[client] update haxework. ep1

package.json

@@ -9,7 +9,7 @@
     "gulp-haxetool": "^0.0.14"
   },
   "haxeDependencies": {
-    "haxework": "0.8.2",
+    "haxework": "git",
     "lime": "7.1.1",
     "openfl": "8.5.1",
     "hxcpp": "4.0.4",

src/client/haxe/ru/m/skin/SimpleButtonSkin.hx

@@ -15,7 +15,7 @@ class SimpleButtonSkin extends ButtonColorSkin {
 
     override public function draw(view:ButtonView):Void {
         var color:Int = selectColor(view);
-        var graphics:Graphics = view.contentAsSprite.graphics;
+        var graphics:Graphics = view.content.graphics;
         graphics.clear();
         graphics.beginFill(color, alpha);
         graphics.lineStyle(2, borderColor);

src/client/haxe/ru/m/tankz/Client.hx

@@ -13,7 +13,6 @@ import haxework.resources.IResources;
 #if flash import haxework.log.JSLogger; #end
 #if debug import haxework.log.SocketLogger; #end
 
-@:style("ru/m/tankz/Style.yaml")
 class Client {
     private static inline var TAG = 'Tankz';
 
@@ -30,6 +29,7 @@ class Client {
         L.d(TAG, 'Debug: ${Const.DEBUG}');
         L.i(TAG, 'Version: ${Const.VERSION}');
         L.i(TAG, 'Build: ${Const.BUILD}');
+        Style.register();
         var view:ClientView = new ClientView();
         Root.bind(view);
         view.launch();

src/client/haxe/ru/m/tankz/ClientView.yaml

@@ -2,25 +2,21 @@
 $type: haxework.gui.VGroupView
 pWidth: 100
 pHeight: 100
-skin:
+skin: $r:skin:light
-  $type: haxework.gui.skin.ColorSkin
-  color: 0x95937D
 views:
 - id: switcher
   $type: haxework.gui.frame.FrameSwitcher
   width: 960
   height: 720
-  skin:
+  skin: $r:skin:dark
-    $type: haxework.gui.skin.ColorSkin
-    color: 0x777564
   views:
-  - id: start
+   - id: start
-    $type: ru.m.tankz.frame.StartFrame
+     $type: ru.m.tankz.frame.StartFrame
-  - id: level
+  # - id: level
-    $type: ru.m.tankz.frame.StartGameFrame
+  #   $type: ru.m.tankz.frame.StartGameFrame
-  - id: game
+  # - id: game
-    $type: ru.m.tankz.frame.GameFrame
+  #   $type: ru.m.tankz.frame.GameFrame
-  - id: network
+  # - id: network
-    $type: ru.m.tankz.frame.NetworkFrame
+  #   $type: ru.m.tankz.frame.NetworkFrame
-  - id: settings
+   - id: settings
-    $type: ru.m.tankz.frame.SettingsFrame
+     $type: ru.m.tankz.frame.SettingsFrame

src/client/haxe/ru/m/tankz/Style.hx

@@ -0,0 +1,36 @@
+package ru.m.tankz;
+
+import ru.m.skin.SimpleButtonSkin;
+import haxework.gui.skin.Skin;
+import haxework.gui.skin.TextSkin;
+import haxework.gui.skin.ButtonBitmapSkin;
+import haxework.gui.utils.DrawUtil;
+import haxework.resources.IResources;
+import openfl.Assets;
+
+class Style {
+
+    @:provide private static var resources:IResources;
+
+    private static var lightColor = 0x95937D;
+    private static var darkColor = 0x777564;
+    private static var textColor = 0xE7E0BB;
+
+    public static function register() {
+        var text = new TextSkin(textColor, "Courirer New");
+        //text.fontSize = 18; // ToDo:
+        var button = new ButtonBitmapSkin();
+        button.fillType = FillType.NINEPATH;
+        button.upImage = Assets.getBitmapData("resources/image/ui/button/normal.png");
+        button.downImage = Assets.getBitmapData("resources/image/ui/button/down.png");
+        button.overImage = Assets.getBitmapData("resources/image/ui/button/over.png");
+        resources.skin.put("light", [Skin.color(lightColor)]);
+        resources.skin.put("dark", [Skin.color(darkColor)]);
+        resources.skin.put("text", [text]);
+        resources.skin.put("button", [button, text]);
+        resources.skin.put("button.simple", [
+            new SimpleButtonSkin(lightColor, textColor),
+            text
+        ]);
+    }
+}

src/client/haxe/ru/m/tankz/frame/SettingsFrame.hx

@@ -4,7 +4,6 @@ import haxework.gui.frame.IFrameSwitcher;
 import haxework.gui.ButtonView;
 import haxework.gui.VGroupView;
 
-
 @:template class SettingsFrame extends VGroupView {
 
     public static var ID(default, never):String = "settings";
@@ -13,10 +12,6 @@ import haxework.gui.VGroupView;
 
     @:view var close:ButtonView;
 
-    private function init():Void {
-        close.onPress = this;
-    }
-
     public function onPress(_):Void {
         frameSwitcher.change(StartFrame.ID);
     }

src/client/haxe/ru/m/tankz/frame/SettingsFrame.yaml

@@ -3,7 +3,7 @@ pWidth: 100
 pHeight: 100
 views:
 - $type: haxework.gui.LabelView
-  $style: label
+  skin: $r:skin:text
   pWidth: 100
   height: 20
   text: Settings

src/client/haxe/ru/m/tankz/frame/StartFrame.hx

@@ -22,13 +22,6 @@ import ru.m.tankz.Type;
     @:provide var state:GameState;
     @:provide var storage:SaveStorage;
 
-    public function init():Void {
-        classic.onPress = this;
-        dota.onPress = this;
-        network.onPress = this;
-        settings.onPress = this;
-    }
-
     public function onPress(view:ButtonView):Void {
         switch (view.id) {
             case 'classic':
@@ -36,7 +29,7 @@ import ru.m.tankz.Type;
             case 'dota':
                 startGame(DotaGame.TYPE, DotaGame.PLAYER1);
             case 'network':
-                frameSwitcher.change(NetworkFrame.ID);
+                //frameSwitcher.change(NetworkFrame.ID);
             case 'settings':
                 frameSwitcher.change(SettingsFrame.ID);
         }
@@ -44,6 +37,6 @@ import ru.m.tankz.Type;
 
     private function startGame(type:GameType, presetId:PresetId):Void {
         state = new GameState(type, presetId);
-        frameSwitcher.change(StartGameFrame.ID);
+        //frameSwitcher.change(StartGameFrame.ID);
     }
 }

src/client/haxe/ru/m/tankz/frame/StartFrame.yaml

@@ -2,36 +2,45 @@
 pWidth: 100
 pHeight: 100
 views:
-# logo
 - $type: haxework.gui.ImageView
-  image: "@asset:image:resources/image/ui/logo.png"
+  image: $asset:image:resources/image/ui/logo.png
-  contentSize: true
+  width: 367
+  height: 157
   bottomMargin: 15
 - $type: haxework.gui.VGroupView
   contentSize: true
   views:
   - id: classic
     $type: haxework.gui.ButtonView
+    skin: $r:skin:button
+    +onPress: $this:onPress
+    width: 250
+    height: 60
     text: Classic
-    $style: button
   - id: dota
     $type: haxework.gui.ButtonView
+    skin: $r:skin:button
+    +onPress: $this:onPress
+    width: 250
+    height: 60
     text: DotA
-    $style: button
   - id: network
     $type: haxework.gui.ButtonView
+    skin: $r:skin:button
+    +onPress: $this:onPress
+    width: 250
+    height: 60
     text: Network (in developing)
-    $style: button
     fontColor: 0xff0000
 - $type: haxework.gui.LabelView
-  $style: label
+  skin: $r:skin:text
   inLayout: false
   contentSize: true
   vAlign: BOTTOM
   hAlign: RIGHT
   rightMargin: 10
   bottomMargin: 10
-  text: "@res:text:version"
+  text: $r:text:version
 - id: settings
   $type: haxework.gui.ButtonView
   inLayout: false
@@ -39,7 +48,9 @@ views:
   vAlign: BOTTOM
   leftMargin: 10
   bottomMargin: 10
-  contentSize: true
+  width: 64
+  height: 64
   skin:
-    $type: haxework.gui.skin.ButtonBitmapSkin
+    - $type: haxework.gui.skin.ButtonBitmapSkin
-    image: "@asset:image:resources/image/ui/settings.png"
+      image: $asset:image:resources/image/ui/settings.png
+  +onPress: $this:onPress

src/client/haxe/ru/m/tankz/frame/StartGameFrame.yaml

@@ -12,7 +12,7 @@ views:
   views:
   - id: players
     $type: haxework.gui.list.VListView<PlayerId>
-    factory: "@class:ru.m.tankz.frame.start.PlayerView"
+    factory: { $class: ru.m.tankz.frame.start.PlayerView }
     pWidth: 50
     pHeight: 100
     paddings: 10
@@ -24,11 +24,11 @@ views:
         $type: haxework.gui.list.VScrollSkin
     skin:
       $type: haxework.gui.skin.ColorSkin
-      color: "#000000"
+      color: 0x000000
       alpha: 0
   - id: levels
     $type: haxework.gui.list.VListView<Int>
-    factory: "@class:ru.m.tankz.frame.start.LevelView"
+    factory: { $class: ru.m.tankz.frame.start.LevelView }
     pWidth: 50
     pHeight: 100
     paddings: 10

src/client/haxe/ru/m/tankz/frame/settings/ActionView.hx

@@ -1,6 +1,5 @@
 package ru.m.tankz.frame.settings;
 
-import haxework.gui.ButtonView;
 import haxework.gui.HGroupView;
 import haxework.gui.LabelView;
 import haxework.gui.list.ListView.IListItemView;
@@ -40,7 +39,7 @@ class KeyboardMap {
 
 @:template class ActionView extends HGroupView implements IListItemView<ActionItem> {
 
-    public var item_index(default, default):Int;
+    public var item_index(default, set):Int;
     public var data(default, set):ActionItem;
 
     @:view var action(default, null):LabelView;
@@ -48,9 +47,6 @@ class KeyboardMap {
 
     private var editDeferred: Deferred<Int>;
 
-    private function init():Void {
-    }
-
     private static function actionLabel(action: TankAction): String {
         return ActionConfig.action2string(action);
     }
@@ -59,6 +55,11 @@ class KeyboardMap {
         return KeyboardMap.getName(key);
     }
 
+    private function set_item_index(value:Int):Int {
+        item_index = value;
+        return item_index;
+    }
+
     private function set_data(value:ActionItem):ActionItem {
         data = value;
         action.text = actionLabel(data.action);
@@ -67,7 +68,7 @@ class KeyboardMap {
     }
 
     public function edit():Promise<Int> {
-        cast(this.skin, ColorSkin).color = 0x00ff00;
+        cast(this.skin[0], ColorSkin).color = 0x00ff00;
         invalidate();
         editDeferred = new Deferred();
         content.stage.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDown);
@@ -76,7 +77,7 @@ class KeyboardMap {
 
     private function onKeyDown(event: KeyboardEvent):Void {
         content.stage.removeEventListener(KeyboardEvent.KEY_DOWN, onKeyDown);
-        cast(this.skin, ColorSkin).color = 0x000000;
+        cast(this.skin[0], ColorSkin).color = 0x000000;
         invalidate();
 
         data.key = event.keyCode;

src/client/haxe/ru/m/tankz/frame/settings/ActionView.yaml

@@ -5,17 +5,17 @@ margins: 5
 views:
 - id: action
   $type: haxework.gui.LabelView
-  $style: label
+  skin: $r:skin:text
   pWidth: 50
   pHeight: 100
   text: ""
 - id: key
   $type: haxework.gui.LabelView
-  $style: label
+  skin: $r:skin:text
   pWidth: 50
   pHeight: 100
   text: ""
 skin:
-  $type: haxework.gui.skin.ColorSkin
+  - $type: haxework.gui.skin.ColorSkin
-  color: "#000000"
+    color: 0x000000
-  alpha: 0.2
+    alpha: 0.2

src/client/haxe/ru/m/tankz/frame/settings/SettingsEditor.hx

@@ -9,7 +9,6 @@ import ru.m.tankz.control.ActionConfig.ActionItem;
 import ru.m.tankz.control.ActionConfig;
 import ru.m.tankz.storage.SettingsStorage;
 
-
 @:template class SettingsEditor extends VGroupView {
 
     public var controlIndex(default, set): Int;
@@ -22,12 +21,6 @@ import ru.m.tankz.storage.SettingsStorage;
 
     @:provide var storage: SettingsStorage;
 
-    private function init():Void {
-        change.onPress = this;
-        clear.onPress = this;
-        reset.onPress = this;
-    }
-
     private function set_controlIndex(value: Int): Int {
         this.controlIndex = value;
         label.text = 'Player ${controlIndex+1}';

src/client/haxe/ru/m/tankz/frame/settings/SettingsEditor.yaml

@@ -2,29 +2,38 @@ layoutMargin: 10
 views:
 - id: label
   $type: haxework.gui.LabelView
-  $style: label
+  skin: $r:skin:text
 - $type: haxework.gui.HGroupView
   contentSize: true
   layoutMargin: 10
   views:
   - id: change
     $type: haxework.gui.ButtonView
-    $style: button_simple
+    +onPress: $this:onPress
+    skin: $r:skin:button.simple
+    width: 100
+    height: 36
     text: Change
   - id: clear
     $type: haxework.gui.ButtonView
-    $style: button_simple
+    +onPress: $this:onPress
+    skin: $r:skin:button.simple
+    width: 100
+    height: 36
     text: Clear
   - id: reset
     $type: haxework.gui.ButtonView
-    $style: button_simple
+    +onPress: $this:onPress
+    skin: $r:skin:button.simple
+    width: 100
+    height: 36
     text: Reset
 - id: list
   $type: haxework.gui.list.VListView<ru.m.tankz.control.ActionItem>
-  factory: "@class:ru.m.tankz.frame.settings.ActionView"
+  factory: { $class: ru.m.tankz.frame.settings.ActionView }
   pWidth: 100
   pHeight: 100
   scroll:
-    $type: haxework.gui.list.VScrollView
+    $type: haxework.gui.list.VScrollBarView
     width: 1
     pHeight: 100