up version

.editorconfig

@@ -0,0 +1,9 @@
+# Editor configuration, see http://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 4
+insert_final_newline = true
+trim_trailing_whitespace = true

ansible/ansible.cfg

@@ -3,7 +3,9 @@ hash_behaviour = merge
 host_key_checking = False
 #callback_whitelist = profile_tasks
 display_skipped_hosts = False
+stdout_callback = yaml
+bin_ansible_callbacks = True
 
 [ssh_connection]
 pipelining = True
-ssh_args = -o ForwardAgent=yes
+ssh_args = -o ForwardAgent=yes

ansible/group_vars/all.yml

@@ -5,7 +5,7 @@ project_user: holop
 deploy_user: "{{ project_user }}"
 deploy_project: "{{ project_name }}"
 deploy_repo_url: "git@bitbucket.org:infernalgames/{{ project_name }}.git"
-deploy_repo_version: staging
+deploy_repo_version: master
 deploy_npm: yes
 
 service_name: "{{ project_name }}"

ansible/roles/build/tasks/main.yml

@@ -6,6 +6,6 @@
     remote_src: true
 
 - name: "Gulp build"
-  command: "/usr/local/lib/npm/bin/gulp default"
+  command: "/usr/local/lib/npm/bin/gulp default --host shmyga.ru"
   args:
     chdir: "{{ deploy_release_dir }}"

gulpfile.js

@@ -1,14 +1,14 @@
-"use strict";
 const gulp = require('gulp');
 const gulpClean = require('gulp-clean');
 const Config = require('./config.json');
 const packageInfo = require('./package.json');
 const {Sdk, Haxe, Project, FlashPlayer} = require('gulp-haxetool');
 const dateformat = require('dateformat');
-
+const argv = require('yargs').argv;
 
 // ToDo: update default in gulp-haxetool
-FlashPlayer.VERSION = '31';
+FlashPlayer.VERSION = '32';
+//Haxe.VERSION = '4.0.0-rc.2';
 if (Config.SdkDir) {
     Sdk.dir = Config.SdkDir;
 }
@@ -49,11 +49,13 @@ const config = new Project.Config({
         'src/common/resources'
     ],
     macros: [
-        //'yield.parser.Parser.auto()',  // ToDo: bug with extraParams.hxml in yield library
         `CompilationOption.set('build','${dateformat(new Date(), 'yyyy-mm-dd HH:MM:ss')}')`,
     ]
 });
 
+const host = argv.host || 'localhost';
+const port = argv.port || 5000;
+
 /**
  * client
  */
@@ -69,16 +71,24 @@ const client = new Project(
         name: 'client',
         sources: ['src/client/haxe'],
         main: 'ru.m.tankz.Client',
-        assets: ['src/client/resources'],
+        preloader: 'ru.m.tankz.Preloader',
+        assets: [
+            'src/client/resources',
+        ],
         meta: {
             width: 1024,
             height: 768,
         },
         flags: [
+            //'proto_debug',
             //'dom',
             //'dev_layout',
             //'bitmap_text',
         ],
+        macros: [
+            `CompilationOption.set('host','${host}')`,
+            `CompilationOption.set('port',${port})`,
+        ]
     }),
     module.exports.generate
 ).bind(module, gulp);
@@ -88,16 +98,23 @@ const client = new Project(
  */
 const editor = new Project(
     Project.BuildSystem.OPENFL,
-    Project.Platform.FLASH,
+    [
+        Project.Platform.FLASH,
+        Project.Platform.HTML5,
+    ],
     config.branch({
         name: 'editor',
         sources: ['src/client/haxe', 'src/editor/haxe'],
         main: 'ru.m.tankz.editor.Editor',
-        assets: ['src/client/resources'],
+        preloader: 'ru.m.tankz.Preloader',
+        assets: [
+            'src/client/resources',
+            'src/editor/resources',
+        ],
         meta: {
             filename: 'editor',
             width: 1024,
-            height: 800,
+            height: 850,
         },
         flags: [
             //'dev_layout',
@@ -115,7 +132,8 @@ const server = new Project(
         name: 'server',
         sources: ['src/server/haxe'],
         main: 'ru.m.tankz.server.Server',
-    })
+    }),
+    module.exports.generate
 ).bind(module, gulp);
 
 /**
@@ -124,11 +142,15 @@ const server = new Project(
 module.exports.default = gulp.series(
     exports.clean,
     module.exports['client:flash:build'],
+    module.exports['client:flash:html'],
     module.exports['client:html5:build'],
     module.exports['client:linux:build'],
-    //module.exports['client:android:build'],
-    module.exports['editor:flash:build'],
-    //module.exports['server:neko:build'],
-    module.exports['client:flash:html'],
     module.exports['client:linux:deb'],
+    //module.exports['client:android:build'],
+
+    module.exports['editor:flash:build'],
+    module.exports['editor:flash:html'],
+    module.exports['editor:html5:build'],
+
+    module.exports['server:neko:build'],
 );

package.json

@@ -1,25 +1,26 @@
 {
-  "name": "tankz",
+    "name": "tankz",
-  "version": "0.8.3",
+    "version": "0.12.0",
-  "private": true,
+    "private": true,
-  "devDependencies": {
+    "devDependencies": {
-    "dateformat": "^3.0.3",
+        "dateformat": "^3.0.3",
-    "gulp": "^4.0.0",
+        "gulp": "^4.0.0",
-    "gulp-add": "0.0.2",
+        "gulp-add": "0.0.2",
-    "gulp-clean": "^0.4.0",
+        "gulp-clean": "^0.4.0",
-    "gulp-haxetool": "^0.0.16"
+        "gulp-haxetool": "^0.0.19",
-  },
+        "yargs": "^13.2.4"
-  "haxeDependencies": {
+    },
-    "haxework": "git@bitbucket.org:shmyga/haxework.git",
+    "haxeDependencies": {
-    "lime": "7.2.1",
+        "haxework": "git@bitbucket.org:shmyga/haxework.git",
-    "openfl": "8.8.0",
+        "lime": "7.5.0",
-    "hxcpp": "4.0.8",
+        "openfl": "8.9.1",
-    "promhx": "1.1.0",
+        "hxcpp": "4.0.8",
-    "protohx": "0.4.6",
+        "promhx": "1.1.0",
-    "yaml": "1.3.0",
+        "protohx": "0.4.6",
-    "orm": "2.1.0",
+        "yaml": "1.3.0",
-    "yield": "2.0.0",
+        "orm": "2.1.0",
-    "haxe-crypto": "0.0.7",
+        "yield": "2.0.0",
-    "svg": "1.1.2"
+        "haxe-crypto": "0.0.7",
-  }
+        "svg": "1.1.2"
+    }
 }

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

@@ -1,10 +1,10 @@
 package ru.m.skin;
 
-import haxework.color.ColorUtil;
-import haxework.color.Color;
-import haxework.gui.ButtonView;
 import format.SVG;
-import haxework.gui.skin.ISkin;
+import haxework.color.Color;
+import haxework.color.ColorUtil;
+import haxework.view.ButtonView;
+import haxework.view.skin.ISkin;
 
 class ButtonSVGSkin implements ISkin<ButtonView> {
 
@@ -28,6 +28,7 @@ class ButtonSVGSkin implements ISkin<ButtonView> {
         svgs.set(ButtonState.UP, buildSVG(color));
         svgs.set(ButtonState.DOWN, buildSVG(ColorUtil.diff(color, -24)));
         svgs.set(ButtonState.OVER, buildSVG(ColorUtil.diff(color, 24)));
+        svgs.set(ButtonState.DISABLED, buildSVG(ColorUtil.grey(color)));
     }
 
     public function draw(view:ButtonView):Void {

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

@@ -2,29 +2,20 @@ package ru.m.tankz;
 
 import flash.Lib;
 import haxework.animate.Animate;
-import ru.m.tankz.frame.StartFrame;
-import flash.ui.Keyboard;
-import flash.events.KeyboardEvent;
-import flash.text.Font;
-import haxework.gui.frame.FrameSwitcher;
-import haxework.gui.Root;
-import haxework.gui.VGroupView;
 import haxework.log.TraceLogger;
-import haxework.provider.Provider;
+import haxework.view.Root;
-import haxework.resources.IResources;
+import ru.m.tankz.view.ClientView;
-#if flash import haxework.log.JSLogger; #end
-#if debug import haxework.log.SocketLogger; #end
 
 class Client {
-    private static inline var TAG = 'Tankz';
+    private static inline var TAG = "Tankz";
 
     public static function main() {
         L.push(new TraceLogger());
         #if flash
-        L.push(new JSLogger());
+        L.push(new haxework.log.JSLogger());
         #end
         #if debug
-        //L.push(new SocketLogger());
+        //L.push(new haxework.log.SocketLogger());
         #end
         Const.init();
         Init.init();
@@ -32,33 +23,17 @@ class Client {
         L.d(TAG, 'Debug: ${Const.DEBUG}');
         L.i(TAG, 'Version: ${Const.VERSION}');
         L.i(TAG, 'Build: ${Const.BUILD}');
+        #if linux
+        LinuxIcon.apply();
+        #end
         Style.register();
         var view:ClientView = new ClientView();
         Root.bind(view);
         view.launch();
-    }
+
-}
+        #if debug
-
+        var fps = new openfl.display.FPS(0, 0, 0x00ff00);
-@:template class ClientView extends VGroupView {
+        Lib.current.addChild(fps);
-    private static inline var TAG = 'Tankz';
+        #end
-
-    @:view private var switcher(default, null):FrameSwitcher;
-    @:provide var resources:IResources;
-
-    public function init():Void {
-        var font:Font = Font.enumerateFonts()[0];
-        resources.text.put('font', 'Bookman Old Style');
-        resources.text.put('version', 'v${Const.VERSION} (${Const.BUILD})');
-        Provider.set(FrameSwitcher, switcher);
-    }
-
-    public function launch():Void {
-        content.stage.stageFocusRect = false;
-        content.stage.addEventListener(KeyboardEvent.KEY_UP, function(event:KeyboardEvent):Void {
-            if (event.keyCode == Keyboard.ESCAPE) {
-                switcher.change(StartFrame.ID);
-            }
-        });
-        switcher.change(StartFrame.ID);
     }
 }

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

@@ -1,30 +0,0 @@
----
-$type: haxework.gui.VGroupView
-geometry.size.stretch: true
-layout.hAlign: center
-layout.vAlign: middle
-skinId: light
-views:
-  - id: switcher
-    $type: haxework.gui.frame.FrameSwitcher
-    skinId: dark
-    geometry.size.stretch: true
-    layout.hAlign: center
-    layout.vAlign: middle
-    views:
-      - id: start
-        $type: ru.m.tankz.frame.StartFrame
-        # classic
-      - id: classic.level
-        $type: ru.m.tankz.frame.classic.ClassicLevelFrame
-      - id: classic.game
-        $type: ru.m.tankz.frame.classic.ClassicGameFrame
-        # dota
-      - id: dota.level
-        $type: ru.m.tankz.frame.dota.DotaLevelFrame
-      - id: dota.game
-        $type: ru.m.tankz.frame.dota.DotaGameFrame
-      # - id: network
-      #   $type: ru.m.tankz.frame.NetworkFrame
-      - id: settings
-        $type: ru.m.tankz.frame.SettingsFrame

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

@@ -3,17 +3,16 @@ package ru.m.tankz;
 import flash.Lib;
 import flash.system.Capabilities;
 
-
 class Const {
-  public static var FPS:Int;
+    public static var FPS:Int;
-  public static var BUILD:String;
+    public static var BUILD:String;
-  public static var VERSION:String;
+    public static var VERSION:String;
-  public static var DEBUG:Bool;
+    public static var DEBUG:Bool;
 
-  public static function init():Void {
+    public static function init():Void {
-    FPS = Std.parseInt(Lib.current.stage.application.meta.get("fps"));
+        FPS = Std.parseInt(Lib.current.stage.application.meta.get("fps"));
-    BUILD = CompilationOption.get("build");
+        BUILD = CompilationOption.get("build");
-    VERSION = Lib.current.stage.application.meta.get("version");
+        VERSION = Lib.current.stage.application.meta.get("version");
-    DEBUG = Capabilities.isDebugger;
+        DEBUG = Capabilities.isDebugger;
-  }
+    }
-}
+}

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

@@ -1,9 +1,10 @@
 package ru.m.tankz;
 
-import ru.m.tankz.storage.SettingsStorage;
+import haxework.animate.FadeAnimate;
-import haxework.provider.Provider;
+import haxework.animate.UnFadeAnimate;
 import haxework.resources.IResources;
 import haxework.resources.Resources;
+import haxework.view.popup.PopupManager;
 import ru.m.connect.IConnection;
 import ru.m.tankz.bundle.ConfigBundle;
 import ru.m.tankz.bundle.IConfigBundle;
@@ -15,50 +16,55 @@ import ru.m.tankz.network.NetworkManager;
 import ru.m.tankz.proto.pack.Request;
 import ru.m.tankz.proto.pack.Response;
 import ru.m.tankz.sound.SoundManager;
-import ru.m.tankz.storage.UserStorage;
+import ru.m.tankz.storage.GameStorage;
-#if flash
+import ru.m.tankz.storage.MultiplayerStorage;
-import flash.Lib;
+import ru.m.tankz.storage.RecordStorage;
-#elseif html5
+import ru.m.tankz.storage.SettingsStorage;
-import js.Browser;
-#end
-
 
 class Init {
 
-    private static function getHost():String {
+    @:provide static var resources:IResources;
+    @:provide static var levelBundle:ILevelBundle;
+    @:provide static var configBundle:IConfigBundle;
+    @:provide static var settingsStorage:SettingsStorage;
+    @:provide static var multiplayerStorage:MultiplayerStorage;
+    @:provide static var gameStorage:GameStorage;
+    @:provide static var recordStorage:RecordStorage;
+    @:provide static var soundManager:SoundManager;
+    @:provide static var networkManager:NetworkManager;
+    @:provide static var controlFactory:IControlFactory;
+    @:provide static var popupManager:PopupManager;
+    @:provide static var connection:IConnection<Request, Response>;
+
+    private static function buildConnection():IConnection<Request, Response> {
+        var host:String = CompilationOption.get("host");
+        var port:Int = CompilationOption.get("port");
+        L.d("Init", 'connect to $host:$port');
         #if flash
-        var url = Lib.current.loaderInfo.url;
+        return new ru.m.connect.flash.FlashConnection<Request, Response>(host, port, Response);
-        var r:EReg = ~/(app|https?):\/\/?([-_\w\d\.]+)(:\d+)?\/?/;
-        if (r.match(url) && !(r.matched(1) == "app")) {
-            return r.matched(2);
-        } else {
-            return "localhost";
-        }
         #elseif html5
-        return Browser.location.hostname;
+        return new ru.m.connect.js.JsConnection<Request, Response>(host, port + (ru.m.connect.js.JsConnection.isSecured() ? 1 : 0), Response);
         #else
-        return "localhost";
+        return new ru.m.connect.desktop.DesktopConnection<Request, Response>(host, port, Response);
         #end
     }
 
     public static function init():Void {
-        Provider.setFactory(IResources, Resources);
+        resources = new Resources();
-        Provider.setFactory(ILevelBundle, LevelBundle);
+        levelBundle = new LevelBundle();
-        Provider.setFactory(IConfigBundle, ConfigBundle);
+        configBundle = new ConfigBundle();
-        Provider.setFactory(UserStorage, UserStorage);
+        settingsStorage = new SettingsStorage();
-        Provider.setFactory(SettingsStorage, SettingsStorage);
+        multiplayerStorage = new MultiplayerStorage();
-        Provider.setFactory(SoundManager, SoundManager);
+        gameStorage = new GameStorage();
-        Provider.setFactory(NetworkManager, NetworkManager);
+        recordStorage = new RecordStorage();
-        Provider.setFactory(IControlFactory, ClientControlFactory);
+        soundManager = new SoundManager();
+        controlFactory = new ClientControlFactory();
+        popupManager = new PopupManager();
 
-        var host:String = getHost();
+        popupManager.showAnimateFactory = function(v) return new UnFadeAnimate(v, 100);
-        L.d('Init', 'host: ${host}');
+        popupManager.closeAnimateFactory = function(v) return new FadeAnimate(v, 100);
-        #if flash
+
-        Provider.set(IConnection, new ru.m.connect.flash.FlashConnection<Request, Response>(host, 5000, Response));
+        connection = buildConnection();
-        #elseif html5
+        networkManager = new NetworkManager();
-        Provider.set(IConnection, new ru.m.connect.js.JsConnection<Request, Response>(host, 5000, Response));
-        #else
-        Provider.set(IConnection, new ru.m.connect.fake.FakeConnection<Request, Response>(Response));
-        #end
     }
 }

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

@@ -0,0 +1,27 @@
+package ru.m.tankz;
+
+import flash.display.BitmapData;
+import flash.filters.ColorMatrixFilter;
+import flash.geom.Point;
+import flash.Lib;
+import openfl.Assets;
+
+class LinuxIcon {
+
+    private static function prepareIcon(bitmap:BitmapData):BitmapData {
+        var matrix:Array<Float> = [];
+        matrix = matrix.concat([0, 0, 1, 0, 0]);
+        matrix = matrix.concat([0, 1, 0, 0, 0]);
+        matrix = matrix.concat([1, 0, 0, 0, 0]);
+        matrix = matrix.concat([0, 0, 0, 1, 0]);
+        var cmf:ColorMatrixFilter = new ColorMatrixFilter(matrix);
+        var bitmap:BitmapData = bitmap.clone();
+        bitmap.applyFilter(bitmap, bitmap.rect, new Point(0, 0), cmf);
+        return bitmap;
+    }
+
+    public static function apply() {
+        var icon = Assets.getBitmapData("resources/icon.png");
+        Lib.current.stage.window.setIcon(prepareIcon(icon).image);
+    }
+}

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

@@ -0,0 +1,141 @@
+package ru.m.tankz;
+
+import flash.display.Shape;
+import flash.display.Sprite;
+import flash.events.Event;
+import flash.events.ProgressEvent;
+import flash.Lib;
+import haxework.view.core.Size;
+
+class Progress extends Sprite {
+
+    public var color(default, set):Int = 0;
+    public var backColor(default, set):Int = 0;
+    public var progress(default, set):Float = 0;
+    public var size(default, set):Size = [0, 0];
+    public var radius(get, null):Float;
+
+    private var maskShape:Shape;
+    private var toRedraw:Bool;
+
+    public function new() {
+        super();
+        maskShape = new Shape();
+        addChild(maskShape);
+        mask = maskShape;
+    }
+
+    private inline function get_radius():Float {
+        return Math.min(size.width, size.height) / 2;
+    }
+
+    private function set_color(value:Int):Int {
+        if (color != value) {
+            color = value;
+            toRedraw = true;
+        }
+        return color;
+    }
+
+    private function set_backColor(value:Int):Int {
+        if (backColor != value) {
+            backColor = value;
+            toRedraw = true;
+        }
+        return color;
+    }
+
+    private function set_progress(value:Float):Float {
+        if (progress != value) {
+            progress = value;
+            toRedraw = true;
+        }
+        return progress;
+    }
+
+    private function set_size(value:Size):Size {
+        if (size != value) {
+            size = value;
+            toRedraw = true;
+        }
+        return size;
+    }
+
+    public function update():Void {
+        if (toRedraw) {
+            redraw();
+            redrawMask();
+            toRedraw = false;
+        }
+    }
+
+    public function redraw():Void {
+        graphics.clear();
+        graphics.beginFill(color);
+        graphics.drawCircle(radius, radius, radius);
+        graphics.beginFill(backColor);
+        graphics.drawCircle(radius, radius, radius / 2);
+        graphics.endFill();
+    }
+
+    public function redrawMask():Void {
+        maskShape.graphics.clear();
+        maskShape.graphics.beginFill(0x00ff00);
+        maskShape.graphics.moveTo(radius, radius);
+        var sides = 6;
+        var rotation = (-(Math.PI) / 2);
+        var r = radius / Math.cos(1/sides * Math.PI);
+        var lineToRadians = function(rads:Float):Void {
+            maskShape.graphics.lineTo(Math.cos(rads) * r + radius, Math.sin(rads) * r + radius);
+        };
+        var sidesToDraw:Int = Math.floor(progress * sides);
+        for (i in 0...sidesToDraw + 1) {
+            lineToRadians((i / sides) * (Math.PI * 2) + rotation);
+        }
+        if (progress * sides != sidesToDraw) {
+            lineToRadians(progress * (Math.PI * 2) + rotation);
+        }
+        maskShape.graphics.endFill();
+    }
+}
+
+class Preloader extends Sprite {
+
+    private var progress:Progress;
+
+    public function new() {
+        super();
+        Lib.current.stage.color = Style.lightColor;
+        progress = new Progress();
+        progress.color = Style.darkColor;
+        progress.backColor = Style.lightColor;
+        progress.size = [200, 200];
+        addChild(progress);
+        onResize(null);
+        Lib.current.stage.addEventListener(Event.RESIZE, onResize);
+        Lib.current.stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
+        Lib.current.stage.addEventListener(ProgressEvent.PROGRESS, onProgress);
+        addEventListener(Event.COMPLETE, onComplete);
+    }
+
+    private function onResize(event:Event):Void {
+        progress.x = (Lib.current.stage.stageWidth - progress.size.width) / 2;
+        progress.y = (Lib.current.stage.stageHeight - progress.size.height) / 2;
+    }
+
+    private function onEnterFrame(event:Event):Void {
+        progress.update();
+    }
+
+    private function onProgress(event:ProgressEvent):Void {
+        progress.progress = event.bytesLoaded / event.bytesTotal;
+    }
+
+    private function onComplete(event:Event):Void {
+        progress.update();
+        Lib.current.stage.removeEventListener(Event.RESIZE, onResize);
+        Lib.current.stage.removeEventListener(Event.ENTER_FRAME, onEnterFrame);
+        Lib.current.stage.removeEventListener(ProgressEvent.PROGRESS, onProgress);
+        removeEventListener(Event.COMPLETE, onComplete);
+    }
+}

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

@@ -1,8 +1,16 @@
 package ru.m.tankz;
 
+import flash.text.Font;
+import flash.text.FontType;
 import haxework.color.ColorUtil;
-import haxework.gui.skin.Skin;
 import haxework.resources.IResources;
+import haxework.view.core.Geometry;
+import haxework.view.core.HAlign;
+import haxework.view.core.VAlign;
+import haxework.view.ITextView;
+import haxework.view.layout.Layout;
+import haxework.view.skin.ISkin;
+import haxework.view.skin.Skin;
 import openfl.Assets;
 import ru.m.skin.ButtonSVGSkin;
 
@@ -10,65 +18,135 @@ class Style {
 
     @:provide private static var resources:IResources;
 
-    private static var lightColor = 0x95937D;
+    public static var lightColor = 0x95937D;
-    private static var darkColor = 0x777564;
+    public static var darkColor = 0x777564;
-    private static var textColor = 0xE7E0BB;
+    public static var textColor = 0xE7E0BB;
-    private static var fontFamily = "Courirer New";
+    public static var activeColor = 0xFFFF00;
 
-    public static function register() {
+    public static var baseFontSize = 18;
+    public static var bigFontSize = 22;
+    public static var veryBigFontSize = 24;
+
+    public static var fontFamily = "Courirer New";
+    public static var fontEmbed = false;
+
+    public static function text(color):ISkin<ITextView> {
+        return Skin.text(color, baseFontSize, fontFamily, fontEmbed);
+    }
+
+    public static function registerButton(name:String, resource:String):Void {
+        resources.skin.put('button.$name', [
+            Skin.size(64, 64),
+            new ButtonSVGSkin(Assets.getText('resources/image/icon/$resource'), lightColor),
+        ]);
+        resources.skin.put('button.$name.small', [
+            Skin.size(32, 32),
+            new ButtonSVGSkin(Assets.getText('resources/image/icon/$resource'), lightColor),
+        ]);
+    }
+
+    public static function register(font:Font = null):Void {
+        resources.color.put("light", lightColor);
+        resources.color.put("dark", darkColor);
+        if (font == null) {
+            font = Font.enumerateFonts()[0];
+        }
+        if (font == null) {
+            font = Font.enumerateFonts(true)[0];
+        }
+        fontFamily = font == null ? "Courirer New" : font.fontName;
+        fontEmbed = font == null ? false : switch font.fontType {
+            case DEVICE: false;
+            case _: true;
+        };
         resources.skin.put("light", [
             Skin.color(lightColor),
         ]);
         resources.skin.put("dark", [
             Skin.color(darkColor),
         ]);
+        resources.skin.put("font", [
+            Skin.text(textColor, 0, fontFamily, fontEmbed),
+        ]);
         resources.skin.put("text", [
-            Skin.text(textColor, 16, fontFamily),
+            Skin.text(textColor, baseFontSize, fontFamily, fontEmbed),
+        ]);
+        resources.skin.put("scroll.vertical", [
+            haxework.view.skin.Skin.scrollVertical(lightColor, darkColor),
         ]);
         resources.skin.put("text.header", [
-            Skin.color(lightColor),
+            Skin.color(0x000000, 0.1),
-            Skin.text(textColor, 22, fontFamily),
+            Skin.border(lightColor, 1, 2),
-            Skin.size(200, 38),
+            Skin.text(textColor, bigFontSize, fontFamily, fontEmbed),
+            Skin.geometry(new Geometry().setPadding([50, 8]).setMargin([0, 0, 0, 30])),
         ]);
         resources.skin.put("button", [
             Skin.buttonColor(lightColor),
-            Skin.text(textColor, 18, fontFamily),
+            Skin.text(textColor, bigFontSize, fontFamily, fontEmbed),
-            Skin.size(250, 50)
+            Skin.size(250, 50),
         ]);
         resources.skin.put("text.box", [
-            Skin.color(lightColor),
+            Skin.color(0x000000, 0.1),
-            Skin.text(textColor, 16, fontFamily),
+            Skin.border(lightColor, 1, 2),
+            Skin.text(textColor, baseFontSize, fontFamily, fontEmbed),
         ]);
         resources.skin.put("text.box.active", [
             Skin.color(0x55aa55),
-            Skin.text(textColor, 16, fontFamily),
+            Skin.border(0x88dd88, 1, 2),
+            Skin.text(textColor, baseFontSize, fontFamily, fontEmbed),
         ]);
         resources.skin.put("button.simple", [
             Skin.buttonColor(lightColor),
-            Skin.text(textColor, 16, fontFamily),
+            Skin.text(textColor, baseFontSize, fontFamily, fontEmbed),
-            Skin.size(100, 38),
+            Skin.geometry(new Geometry().setPadding([25, 8])),
+        ]);
+        resources.skin.put("button.simple.active", [
+            Skin.buttonColor(lightColor, activeColor),
+            Skin.text(activeColor, baseFontSize, fontFamily, fontEmbed),
+            Skin.geometry(new Geometry().setPadding([25, 8])),
         ]);
         resources.skin.put("button.tab", [
             Skin.tabColor(lightColor),
-            Skin.text(textColor, 16, fontFamily),
+            Skin.text(textColor, baseFontSize, fontFamily, fontEmbed),
-            Skin.size(200, 38),
+            Skin.geometry(new Geometry().setPadding([25, 8])),
         ]);
         resources.skin.put("border", [
             Skin.border(ColorUtil.multiply(lightColor, 1.5), 1, 2),
         ]);
+        resources.skin.put("scroll", [
+            Skin.scrollVertical(lightColor, ColorUtil.diff(lightColor, 128)),
+        ]);
         resources.skin.put("button.level", [
             Skin.buttonColor(lightColor),
-            Skin.text(textColor, 24, fontFamily),
+            Skin.text(textColor, veryBigFontSize, fontFamily, fontEmbed),
             Skin.size(64, 64),
         ]);
 
-        resources.skin.put("button.settings", [
+        resources.skin.put("container", [
-            Skin.size(64, 64),
+            Skin.geometry(new Geometry().setSize("100%", "100%")),
-            new ButtonSVGSkin(Assets.getText("resources/image/icon/cog-solid.svg"), lightColor)
+            Skin.layout(new Layout().setAlign(CENTER, MIDDLE)),
+            Skin.color(darkColor),
         ]);
-        resources.skin.put("button.close", [
+        resources.skin.put("panel", [
-            Skin.size(64, 64),
+            Skin.geometry(new Geometry().setSize("100%", -1).setPadding([20, 10])),
-            new ButtonSVGSkin(Assets.getText("resources/image/icon/times-circle-solid.svg"), lightColor)
+            Skin.layout(new Layout().setAlign(NONE, MIDDLE)),
+            Skin.color(lightColor),
         ]);
+        resources.skin.put("window", [
+            Skin.color(darkColor),
+            Skin.border(ColorUtil.multiply(lightColor, 1.5), 1, 2),
+            Skin.geometry(new Geometry().setPadding(2)),
+        ]);
+        resources.skin.put("window.close", [
+            Skin.size(36, 36),
+            new ButtonSVGSkin(Assets.getText("resources/image/icon/window-close-solid.svg"), lightColor),
+        ]);
+
+        registerButton("settings", "cog-solid.svg");
+        registerButton("close", "times-circle-solid.svg");
+        registerButton("next", "arrow-alt-circle-right-solid.svg");
+        registerButton("start", "play-circle-solid.svg");
+        registerButton("login", "sign-in-solid.svg");
+        registerButton("logout", "sign-out-solid.svg");
     }
 }

src/client/haxe/ru/m/tankz/bundle/ConfigBundle.hx

@@ -7,11 +7,12 @@ import ru.m.tankz.Type;
 import yaml.Parser;
 import yaml.Yaml;
 
-
 class ConfigBundle implements IConfigBundle {
 
     private var _cache:Map<GameType, Config> = new Map();
 
+    public function new() {}
+
     public function get(type:GameType):Config {
         if (!_cache.exists(type)) {
             var source:ConfigSource = Yaml.parse(Assets.getText('resources/${type}/config.yaml'), Parser.options().useObjects());

src/client/haxe/ru/m/tankz/bundle/LevelBundle.hx

@@ -5,11 +5,19 @@ import ru.m.tankz.config.Config;
 import ru.m.tankz.Type;
 import ru.m.tankz.util.LevelUtil;
 
-
 class LevelBundle implements ILevelBundle {
 
-    public function get(type:GameType, config:Config, level:Int):LevelConfig {
+    private var cache:Map<String, LevelConfig> = new Map();
-        var data:String = Assets.getText('resources/${type}/levels/level${LevelUtil.formatLevel(level)}.txt');
+
-        return LevelUtil.loads(config, data);
+    public function new() {}
+
+    public function get(type:GameType, config:Config, levelId:LevelId):LevelConfig {
+        var key = '${type}:${levelId}';
+        if (!cache.exists(key)) {
+            var data:String = Assets.getText('resources/${type}/levels/level${LevelUtil.formatLevel(levelId)}.txt');
+            cache[key] = LevelUtil.loads(config, data);
+            cache[key].id = levelId;
+        }
+        return cache[key];
     }
 }

src/client/haxe/ru/m/tankz/control/ActionConfig.hx

@@ -1,7 +1,5 @@
 package ru.m.tankz.control;
 
-import haxe.Serializer;
-import haxe.Unserializer;
 import ru.m.tankz.control.Control.TankAction;
 
 typedef ActionItem = {
@@ -26,16 +24,4 @@ class ActionConfig {
         }
         return result;
     }
-
-    public function clone():ActionConfig {
-        return loads(dumps());
-    }
-
-    public function dumps():String {
-        return Serializer.run(this);
-    }
-
-    public static function loads(value:String):ActionConfig {
-        return new Unserializer(value).unserialize();
-    }
 }

src/client/haxe/ru/m/tankz/control/ClientControlFactory.hx

@@ -1,23 +1,22 @@
 package ru.m.tankz.control;
 
+import ru.m.tankz.bot.StupidBotControl;
+import ru.m.tankz.bot.HardBotControl;
 import ru.m.tankz.Type;
-import ru.m.tankz.bot.BotControl;
-
 
 class ClientControlFactory implements IControlFactory {
 
-    private var humanControlIndex:Int;
+    public function new() {}
 
-    public function new() {
+    public function build(id:PlayerId, controller:Controller):Control {
-        humanControlIndex = 0;
+        return switch controller {
-    }
+            case HUMAN(index): new HumanControl(id, index);
-
+            case BOT(type): switch type {
-    public function build(id:PlayerId, type:ControlType):Control {
+                case StupidBotControl.BOT_TYPE: new StupidBotControl(id);
-        return switch (type) {
+                case HardBotControl.BOT_TYPE: new HardBotControl(id);
-            case Control.HUMAN: new HumanControl(id, humanControlIndex++);
+                case _: null;
-            case Control.BOT: new BotControl(id);
+            }
-            case Control.NONE: null;
+            case NONE: null;
-            case _: throw 'Unsupported control type: "${type}"';
         }
     }
 }

src/client/haxe/ru/m/tankz/control/ClientNetworkControl.hx

@@ -3,7 +3,6 @@ package ru.m.tankz.control;
 import ru.m.tankz.network.NetworkManager;
 import ru.m.tankz.control.Control;
 
-
 class ClientNetworkControl extends HumanControl {
 
     @:provide private var network:NetworkManager;

src/client/haxe/ru/m/tankz/control/HumanControl.hx

@@ -10,10 +10,9 @@ import ru.m.tankz.control.Control;
 import ru.m.tankz.storage.SettingsStorage;
 import ru.m.tankz.Type;
 
-
 class HumanControl extends Control {
 
-    @:provide var settings: SettingsStorage;
+    @:provide var storage:SettingsStorage;
 
     private var keyBinding:KeyBinding;
     private var moveQueue:Array<Int>;
@@ -21,7 +20,7 @@ class HumanControl extends Control {
 
     public function new(playerId:PlayerId, controlIndex:Int) {
         super(playerId);
-        this.keyBinding = settings.read(controlIndex).asKeyBinding();
+        this.keyBinding = storage.getActionConfig(controlIndex).asKeyBinding();
         moveQueue = new Array<Int>();
         Lib.current.stage.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDown);
         Lib.current.stage.addEventListener(KeyboardEvent.KEY_UP, onKeyUp);
@@ -43,9 +42,6 @@ class HumanControl extends Control {
                 }
             case _:
         }
-        if (event.keyCode == Keyboard.U) {
-            action(TankAction.UPGRADE);
-        }
     }
 
     private function onKeyUp(event:KeyboardEvent):Void {

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

@@ -1,108 +0,0 @@
-package ru.m.tankz.frame;
-
-import haxework.gui.ButtonView;
-import haxework.gui.frame.IFrameSwitcher;
-import haxework.gui.IGroupView;
-import haxework.gui.InputView;
-import haxework.gui.LabelView;
-import haxework.gui.list.ListView;
-import haxework.gui.VGroupView;
-import haxework.provider.Provider;
-import ru.m.tankz.game.GameState;
-import ru.m.tankz.network.NetworkManager;
-import ru.m.tankz.preset.ClassicGame;
-import ru.m.tankz.proto.core.GameInfoProto;
-import ru.m.tankz.proto.core.GameStateProto;
-import ru.m.tankz.proto.core.UserProto;
-
-
-@:template class NetworkFrame extends VGroupView {
-    public static var ID(default, never):String = "network";
-
-    @:view var frameSwitcher(default, null):IFrameSwitcher;
-
-    @:view var loginFrame(default, null):IGroupView;
-    @:view var stateLabel(default, null):LabelView;
-    @:view var nameInput(default, null):InputView;
-    @:view var loginButton(default, null):ButtonView;
-
-    @:view var gameListFrame(default, null):IGroupView;
-    @:view var createGameButton(default, null):ButtonView;
-    @:view var gameList(default, null):ListView<GameInfoProto>;
-
-    @:view var gameFrame(default, null):IGroupView;
-    @:view var leaveGameButton(default, null):ButtonView;
-    @:view var startGameButton(default, null):ButtonView;
-    @:view var userList(default, null):ListView<UserProto>;
-
-    @:provide var network:NetworkManager;
-    @:provide var mainFrameSwitcher:IFrameSwitcher;
-
-    public function init():Void {
-        loginButton.onPress = this;
-        createGameButton.onPress = this;
-        leaveGameButton.onPress = this;
-        startGameButton.onPress = this;
-        gameList.dispatcher.addListener({
-            onListItemClick: function(item:IListItemView<GameInfoProto>):Void {
-                network.joinGame(item.data.id);
-            }
-        });
-    }
-
-    public function onShow():Void {
-        nameInput.text = network.user.name;
-        onStateChange(network.state);
-        network.stateSignal.connect(onStateChange);
-    }
-
-    private function onStateChange(state:String):Void {
-        loginButton.disabled = !(state == "offline" || state == "error");
-        stateLabel.text = state;
-        if (state == 'online') {
-            gameList.data = [];
-            frameSwitcher.change(gameListFrame.id);
-            network.listGameSignal.connect(onListGame);
-            network.gameSignal.connect(onGame);
-            network.listGame();
-        } else {
-            frameSwitcher.change(loginFrame.id);
-        }
-    }
-
-    private function onListGame(games:Array<GameInfoProto>):Void {
-        gameList.data = games;
-    }
-
-    private function onGame(game:GameInfoProto):Void {
-        if (game != null) {
-            userList.data = game.players;
-            frameSwitcher.change(gameFrame.id);
-            if (game.state == GameStateProto.STARTED) {
-                Provider.set(GameState, new GameState(ClassicGame.TYPE, ClassicGame.PLAYER1));
-                mainFrameSwitcher.change(GameFrame.ID);
-            }
-        } else {
-            frameSwitcher.change(gameListFrame.id);
-        }
-    }
-
-    public function onHide():Void {
-        network.listGameSignal.disconnect(onListGame);
-        network.gameSignal.disconnect(onGame);
-        network.stateSignal.disconnect(onStateChange);
-    }
-
-    public function onPress(view:ButtonView):Void {
-        switch (view.id) {
-            case 'loginButton':
-                network.login(nameInput.text);
-            case 'createGameButton':
-                network.createGame('classic');
-            case 'leaveGameButton':
-                network.leaveGame();
-            case 'startGameButton':
-                network.startGame();
-        }
-    }
-}

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

@@ -1,90 +0,0 @@
----
-pWidth: 100
-pHeight: 100
-views:
-- id: frameSwitcher
-  $type: haxework.gui.frame.FrameSwitcher
-  pWidth: 100
-  pHeight: 100
-  views:
-  # login
-  - id: loginFrame
-    $type: haxework.gui.VGroupView
-    pWidth: 100
-    pHeight: 100
-    views:
-    - id: stateLabel
-      $type: haxework.gui.LabelView
-      $style: label
-      text: offline
-      width: 200
-      height: 50
-    - id: nameInput
-      $type: haxework.gui.InputView
-      $style: label
-      width: 200
-      height: 50
-      text: User
-      skin:
-        $type: haxework.gui.skin.ColorSkin
-        color: '#444444'
-    - id: loginButton
-      $type: haxework.gui.ButtonView
-      $style: button
-      text: Login
-  # game list
-  - id: gameListFrame
-    $type: haxework.gui.VGroupView
-    pWidth: 100
-    pHeight: 100
-    views:
-    - id: createGameButton
-      $type: haxework.gui.ButtonView
-      $style: button
-      text: Create
-    - id: gameList
-      $type: haxework.gui.list.VListView<ru.m.tankz.proto.core.GameInfoProto>
-      factory: "@class:ru.m.tankz.frame.network.GameItemView"
-      pWidth: 100
-      pHeight: 100
-      paddings: 10
-      scroll:
-        $type: haxework.gui.list.VScrollView
-        width: 10
-        pHeight: 100
-        skin:
-          $type: haxework.gui.list.VScrollSkin
-      skin:
-        $type: haxework.gui.skin.ColorSkin
-        color: "#000000"
-        alpha: 0
-  # game
-  - id: gameFrame
-    $type: haxework.gui.VGroupView
-    pWidth: 100
-    pHeight: 100
-    views:
-    - id: startGameButton
-      $type: haxework.gui.ButtonView
-      $style: button
-      text: Start
-    - id: leaveGameButton
-      $type: haxework.gui.ButtonView
-      $style: button
-      text: Leave
-    - id: userList
-      $type: haxework.gui.list.VListView<ru.m.tankz.proto.core.UserProto>
-      factory: "@class:ru.m.tankz.frame.network.UserItemView"
-      pWidth: 100
-      pHeight: 100
-      paddings: 10
-      scroll:
-        $type: haxework.gui.list.VScrollView
-        width: 10
-        pHeight: 100
-        skin:
-          $type: haxework.gui.list.VScrollSkin
-      skin:
-        $type: haxework.gui.skin.ColorSkin
-        color: "#000000"
-        alpha: 0

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

@@ -1,18 +0,0 @@
-package ru.m.tankz.frame;
-
-import haxework.gui.frame.FrameSwitcher;
-import haxework.gui.ButtonView;
-import haxework.gui.VGroupView;
-
-@:template class SettingsFrame extends VGroupView {
-
-    public static var ID(default, never):String = "settings";
-
-    @:provide var frameSwitcher:FrameSwitcher;
-
-    @:view var close:ButtonView;
-
-    public function onPress(_):Void {
-        frameSwitcher.change(StartFrame.ID);
-    }
-}

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

@@ -1,23 +0,0 @@
----
-geometry.size.stretch: true
-layout.hAlign: center
-layout.vAlign: middle
-views:
-  - $type: haxework.gui.LabelView
-    skinId: text.header
-    text: Settings
-  - $type: haxework.gui.HGroupView
-    layout.margin: 20
-    views:
-      - $type: ru.m.tankz.frame.settings.SettingsEditor
-        controlIndex: 0
-      - $type: ru.m.tankz.frame.settings.SettingsEditor
-        controlIndex: 1
-  - id: close
-    $type: haxework.gui.ButtonView
-    skinId: button.close
-    +onPress: $this:onPress
-    geometry.position: absolute
-    geometry.margin: 10
-    geometry.vAlign: bottom
-    geometry.hAlign: left

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

@@ -1,27 +0,0 @@
-package ru.m.tankz.frame;
-
-import ru.m.tankz.frame.classic.ClassicLevelFrame;
-import ru.m.tankz.frame.dota.DotaLevelFrame;
-import haxework.gui.ButtonView;
-import haxework.gui.frame.FrameSwitcher;
-import haxework.gui.VGroupView;
-
-@:template class StartFrame extends VGroupView {
-
-    public static var ID(default, never):String = "start";
-
-    @:provide var frameSwitcher:FrameSwitcher;
-
-    public function onPress(view:ButtonView):Void {
-        switch (view.id) {
-            case 'classic':
-                frameSwitcher.change(ClassicLevelFrame.ID);
-            case 'dota':
-                frameSwitcher.change(DotaLevelFrame.ID);
-            case 'network':
-                //frameSwitcher.change(NetworkFrame.ID);
-            case 'settings':
-                frameSwitcher.change(SettingsFrame.ID);
-        }
-    }
-}

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

@@ -1,43 +0,0 @@
----
-geometry.size.stretch: true
-layout.hAlign: center
-layout.vAlign: middle
-views:
-  - $type: haxework.gui.ImageView
-    image: $asset:image:resources/image/ui/logo.png
-    geometry.margin.bottom: 15
-  - $type: haxework.gui.VGroupView
-    layout.margin: 3
-    views:
-      - id: classic
-        $type: haxework.gui.ButtonView
-        skinId: button
-        +onPress: $this:onPress
-        text: Classic
-      - id: dota
-        $type: haxework.gui.ButtonView
-        skinId: button
-        +onPress: $this:onPress
-        text: DotA
-      - id: network
-        $type: haxework.gui.ButtonView
-        skinId: button
-        +onPress: $this:onPress
-        text: Network (in developing)
-        fontColor: 0xff0000
-        visible: false
-  - $type: haxework.gui.LabelView
-    skinId: text
-    geometry.position: absolute
-    geometry.margin: 10
-    geometry.vAlign: bottom
-    geometry.hAlign: right
-    text: $r:text:version
-  - id: settings
-    $type: haxework.gui.ButtonView
-    geometry.position: absolute
-    geometry.margin: 10
-    geometry.vAlign: bottom
-    geometry.hAlign: left
-    skinId: button.settings
-    +onPress: $this:onPress

src/client/haxe/ru/m/tankz/frame/classic/ClassicGameFrame.hx

@@ -1,20 +0,0 @@
-package ru.m.tankz.frame.classic;
-
-import ru.m.tankz.frame.common.IGamePanel;
-import ru.m.tankz.render.Render;
-import ru.m.tankz.frame.common.GameFrame;
-
-@:template class ClassicGameFrame extends GameFrame {
-    public static inline var ID = "classic.game";
-
-    @:view("render") private var renderView(default, null):Render;
-    @:view("panel") private var panelView(default, null):IGamePanel;
-
-    override private function get_render():Render {
-        return renderView;
-    }
-
-    override private function get_panel():IGamePanel {
-        return panelView;
-    }
-}

src/client/haxe/ru/m/tankz/frame/classic/ClassicGameFrame.yaml

@@ -1,11 +0,0 @@
----
-layout:
-  $type: haxework.gui.layout.HorizontalLayout
-  margin: 5
-  hAlign: center
-  vAlign: middle
-views:
-  - id: render
-    $type: ru.m.tankz.render.Render
-  - id: panel
-    $type: ru.m.tankz.frame.classic.ClassicGamePanel

src/client/haxe/ru/m/tankz/frame/classic/ClassicGamePanel.hx

@@ -1,39 +0,0 @@
-package ru.m.tankz.frame.classic;
-
-import haxework.gui.LabelView;
-import haxework.gui.VGroupView;
-import ru.m.tankz.frame.common.IGamePanel;
-import ru.m.tankz.frame.common.LifeView;
-import ru.m.tankz.game.Game;
-import ru.m.tankz.preset.ClassicGame;
-
-@:template class ClassicGamePanel extends VGroupView implements IGamePanel {
-
-    @:view var bot:LifeView;
-    @:view var player1:LifeView;
-    @:view var player2:LifeView;
-    @:view var level:LabelView;
-
-    public var game:Game;
-
-    private function updateViews():Void {
-        level.text = 'Level: ${game.state.level}';
-        bot.live = game.teams[ClassicGame.BOT].life;
-        player1.live = game.teams[ClassicGame.HUMAN].players[0].state.life;
-        player1.score = game.teams[ClassicGame.HUMAN].players[0].state.score;
-        if (game.teams[ClassicGame.HUMAN].players[1] != null) {
-            player2.visible = true;
-            player2.live = game.teams[ClassicGame.HUMAN].players[1].state.life;
-            player2.score = game.teams[ClassicGame.HUMAN].players[1].state.score;
-        } else {
-            player2.visible = false;
-        }
-    }
-
-    override public function update():Void {
-        if (game != null) {
-            updateViews();
-        }
-        super.update();
-    }
-}

src/client/haxe/ru/m/tankz/frame/classic/ClassicLevelFrame.hx

@@ -1,52 +0,0 @@
-package ru.m.tankz.frame.classic;
-
-import haxework.gui.ButtonView;
-import haxework.gui.DataView;
-import haxework.gui.frame.FrameSwitcher;
-import haxework.gui.ToggleButtonView;
-import ru.m.tankz.config.Config;
-import ru.m.tankz.frame.common.LevelFrame;
-import ru.m.tankz.preset.ClassicGame;
-
-@:template class ClassicLevelFrame extends LevelFrame {
-    public static inline var ID = "classic.level";
-
-    @:view var presets(default, null):DataView<GamePreset, ToggleButtonView>;
-    @:view var levels(default, null):DataView<Int, ButtonView>;
-
-    @:provide var frames:FrameSwitcher;
-
-    private function onShow():Void {
-        gameType = ClassicGame.TYPE;
-        levels.data = [for (i in 0...config.game.levels) i];
-        presets.data = config.presets;
-        setSelectedPreset(preset);
-    }
-
-    private function setSelectedPreset(preset:GamePreset) {
-        for (view in presets.views) {
-            cast(view, ToggleButtonView).on = view.id == preset.id;
-        }
-    }
-
-    private function presetViewFactory(index:Int, preset:GamePreset):ToggleButtonView {
-        var view = new ToggleButtonView();
-        view.id = preset.id;
-        view.text = '${preset.id}';
-        resources.skin.bind("button.simple", view, "skin");
-        return view;
-    }
-
-    override private function set_preset(value:GamePreset):GamePreset {
-        var result = super.set_preset(value);
-        setSelectedPreset(result);
-        return result;
-    }
-
-
-    override private function set_level(value:Int):Int {
-        var result = super.set_level(value);
-        frames.change(ClassicGameFrame.ID);
-        return result;
-    }
-}

src/client/haxe/ru/m/tankz/frame/classic/ClassicLevelFrame.yaml

@@ -1,26 +0,0 @@
----
-layout:
-  $type: haxework.gui.layout.VerticalLayout
-  hAlign: center
-views:
-  - $type: haxework.gui.LabelView
-    skinId: text.header
-    text: Classic
-  - id: presets
-    $type: haxework.gui.DataView
-    layout:
-      $type: haxework.gui.layout.HorizontalLayout
-      hAlign: center
-      margin: 2
-    factory: $this:presetViewFactory
-    +onDataSelect: $code:function(value) preset = value
-    geometry.padding: 10
-  - id: levels
-    $type: haxework.gui.DataView
-    layout:
-      $type: haxework.gui.layout.TailLayout
-      rowSize: 10
-      margin: 5
-    factory: $this:levelViewFactory
-    +onDataSelect: $code:function(value) level = value
-    geometry.padding: 10

src/client/haxe/ru/m/tankz/frame/common/GameFrame.hx

@@ -1,93 +0,0 @@
-package ru.m.tankz.frame.common;
-
-import ru.m.tankz.game.GameState;
-import flash.events.Event;
-import haxe.ds.Option;
-import haxe.Timer;
-import haxework.gui.frame.FrameSwitcher;
-import haxework.gui.GroupView;
-import ru.m.tankz.frame.common.IGamePanel;
-import ru.m.tankz.game.Game;
-import ru.m.tankz.network.NetworkManager;
-import ru.m.tankz.render.Render;
-import ru.m.tankz.sound.SoundManager;
-
-class GameFrame extends GroupView {
-
-    private static inline var TAG = "GameFrame";
-
-    private var render(get, null):Render;
-    private var panel(get, null):IGamePanel;
-
-    @:provide var network:NetworkManager;
-    @:provide var sound:SoundManager;
-    @:provide var state:GameState;
-    @:provide var switcher:FrameSwitcher;
-
-    private var game:Game;
-    private var timer:Timer;
-
-    private function get_render():Render {
-        throw "Not implemented";
-    }
-
-    private function get_panel():IGamePanel {
-        throw "Not implemented";
-    }
-
-    public function onShow():Void {
-        start(state);
-    }
-
-    private function start(state:GameState):Void {
-        game = new Game(state.type);
-        game.engine.connect(render);
-        game.engine.connect(sound);
-        game.start(state).then(onGameStateChange).endThen(onGameComplete);
-        timer = new Timer(10);
-        timer.run = updateEngine;
-        panel.game = game;
-        content.addEventListener(Event.ENTER_FRAME, _redraw);
-        render.draw(game.engine);
-        sound.play('start');
-    }
-
-    private function stop():Void {
-        if (timer != null) {
-            timer.stop();
-            timer = null;
-        }
-        content.removeEventListener(Event.ENTER_FRAME, _redraw);
-        if (game != null) {
-            game.dispose();
-            game = null;
-        }
-        render.reset();
-    }
-
-    private function onGameStateChange(_):Void {
-        panel.toUpdate();
-    }
-
-    private function onGameComplete(_):Void {
-        switch (game.next()) {
-            case Option.Some(s):
-                stop();
-                start(s);
-            case Option.None:
-                switcher.change(StartFrame.ID);
-        }
-    }
-
-    public function onHide():Void {
-        stop();
-    }
-
-    private function updateEngine():Void {
-        game.engine.update();
-    }
-
-    private function _redraw(_):Void {
-        render.draw(game.engine);
-    }
-}

src/client/haxe/ru/m/tankz/frame/common/IGamePanel.hx

@@ -1,8 +0,0 @@
-package ru.m.tankz.frame.common;
-
-import ru.m.tankz.game.Game;
-import haxework.gui.IView;
-
-interface IGamePanel extends IView<Dynamic> {
-    public var game:Game;
-}

src/client/haxe/ru/m/tankz/frame/common/LevelFrame.hx

@@ -1,56 +0,0 @@
-package ru.m.tankz.frame.common;
-
-import haxework.gui.ButtonView;
-import haxework.gui.GroupView;
-import haxework.resources.IResources;
-import ru.m.tankz.bundle.IConfigBundle;
-import ru.m.tankz.config.Config;
-import ru.m.tankz.game.GameState;
-import ru.m.tankz.Type;
-
-class LevelFrame extends GroupView {
-
-    public var gameType(default, set):GameType;
-    public var preset(default, set):GamePreset;
-    public var level(default, set):Int;
-    private var config(default, null):Config;
-
-    @:provide var configBundle:IConfigBundle;
-    @:provide var state:GameState;
-    @:provide var resources:IResources;
-
-    private function set_gameType(value:GameType):GameType {
-        if (gameType != value || true) { // ToDo:
-            gameType = value;
-            config = configBundle.get(gameType);
-            preset = config.presets[0];
-        }
-        return gameType;
-    }
-
-    private function set_preset(value:GamePreset):GamePreset {
-        if (preset != value || true) { // ToDo:
-            preset = value;
-            state = new GameState(gameType, preset.id);
-            for (team in value.teams) {
-                for (player in team.players) {
-                    var playerId = new PlayerId(team.id, player.index);
-                    state.players.push(new PlayerState(playerId, player.control, player.life));
-                }
-            }
-        }
-        return preset;
-    }
-
-    private function set_level(value:Int):Int {
-        state.level = value;
-        return state.level;
-    }
-
-    private function levelViewFactory(index:Int, level:Int):ButtonView {
-        var view = new ButtonView();
-        view.text = '${level}';
-        resources.skin.bind("button.level", view, "skin");
-        return view;
-    }
-}

src/client/haxe/ru/m/tankz/frame/common/LifeView.hx

@@ -1,37 +0,0 @@
-package ru.m.tankz.frame.common;
-
-import openfl.Assets;
-import haxework.gui.LabelView;
-import haxework.gui.ImageView;
-import haxework.gui.HGroupView;
-
-@:template class LifeView extends HGroupView {
-    @:view("tank") public var tankImage:ImageView;
-    @:view("live") public var liveLabel:LabelView;
-    @:view("score") public var scoreLabel:LabelView;
-
-    public var tank(null, set):String;
-    public var color(null, set):Int;
-    public var live(null, set):Int;
-    public var score(null, set):Int;
-
-    private inline function set_tank(value:String):String {
-        tankImage.image = Assets.getBitmapData('resources/image/tank/${value}-0.png');
-        return value;
-    }
-
-    private inline function set_color(value:Int):Int {
-        tankImage.color = value;
-        return value;
-    }
-
-    private inline function set_live(value:Int):Int {
-        liveLabel.text = 'x${value}';
-        return value;
-    }
-
-    private inline function set_score(value:Int):Int {
-        scoreLabel.text = '${value}$';
-        return value;
-    }
-}

src/client/haxe/ru/m/tankz/frame/dota/DotaGameFrame.hx

@@ -1,21 +0,0 @@
-package ru.m.tankz.frame.dota;
-
-import ru.m.tankz.frame.common.GameFrame;
-import ru.m.tankz.frame.common.IGamePanel;
-import ru.m.tankz.render.Render;
-
-@:template class DotaGameFrame extends GameFrame {
-
-    public static inline var ID = "dota.game";
-
-    @:view("render") private var renderView(default, null):Render;
-    @:view("panel") private var panelView(default, null):IGamePanel;
-
-    override private function get_render():Render {
-        return renderView;
-    }
-
-    override private function get_panel():IGamePanel {
-        return panelView;
-    }
-}

src/client/haxe/ru/m/tankz/frame/dota/DotaGameFrame.yaml

@@ -1,9 +0,0 @@
----
-layout:
-  $type: haxework.gui.layout.VerticalLayout
-  margin: 5
-views:
-  - id: panel
-    $type: ru.m.tankz.frame.dota.DotaGamePanel
-  - id: render
-    $type: ru.m.tankz.render.Render

src/client/haxe/ru/m/tankz/frame/dota/DotaGamePanel.hx

@@ -1,32 +0,0 @@
-package ru.m.tankz.frame.dota;
-
-import haxework.gui.HGroupView;
-import haxework.gui.LabelView;
-import ru.m.tankz.frame.common.IGamePanel;
-import ru.m.tankz.frame.common.LifeView;
-import ru.m.tankz.game.Game;
-import ru.m.tankz.preset.DotaGame;
-
-@:template class DotaGamePanel extends HGroupView implements IGamePanel {
-
-    @:view var radiant:LifeView;
-    @:view var dire:LifeView;
-    @:view var level:LabelView;
-
-    public var game:Game;
-
-    private function updateViews():Void {
-        level.text = 'Level: ${game.state.level}';
-        radiant.live = game.teams[DotaGame.RADIANT].life;
-        radiant.score = game.teams[DotaGame.RADIANT].score;
-        dire.live = game.teams[DotaGame.DIRE].life;
-        dire.score = game.teams[DotaGame.DIRE].score;
-    }
-
-    override public function update():Void {
-        if (game != null) {
-            updateViews();
-        }
-        super.update();
-    }
-}

src/client/haxe/ru/m/tankz/frame/dota/DotaGamePanel.yaml

@@ -1,21 +0,0 @@
----
-geometry.size.width: 100%
-layout.margin: 20
-views:
-  - id: radiant
-    $type: ru.m.tankz.frame.common.LifeView
-    tank: bc
-    color: 0xff4422
-  - $type: haxework.gui.SpriteView
-    geometry.size.width: 50%
-  - id: level
-    $type: haxework.gui.LabelView
-    skinId: text.box
-    geometry.size.height: 38
-    geometry.padding: [20, 0]
-  - $type: haxework.gui.SpriteView
-    geometry.size.width: 50%
-  - id: dire
-    $type: ru.m.tankz.frame.common.LifeView
-    tank: bc
-    color: 0x3284ff

src/client/haxe/ru/m/tankz/frame/dota/DotaLevelFrame.hx

@@ -1,37 +0,0 @@
-package ru.m.tankz.frame.dota;
-
-import haxework.gui.ButtonView;
-import haxework.gui.DataView;
-import haxework.gui.frame.FrameSwitcher;
-import ru.m.tankz.frame.common.LevelFrame;
-import ru.m.tankz.frame.common.PlayerView;
-import ru.m.tankz.game.GameState;
-import ru.m.tankz.preset.DotaGame;
-
-@:template class DotaLevelFrame extends LevelFrame {
-    public static inline var ID = "dota.level";
-
-    @:view var levels(default, null):DataView<Int, ButtonView>;
-    @:view var players(default, null):DataView<Array<PlayerState>, PlayerView>;
-
-    @:provide var frames:FrameSwitcher;
-
-    private function onShow():Void {
-        gameType = DotaGame.TYPE;
-        levels.data = [for (i in 0...config.game.levels) i];
-        players.data = [for (i in 0...2) state.players];
-    }
-
-    private function playerViewFactory(index:Int, data:Array<PlayerState>):PlayerView {
-        var view = new PlayerView();
-        view.item_index = index;
-        view.data = data;
-        return view;
-    }
-
-    override private function set_level(value:Int):Int {
-        var result = super.set_level(value);
-        frames.change(DotaGameFrame.ID);
-        return result;
-    }
-}

src/client/haxe/ru/m/tankz/frame/dota/DotaLevelFrame.yaml

@@ -1,24 +0,0 @@
----
-layout:
-  $type: haxework.gui.layout.VerticalLayout
-  hAlign: center
-views:
-  - $type: haxework.gui.LabelView
-    skinId: text.header
-    text: DotA
-  - id: players
-    $type: haxework.gui.DataView
-    layout:
-      $type: haxework.gui.layout.VerticalLayout
-      hAlign: center
-    factory: $this:playerViewFactory
-    geometry.padding: 10
-  - id: levels
-    $type: haxework.gui.DataView
-    layout:
-      $type: haxework.gui.layout.TailLayout
-      rowSize: 5
-      margin: 5
-    factory: $this:levelViewFactory
-    +onDataSelect: $code:function(value) level = value
-    geometry.padding: 10

src/client/haxe/ru/m/tankz/frame/network/GameItemView.hx

@@ -1,21 +0,0 @@
-package ru.m.tankz.frame.network;
-
-import haxework.gui.HGroupView;
-import haxework.gui.LabelView;
-import haxework.gui.list.ListView;
-import ru.m.tankz.proto.core.GameInfoProto;
-
-
-@:template class GameItemView extends HGroupView implements IListItemView<GameInfoProto> {
-
-    public var item_index(default, default):Int;
-    public var data(default, set):GameInfoProto;
-
-    @:view var label(default, null):LabelView;
-
-    private function set_data(value:GameInfoProto):GameInfoProto {
-        data = value;
-        label.text = '${data.type}';
-        return data;
-    }
-}

src/client/haxe/ru/m/tankz/frame/network/GameItemView.yaml

@@ -1,15 +0,0 @@
----
-width: 440
-height: 44
-margins: 5
-views:
-- id: label
-  $type: haxework.gui.LabelView
-  $style: label
-  pWidth: 100
-  pHeight: 100
-  text: ""
-skin:
-  $type: haxework.gui.skin.ColorSkin
-  color: "#000000"
-  alpha: 0.2

src/client/haxe/ru/m/tankz/frame/network/UserItemView.hx

@@ -1,21 +0,0 @@
-package ru.m.tankz.frame.network;
-
-import haxework.gui.HGroupView;
-import haxework.gui.LabelView;
-import haxework.gui.list.ListView;
-import ru.m.tankz.proto.core.UserProto;
-
-
-@:template class UserItemView extends HGroupView implements IListItemView<UserProto> {
-
-    public var item_index(default, default):Int;
-    public var data(default, set):UserProto;
-
-    @:view var label(default, null):LabelView;
-
-    private function set_data(value:UserProto):UserProto {
-        data = value;
-        label.text = '${data.uuid} -- ${data.name}';
-        return data;
-    }
-}

src/client/haxe/ru/m/tankz/frame/network/UserItemView.yaml

@@ -1,15 +0,0 @@
----
-width: 440
-height: 44
-margins: 5
-views:
-- id: label
-  $type: haxework.gui.LabelView
-  $style: label
-  pWidth: 100
-  pHeight: 100
-  text: ""
-skin:
-  $type: haxework.gui.skin.ColorSkin
-  color: "#000000"
-  alpha: 0.2

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

@@ -1,29 +0,0 @@
-layout.margin: 10
-layout.hAlign: center
-views:
-  - id: label
-    $type: haxework.gui.LabelView
-    skinId: text
-  - $type: haxework.gui.HGroupView
-    layout.margin: 10
-    views:
-      - id: change
-        $type: haxework.gui.ButtonView
-        +onPress: $this:onPress
-        skinId: button.simple
-        text: Change
-      - id: clear
-        $type: haxework.gui.ButtonView
-        +onPress: $this:onPress
-        skinId: button.simple
-        text: Clear
-      - id: reset
-        $type: haxework.gui.ButtonView
-        +onPress: $this:onPress
-        skinId: button.simple
-        text: Reset
-  - id: list
-    $type: haxework.gui.DataView
-    layout:
-      $type: haxework.gui.layout.VerticalLayout
-    factory: $this:viewFactory

src/client/haxe/ru/m/tankz/network/NetworkManager.hx

@@ -1,78 +1,90 @@
 package ru.m.tankz.network;
 
+import ru.m.tankz.proto.core.UserProto;
 import haxework.signal.Signal;
-import ru.m.tankz.proto.pack.GameRequest;
+import ru.m.connect.IConnection;
-import ru.m.tankz.proto.core.GameProto;
-import ru.m.tankz.proto.pack.StartGameRequest;
-import ru.m.tankz.proto.game.GameChangeProto;
-import ru.m.tankz.proto.game.GameActionTypeProto;
-import ru.m.tankz.proto.pack.GameUpdateRequest;
 import ru.m.tankz.control.Control;
+import ru.m.tankz.proto.core.GameProto;
+import ru.m.tankz.proto.game.GameChangeProto;
+import ru.m.tankz.proto.pack.CreateGameRequest;
 import ru.m.tankz.proto.pack.JoinGameRequest;
 import ru.m.tankz.proto.pack.LeaveGameRequest;
-import ru.m.tankz.proto.pack.CreateGameRequest;
-import ru.m.connect.IConnection;
-import ru.m.tankz.proto.core.GameInfoProto;
 import ru.m.tankz.proto.pack.ListGameRequest;
 import ru.m.tankz.proto.pack.LoginRequest;
+import ru.m.tankz.proto.pack.LogoutRequest;
 import ru.m.tankz.proto.pack.Request;
 import ru.m.tankz.proto.pack.Response;
-import ru.m.tankz.storage.UserStorage;
+import ru.m.tankz.proto.pack.StartGameRequest;
-
+import ru.m.tankz.storage.MultiplayerStorage;
 
 typedef ClientConnection = IConnection<Request, Response>;
 
+enum ConnectionState {
+    OFFLINE;
+    CONNECT;
+    CONNECTED;
+    LOGIN;
+    ONLINE(user:User);
+    ERROR(error:Dynamic);
+}
+
 class NetworkManager {
 
-    public var state(default, null):String;
+    public var state(default, null):ConnectionState;
-    public var stateSignal:Signal<String>;
+    public var game(default, null):GameProto;
-    public var listGameSignal:Signal<Array<GameInfoProto>>;
+    public var user(default, null):UserProto;
-    public var gameSignal:Signal<GameInfoProto>;
+
+    public var stateSignal:Signal<ConnectionState>;
+    public var listGameSignal:Signal<Array<GameProto>>;
+    public var gameSignal:Signal<GameProto>;
     public var gameUpdateSignal:Signal<Array<GameChangeProto>>;
-    public var user(default, null):User;
-    public var game(default, set):NetworkGame;
 
     @:provide private var connection:ClientConnection;
-    @:provide private var storage:UserStorage;
+    @:provide private var storage:MultiplayerStorage;
 
     public function new() {
-        stateSignal = new Signal<String>();
+        stateSignal = new Signal();
-        listGameSignal = new Signal<Array<GameInfoProto>>();
+        listGameSignal = new Signal();
-        gameSignal = new Signal<GameInfoProto>();
+        gameSignal = new Signal();
-        gameUpdateSignal = new Signal<Array<GameChangeProto>>();
+        gameUpdateSignal = new Signal();
-        updateState('offline');
+        updateState(OFFLINE);
         connection.handler.connect(onConnectionEvent);
         connection.receiveHandler.connect(onResponse);
-        user = storage.read();
+        var user = storage.user;
-        if (user == null) {
+        if (user != null) {
-            user = {name: 'User', uuid: null};
+            login(user.name, user.uuid);
         }
     }
 
-    private function updateState(value:String):Void {
+    private function updateState(value:ConnectionState):Void {
         state = value;
         stateSignal.emit(value);
     }
 
-    public function login(name:String):Void {
+    public function login(name:String, uuid:String = null):Void {
-        user.name = name;
+        updateState(CONNECT);
-        updateState('connect...');
         connection.connect().then(function(c:ClientConnection) {
-            updateState('login...');
+            updateState(LOGIN);
             c.send(new Request().setLogin(
                 new LoginRequest()
-                    .setUuid(user.uuid)
+                    .setUuid(uuid)
-                    .setName(user.name)
+                    .setName(name)
             ));
-        }).catchError(function(_) {});
+        }).catchError(function(error) {
+            updateState(ERROR(error));
+        });
+    }
+
+    public function logout():Void {
+        connection.send(new Request().setLogout(new LogoutRequest()));
     }
 
     public function listGame():Void {
         connection.send(new Request().setListGame(new ListGameRequest()));
     }
 
-    public function createGame(type:String):Void {
+    public function createGame(type:String, level:Int):Void {
-        connection.send(new Request().setCreateGame(new CreateGameRequest().setType(type)));
+        connection.send(new Request().setCreateGame(new CreateGameRequest().setType(type).setLevel(level)));
     }
 
     public function joinGame(gameId:Int):Void {
@@ -88,70 +100,54 @@ class NetworkManager {
     }
 
     public function action(action:TankAction):Void {
-        var update:GameUpdateRequest = switch action {
+        // ToDo: network
-            case TankAction.MOVE(direction):
-                new GameUpdateRequest()
-                    .setType(GameActionTypeProto.MOVE)
-                    .setDirectionX(direction.x)
-                    .setDirectionY(direction.y);
-            case TankAction.STOP:
-                new GameUpdateRequest()
-                    .setType(GameActionTypeProto.STOP);
-            case TankAction.SHOT:
-                new GameUpdateRequest()
-                    .setType(GameActionTypeProto.SHOT);
-            case _: null;
-        }
-        if (update != null) {
-            connection.send(new Request().setUpdateGame(update));
-        }
     }
 
     private function onConnectionEvent(event:ConnectionEvent):Void {
-        updateState(switch (event) {
+        updateState(switch event {
-            case ConnectionEvent.CONNECTED:
+            case CONNECTED:
                 L.d('Network', '$event');
-                'connected';
+                CONNECTED;
-            case ConnectionEvent.DISCONNECTED:
+            case DISCONNECTED:
                 L.d('Network', '$event');
-                'offline';
+                OFFLINE;
-            case ConnectionEvent.ERROR(error):
+            case ERROR(error):
                 L.e('Network', '$error', error);
-                'error';
+                ERROR(error);
         });
     }
 
     private function onResponse(packet:Response):Void {
         if (packet.hasLogin()) {
-            user = {
+            this.user = packet.login.user;
-                uuid: packet.login.user.uuid,
+            var user = {
-                name: packet.login.user.name,
+                uuid: this.user.uuid,
+                name: this.user.name,
             };
-            storage.write(user);
+            storage.user = user;
-            updateState('online');
+            updateState(ONLINE(user));
         } else if (packet.hasLogout()) {
-            user = null;
+            storage.user = null;
-            updateState('connected');
+            updateState(CONNECTED);
         } else if (packet.hasListGame()) {
             listGameSignal.emit(packet.listGame.games);
         } else if (packet.hasCreateGame()) {
-            gameSignal.emit(packet.createGame.game);
+            game = packet.createGame.game;
+            gameSignal.emit(game);
         } else if (packet.hasJoinGame()) {
-            gameSignal.emit(packet.joinGame.game);
+            game = packet.joinGame.game;
+            gameSignal.emit(game);
         } else if (packet.hasLeaveGame()) {
-            gameSignal.emit(null);
+            if (packet.leaveGame.user.uuid == user.uuid) {
+                game = null;
+                gameSignal.emit(null);
+            } else {
+                game = packet.leaveGame.game;
+                gameSignal.emit(game);
+            }
         } else if (packet.hasStartGame()) {
-            gameSignal.emit(packet.startGame.game);
+            game = packet.startGame.game;
-        } else if (packet.hasUpdateGame()) {
+            gameSignal.emit(game);
-            gameUpdateSignal.emit(packet.updateGame.changes);
-        } else if (packet.hasGame()) {
-            game.load(packet.game.game);
         }
     }
-
-    private function set_game(value:NetworkGame):NetworkGame {
-        this.game = value;
-        connection.send(new Request().setGame(new GameRequest()));
-        return this.game;
-    }
 }

src/client/haxe/ru/m/tankz/render/AnimateBundle.hx

@@ -1,13 +1,8 @@
 package ru.m.tankz.render;
 
-import haxework.gui.utils.BitmapUtil;
-import haxework.color.Color;
-import flash.display.BitmapData;
 import openfl.Assets;
 import ru.m.animate.Animate;
 import ru.m.animate.OnceAnimate;
-import ru.m.tankz.core.Tank;
-import ru.m.tankz.Type;
 
 class AnimateBundle {
 
@@ -44,27 +39,4 @@ class AnimateBundle {
             length: 5
         })]);
     }
-
-    public static function tankFrames(tank:Tank):Array<Frame> {
-        var color:Color = switch (tank.hits) {
-            case 1: 0x869C43;
-            case 2: 0xDEAF80;
-            case 3: 0x5EA67A;
-            case _: tank.color;
-        }
-        var colors:Array<Color> = [color, color];
-        if (tank.bonus) {
-            colors[1] = 0xff00aa;
-        }
-        return [for (i in 0...2) ({
-            image: BitmapUtil.colorize(Assets.getBitmapData('resources/image/tank/${tank.config.skin}-${i}.png'), colors[i]),
-            length: 3
-        })];
-    }
-
-    public static function bonusFrames(type:BonusType):Array<Frame> {
-        var image =  Assets.getBitmapData('resources/image/bonus/${type}.png');
-        var empty = new BitmapData(image.width, image.height, true, 0x00000000);
-        return [{image: image, length: 15}, {image: empty, length: 15}];
-    }
 }

src/client/haxe/ru/m/tankz/render/IRender.hx

@@ -0,0 +1,11 @@
+package ru.m.tankz.render;
+
+import haxework.view.IView;
+import ru.m.tankz.config.Config;
+import ru.m.tankz.game.IGame;
+
+interface IRender extends IView<Dynamic> extends GameListener {
+    public var config(default, set):Config;
+    public function draw():Void;
+    public function reset():Void;
+}

src/client/haxe/ru/m/tankz/render/Render.hx

@@ -3,21 +3,28 @@ package ru.m.tankz.render;
 import flash.display.DisplayObjectContainer;
 import flash.display.Graphics;
 import flash.display.Sprite;
-import flash.text.TextField;
+import flash.events.Event;
-import flash.text.TextFormat;
 import haxe.Timer;
-import haxework.gui.SpriteView;
+import haxework.view.LabelView;
-import haxework.provider.Provider;
+import haxework.view.SpriteView;
-import haxework.resources.IResources;
+import promhx.Promise;
 import ru.m.animate.Animate;
 import ru.m.animate.OnceAnimate;
 import ru.m.geom.Point;
+import ru.m.tankz.config.Config;
 import ru.m.tankz.core.EntityType;
-import ru.m.tankz.engine.Engine;
+import ru.m.tankz.game.GameEvent;
-import ru.m.tankz.render.RenderItem;
+import ru.m.tankz.render.item.BonusRenderItem;
+import ru.m.tankz.render.item.BrickRenderItem;
+import ru.m.tankz.render.item.BulletRenderItem;
+import ru.m.tankz.render.item.EagleRenderItem;
+import ru.m.tankz.render.item.IRenderItem;
+import ru.m.tankz.render.item.TankRenderItem;
 import ru.m.tankz.Type;
 
-class Render extends SpriteView {
+class Render extends SpriteView implements IRender {
+
+    public var config(default, set):Config;
 
     private var backgroundLayer:Sprite;
     private var groundLayer:Sprite;
@@ -25,8 +32,7 @@ class Render extends SpriteView {
     private var upLayer:Sprite;
     private var upperLayer:Sprite;
 
-    private var background:Sprite;
+    private var items:Map<Int, IRenderItem>;
-    private var items:Map<String, RenderItem<Dynamic, Dynamic>>;
 
     public function new() {
         super();
@@ -44,42 +50,29 @@ class Render extends SpriteView {
         reset();
     }
 
-    private function drawBackground(game:Engine):Void {
+    private function set_config(value:Config):Config {
-        var mapWidth = game.map.gridWidth * game.map.cellWidth;
+        return config = value;
-        var mapHeight = game.map.gridHeight * game.map.cellHeight;
+    }
+
+    private function drawBackground():Void {
+        var width = config.map.cellWidth * config.map.gridWidth;
+        var height = config.map.cellHeight * config.map.gridHeight;
         var g:Graphics = backgroundLayer.graphics;
         g.clear();
         g.beginFill(0x000000);
-        g.drawRect(0, 0, mapWidth, mapHeight);
+        g.drawRect(0, 0, width, height);
         g.endFill();
-        setContentSize(mapWidth, mapHeight);
+        setContentSize(width, height);
     }
 
-    public function draw(game:Engine):Void {
+    public function draw():Void {
-        for (brick in game.map.bricks) if (brick.config.index > 0) {
-            if (!items.exists(brick.key)) {
-                var item:RenderItem<Dynamic, Dynamic> = switch(brick.config.type) {
-                    case 'ace' | 'bush': new BrickItem(brick);
-                    case 'water': new BrickAnimateItem(brick);
-                    case 'armor' | 'brick': new BrickBreakingItem(brick);
-                    case x: null;
-                };
-                if (item != null) {
-                    items[brick.key] = item;
-                    if (brick.config.layer > 2) {
-                        upLayer.addChild(item.view);
-                    } else {
-                        groundLayer.addChild(item.view);
-                    }
-                }
-            }
-        }
         for (item in items) {
             item.update();
         }
-        if (background == null) {
+    }
-            drawBackground(game);
+
-        }
+    private function onEnterFrame(event:Event):Void {
+        draw();
     }
 
     private function clearLayer(layer:DisplayObjectContainer) {
@@ -87,94 +80,157 @@ class Render extends SpriteView {
     }
 
     public function reset():Void {
+        content.removeEventListener(Event.ENTER_FRAME, onEnterFrame);
         for (item in items.iterator()) {
             item.dispose();
         }
         items = new Map();
-        if (background != null) {
-            backgroundLayer.removeChild(background);
-            background = null;
-        }
         clearLayer(entryLayer);
         clearLayer(groundLayer);
         clearLayer(upLayer);
         clearLayer(upperLayer);
     }
 
-    public function onSpawn(entity:EntityType):Void {
+    public function onGameEvent(event:GameEvent):Void {
-        switch(entity) {
+        switch event {
-            case EntityType.TANK(tank):
+            case START(_):
-                var item = new TankItem(tank);
+                content.addEventListener(Event.ENTER_FRAME, onEnterFrame);
-                items.set(tank.key, item);
+            case COMPLETE(_, _):
+                content.removeEventListener(Event.ENTER_FRAME, onEnterFrame);
+            case SPAWN(BRICK(bricks)):
+                drawBackground();
+                for (brick in bricks) {
+                    var item:IRenderItem = new BrickRenderItem(brick.rect, brick.type);
+                    var config = config.getBrick(brick.type);
+                    items[brick.id] = item;
+                    if (config.layer > 2) {
+                        upLayer.addChild(item.view);
+                    } else {
+                        groundLayer.addChild(item.view);
+                    }
+                }
+            case SPAWN(EAGLE(id, rect, teamId)):
+                var item = new EagleRenderItem(rect, config.getColor(new PlayerId(teamId, -1)));
+                items.set(id, item);
                 entryLayer.addChild(item.view);
                 item.update();
-                playAnimate(tank.rect.center, AnimateBundle.tankSpawn());
+            case SPAWN(TANK(id, rect, playerId, info)):
-            case EntityType.BULLET(bullet):
+                var item = new TankRenderItem(rect);
-                var item = new BulletItem(bullet);
+                var tankConfig = config.getTank(info.type);
-                items.set(bullet.key, item);
+                item.color = config.getColor(playerId);
+                item.skin = tankConfig.skin;
+                item.hits = info.hits;
+                item.bonus = info.bonus;
+                items.set(id, item);
                 entryLayer.addChild(item.view);
                 item.update();
-            case EntityType.EAGLE(eagle):
+                playAnimate(item.rect.center, AnimateBundle.tankSpawn());
-                var item = new EagleItem(eagle);
+            case SPAWN(BULLET(id, rect, playerId, piercing)):
-                items.set(eagle.key, item);
+                var item = new BulletRenderItem(rect, piercing);
+                items.set(id, item);
                 entryLayer.addChild(item.view);
                 item.update();
-            case EntityType.BONUS(bonus):
+            case SPAWN(BONUS(id, rect, type)):
-                var item = new BonusItem(bonus);
+                var item = new BonusRenderItem(rect, type);
-                items.set(bonus.key, item);
+                items.set(id, item);
                 upperLayer.addChild(item.view);
                 item.update();
-            case _:
+            case MOVE(EAGLE(id, position)):
-        }
+                if (items.exists(id)) {
-    }
+                    var item = items[id];
-
+                    item.move(position);
-    public function onChange(entity:EntityType, change:EntityChange):Void {}
-
-    public function onCollision(entity:EntityType, with:EntityType):Void {
-        switch [entity, with] {
-            case [EntityType.BULLET(_), EntityType.EAGLE(eagle)]:
-                if (eagle.death) {
-                    playAnimate(eagle.rect.center, AnimateBundle.tankBoom());
                 }
-            case _:
+            case MOVE(BULLET(id, position)):
-        }
+                if (items.exists(id)) {
-    }
+                    var item = items[id];
-
+                    item.move(position);
-    public function onDestroy(entity:EntityType, ?playerId:PlayerId):Void {
+                }
-        switch entity {
+            case MOVE(TANK(id, position)):
-            case EntityType.TANK(tank):
+                if (items.exists(id)) {
-                if (items.exists(tank.key)) {
+                    var item = items[id];
-                    entryLayer.removeChild(items.get(tank.key).view);
+                    item.move(position);
-                    items.remove(tank.key);
+                    cast(item, TankRenderItem).moves = true;
-                    playAnimate(tank.rect.center, AnimateBundle.tankBoom());
+                }
-                    if (tank.config.score > 0) {
+            case STOP(TANK(id)):
-                        showScore(tank.rect.center, tank.config.score);
+                if (items.exists(id)) {
+                    var item = items[id];
+                    cast(item, TankRenderItem).moves = false;
+                }
+            case CHANGE(TANK(id, type, hits, bonus)):
+                if (items.exists(id)) {
+                    var item:TankRenderItem = cast items[id];
+                    item.skin = config.getTank(type).skin;
+                    item.hits = hits;
+                    item.bonus = bonus;
+                }
+            case CHANGE(TANK_PROTECT(id, state)):
+                if (items.exists(id)) {
+                    var item:TankRenderItem = cast items[id];
+                    item.protect = state;
+                }
+            case CHANGE(EAGLE_PROTECT(id, state)):
+                if (items.exists(id)) {
+                    var item:EagleRenderItem = cast items[id];
+                    item.protect = state;
+                }
+            case CHANGE(BRICK(id, type)):
+                if (items.exists(id)) {
+                    var item:BrickRenderItem = cast items[id];
+                    item.type = type;
+                }
+            case DESTROY(TANK(id, shot)):
+                if (items.exists(id)) {
+                    var item = items[id];
+                    entryLayer.removeChild(item.view);
+                    playAnimate(item.rect.center, AnimateBundle.tankBoom());
+                    if (shot.score != 0) {
+                        showScore(item.rect.center, shot.score);
                     }
+                    items.remove(id);
                 }
-            case EntityType.BULLET(bullet):
+            case DESTROY(BULLET(id)):
-                if (items.exists(bullet.key)) {
+                if (items.exists(id)) {
-                    entryLayer.removeChild(items.get(bullet.key).view);
+                    var item = items[id];
-                    items.remove(bullet.key);
+                    entryLayer.removeChild(item.view);
-                    var point = bullet.rect.center.add(new Point(bullet.rect.width * bullet.rect.direction.x, bullet.rect.height * bullet.rect.direction.y));
+                    var rect = item.rect;
+                    // move boom
+                    var point = rect.center.add(new Point(rect.width * rect.direction.x, rect.height * rect.direction.y));
                     playAnimate(point, AnimateBundle.bulletBoom());
+                    items.remove(id);
                 }
-            case EntityType.BONUS(bonus):
+            case DESTROY(EAGLE(id, shot)):
-                if (items.exists(bonus.key)) {
+                if (items.exists(id)) {
-                    upperLayer.removeChild(items.get(bonus.key).view);
+                    var item = items[id];
-                    items.remove(bonus.key);
+                    playAnimate(item.rect.center, AnimateBundle.tankBoom());
-                    if (bonus.config.score > 0) {
+                    if (shot.score != 0) {
-                        showScore(bonus.rect.center, bonus.config.score);
+                        showScore(item.rect.center, shot.score);
                     }
+                    cast(item, EagleRenderItem).death = true;
                 }
+            case DESTROY(BONUS(id, shot)):
+                if (items.exists(id)) {
+                    var item = items[id];
+                    upperLayer.removeChild(item.view);
+                    if (shot.score != 0) {
+                        showScore(item.rect.center, shot.score);
+                    }
+                    items.remove(id);
+                }
+            case DESTROY(CELL(id, x, y, shot)):
+                var item:BrickRenderItem = cast items.get(id);
+                item.destroyCell(x, y);
+            case DESTROY(BRICK(id, shot)):
+                var item:BrickRenderItem = cast items.get(id);
+                item.destroy();
             case _:
         }
     }
 
-    private function playAnimate(point:Point, animate:OnceAnimate):Void {
+    private function playAnimate(point:Point, animate:OnceAnimate):Promise<Dynamic> {
         animate.x = point.x - animate.width / 2;
         animate.y = point.y - animate.height / 2;
         upperLayer.addChild(animate);
-        animate.play().then(function(animate:Animate):Void {
+        return animate.play().then(function(animate:Animate):Void {
             // ToDo: clean animates on reset
             if (upperLayer.contains(animate)) {
                 upperLayer.removeChild(animate);
@@ -184,14 +240,14 @@ class Render extends SpriteView {
     }
 
     private function showScore(point:Point, score:Int):Void {
-        var view:TextField = new TextField();
+        var view:LabelView = new LabelView();
-        view.embedFonts = true;
+        view.skinId = "text";
-        var font:String = Provider.get(IResources).text.get('font');
-        view.defaultTextFormat = new TextFormat(font, 28, 0xffffff);
         view.text = Std.string(score);
-        view.x = point.x - view.textWidth / 2;
+        view.update();
-        view.y = point.y - view.textHeight / 2;
+        view.redraw();
-        upperLayer.addChild(view);
+        view.x = point.x - view.width / 2;
-        Timer.delay(function() upperLayer.removeChild(view), 1000);
+        view.y = point.y - view.height / 2;
+        upperLayer.addChild(view.content);
+        Timer.delay(function() upperLayer.removeChild(view.content), 1000);
     }
 }

src/client/haxe/ru/m/tankz/render/RenderItem.hx

@@ -1,271 +0,0 @@
-package ru.m.tankz.render;
-
-import flash.display.Bitmap;
-import flash.display.DisplayObject;
-import flash.display.Shape;
-import flash.display.Sprite;
-import openfl.Assets;
-import ru.m.animate.Animate;
-import ru.m.geom.Rectangle;
-import ru.m.tankz.core.Bonus;
-import ru.m.tankz.core.Bullet;
-import ru.m.tankz.core.Eagle;
-import ru.m.tankz.core.Tank;
-import ru.m.tankz.map.Brick;
-import ru.m.tankz.Type.BrickType;
-
-typedef TRectangle = {
-    var rect(default, null):Rectangle;
-}
-
-class RenderItem<T:TRectangle, D:DisplayObject> {
-
-    public var value(default, null):T;
-    public var view(default, null):D;
-
-    public function new(value:T) {
-        this.value = value;
-        this.view = null;
-    }
-
-    public function redraw():Void {}
-
-    public function update():Void {
-        var rect = value.rect;
-        view.rotation = rect.direction.angle;
-        view.x = rect.x - rect.width * (rect.direction.x + 1) / 2 + rect.width * (rect.direction.y + 1) / 2 + 0.5 * rect.width;
-        view.y = rect.y - rect.height * (rect.direction.x + 1) / 2 - rect.height * (rect.direction.y + 1) / 2 + 1.5 * rect.height;
-    }
-
-    public function dispose():Void {}
-}
-
-
-class BitmapItem<T:TRectangle> extends RenderItem<T, Bitmap> {
-
-    public function new(value:T) {
-        super(value);
-        this.view = new Bitmap();
-        redraw();
-    }
-
-    override public function redraw():Void {
-        view.bitmapData = Assets.getBitmapData(getImage());
-    }
-
-    private function getImage():String {
-        return 'ERROR';
-    }
-}
-
-
-class BrickItem extends BitmapItem<Brick> {
-    private var type:BrickType;
-
-    public function new(value:Brick) {
-        super(value);
-        redraw();
-    }
-
-    override public function update():Void {
-        super.update();
-        var t = value.config.type;
-        if (t != type) {
-            type = t;
-            view.visible = t != 'none';
-            redraw();
-        }
-    }
-
-    override private function getImage():String {
-        return 'resources/image/map/${value.config.type}.png';
-    }
-}
-
-
-class BrickAnimateItem extends AnimateItem<Brick> {
-
-    public function new(value:Brick) {
-        super(value);
-        redraw();
-    }
-
-    override public function redraw():Void {
-        view.frames = [for (i in 0...2) ({
-            image: Assets.getBitmapData('resources/image/map/${value.config.type}-${i}.png'),
-            length: 15
-        })];
-        view.playing = true;
-    }
-}
-
-
-class BrickBreakingItem extends RenderItem<Brick, Shape> {
-    private var broken:Int;
-    private var type:BrickType;
-
-    public function new(value:Brick) {
-        super(value);
-        this.view = new Shape();
-        redraw();
-    }
-
-    override public function redraw():Void {
-        var image = Assets.getBitmapData(getImage());
-        var g = view.graphics;
-        g.clear();
-        if (value.destroyed) return;
-        if (value.config.index > 0) {
-            g.beginBitmapFill(image);
-            g.drawRect(0, 0, value.rect.width, value.rect.height);
-            for (c in value.cells) {
-                if (c.destroyed) {
-                    g.beginFill(0x000000);
-                    g.drawRect(c.rect.x - value.rect.x, c.rect.y - value.rect.y, c.rect.width, c.rect.height);
-                }
-            }
-            g.endFill();
-        }
-    }
-
-    override public function update():Void {
-        super.update();
-        var b = value.broken;
-        var t = value.config.type;
-        if (b != broken || t != type) {
-            broken = b;
-            type = t;
-            redraw();
-        }
-    }
-
-    private function getImage():String {
-        return 'resources/image/map/${value.config.type}.png';
-    }
-}
-
-
-class AnimateItem<T:TRectangle> extends RenderItem<T, Animate> {
-
-    public function new(value:T) {
-        super(value);
-        view = new Animate();
-    }
-
-    override public function dispose():Void {
-        view.dispose();
-    }
-}
-
-
-class TankItem extends RenderItem<Tank, Sprite> {
-
-    private var type:String;
-    private var hits:Int;
-    private var protected:Bool;
-    private var frozen:Bool;
-
-    private var tankView:Animate;
-    private var protectView:Animate;
-
-    public function new(value:Tank) {
-        super(value);
-        view = new Sprite();
-        tankView = new Animate();
-        view.addChild(tankView);
-        protectView = AnimateBundle.tankProtect();
-        protectView.visible = false;
-        view.addChild(protectView);
-        redraw();
-    }
-
-    override public function redraw():Void {
-        tankView.frames = AnimateBundle.tankFrames(value);
-        if (value.protect.active) {
-            protectView.x = (tankView.frames[0].image.width - protectView.frames[0].image.width) / 2;
-            protectView.y = (tankView.frames[0].image.height - protectView.frames[0].image.height) / 2;
-            protectView.playing = true;
-            protectView.visible = true;
-        } else {
-            protectView.playing = false;
-            protectView.visible = false;
-        }
-    }
-
-    private function getFrames():Array<String> {
-        var frame0 = 'resources/image/tank/${value.config.skin}-0.png';
-        var frame1 = 'resources/image/tank/${value.config.skin}-1.png';
-        return [frame1, frame0];
-    }
-
-    override public function update():Void {
-        super.update();
-        var t = value.config.type;
-        var h = value.hits;
-        var p = value.protect.active;
-        var f = value.freezing.active;
-        if (t != type || h != hits || p != protected || f != frozen) {
-            this.type = t;
-            this.hits = h;
-            this.protected = p;
-            this.frozen = f;
-            redraw();
-        }
-        tankView.playing = !value.freezing.active && (value.mx !=0 || value.my != 0);
-    }
-
-    override public function dispose():Void {
-        if (tankView != null) {
-            tankView.dispose();
-            tankView = null;
-        }
-    }
-}
-
-
-class BulletItem extends BitmapItem<Bullet> {
-
-    override private function getImage():String {
-        var type:String = 'normal';
-        if (value.config.piercing > 0) type = 'piercing';
-        return 'resources/image/bullet/${type}.png';
-    }
-}
-
-
-class EagleItem extends BitmapItem<Eagle> {
-
-    private var death:Bool;
-    private var protected:Bool;
-
-    override public function update():Void {
-        super.update();
-        var d = value.death;
-        var p = value.protect.active;
-        if (d != death || p != protected) {
-            death = d;
-            protected = p;
-            redraw();
-        }
-    }
-
-    override private function getImage():String {
-        var suffix = value.death ? '-death' : value.protect.active ? '-protected' : '';
-        return 'resources/image/eagle/eagle${suffix}.png';
-    }
-}
-
-
-class BonusItem extends AnimateItem<Bonus> {
-
-    public function new(value:Bonus) {
-        super(value);
-        redraw();
-    }
-
-    override public function redraw():Void {
-        var image =  Assets.getBitmapData('resources/image/bonus/${value.config.type}.png');
-        view.frames = AnimateBundle.bonusFrames(value.config.type);
-        view.playing = true;
-    }
-}

src/client/haxe/ru/m/tankz/render/item/BitmapRenderItem.hx

@@ -0,0 +1,33 @@
+package ru.m.tankz.render.item;
+
+import flash.display.Bitmap;
+import flash.display.BitmapData;
+import flash.display.DisplayObject;
+import flash.display.PixelSnapping;
+import openfl.Assets;
+import ru.m.geom.Rectangle;
+
+class BitmapRenderItem extends RenderItem {
+    public var image(default, set):String;
+
+    private var bitmapData:BitmapData;
+    private var bitmap:Bitmap;
+
+    public function new(rect:Rectangle) {
+        super(rect);
+        this.bitmap = new Bitmap(null, PixelSnapping.AUTO, true);
+    }
+
+    override private function get_view():DisplayObject {
+        return bitmap;
+    }
+
+    private function set_image(value:String):String {
+        if (image != value) {
+            image = value;
+            bitmapData = Assets.getBitmapData(image);
+            bitmap.bitmapData = bitmapData;
+        }
+        return image;
+    }
+}

src/client/haxe/ru/m/tankz/render/item/BonusRenderItem.hx

@@ -0,0 +1,34 @@
+package ru.m.tankz.render.item;
+
+import ru.m.geom.Rectangle;
+import ru.m.tankz.Type;
+
+class BonusRenderItem extends BitmapRenderItem {
+
+    public var type(default, set):BonusType;
+    private var d = -0.05;
+    private var alpha = 1.0;
+
+    public function new(rect:Rectangle, type:BonusType) {
+        super(rect);
+        this.type = type;
+        move(rect.position);
+    }
+
+    private function set_type(value:BonusType):BonusType {
+        if (type != value) {
+            type = value;
+            image = 'resources/image/bonus/${type}.png';
+        }
+        return type;
+    }
+
+    override public function update():Void {
+        super.update();
+        alpha += d;
+        view.alpha = alpha;
+        if (alpha <= 0 || alpha >= 1.5) {
+            d = -d;
+        }
+    }
+}

src/client/haxe/ru/m/tankz/render/item/BrickRenderItem.hx

@@ -0,0 +1,91 @@
+package ru.m.tankz.render.item;
+
+import flash.display.BitmapData;
+import flash.display.Shape;
+import openfl.Assets;
+import openfl.display.DisplayObject;
+import ru.m.geom.Point;
+import ru.m.geom.Rectangle;
+import ru.m.tankz.Type.BrickType;
+
+enum BrickState {
+    UNBROKEN;
+    BROKEN;
+    DESTROYED;
+}
+
+class BrickRenderItem extends RenderItem {
+
+    public var type(default, set):BrickType;
+    public var state(get, never):BrickState;
+
+    private var image:BitmapData;
+    private var shape:Shape;
+    private var cells:Array<Point>;
+
+    public function new(rect:Rectangle, type:BrickType) {
+        super(rect);
+        this.shape = new Shape();
+        cells = [
+            new Point(0, 0),
+            new Point(0, 1),
+            new Point(1, 0),
+            new Point(1, 1),
+        ];
+        this.type = type;
+        move(rect.position);
+    }
+
+    private function get_state():BrickState {
+        return switch cells.length {
+            case 0: DESTROYED;
+            case 4: UNBROKEN;
+            case _: BROKEN;
+        }
+    }
+
+    override private function get_view():DisplayObject {
+        return shape;
+    }
+
+    private function set_type(value:BrickType):BrickType {
+        if (type != value) {
+            type = value;
+            image = Assets.getBitmapData('resources/image/map/${type}.png');
+            redraw();
+        }
+        return type;
+    }
+
+    public function destroyCell(x:Int, y:Int):Void {
+        cells = cells.filter(function(point) return !(point.x == x && point.y == y));
+        redraw();
+    }
+
+    public function destroy():Void {
+        cells = [];
+        redraw();
+    }
+
+    public function redraw():Void {
+        shape.graphics.clear();
+        if (type == "none") return;
+        switch state {
+            case UNBROKEN:
+                shape.graphics.beginBitmapFill(image);
+                shape.graphics.drawRect(0, 0, rect.width, rect.height);
+                shape.graphics.endFill();
+            case BROKEN:
+                shape.graphics.beginBitmapFill(image);
+                for (point in cells) {
+                    var x = point.x * (rect.width / 2);
+                    var y = point.y * (rect.width / 2);
+                    var width = rect.width / 2;
+                    var height = rect.height / 2;
+                    shape.graphics.drawRect(x, y, width, height);
+                }
+                shape.graphics.endFill();
+            case DESTROYED:
+        }
+    }
+}

src/client/haxe/ru/m/tankz/render/item/BulletRenderItem.hx

@@ -0,0 +1,22 @@
+package ru.m.tankz.render.item;
+
+import ru.m.geom.Rectangle;
+
+class BulletRenderItem extends BitmapRenderItem {
+    public var piercing(default, set):Int = -1;
+
+    public function new(rect:Rectangle, piercing:Int) {
+        super(rect);
+        this.piercing = piercing;
+        move(rect.position);
+    }
+
+    private function set_piercing(value:Int):Int {
+        if (piercing != value) {
+            piercing = value;
+            var type = piercing > 0 ? 'piercing' : 'normal';
+            image = 'resources/image/bullet/${type}.png';
+        }
+        return piercing;
+    }
+}

src/client/haxe/ru/m/tankz/render/item/EagleRenderItem.hx

@@ -0,0 +1,58 @@
+package ru.m.tankz.render.item;
+
+import flash.display.DisplayObject;
+import flash.display.Sprite;
+import haxework.color.Color;
+import haxework.view.utils.BitmapUtil;
+import ru.m.animate.Animate;
+import ru.m.geom.Rectangle;
+
+class EagleRenderItem extends BitmapRenderItem {
+    public var color(default, default):Color;
+    public var death(default, set):Bool = true;
+    public var protect(default, set):Bool;
+
+    private var container:Sprite;
+    private var protectView:Animate;
+
+    public function new(rect:Rectangle, color:Color) {
+        super(rect);
+        this.color = color;
+        container = new Sprite();
+        container.addChild(bitmap);
+        protectView = AnimateBundle.tankProtect();
+        protectView.visible = false;
+        container.addChild(protectView);
+        death = false;
+        move(rect.position);
+    }
+
+    override private function get_view():DisplayObject {
+        return container;
+    }
+
+    private function set_protect(value:Bool):Bool {
+        if (protect != value) {
+            protect = value;
+            if (protect) {
+                protectView.x = (bitmapData.width - protectView.frames[0].image.width) / 2;
+                protectView.y = (bitmapData.height - protectView.frames[0].image.height) / 2;
+            }
+            protectView.visible = protect;
+            protectView.playing = protect;
+        }
+        return protect;
+    }
+
+    private function set_death(value:Bool):Bool {
+        if (death != value) {
+            death = value;
+            var suffix = death ? '-death' : '';
+            image = 'resources/image/eagle/eagle${suffix}.png';
+            if (!color.zero) {
+                bitmap.bitmapData = bitmapData = BitmapUtil.colorize(bitmapData, color);
+            }
+        }
+        return death;
+    }
+}

src/client/haxe/ru/m/tankz/render/item/IRenderItem.hx

@@ -0,0 +1,13 @@
+package ru.m.tankz.render.item;
+
+import flash.display.DisplayObject;
+import ru.m.geom.Position;
+import ru.m.geom.Rectangle;
+
+interface IRenderItem {
+    public var view(get, null):DisplayObject;
+    public var rect(default, null):Rectangle;
+    public function move(position:Position):Void;
+    public function update():Void;
+    public function dispose():Void;
+}

src/client/haxe/ru/m/tankz/render/item/RenderItem.hx

@@ -0,0 +1,35 @@
+package ru.m.tankz.render.item;
+
+import flash.display.DisplayObject;
+import ru.m.geom.Position;
+import ru.m.geom.Rectangle;
+
+class RenderItem implements IRenderItem {
+
+    public var view(get, null):DisplayObject;
+
+    public var rect(default, null):Rectangle;
+
+    public function new(rect:Rectangle) {
+        this.rect = rect.clone();
+    }
+
+    private function get_view():DisplayObject {
+        throw "Not Implemented";
+    }
+
+    public function move(position:Position):Void {
+        view.x = rect.x = position.x;
+        view.y = rect.y = position.y;
+        if (position.direction != null) {
+            rect.direction = position.direction;
+            view.rotation = rect.direction.angle;
+            view.x = rect.x - rect.width * (rect.direction.x + 1) / 2 + rect.width * (rect.direction.y + 1) / 2 + 0.5 * rect.width;
+            view.y = rect.y - rect.height * (rect.direction.x + 1) / 2 - rect.height * (rect.direction.y + 1) / 2 + 1.5 * rect.height;
+        }
+    }
+
+    public function update():Void {}
+
+    public function dispose():Void {}
+}

src/client/haxe/ru/m/tankz/render/item/TankRenderItem.hx

@@ -0,0 +1,118 @@
+package ru.m.tankz.render.item;
+
+import flash.display.DisplayObject;
+import flash.display.Sprite;
+import flash.display.BitmapData;
+import haxework.color.Color;
+import haxework.view.utils.BitmapUtil;
+import openfl.Assets;
+import ru.m.animate.Animate;
+import ru.m.geom.Rectangle;
+
+class TankRenderItem extends BitmapRenderItem {
+    public var color(default, default):Color;
+    public var skin(default, set):String;
+    public var hits(default, set):Int;
+    public var bonus(default, set):Bool;
+    public var moves(default, set):Bool;
+    public var protect(default, set):Bool;
+
+    private var container:Sprite;
+    private var images:Array<BitmapData>;
+    private var frame:Int;
+    private var protectView:Animate;
+
+    public function new(rect:Rectangle) {
+        super(rect);
+        container = new Sprite();
+        container.addChild(bitmap);
+        protectView = AnimateBundle.tankProtect();
+        protectView.visible = false;
+        container.addChild(protectView);
+        move(rect.position);
+    }
+
+    override private function get_view():DisplayObject {
+        return container;
+    }
+
+    private function redraw():Void {
+        var image1 = Assets.getBitmapData('resources/image/tank/${skin}-0.png');
+        var image2 = Assets.getBitmapData('resources/image/tank/${skin}-1.png');
+        var color1:Color = switch hits {
+            case 1: 0x869C43;
+            case 2: 0xDEAF80;
+            case 3: 0x5EA67A;
+            case _: color;
+        }
+        var color2:Color = color1;
+        if (bonus) {
+            color1 = 0xff00aa;
+        }
+        if (!color1.zero) {
+            image1 = BitmapUtil.colorize(image1, color1);
+        }
+        if (!color1.zero) {
+            image2 = BitmapUtil.colorize(image2, color2);
+        }
+        images = [for (i in 0...6) image1].concat([for (i in 0...6) image2]);
+        frame = 0;
+        bitmap.bitmapData = images[frame];
+    }
+
+    private function set_skin(value:String):String {
+        if (skin != value) {
+            skin = value;
+            redraw();
+        }
+        return skin;
+    }
+
+    private function set_hits(value:Int):Int {
+        if (hits != value) {
+            hits = value;
+            redraw();
+        }
+        return hits;
+    }
+
+    private function set_bonus(value:Bool):Bool {
+        if (bonus != value) {
+            bonus = value;
+            redraw();
+        }
+        return bonus;
+    }
+
+    private function set_protect(value:Bool):Bool {
+        if (protect != value) {
+            protect = value;
+            if (protect) {
+                protectView.x = (images[0].width - protectView.frames[0].image.width) / 2;
+                protectView.y = (images[0].height - protectView.frames[0].image.height) / 2;
+            }
+            protectView.visible = protect;
+            protectView.playing = protect;
+        }
+        return protect;
+    }
+
+    private function set_moves(value:Bool):Bool {
+        if (moves != value) {
+            moves = value;
+            bitmap.bitmapData = images[0];
+        }
+        return moves;
+    }
+
+    override public function update():Void {
+        super.update();
+        if (moves) {
+            frame++;
+            if (frame > images.length - 1) {
+                frame = 0;
+            }
+            bitmap.bitmapData = images[frame];
+        }
+    }
+}

src/client/haxe/ru/m/tankz/sound/SoundManager.hx

@@ -1,69 +1,127 @@
 package ru.m.tankz.sound;
 
-import openfl.media.Sound;
+import flash.events.Event;
+import flash.media.Sound;
+import flash.media.SoundChannel;
+import flash.media.SoundTransform;
 import openfl.utils.Assets;
-import ru.m.tankz.core.EntityType;
+import ru.m.tankz.config.Config;
-import ru.m.tankz.engine.Engine;
+import ru.m.tankz.game.GameEvent;
-import ru.m.tankz.Type;
+import ru.m.tankz.game.IGame;
 
-
+class SoundManager implements GameListener {
-class SoundManager {
+    private static var TAG(default, never):String = "SoundManager";
-    private static var TAG(default, never):String = 'SoundManager';
 
     #if flash
-    private static var type:String = 'mp3';
+    private static var type:String = "mp3";
     #else
-    private static var type:String = 'ogg';
+    private static var type:String = "ogg";
     #end
 
-    public function new() {}
+    public var config(default, default):Config;
+    public var volume(default, set):Float = 1;
+    public var mute(default, set):Bool = false;
+
+    private var channels:Array<SoundChannel>;
+    private var transform:SoundTransform;
+
+    private var humanTanks:Array<Int>;
+    private var humanBullets:Array<Int>;
+    private var liveBonuses:Array<Int>;
+
+    public function new() {
+        channels = [];
+        updateSoundTransform();
+    }
+
+    private function updateSoundTransform():Void {
+        transform = new SoundTransform(mute ? 0 : volume);
+        for (channel in channels) {
+            channel.soundTransform = transform;
+        }
+    }
+
+    private function set_volume(value:Float):Float {
+        if (volume != value) {
+            volume = value;
+            updateSoundTransform();
+        }
+        return volume;
+    }
+
+    private function set_mute(value:Bool):Bool {
+        if (mute != value) {
+            mute = value;
+            updateSoundTransform();
+        }
+        return mute;
+    }
 
     public function play(id:String):Void {
         //L.d(TAG, 'play: ${id}');
         var sound:Sound = Assets.getSound('resources/sounds/${id}.${type}');
         if (sound != null) {
-            sound.play();
+            var channel = sound.play(0, 0, transform);
+            channel.addEventListener(Event.SOUND_COMPLETE, onSoundComplete);
+            channels.push(channel);
         } else {
             L.w(TAG, 'Sound "${id}" not found');
         }
     }
 
-    public function onSpawn(entity:EntityType):Void {
+    public function stopAll():Void {
-        switch entity {
+        for (channel in channels) {
-            case EntityType.BULLET(_.tank.playerId.team => 'human'):
+            channel.stop();
-                play('shot');
-            case EntityType.BONUS(_):
-                play('bonus_add');
-            case _:
         }
+        channels = [];
     }
 
-    public function onChange(entity:EntityType, change:EntityChange):Void {
+    private function onSoundComplete(event:Event):Void {
-        switch [entity, change] {
+        channels.remove(event.currentTarget);
-            case [EntityType.TANK(_), EntityChange.HIT]:
-                play('bullet_hit');
-            //case [EntityType.TANK(_), EntityChange.LIVE_UP]:
-            //    play('live');
-            case [EntityType.EAGLE(_), EntityChange.DEATH(_)]:
-                play('boom_player');
-            case _:
-        }
     }
 
-    public function onCollision(entity:EntityType, with:EntityType):Void {
+    public function onGameEvent(event:GameEvent):Void {
-        switch [entity, with] {
+        switch event {
-            case [EntityType.BULLET(_), EntityType.CELL(cell)]:
+            case START(_):
-                //play('bullet_wall');
+                play("start");
-            case _:
+                humanTanks = [];
-        }
+                liveBonuses = [];
-    }
+                humanBullets = [];
-
+            case SPAWN(BULLET(id, _, playerId, _)):
-    public function onDestroy(entity:EntityType, ?playerId:PlayerId):Void {
+                if (config.isHuman(playerId)) {
-        switch entity {
+                    play("shot");
-            case EntityType.TANK(_):
+                    humanBullets.push(id);
-                play('boom_bot');
+                }
-            case EntityType.BONUS(_):
+            case SPAWN(TANK(id, _, playerId, _)):
-                play('bonus_get');
+                if (config.isHuman(playerId)) {
+                    humanTanks.push(id);
+                }
+            case SPAWN(BONUS(id, _, type)):
+                play("bonus_add");
+                if (type == "live") {
+                    liveBonuses.push(id);
+                }
+            case HIT(TANK(_, _)):
+                play("bullet_hit");
+            case HIT(CELL(_, _, shot)):
+                if (humanBullets.indexOf(shot.bulletId) > -1) {
+                    //play("bullet_block");
+                }
+            case DESTROY(TANK(id, _)):
+                if (humanTanks.indexOf(id) > -1) {
+                    play("boom_player");
+                } else {
+                    play("boom_bot");
+                }
+            case DESTROY(EAGLE(_, _)):
+                play("boom_player");
+            case DESTROY(BONUS(id, _)):
+                play("bonus_get");
+                if (liveBonuses.indexOf(id) > -1) {
+                    play("live");
+                } else {
+                    play("bonus_get");
+                }
             case _:
         }
     }

src/client/haxe/ru/m/tankz/storage/GameStorage.hx

@@ -0,0 +1,22 @@
+package ru.m.tankz.storage;
+
+import haxework.storage.SharedObjectStorage;
+import ru.m.tankz.game.GameProgress;
+import ru.m.tankz.Type.GameType;
+
+class GameStorage extends SharedObjectStorage  {
+
+    private static inline var VERSION = 1;
+
+    public function new() {
+        super('game_${VERSION}');
+    }
+
+    public function get(type:GameType):GameProgress {
+        return exists(type) ? read(type) : new GameProgress(type);
+    }
+
+    public function set(progress:GameProgress):Void {
+        write(progress.type, progress);
+    }
+}

src/client/haxe/ru/m/tankz/storage/MultiplayerStorage.hx

@@ -0,0 +1,21 @@
+package ru.m.tankz.storage;
+
+import haxework.storage.SharedObjectStorage;
+
+class MultiplayerStorage extends SharedObjectStorage {
+
+    public var user(get, set):User;
+
+    public function new() {
+        super("multiplayer");
+    }
+
+    private inline function get_user():User {
+        return read("user");
+    }
+
+    private inline function set_user(value:User):User {
+        write("user", value);
+        return value;
+    }
+}

src/client/haxe/ru/m/tankz/storage/RecordStorage.hx

@@ -0,0 +1,39 @@
+package ru.m.tankz.storage;
+
+import haxe.DynamicAccess;
+import haxework.storage.SharedObjectStorage;
+import ru.m.tankz.game.record.GameRecord;
+
+@:yield class RecordStorage extends SharedObjectStorage  {
+
+    private static inline var VERSION = 1;
+
+    public function new() {
+        super('record_${VERSION}');
+    }
+
+    public function save(record:GameRecord):Void {
+        L.d("RecordStorage", 'save $record');
+        write('${record.info.id}.info', record.info);
+        write(record.info.id, record);
+    }
+
+    override public function delete(id:String):Void {
+        super.delete(id);
+        super.delete('${id}.info');
+    }
+
+    public function iterator():Iterator<GameRecordInfo> {
+        var data:DynamicAccess<String> = so.data;
+        for (id in data.keys()) {
+            try {
+                if (StringTools.endsWith(id, '.info')) {
+                    @yield return read(id);
+                }
+            } catch (error:Dynamic) {
+                L.w("RecordStorage", 'read ', error);
+                delete(id);
+            }
+        }
+    }
+}

src/client/haxe/ru/m/tankz/storage/SettingsStorage.hx

@@ -1,46 +1,31 @@
 package ru.m.tankz.storage;
 
-import flash.net.SharedObject;
 import flash.ui.Keyboard;
+import haxework.storage.SharedObjectStorage;
+import haxework.utils.ObjectUtil;
 import ru.m.geom.Direction;
 import ru.m.tankz.control.ActionConfig;
 import ru.m.tankz.control.Control.TankAction;
 
-
+class SettingsStorage extends SharedObjectStorage {
-class SettingsStorage {
-
-    private static var TAG(default, never):String = 'SettingsStorage';
-
-    private var so:SharedObject;
 
     public function new() {
-        so = SharedObject.getLocal('settings');
+        super("settings");
     }
 
-    public function read(index: Int):Null<ActionConfig> {
+    public function getActionConfig(index:Int):ActionConfig {
-        var data:String = Reflect.getProperty(so.data, Std.string(index));
+        return exists('action:$index') ? read('action:$index') : getDefaultActionConfig(index);
-        L.d(TAG, 'read: ${data}');
-        if (data != null) {
-            try {
-                return ActionConfig.loads(data);
-            } catch (error:Dynamic) {
-                L.w(TAG, "read", error);
-            }
-        }
-        return getDefault(index);
     }
 
-    public function write(index: Int, data: ActionConfig):Void {
+    public function setActionConffig(index:Int, value:ActionConfig) {
-        L.d(TAG, 'write: ${data}');
+        write('action:$index', value);
-        so.setProperty(Std.string(index), data.dumps());
-        so.flush();
     }
 
-    public static function getDefault(index: Int): ActionConfig {
+    public static function getDefaultActionConfig(index:Int):ActionConfig {
-        return (defaults.exists(index) ? defaults.get(index) : empty).clone();
+        return ObjectUtil.clone(defaults.exists(index) ? defaults.get(index) : empty);
     }
 
-    private static var defaults: Map<Int, ActionConfig> = [
+    private static var defaults:Map<Int, ActionConfig> = [
         0 => new ActionConfig([
             {action:TankAction.MOVE(Direction.TOP), key:Keyboard.W},
             {action:TankAction.MOVE(Direction.LEFT), key:Keyboard.A},
@@ -57,7 +42,7 @@ class SettingsStorage {
         ]),
     ];
 
-    private static var empty: ActionConfig = new ActionConfig([
+    private static var empty:ActionConfig = new ActionConfig([
         {action:TankAction.MOVE(Direction.TOP), key:-1},
         {action:TankAction.MOVE(Direction.LEFT), key:-1},
         {action:TankAction.MOVE(Direction.BOTTOM), key:-1},

src/client/haxe/ru/m/tankz/storage/UserStorage.hx

@@ -1,27 +0,0 @@
-package ru.m.tankz.storage;
-
-import flash.net.SharedObject;
-
-
-class UserStorage {
-
-    private static var TAG(default, never):String = 'UserStorage';
-
-    private var so:SharedObject;
-
-    public function new() {
-        so = SharedObject.getLocal('user');
-    }
-
-    public function read():Null<User> {
-        var user:User = Reflect.getProperty(so.data, 'user');
-        L.d(TAG, 'read: ${user}');
-        return user;
-    }
-
-    public function write(user:User):Void {
-        L.d(TAG, 'write: ${user}');
-        so.setProperty('user', user);
-        so.flush();
-    }
-}

src/client/haxe/ru/m/tankz/view/ClientView.hx

@@ -0,0 +1,40 @@
+package ru.m.tankz.view;
+
+import flash.events.KeyboardEvent;
+import flash.ui.Keyboard;
+import haxework.resources.IResources;
+import haxework.view.frame.FrameSwitcher;
+import haxework.view.IView;
+import ru.m.tankz.sound.SoundManager;
+
+@:template class ClientView extends FrameSwitcher {
+
+    @:provide var resources:IResources;
+    @:provide var switcher:FrameSwitcher;
+    @:provide var soundManager:SoundManager;
+
+    public function init():Void {
+        resources.text.put('version', '${Const.VERSION}');
+        switcher = this;
+        onSwitch.connect(onFrameSwitch);
+    }
+
+    public function launch():Void {
+        content.stage.stageFocusRect = false;
+        content.stage.addEventListener(KeyboardEvent.KEY_UP, function(event:KeyboardEvent):Void {
+            switch event.keyCode {
+                case Keyboard.ESCAPE:
+                    change(StartFrame.ID);
+                case Keyboard.M:
+                    soundManager.mute = !soundManager.mute;
+            }
+        });
+        change(StartFrame.ID);
+    }
+
+    private function onFrameSwitch(frame:IView<Dynamic>):Void {
+        if (frame.id == StartFrame.ID) {
+            soundManager.stopAll();
+        }
+    }
+}

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

@@ -0,0 +1,21 @@
+---
+$type: haxework.view.frame.FrameSwitcher
+geometry.size.stretch: true
+skinId: dark
+views:
+  - id: start
+    $type: ru.m.tankz.view.StartFrame
+  - id: level
+    $type: ru.m.tankz.view.LevelFrame
+  - id: game
+    $type: ru.m.tankz.view.GameFrame
+  - id: result
+    $type: ru.m.tankz.view.ResultFrame
+  - id: settings
+    $type: ru.m.tankz.view.SettingsFrame
+  - id: record
+    $type: ru.m.tankz.view.RecordFrame
+  - id: game_list
+    $type: ru.m.tankz.view.network.GameListFrame
+  - id: game_room
+    $type: ru.m.tankz.view.network.GameRoomFrame

src/client/haxe/ru/m/tankz/view/GameFrame.hx

@@ -0,0 +1,118 @@
+package ru.m.tankz.view;
+
+import haxe.ds.Option;
+import haxework.view.frame.FrameSwitcher;
+import haxework.view.VGroupView;
+import ru.m.tankz.game.Game;
+import ru.m.tankz.game.GameEvent;
+import ru.m.tankz.game.GameRunner;
+import ru.m.tankz.game.GameState;
+import ru.m.tankz.game.IGame;
+import ru.m.tankz.game.record.GamePlayer;
+import ru.m.tankz.game.record.GameRecord;
+import ru.m.tankz.game.record.GameRecorder;
+import ru.m.tankz.network.NetworkManager;
+import ru.m.tankz.sound.SoundManager;
+import ru.m.tankz.storage.GameStorage;
+import ru.m.tankz.storage.RecordStorage;
+import ru.m.tankz.view.game.GameView;
+
+@:template class GameFrame extends VGroupView implements GameListener {
+    public static inline var ID = "game";
+
+    private static inline var TAG = "GameFrame";
+
+    @:view("game") private var gameView(default, null):GameView;
+
+    @:provide var network:NetworkManager;
+    @:provide var soundManager:SoundManager;
+    @:provide var state:GameState;
+    @:provide var record:GameRecord;
+    @:provide("result") var result:GameState;
+    @:provide var switcher:FrameSwitcher;
+    @:provide var gameStorage:GameStorage;
+    @:provide var recordStorage:RecordStorage;
+
+    private var game:IGame;
+    private var runner:GameRunner;
+    private var recorder:GameRecorder;
+    private var player:GamePlayer;
+
+    public function onShow():Void {
+        if (record != null) {
+            play(record);
+            record = null;
+        } else {
+            start(state);
+        }
+    }
+
+    private function buildGame(state:GameState):Void {
+        gameView.type = state.type;
+        game = new Game(state);
+        soundManager.config = game.config;
+        gameView.render.config = game.config;
+        game.connect(gameView.render);
+        game.connect(soundManager);
+        if (gameView.panel != null) {
+            game.connect(gameView.panel);
+        }
+    }
+
+    private function start(state:GameState):Void {
+        buildGame(state);
+        game.connect(this);
+        recorder = new GameRecorder();
+        game.connect(recorder);
+        runner = new GameRunner(game);
+        runner.start(state);
+    }
+
+    private function play(record:GameRecord):Void {
+        buildGame(record.state);
+        player = new GamePlayer(game, record);
+        player.start();
+    }
+
+    private function stop():Void {
+        if (runner != null) {
+            runner.dispose();
+            runner = null;
+        }
+        if (game != null) {
+            game.dispose();
+            game = null;
+        }
+        gameView.render.reset();
+    }
+
+    public function onGameEvent(event:GameEvent):Void {
+        switch event {
+            case GameEvent.COMPLETE(state, _):
+                // ToDo:
+                recordStorage.save(recorder.record);
+                result = state;
+                this.state = switch runner.next() {
+                    case Some(s):
+                        // ToDo:
+                        var progress = gameStorage.get(game.type);
+                        progress.completeLevel(result.levelId, result.presetId);
+                        gameStorage.set(progress);
+                        s;
+                    case None:
+                        new GameState(state.type, state.presetId, 0);
+                }
+                stop();
+                switcher.change(ResultFrame.ID);
+            case _:
+        }
+    }
+
+    public function onHide():Void {
+        stop();
+    }
+
+    public function close():Void {
+        switcher.change(LevelFrame.ID);
+    }
+}

src/client/haxe/ru/m/tankz/view/GameFrame.yaml

@@ -0,0 +1,14 @@
+---
+views:
+  - $type: haxework.view.VGroupView
+    skinId: container
+    views:
+      - id: game
+        $type: ru.m.tankz.view.game.GameView
+#  - $type: haxework.view.HGroupView
+#    skinId: panel
+#    views:
+#      - id: close
+#        $type: haxework.view.ButtonView
+#        skinId: button.close
+#        +onPress: $code:close()

src/client/haxe/ru/m/tankz/view/LevelFrame.hx

@@ -0,0 +1,64 @@
+package ru.m.tankz.view;
+
+import haxework.view.ButtonView;
+import haxework.view.DataView;
+import haxework.view.frame.FrameSwitcher;
+import haxework.view.LabelView;
+import haxework.view.VGroupView;
+import ru.m.tankz.bundle.ILevelBundle;
+import ru.m.tankz.config.Config;
+import ru.m.tankz.game.GameState;
+import ru.m.tankz.storage.GameStorage;
+import ru.m.tankz.Type;
+import ru.m.tankz.view.popup.LevelPopup;
+
+@:template class LevelFrame extends VGroupView {
+    public static inline var ID = "level";
+
+    @:view var header:LabelView;
+    @:view var levels:DataView<LevelId, ButtonView>;
+
+    @:provide var state:GameState;
+    @:provide var switcher:FrameSwitcher;
+    @:provide var levelBundle:ILevelBundle;
+    @:provide var storage:GameStorage;
+
+    private var levelPopup:LevelPopup;
+
+    public function onShow():Void {
+        header.text = state.type;
+        levels.data = [for (i in 0...state.config.game.levels) i];
+    }
+
+    private function start(level:LevelConfig, preset:GamePreset):Void {
+        state.levelId = level.id;
+        state.presetId = preset.id;
+        switcher.change(GameFrame.ID);
+    }
+
+    private function levelViewFactory(index:Int, levelId:LevelId):ButtonView {
+        var progress = storage.get(state.type);
+        var result = new ButtonView();
+        result.skinId = "button.level";
+        var presetsLine = [for (p in state.config.presets) progress.isPresetCompleted(levelId, p.id) ? '*' : '_'].join('');
+        result.text = '${levelId}\n${presetsLine}';
+        result.disabled = !progress.isLevelAvailable(levelId);
+        return result;
+    }
+
+    private function onLevelSelect(index:Int, levelId:LevelId, view:ButtonView):Void {
+        if (!storage.get(state.type).isLevelAvailable(levelId)) {
+            return;
+        }
+        if (levelPopup == null) {
+            levelPopup = new LevelPopup();
+        }
+        var level = levelBundle.get(state.type, state.config, levelId);
+        levelPopup.setData(
+            level,
+            state.config.presets,
+            storage.get(state.type)
+        );
+        levelPopup.show().then(function(preset) preset != null ? start(level, preset) : {});
+    }
+}

src/client/haxe/ru/m/tankz/view/LevelFrame.yaml

@@ -0,0 +1,24 @@
+---
+views:
+  - $type: haxework.view.VGroupView
+    skinId: container
+    views:
+      - id: header
+        $type: haxework.view.LabelView
+        skinId: text.header
+      - id: levels
+        $type: haxework.view.DataView
+        geometry.size.width: 100%
+        layout:
+          $type: haxework.view.layout.TailLayout
+          rowSize: 10
+          margin: 5
+        factory: $this:levelViewFactory
+        +onItemSelect: $this:onLevelSelect
+        geometry.padding: 10
+  - $type: haxework.view.HGroupView
+    skinId: panel
+    views:
+      - $type: haxework.view.ButtonView
+        skinId: button.close
+        +onPress: $code:switcher.change('start')

src/client/haxe/ru/m/tankz/view/RecordFrame.hx

@@ -0,0 +1,32 @@
+package ru.m.tankz.view;
+
+import haxework.view.frame.FrameSwitcher;
+import haxework.view.list.ListView;
+import haxework.view.list.VListView;
+import haxework.view.VGroupView;
+import ru.m.tankz.game.record.GameRecord;
+import ru.m.tankz.storage.RecordStorage;
+
+@:template class RecordFrame extends VGroupView {
+    public static var ID(default, never):String = "record";
+
+    @:view var data:VListView<GameRecordInfo>;
+
+    @:provide var recordStorage:RecordStorage;
+    @:provide var switcher:FrameSwitcher;
+    @:provide var record:GameRecord;
+
+    public function onShow():Void {
+        var data = Lambda.array(recordStorage);
+        data.sort(function(a:GameRecordInfo, b:GameRecordInfo) return Std.int(b.date.getTime() - a.date.getTime()));
+        this.data.data = data;
+    }
+
+    private function onRecordSelect(item:IListItemView<GameRecordInfo>):Void {
+
+    }
+
+    private function close() {
+        switcher.change(StartFrame.ID);
+    }
+}

src/client/haxe/ru/m/tankz/view/RecordFrame.yaml

@@ -0,0 +1,24 @@
+---
+views:
+  - $type: haxework.view.VGroupView
+    skinId: container
+    geometry.padding: 20
+    views:
+      - $type: haxework.view.LabelView
+        skinId: text.header
+        text: Records
+      - id: data
+        $type: haxework.view.list.VListView
+        factory: $code:function() return new ru.m.tankz.view.common.RecordView()
+        +onItemSelect: $this:onRecordSelect
+        geometry.margin.top: 20
+        geometry.size.stretch: true
+        scroll:
+            $type: haxework.view.list.VScrollBarView
+            skinId: scroll
+  - $type: haxework.view.HGroupView
+    skinId: panel
+    views:
+      - $type: haxework.view.ButtonView
+        skinId: button.close
+        +onPress: $code:close()

src/client/haxe/ru/m/tankz/view/ResultFrame.hx

@@ -0,0 +1,47 @@
+package ru.m.tankz.view;
+
+import haxework.view.ButtonView;
+import haxework.view.DataView;
+import haxework.view.frame.FrameSwitcher;
+import haxework.view.LabelView;
+import haxework.view.VGroupView;
+import ru.m.tankz.game.GameState;
+import ru.m.tankz.view.common.LifeView;
+
+@:template class ResultFrame extends VGroupView {
+    public static var ID(default, never):String = "result";
+
+    @:view("result") var resultView:DataView<PlayerState, LifeView>;
+    @:view("next") var nextButton:ButtonView;
+    @:view("level") var levelLabel:LabelView;
+
+    @:provide var frames:FrameSwitcher;
+    @:provide var state:GameState;
+    @:provide("result") var resultState:GameState;
+
+    private function playerViewFactory(index:Int, player:PlayerState) {
+        var view = new LifeView();
+        var playerConfig = resultState.config.getPlayer(player.id);
+        var tankType = playerConfig.tanks[0].type;
+        var tankConfig = resultState.config.getTank(tankType);
+        view.tank = tankConfig == null ? 'ba' : tankConfig.skin;
+        view.color = resultState.getPlayerColor(player.id);
+        view.life = player.frags;
+        view.score = player.score;
+        return view;
+    }
+
+    public function onShow() {
+        resultView.data =  Lambda.array(resultState.players);
+        levelLabel.text = 'Level ${resultState.levelId}';
+        nextButton.visible = state != null;
+    }
+
+    private function next() {
+        frames.change(GameFrame.ID);
+    }
+
+    private function close() {
+        frames.change(LevelFrame.ID);
+    }
+}

src/client/haxe/ru/m/tankz/view/ResultFrame.yaml

@@ -0,0 +1,29 @@
+---
+views:
+  - $type: haxework.view.VGroupView
+    skinId: container
+    views:
+      - id: level
+        $type: haxework.view.LabelView
+        skinId: text.header
+      - id: result
+        $type: haxework.view.DataView
+        factory: $this:playerViewFactory
+        geometry.margin.top: 20
+        layout:
+          $type: haxework.view.layout.VerticalLayout
+          hAlign: right
+          margin: 10
+  - $type: haxework.view.HGroupView
+    skinId: panel
+    views:
+      - id: close
+        $type: haxework.view.ButtonView
+        skinId: button.close
+        +onPress: $code:close()
+      - $type: haxework.view.SpriteView
+        geometry.size.width: 100%
+      - id: next
+        $type: haxework.view.ButtonView
+        skinId: button.next
+        +onPress: $code:next()

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

@@ -0,0 +1,11 @@
+package ru.m.tankz.view;
+
+import haxework.view.frame.FrameSwitcher;
+import haxework.view.VGroupView;
+
+@:template class SettingsFrame extends VGroupView {
+
+    public static var ID(default, never):String = "settings";
+
+    @:provide var switcher:FrameSwitcher;
+}

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

@@ -0,0 +1,21 @@
+---
+views:
+  - $type: haxework.view.VGroupView
+    skinId: container
+    views:
+      - $type: haxework.view.LabelView
+        skinId: text.header
+        text: Settings
+      - $type: haxework.view.HGroupView
+        layout.margin: 20
+        views:
+          - $type: ru.m.tankz.view.settings.SettingsEditor
+            controlIndex: 0
+          - $type: ru.m.tankz.view.settings.SettingsEditor
+            controlIndex: 1
+  - $type: haxework.view.HGroupView
+    skinId: panel
+    views:
+      - $type: haxework.view.ButtonView
+        skinId: button.close
+        +onPress: $code:switcher.change('start')

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

@@ -0,0 +1,76 @@
+package ru.m.tankz.view;
+
+import haxework.view.ButtonView;
+import haxework.view.LabelView;
+import haxework.view.frame.FrameSwitcher;
+import haxework.view.VGroupView;
+import ru.m.tankz.game.GameState;
+import ru.m.tankz.network.NetworkManager;
+import ru.m.tankz.Type.GameType;
+import ru.m.tankz.view.popup.FontPopup;
+import ru.m.tankz.view.popup.LoginPopup;
+
+@:template class StartFrame extends VGroupView {
+
+    public static var ID(default, never):String = "start";
+
+    @:view var username:LabelView;
+    @:view("login") var loginButton:ButtonView;
+    @:view("logout") var logoutButton:ButtonView;
+    @:view("network") var networkButton:ButtonView;
+
+    @:provide var state:GameState;
+    @:provide var switcher:FrameSwitcher;
+    @:provide var network:NetworkManager;
+
+    private var fontPopup:FontPopup;
+
+    public function onShow():Void {
+        onConnectionState(network.state);
+        network.stateSignal.connect(onConnectionState);
+    }
+
+    public function onHide():Void {
+        network.stateSignal.disconnect(onConnectionState);
+    }
+
+    private function onConnectionState(state:ConnectionState):Void {
+        trace("state", state);
+        setUser(switch state {
+            case ONLINE(user): user;
+            case _: null;
+        });
+    }
+
+    private function setUser(value:User):Void {
+        username.text = value == null ? "" : value.name;
+        loginButton.visible = value == null;
+        logoutButton.visible = value != null;
+        networkButton.disabled = value == null;
+    }
+
+    private function startGame(type:GameType):Void {
+        state = new GameState(type);
+        switcher.change(LevelFrame.ID);
+    }
+
+    private function login():Void {
+        LoginPopup.instance.show().then(function(user:User):Void {
+            L.d("Login", 'user: $user');
+        });
+    }
+
+    private function logout():Void {
+        network.logout();
+    }
+
+    private function choiceFont():Void {
+        if (fontPopup == null) {
+            fontPopup = new FontPopup();
+        }
+        fontPopup
+        .show()
+        .then(function(font) Style.register(font))
+        .catchError(function(e) {});
+    }
+}

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

@@ -0,0 +1,63 @@
+---
+views:
+    - $type: haxework.view.VGroupView
+      skinId: container
+      layout.margin: 10
+      views:
+          - $type: haxework.view.LabelView
+            text: Tank'z
+            skinId: font
+            fontSize: 100
+            geometry.margin.bottom: 30
+          - $type: haxework.view.ButtonView
+            skinId: button
+            +onPress: $code:startGame('classic')
+            text: Classic
+          - $type: haxework.view.ButtonView
+            skinId: button
+            +onPress: $code:startGame('dota')
+            text: DotA
+          - $type: haxework.view.ButtonView
+            skinId: button
+            +onPress: $code:startGame('death')
+            text: DeathMatch
+          - $type: haxework.view.ButtonView
+            skinId: button
+            +onPress: $code:switcher.change('record')
+            text: Records
+          - id: network
+            $type: haxework.view.ButtonView
+            skinId: button
+            +onPress: $code:switcher.change('game_list')
+            text: Network
+            disabled: true
+    - $type: haxework.view.HGroupView
+      skinId: panel
+      views:
+          - id: settings
+            $type: haxework.view.ButtonView
+            skinId: button.settings
+            +onPress: $code:switcher.change('settings')
+          - $type: haxework.view.SpriteView
+            geometry.size.width: 100%
+          - id: username
+            $type: haxework.view.LabelView
+            skinId: text
+            geometry.margin.right: 10
+          - id: login
+            $type: haxework.view.ButtonView
+            skinId: button.login
+            +onPress: $code:login()
+          - id: logout
+            $type: haxework.view.ButtonView
+            skinId: button.logout
+            +onPress: $code:logout()
+            visible: false
+    - $type: haxework.view.LabelView
+      geometry.hAlign: right
+      geometry.vAlign: top
+      geometry.padding: [20, 5]
+      geometry.position: absolute
+      geometry.margin: [0, 20, 20, 0]
+      skinId: text.box
+      text: $r:text:version

src/client/haxe/ru/m/tankz/view/common/LifeView.hx

@@ -0,0 +1,67 @@
+package ru.m.tankz.view.common;
+
+import haxework.view.HGroupView;
+import haxework.view.ImageView;
+import haxework.view.LabelView;
+import openfl.Assets;
+import ru.m.tankz.game.GameState;
+
+@:template class LifeView extends HGroupView {
+    @:provide static var currentState:GameState;
+
+    @:view("tank") public var tankImage:ImageView;
+    @:view("life") public var lifeLabel:LabelView;
+    @:view("score") public var scoreLabel:LabelView;
+
+    public var state(null, set):PlayerState;
+    public var tank(null, set):String;
+    public var color(null, set):Int;
+    public var life(null, set):Int;
+    public var score(null, set):Int;
+
+    private inline function set_state(value:PlayerState):PlayerState {
+        state = value;
+        toUpdate();
+        return state;
+    }
+
+    private inline function set_tank(value:String):String {
+        if (value != null && value != tank) {
+            tank = value;
+            tankImage.image = Assets.getBitmapData('resources/image/tank/${tank}-0.png');
+        }
+        return tank;
+    }
+
+    private inline function set_color(value:Int):Int {
+        tankImage.color = value;
+        return value;
+    }
+
+    private inline function set_life(value:Int):Int {
+        lifeLabel.text = '${value}';
+        return value;
+    }
+
+    private inline function set_score(value:Int):Int {
+        scoreLabel.text = '${value}$';
+        return value;
+    }
+
+    override public function update():Void {
+        super.update();
+        if (state != null && currentState != null) {
+            var tankConfig = currentState.config.getTank(state.tank);
+            tank = tankConfig == null ? 'ba' : tankConfig.skin;
+            color = currentState.config.getColor(state.id);
+            life = state.life;
+            score = state.score;
+        }
+    }
+
+    public static inline function factory(index:Int, data:PlayerState):LifeView {
+        var result = new LifeView();
+        result.state = data;
+        return result;
+    }
+}

src/client/haxe/ru/m/tankz/view/common/LifeView.yaml

@@ -2,12 +2,12 @@
 layout.margin: 5
 views:
   - id: tank
-    $type: haxework.gui.ImageView
+    $type: haxework.view.ImageView
-  - id: live
+  - id: life
-    $type: haxework.gui.LabelView
+    $type: haxework.view.LabelView
     skinId: text.box
     geometry.size.fixed: [50, 38]
   - id: score
-    $type: haxework.gui.LabelView
+    $type: haxework.view.LabelView
     skinId: text.box
     geometry.size.fixed: [100, 38]

src/client/haxe/ru/m/tankz/view/common/PlayerView.hx

@@ -1,11 +1,13 @@
-package ru.m.tankz.frame.common;
+package ru.m.tankz.view.common;
 
+import haxework.resources.IResources;
+import haxework.color.ColorUtil;
+import haxework.view.DataView;
+import haxework.view.HGroupView;
+import haxework.view.LabelView;
+import haxework.view.skin.ISkin;
+import haxework.view.ToggleButtonView;
 import ru.m.tankz.control.Control;
-import haxework.gui.DataView;
-import haxework.gui.HGroupView;
-import haxework.gui.LabelView;
-import haxework.gui.skin.ISkin;
-import haxework.gui.ToggleButtonView;
 import ru.m.tankz.game.GameState;
 import ru.m.tankz.Type.TeamId;
 
@@ -23,6 +25,8 @@ class TeamButton extends ToggleButtonView {
 
 class TeamSkin implements ISkin<TeamButton> {
 
+    @:provide private static var resources:IResources;
+
     public var color(default, default):Int;
 
     public function new(color:Int) {
@@ -30,21 +34,22 @@ class TeamSkin implements ISkin<TeamButton> {
     }
 
     public function draw(view:TeamButton):Void {
-        view.fontColor = view.on ? 0x000000 : 0xcccccc;
+        view.fontColor = view.on ? 0xffffff : resources.color.get("dark");
         var graphics = view.content.graphics;
-        graphics.beginFill(view.on ? color : 0x333333);
+        graphics.beginFill(view.on ? color : resources.color.get("light"));
-        graphics.lineStyle(1, view.on ? 0x333333 : color);
+        graphics.lineStyle(2, color, 0.5);
-        graphics.drawRect(0, 0, view.width, view.height);
+        graphics.drawRoundRect(0, 0, view.width, view.height, 5, 5);
         graphics.endFill();
         graphics.lineStyle();
     }
 }
 
 @:template class PlayerView extends HGroupView {
-    private static inline var NONE:TeamId = "none";
+    private static inline var TEAM_NONE:TeamId = "none";
 
     public var item_index(default, set):Int;
     public var data(default, set):Array<PlayerState>;
+    public var colorize:Bool;
 
     @:view var label(default, null):LabelView;
     @:view var teams(default, null):DataView<TeamId, ToggleButtonView>;
@@ -55,21 +60,22 @@ class TeamSkin implements ISkin<TeamButton> {
 
     private function teamViewFactory(index:Int, team:TeamId) {
         var view = new TeamButton();
-        view.skin = [new TeamSkin(getTeamColor(team))];
+        var color = getTeamColor(team);
+        view.skin = [Style.text(color), new TeamSkin(color)];
         view.geometry.padding = [10, 5];
         view.team = team;
-        view.on = team == NONE;
+        view.on = team == TEAM_NONE;
         return view;
     }
 
     private function set_data(value:Array<PlayerState>):Array<PlayerState> {
         data = value;
-        teams.data = [NONE].concat([for (team in state.preset.teams) team.id]);
+        teams.data = [TEAM_NONE].concat([for (team in state.preset.teams) team.id]);
         return data;
     }
 
     private function getTeamColor(teamId:TeamId):Int {
-        var color = 0xcccccc;
+        var color = 0xaaaaaa;
         for (team in state.preset.teams) {
             if (team.id == teamId) {
                 if (!team.color.zero) color = team.color;
@@ -81,20 +87,28 @@ class TeamSkin implements ISkin<TeamButton> {
 
     private function set_item_index(value:Int):Int {
         item_index = value;
-        label.text = 'Player ${item_index}';
+        label.text = 'Player ${item_index+1}';
         return item_index;
     }
 
     private function onTeamSelect(team:TeamId) {
         if (player != null) {
-            player.control = Control.BOT;
+            player.controller = NONE;
+            player.color = 0;
             player = null;
         }
         for (p in data) {
-            if (p.id.team == team && p.control != Control.HUMAN) {
+            if (p.id.team == team) {
-                player = p;
+                switch (p.controller) {
-                player.control = Control.HUMAN;
+                    case NONE:
-                break;
+                        player = p;
+                        player.controller = HUMAN(item_index);
+                        if (colorize) {
+                            player.color = ColorUtil.multiply(state.config.getTeam(team).color, 1.7);
+                        }
+                        break;
+                    case _:
+                }
             }
         }
         for (view in teams.views) {

src/client/haxe/ru/m/tankz/view/common/PlayerView.yaml

@@ -4,12 +4,13 @@ layout.margin: 10
 layout.vAlign: middle
 views:
   - id: label
-    $type: haxework.gui.LabelView
+    $type: haxework.view.LabelView
     skinId: text
   - id: teams
-    $type: haxework.gui.DataView
+    $type: haxework.view.DataView
     factory: $this:teamViewFactory
     layout:
-      $type: haxework.gui.layout.HorizontalLayout
+      $type: haxework.view.layout.TailLayout
+      rowSize: 5
       margin: 3
     +onDataSelect: $this:onTeamSelect

src/client/haxe/ru/m/tankz/view/common/RecordView.hx

@@ -0,0 +1,46 @@
+package ru.m.tankz.view.common;
+
+import haxework.view.frame.FrameSwitcher;
+import haxework.view.HGroupView;
+import haxework.view.LabelView;
+import haxework.view.list.ListView;
+import ru.m.tankz.game.record.GameRecord;
+import ru.m.tankz.storage.RecordStorage;
+
+@:template class RecordView extends HGroupView implements IListItemView<GameRecordInfo> {
+    @:view var date:LabelView;
+    @:view var type:LabelView;
+    @:view var level:LabelView;
+    @:view var preset:LabelView;
+
+    public var item_index(default, default):Int;
+    public var data(default, set):GameRecordInfo;
+
+    @:provide var recordStorage:RecordStorage;
+    @:provide var switcher:FrameSwitcher;
+    @:provide var record:GameRecord;
+
+    private function set_data(value:GameRecordInfo):GameRecordInfo {
+        if (data != value) {
+            data = value;
+            date.text = data.date.toString();
+            type.text = data.type;
+            level.text = Std.string(data.levelId);
+            preset.text = Std.string(data.presetId);
+        }
+        return data;
+    }
+
+    private function play():Void {
+        record = recordStorage.read(data.id);
+        switcher.change(GameFrame.ID);
+    }
+
+    private function delete():Void {
+        recordStorage.delete(data.id);
+        // ToDo:
+        var list = cast(parent.parent.parent, ListView<Dynamic>);
+        list.data.splice(item_index, 1);
+        list.toUpdate();
+    }
+}

src/client/haxe/ru/m/tankz/view/common/RecordView.yaml

@@ -0,0 +1,29 @@
+---
+geometry.size.height: 38
+layout.margin: 5
+layout.vAlign: middle
+views:
+  - id: play
+    $type: haxework.view.ButtonView
+    skinId: button.start.small
+    +onPress: $code:play()
+  - id: date
+    $type: haxework.view.LabelView
+    skinId: text.box
+    geometry.size.fixed: [250, 38]
+  - id: type
+    $type: haxework.view.LabelView
+    skinId: text.box
+    geometry.size.fixed: [250, 38]
+  - id: level
+    $type: haxework.view.LabelView
+    skinId: text.box
+    geometry.size.fixed: [50, 38]
+  - id: preset
+    $type: haxework.view.LabelView
+    skinId: text.box
+    geometry.size.fixed: [50, 38]
+  - id: delete
+    $type: haxework.view.ButtonView
+    skinId: button.close.small
+    +onPress: $code:delete()

src/client/haxe/ru/m/tankz/view/game/ClassicGamePanel.hx

@@ -0,0 +1,60 @@
+package ru.m.tankz.view.game;
+
+import haxework.view.LabelView;
+import haxework.view.VGroupView;
+import ru.m.geom.Direction;
+import ru.m.tankz.game.GameEvent;
+import ru.m.tankz.game.GameState;
+import ru.m.tankz.preset.ClassicGame;
+import ru.m.tankz.Type.PlayerId;
+import ru.m.tankz.view.common.LifeView;
+
+@:template class ClassicGamePanel extends VGroupView implements IGamePanel {
+    public var position(default, null):Direction = Direction.RIGHT;
+
+    @:view var bot:LifeView;
+    @:view var player1:LifeView;
+    @:view var player2:LifeView;
+    @:view var level:LabelView;
+
+    private var player1Id:PlayerId = new PlayerId(ClassicGame.HUMAN, 0);
+    private var player2Id:PlayerId = new PlayerId(ClassicGame.HUMAN, 1);
+
+    public function refresh(state:GameState):Void {
+        level.text = 'Level ${state.levelId}';
+        bot.life = state.getTeamLife(ClassicGame.BOT);
+        player1.life = state.getPlayerLife(player1Id);
+        player1.score = state.getPlayerScore(player1Id);
+        if (state.getPlayerLife(player2Id) > 0) {
+            player2.visible = true;
+            player2.life = state.getPlayerLife(player2Id);
+            player2.score = state.getPlayerScore(player2Id);
+        } else {
+            player2.visible = false;
+        }
+    }
+
+    public function onGameEvent(event:GameEvent):Void {
+        switch event {
+            case START(state):
+                refresh(state);
+            case CHANGE(TEAM_LIFE(teamId, life)):
+                if (teamId == ClassicGame.BOT) {
+                    bot.life = life;
+                }
+            case CHANGE(PLAYER_LIFE(playerId, life)):
+                if (playerId == player1Id) {
+                    player1.life = life;
+                } else if (playerId == player2Id) {
+                    player2.life = life;
+                }
+            case CHANGE(PLAYER_SCORE(playerId, score)):
+                if (playerId == player1Id) {
+                    player1.score = score;
+                } else if (playerId == player2Id) {
+                    player2.score = score;
+                }
+            case _:
+        }
+    }
+}

src/client/haxe/ru/m/tankz/view/game/ClassicGamePanel.yaml

@@ -5,22 +5,21 @@ layout.margin: 5
 layout.hAlign: right
 views:
   - id: level
-    $type: haxework.gui.LabelView
+    $type: haxework.view.LabelView
     skinId: text.box
     geometry.size.height: 38
-    geometry.padding: [20, 0]
+    geometry.size.width: 100%
-    geometry.hAlign: center
+  - $type: haxework.view.SpriteView
-  - $type: haxework.gui.SpriteView
     geometry.size.height: 50%
   - id: bot
-    $type: ru.m.tankz.frame.common.LifeView
+    $type: ru.m.tankz.view.common.LifeView
     tank: ba
     scoreLabel.visible: false
   - id: player1
-    $type: ru.m.tankz.frame.common.LifeView
+    $type: ru.m.tankz.view.common.LifeView
     tank: pa
     color: 0xFFFF00
   - id: player2
-    $type: ru.m.tankz.frame.common.LifeView
+    $type: ru.m.tankz.view.common.LifeView
     tank: pa
     color: 0x15C040

src/client/haxe/ru/m/tankz/view/game/DeathGamePanel.hx

@@ -0,0 +1,28 @@
+package ru.m.tankz.view.game;
+
+import haxework.view.DataView;
+import haxework.view.LabelView;
+import haxework.view.VGroupView;
+import ru.m.geom.Direction;
+import ru.m.tankz.game.GameEvent;
+import ru.m.tankz.game.GameState;
+import ru.m.tankz.view.common.LifeView;
+
+@:template class DeathGamePanel extends VGroupView implements IGamePanel {
+    public var position(default, null):Direction = Direction.RIGHT;
+
+    @:view var level:LabelView;
+    @:view var players:DataView<PlayerState, LifeView>;
+
+    public function onGameEvent(event:GameEvent):Void {
+        switch event {
+            case START(state):
+                level.text = 'Level ${state.levelId}';
+                players.data = Lambda.array(state.players);
+            case _:
+                for (view in players.views) {
+                    view.toUpdate();
+                }
+        }
+    }
+}

src/client/haxe/ru/m/tankz/view/game/DeathGamePanel.yaml

@@ -0,0 +1,18 @@
+---
+geometry.padding: 5
+geometry.size.height: 100%
+layout.margin: 5
+layout.hAlign: right
+views:
+  - id: level
+    $type: haxework.view.LabelView
+    skinId: text.box
+    geometry.size.height: 38
+    geometry.size.width: 100%
+  - $type: haxework.view.SpriteView
+    geometry.size.height: 50%
+  - id: players
+    $type: haxework.view.DataView
+    layout:
+      $type: haxework.view.layout.VerticalLayout
+    factory: $code:ru.m.tankz.view.common.LifeView.factory

src/client/haxe/ru/m/tankz/view/game/DotaGamePanel.hx

@@ -0,0 +1,46 @@
+package ru.m.tankz.view.game;
+
+import haxework.view.HGroupView;
+import haxework.view.LabelView;
+import ru.m.geom.Direction;
+import ru.m.tankz.game.GameEvent;
+import ru.m.tankz.game.GameState;
+import ru.m.tankz.preset.DotaGame;
+import ru.m.tankz.Type.TeamId;
+import ru.m.tankz.view.common.LifeView;
+
+@:template class DotaGamePanel extends HGroupView implements IGamePanel {
+    public var position(default, null):Direction = Direction.TOP;
+
+    @:view var radiant:LifeView;
+    @:view var dire:LifeView;
+    @:view var level:LabelView;
+
+    public function refresh(state:GameState):Void {
+        level.text = 'Level ${state.levelId}';
+        radiant.life = state.getTeamLife(DotaGame.RADIANT);
+        radiant.score = state.getTeamScore(DotaGame.RADIANT);
+        dire.life = state.getTeamLife(DotaGame.DIRE);
+        dire.score = state.getTeamScore(DotaGame.DIRE);
+    }
+
+    private inline function getLifeView(teamId:TeamId):LifeView {
+        return switch teamId {
+            case DotaGame.RADIANT: radiant;
+            case DotaGame.DIRE: dire;
+            case _: null;
+        }
+    }
+
+    public function onGameEvent(event:GameEvent):Void {
+        switch event {
+            case START(state):
+                refresh(state);
+            case CHANGE(TEAM_LIFE(teamId, life)):
+                getLifeView(teamId).life = life;
+            case CHANGE(TEAM_SCORE(teamId, score)):
+                getLifeView(teamId).score = score;
+            case _:
+        }
+    }
+}

src/client/haxe/ru/m/tankz/view/game/DotaGamePanel.yaml

@@ -0,0 +1,21 @@
+---
+geometry.size.width: 100%
+layout.margin: 20
+views:
+  - id: radiant
+    $type: ru.m.tankz.view.common.LifeView
+    tank: bc
+    color: 0xff4422
+  - $type: haxework.view.SpriteView
+    geometry.size.width: 25%
+  - id: level
+    $type: haxework.view.LabelView
+    skinId: text.box
+    geometry.size.height: 38
+    geometry.size.width: 50%
+  - $type: haxework.view.SpriteView
+    geometry.size.width: 25%
+  - id: dire
+    $type: ru.m.tankz.view.common.LifeView
+    tank: bc
+    color: 0x3284ff

src/client/haxe/ru/m/tankz/view/game/GameView.hx

@@ -0,0 +1,53 @@
+package ru.m.tankz.view.game;
+
+import haxework.view.IGroupView;
+import haxework.view.VGroupView;
+import ru.m.geom.Direction;
+import ru.m.tankz.preset.ClassicGame;
+import ru.m.tankz.preset.DeathGame;
+import ru.m.tankz.preset.DotaGame;
+import ru.m.tankz.render.IRender;
+import ru.m.tankz.Type;
+
+@:template class GameView extends VGroupView {
+
+    @:view public var render(default, null):IRender;
+    public var panel(default, null):IGamePanel;
+    public var type(default, set):GameType;
+
+    @:view public var top(default, null):IGroupView;
+    @:view public var bottom(default, null):IGroupView;
+    @:view public var left(default, null):IGroupView;
+    @:view public var right(default, null):IGroupView;
+
+    private function set_type(value:GameType):GameType {
+        if (type != value) {
+            type = value;
+            if (panel != null) {
+                panel.remove();
+            }
+            panel = buildPanel(type);
+            getContainer(panel.position).addView(panel);
+        }
+        return type;
+    }
+
+    private function buildPanel(type:GameType):IGamePanel {
+        return switch type {
+            case ClassicGame.TYPE: new ClassicGamePanel();
+            case DotaGame.TYPE: new DotaGamePanel();
+            case DeathGame.TYPE: new DeathGamePanel();
+            case _: throw 'Unsupported type: ${type}';
+        }
+    }
+
+    private function getContainer(position:Direction):IGroupView {
+        return switch position.toString() {
+            case "RIGHT": right;
+            case "LEFT": left;
+            case "TOP": top;
+            case "BOTTOM": bottom;
+            case _: throw 'Unsupported position: ${position}';
+        }
+    }
+}

src/client/haxe/ru/m/tankz/view/game/GameView.yaml

@@ -0,0 +1,22 @@
+---
+views:
+  - id: top
+    $type: haxework.view.GroupView
+    layout.hAlign: center
+    geometry.size.width: 100%
+  - $type: haxework.view.HGroupView
+    views:
+      - id: left
+        $type: haxework.view.GroupView
+        layout.vAlign: middle
+        geometry.size.height: 100%
+      - id: render
+        $type: ru.m.tankz.render.Render
+      - id: right
+        $type: haxework.view.GroupView
+        layout.vAlign: middle
+        geometry.size.height: 100%
+  - id: bottom
+    $type: haxework.view.GroupView
+    layout.hAlign: center
+    geometry.size.width: 100%

src/client/haxe/ru/m/tankz/view/game/IGamePanel.hx

@@ -0,0 +1,9 @@
+package ru.m.tankz.view.game;
+
+import haxework.view.IView;
+import ru.m.geom.Direction;
+import ru.m.tankz.game.IGame;
+
+interface IGamePanel extends IView<Dynamic> extends GameListener {
+    public var position(default, null):Direction;
+}

src/client/haxe/ru/m/tankz/view/network/GameItemView.hx

@@ -0,0 +1,24 @@
+package ru.m.tankz.view.network;
+
+import haxework.view.LabelView;
+import haxework.view.HGroupView;
+import haxework.view.list.ListView;
+import ru.m.tankz.proto.core.GameProto;
+
+@:template class GameItemView extends HGroupView implements IListItemView<GameProto> {
+
+    public var item_index(default, default):Int;
+    public var data(default, set):GameProto;
+
+    @:view var label:LabelView;
+
+    private function set_data(value:GameProto):GameProto {
+        data = value;
+        label.text = '[${value.creator.name}] ${value.type} ${value.level} (${value.players.length})';
+        return data;
+    }
+
+    public static function factory():GameItemView {
+        return new GameItemView();
+    }
+}

src/client/haxe/ru/m/tankz/view/network/GameItemView.yaml

@@ -0,0 +1,8 @@
+---
+geometry.size.width: 100%
+geometry.size.height: 48
+views:
+    - id: label
+      $type: haxework.view.LabelView
+      geometry.size.stretch: true
+      skinId: text.box

src/client/haxe/ru/m/tankz/view/network/GameListFrame.hx

@@ -0,0 +1,54 @@
+package ru.m.tankz.view.network;
+
+import haxework.view.frame.FrameSwitcher;
+import haxework.view.list.VListView;
+import haxework.view.VGroupView;
+import ru.m.tankz.network.NetworkManager;
+import ru.m.tankz.proto.core.GameProto;
+
+@:template class GameListFrame extends VGroupView {
+    public static inline var ID = "game_list";
+
+    @:view var games:VListView<GameProto>;
+
+    @:provide var switcher:FrameSwitcher;
+    @:provide var network:NetworkManager;
+
+    public function onShow():Void {
+        network.listGameSignal.connect(onGameList);
+        network.gameSignal.connect(onGame);
+        network.stateSignal.connect(onState);
+        network.listGame();
+    }
+
+    public function onHide():Void {
+        network.listGameSignal.disconnect(onGameList);
+        network.gameSignal.disconnect(onGame);
+        network.stateSignal.disconnect(onState);
+    }
+
+    private function create():Void {
+        network.createGame("classic", 0);
+    }
+
+    private function onState(state:ConnectionState):Void {
+        switch state {
+            case ONLINE(_):
+            case _: switcher.change(StartFrame.ID);
+        }
+    }
+
+    private function onGameList(data:Array<GameProto>):Void {
+        games.data = data;
+    }
+
+    private function onGame(game:GameProto):Void {
+        if (game != null) {
+            switcher.change(GameRoomFrame.ID);
+        }
+    }
+
+    private function selectGame(game:GameProto):Void {
+        network.joinGame(game.id);
+    }
+}