header, main panel addition

project.xml

@@ -18,6 +18,7 @@
 	<haxelib name="actuate"/>
 	<haxelib name="feathersui"/>
 	<haxelib name="feathersui-cairngorm"/>
+	<haxelib name="hx-color-trace"/>
 
 	<icon path="assets/icons/icon.svg"/>
 

src/LPTCManager2026.hx

@@ -16,17 +16,20 @@ import feathers.text.TextFormat;
 import model.Constants;
 import openfl.Assets;
 import openfl.text.Font;
+import t9.util.ColorTraces.*;
+import view.MainPanel;
 
 class LPTCManager2026 extends Application {
 
-	private var model = AppModelLocator.getInstance();
+	private var model:AppModelLocator = AppModelLocator.getInstance();
-	private var services = new Services();
+	private var services:Services = new Services();
-	private var appController = new AppController();
+	private var appController:AppController = new AppController();
-	//private var mainPanel:Panel;
+	private var mainPanel:MainPanel = new MainPanel();
 
 	// private var nav:StackNavigator;
 
 	public function new() {
+		
 		super();
 
 		addEventListener(FeathersEvent.CREATION_COMPLETE, onCreationComplete);
@@ -39,6 +42,8 @@ class LPTCManager2026 extends Application {
 		stage.displayState = NORMAL;
 		stage.scaleMode = NO_SCALE;
 
+		addChild(mainPanel);
+
 		/*mainPanel = new Panel();
 		mainPanel.autoSizeMode = STAGE;
 		mainPanel.backgroundSkin = new NekoRectangle(Constants.MAIN_COLOR3);
@@ -54,7 +59,7 @@ class LPTCManager2026 extends Application {
 		title.backgroundSkin = new NekoRectangle(Constants.ACCENT_COLOR2, 0, 0, 200, 80);
 		title.verticalAlign = VerticalAlign.MIDDLE;
 		title.text = "Header";
-		title.embedFonts =true;
+		title.embedFonts = true;
 		var fnt:Font = Assets.getFont(Constants.MONTSERRAT_MEDIUM_500);
 		
 		var tf:TextFormat = new TextFormat(fnt.fontName, Std.int(stage.stageHeight * Constants.MAIN_HEADER_HEIGHT_RATIO * .1), Constants.MAIN_COLOR3);
@@ -87,17 +92,17 @@ class LPTCManager2026 extends Application {
 
 		// nav = new StackNavigator();
 
-		trace(this, "--> initialize()");
+		traceBlue(this + " --> initialize()");
 	}
 
 	private function loadRiders():Void {
-		trace(this + " --> loadRiders()");
+		traceGreen(this + " --> loadRiders()");
 		var cgEvent:LoadRidersEvent = new LoadRidersEvent();
 		CairngormEventDispatcher.getInstance().dispatchEvent(cgEvent);
 	}
 
 	private function onCreationComplete(event:FeathersEvent):Void {
-		trace(this + " --> onCreationComplete()");
+		traceBlue(this + " --> onCreationComplete()");
 		loadRiders();
 	}
 }

src/command/LoadRidersCommand.hx

@@ -1,5 +1,6 @@
 package command;
 
+import t9.util.ColorTraces;
 import openfl.Vector;
 import vo.Rider;
 import feathers.data.ArrayCollection;
@@ -12,6 +13,7 @@ import feathers.rpc.IResponder;
 import feathers.rpc.events.ResultEvent;
 import haxe.Json;
 import model.AppModelLocator;
+import t9.util.ColorTraces.*;
 
 class LoadRidersCommand implements ICommand implements IResponder {
 	private var model = AppModelLocator.getInstance();
@@ -21,7 +23,6 @@ class LoadRidersCommand implements ICommand implements IResponder {
 		var delegate = new LoadRidersDelegate(this);
 		// make the delegate do some work
 		delegate.loadRidersService();
-        trace(this + "execute()");
 	}
 
 	// this is called when the delegate receives a result from the service
@@ -31,7 +32,7 @@ class LoadRidersCommand implements ICommand implements IResponder {
         var riders:Array<Rider> = cast(rpcEvent, ResultEvent).result;
         model.ridersListDP = new ArrayCollection(riders);
 
-        trace("ridersListDP.length --> " + model.ridersListDP.length);
+        traceGreen("ridersListDP.length --> " + model.ridersListDP.length);
 
         /*var data:DynamicAccess<Dynamic> = Json.parse(cast(rpcEvent, ResultEvent).result);
         */

src/components/NekoRectangle.hx

@@ -3,7 +3,7 @@ package components;
 import openfl.display.Shape;
 
 class NekoRectangle extends Shape {
-	public function new(pColor:Int = 0xFF0000, pX:Int = 0, pY:Int = 0, pWidth:Int = 100, pHeight:Int = 100) {
+	public function new(pColor:Int = 0xFF0000, pX:Int = 0, pY:Int = 0, pWidth:Int = 10, pHeight:Int = 10) {
 		super();
 
         graphics.beginFill(pColor);

src/model/Constants.hx

@@ -18,7 +18,7 @@ class Constants {
    
     // UI Proportions against satge dimmentions
     public static final MAIN_HEADER_WIDTH_RATIO:Float = 1;
-    public static final MAIN_HEADER_HEIGHT_RATIO:Float = 0.3;
+    public static final MAIN_HEADER_HEIGHT_RATIO:Float = 0.1;
 
     private function new() {
         

src/view/MainHeader.hx

@@ -0,0 +1,69 @@
+package view;
+
+import feathers.layout.HorizontalLayout;
+import feathers.layout.AnchorLayoutData;
+import feathers.text.TextFormat;
+import openfl.Assets;
+import openfl.text.Font;
+import feathers.layout.VerticalAlign;
+import feathers.controls.Label;
+import feathers.layout.AnchorLayout;
+import components.NekoRectangle;
+import feathers.controls.LayoutGroup;
+import feathers.controls.Panel;
+import feathers.events.FeathersEvent;
+import model.Constants;
+import t9.util.ColorTraces.*;
+
+class MainHeader extends LayoutGroup {
+
+    private var lb1:Label;
+
+	public function new() {
+		super();
+
+		addEventListener(FeathersEvent.CREATION_COMPLETE, onCreationComplete);
+	}
+
+	override private function initialize():Void {
+		super.initialize();
+
+        final sw:Int = stage.stageWidth;
+        final sh:Int = stage.stageHeight;
+        final headerWidth = Std.int(sw * Constants.MAIN_HEADER_WIDTH_RATIO);
+        final headerHeight = Std.int(sh * Constants.MAIN_HEADER_HEIGHT_RATIO);
+
+		autoSizeMode = CONTENT;
+		backgroundSkin = new NekoRectangle( Constants.HERO_COLOR, 
+                                            0, 
+                                            0, 
+                                            headerWidth, 
+                                            headerHeight);
+		variant = LayoutGroup.VARIANT_TOOL_BAR;
+
+        // Layout settings
+		var l:HorizontalLayout = new HorizontalLayout();
+        l.paddingLeft = l.paddingRight = Std.int(headerHeight * .3);
+        l.paddingTop = l.paddingBottom = Std.int(headerHeight * .2);
+        layout = l;
+
+        // Title label
+        lb1 = new Label();
+        //lb1.backgroundSkin = new NekoRectangle(Constants.ACCENT_COLOR2);
+
+		//lb1.verticalAlign = VerticalAlign.TOP;
+		lb1.text = "Cavalier·e·s";
+		lb1.embedFonts = true;
+		var fnt:Font = Assets.getFont(Constants.MONTSERRAT_MEDIUM_500);
+		
+		var tf:TextFormat = new TextFormat(fnt.fontName, Std.int(headerHeight * .4), Constants.MAIN_COLOR3);
+		lb1.textFormat =  tf;
+
+		lb1.layoutData = AnchorLayoutData.middleLeft();
+		addChild(lb1);
+	}
+
+	private function onCreationComplete(event:FeathersEvent):Void {
+		traceBlue(this + " --> onCreationComplete()");
+	}
+}

src/view/MainPanel.hx

@@ -0,0 +1,32 @@
+package view;
+
+import feathers.events.FeathersEvent;
+import model.Constants;
+import components.NekoRectangle;
+import feathers.controls.Panel;
+import t9.util.ColorTraces.*;
+
+class MainPanel extends Panel {
+
+	private var mh:MainHeader;
+
+	public function new() {
+		super();
+
+		addEventListener(FeathersEvent.CREATION_COMPLETE, onCreationComplete);
+	}
+
+	override private function initialize():Void {
+		super.initialize();
+
+		autoSizeMode = STAGE;
+		backgroundSkin = new NekoRectangle(Constants.MAIN_COLOR3);
+
+		mh = new MainHeader();
+		addChild(mh);
+	}
+
+	private function onCreationComplete(event:FeathersEvent):Void {
+		traceBlue(this + " --> onCreationComplete()");
+	}
+}

src/view/UserLogin.hx

@@ -1,13 +0,0 @@
-package view;
-
-import feathers.controls.ScrollContainer;
-
-class UserLogin extends ScrollContainer {
-	public function new() {
-		super();
-	}
-
-	override private function initialize():Void {
-		super.initialize();
-	}
-}