[client] add font

2019-03-22 15:47:47 +03:00
parent 4d8de90419
commit 216e1aa476
27 changed files with 178 additions and 1599 deletions
--- a/src/client/haxe/ru/m/tankz/Init.hx
+++ b/src/client/haxe/ru/m/tankz/Init.hx
@@ -1,5 +1,6 @@
 package ru.m.tankz;

+import haxework.gui.popup.PopupManager;
 import ru.m.tankz.storage.SettingsStorage;
 import haxework.provider.Provider;
 import haxework.resources.IResources;
@@ -49,6 +50,7 @@ class Init {
        Provider.setFactory(SoundManager, SoundManager);
        Provider.setFactory(NetworkManager, NetworkManager);
        Provider.setFactory(IControlFactory, ClientControlFactory);
+        Provider.setFactory(PopupManager, PopupManager);

        var host:String = getHost();
        L.d('Init', 'host: ${host}');
--- a/src/client/haxe/ru/m/tankz/Style.hx
+++ b/src/client/haxe/ru/m/tankz/Style.hx
@@ -1,10 +1,14 @@
 package ru.m.tankz;

+import flash.text.Font;
+import flash.text.FontType;
 import haxework.color.ColorUtil;
 import haxework.gui.core.Geometry;
 import haxework.gui.core.HAlign;
 import haxework.gui.core.VAlign;
+import haxework.gui.ITextView;
 import haxework.gui.layout.Layout;
+import haxework.gui.skin.ISkin;
 import haxework.gui.skin.Skin;
 import haxework.resources.IResources;
 import openfl.Assets;
@@ -17,9 +21,32 @@ class Style {
    private static var lightColor = 0x95937D;
    private static var darkColor = 0x777564;
    private static var textColor = 0xE7E0BB;
-    private static var fontFamily = "Courirer New";

-    public static function register() {
+    private static var baseFontSize = 18;
+    private static var bigFontSize = 22;
+    private static var veryBigFontSize = 24;
+
+    private static var fontFamily = "Courirer New";
+    private static var fontEmbed = false;
+
+    public static function text(color):ISkin<ITextView> {
+        return Skin.text(color, baseFontSize, fontFamily, fontEmbed);
+    }
+
+    public static function register(font:Font = null) {
+        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),
        ]);
@@ -27,45 +54,48 @@ class Style {
            Skin.color(darkColor),
        ]);
        resources.skin.put("text", [
-            Skin.text(textColor, 16, fontFamily),
+            Skin.text(textColor, baseFontSize, fontFamily, fontEmbed),
+        ]);
+        resources.skin.put("scroll.vertical", [
+            haxework.gui.skin.Skin.scrollVertical(lightColor, darkColor),
        ]);
        resources.skin.put("text.header", [
            Skin.color(0x000000, 0.1),
            Skin.border(lightColor, 1, 2),
-            Skin.text(textColor, 22, fontFamily),
-            Skin.geometry(new Geometry().setSize(200, 38).setMargin([0, 0, 0, 30])),
+            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),
        ]);
        resources.skin.put("text.box", [
            Skin.color(0x000000, 0.1),
            Skin.border(lightColor, 1, 2),
-            Skin.text(textColor, 16, fontFamily),
+            Skin.text(textColor, baseFontSize, fontFamily, fontEmbed),
        ]);
        resources.skin.put("text.box.active", [
            Skin.color(0x55aa55),
            Skin.border(0x88dd88, 1, 2),
-            Skin.text(textColor, 16, fontFamily),
+            Skin.text(textColor, baseFontSize, fontFamily, fontEmbed),
        ]);
        resources.skin.put("button.simple", [
            Skin.buttonColor(lightColor),
-            Skin.text(textColor, 16, fontFamily),
-            Skin.size(100, 38),
+            Skin.text(textColor, baseFontSize, fontFamily, fontEmbed),
+            Skin.geometry(new Geometry().setPadding([25, 8])),
        ]);
        resources.skin.put("button.tab", [
            Skin.tabColor(lightColor),
-            Skin.text(textColor, 16, fontFamily),
-            Skin.size(200, 38),
+            Skin.text(textColor, baseFontSize, fontFamily, fontEmbed),
+            Skin.geometry(new Geometry().setPadding([25, 8])),
        ]);
        resources.skin.put("border", [
            Skin.border(ColorUtil.multiply(lightColor, 1.5), 1, 2),
        ]);
        resources.skin.put("button.level", [
            Skin.buttonColor(lightColor),
-            Skin.text(textColor, 24, fontFamily),
+            Skin.text(textColor, veryBigFontSize, fontFamily, fontEmbed),
            Skin.size(64, 64),
        ]);

--- a/src/client/haxe/ru/m/tankz/view/ClientView.hx
+++ b/src/client/haxe/ru/m/tankz/view/ClientView.hx
@@ -7,15 +7,13 @@ import haxework.gui.frame.FrameSwitcher;
 import haxework.resources.IResources;

@:template class ClientView extends FrameSwitcher {
-    private static inline var TAG = 'Tankz';

    @:provide var resources:IResources;
    @:provide var switcher:FrameSwitcher;

    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})');
+        resources.text.put('version', '${Const.VERSION}');
        switcher = this;
    }

--- a/src/client/haxe/ru/m/tankz/view/ResultFrame.hx
+++ b/src/client/haxe/ru/m/tankz/view/ResultFrame.hx
@@ -41,7 +41,7 @@ import ru.m.tankz.preset.DotaGame;
            case HUMAN(_): true;
            case _: false;
        });
-        levelLabel.text = 'Level: ${resultState.level}';
+        levelLabel.text = 'Level ${resultState.level}';
        nextButton.visible = state != null;
    }

--- a/src/client/haxe/ru/m/tankz/view/StartFrame.hx
+++ b/src/client/haxe/ru/m/tankz/view/StartFrame.hx
@@ -1,10 +1,11 @@
 package ru.m.tankz.view;

-import ru.m.tankz.view.classic.ClassicLevelFrame;
-import ru.m.tankz.view.dota.DotaLevelFrame;
 import haxework.gui.ButtonView;
 import haxework.gui.frame.FrameSwitcher;
 import haxework.gui.VGroupView;
+import ru.m.tankz.view.classic.ClassicLevelFrame;
+import ru.m.tankz.view.dota.DotaLevelFrame;
+import ru.m.tankz.view.popup.FontPopup;

@:template class StartFrame extends VGroupView {

@@ -12,7 +13,9 @@ import haxework.gui.VGroupView;

    @:provide var frameSwitcher:FrameSwitcher;

-    public function onPress(view:ButtonView):Void {
+    private var fontPopup:FontPopup;
+
+    private function onPress(view:ButtonView):Void {
        switch (view.id) {
            case 'classic':
                frameSwitcher.change(ClassicLevelFrame.ID);
@@ -24,4 +27,14 @@ import haxework.gui.VGroupView;
                frameSwitcher.change(SettingsFrame.ID);
        }
    }
+
+    private function choiceFont():Void {
+        if (fontPopup == null) {
+            fontPopup = new FontPopup();
+        }
+        fontPopup
+        .show()
+        .then(function(font) Style.register(font))
+        .catchError(function(e) {});
+    }
 }
--- a/src/client/haxe/ru/m/tankz/view/StartFrame.yaml
+++ b/src/client/haxe/ru/m/tankz/view/StartFrame.yaml
@@ -17,13 +17,17 @@ views:
        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
+#      - id: font
+#        $type: haxework.gui.ButtonView
+#        skinId: button
+#        +onPress: $code:choiceFont()
+#        text: Font
+#      - id: network
+#        $type: haxework.gui.ButtonView
+#        skinId: button
+#        +onPress: $this:onPress
+#        text: Network (in developing)
+#        fontColor: 0xff0000
  - $type: haxework.gui.HGroupView
    skinId: panel
    views:
--- a/src/client/haxe/ru/m/tankz/view/classic/ClassicGamePanel.hx
+++ b/src/client/haxe/ru/m/tankz/view/classic/ClassicGamePanel.hx
@@ -17,7 +17,7 @@ import ru.m.tankz.preset.ClassicGame;
    public var game:Game;

    private function updateViews():Void {
-        level.text = 'Level: ${game.state.level}';
+        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;
--- a/src/client/haxe/ru/m/tankz/view/common/LifeView.hx
+++ b/src/client/haxe/ru/m/tankz/view/common/LifeView.hx
@@ -28,7 +28,7 @@ import haxework.gui.HGroupView;
    }

    private inline function set_live(value:Int):Int {
-        liveLabel.text = 'x${value}';
+        liveLabel.text = '${value}';
        return value;
    }

--- a/src/client/haxe/ru/m/tankz/view/common/PlayerView.hx
+++ b/src/client/haxe/ru/m/tankz/view/common/PlayerView.hx
@@ -1,5 +1,6 @@
 package ru.m.tankz.view.common;

+import haxework.resources.IResources;
 import haxework.color.ColorUtil;
 import haxework.gui.DataView;
 import haxework.gui.HGroupView;
@@ -24,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) {
@@ -31,11 +34,11 @@ 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.lineStyle(1, view.on ? 0x333333 : color);
-        graphics.drawRect(0, 0, view.width, view.height);
+        graphics.beginFill(view.on ? color : resources.color.get("light"));
+        graphics.lineStyle(2, color, 0.5);
+        graphics.drawRoundRect(0, 0, view.width, view.height, 5, 5);
        graphics.endFill();
        graphics.lineStyle();
    }
@@ -56,7 +59,8 @@ 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 == TEAM_NONE;
@@ -70,7 +74,7 @@ class TeamSkin implements ISkin<TeamButton> {
    }

    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;
@@ -82,7 +86,7 @@ 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;
    }

--- a/src/client/haxe/ru/m/tankz/view/dota/DotaGamePanel.hx
+++ b/src/client/haxe/ru/m/tankz/view/dota/DotaGamePanel.hx
@@ -16,7 +16,7 @@ import ru.m.tankz.preset.DotaGame;
    public var game:Game;

    private function updateViews():Void {
-        level.text = 'Level: ${game.state.level}';
+        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;
--- a/src/client/haxe/ru/m/tankz/view/dota/DotaLevelFrame.yaml
+++ b/src/client/haxe/ru/m/tankz/view/dota/DotaLevelFrame.yaml
@@ -10,7 +10,7 @@ views:
    $type: haxework.gui.DataView
    layout:
      $type: haxework.gui.layout.VerticalLayout
-      hAlign: center
+      hAlign: right
    factory: $this:playerViewFactory
    geometry.padding: 10
  - id: levels
--- a/src/client/haxe/ru/m/tankz/view/popup/FontPopup.hx
+++ b/src/client/haxe/ru/m/tankz/view/popup/FontPopup.hx
@@ -0,0 +1,41 @@
+package ru.m.tankz.view.popup;
+
+import flash.text.Font;
+import flash.text.FontType;
+import haxework.gui.list.LabelListItem;
+import haxework.gui.list.ListView;
+import haxework.gui.popup.PopupView;
+
+class FontLabelView extends LabelListItem<Font> {
+
+    override private function set_data(value:Font):Font {
+        skinId = item_index % 2 == 0 ? "light" : "dark";
+        data = value;
+        text = value.fontName;
+        fontFamily = value.fontName;
+        fontEmbed = switch value.fontType {
+            case DEVICE: false;
+            case _: true;
+        };
+        return data;
+    }
+}
+
+@:template class FontPopup extends PopupView<Font> {
+
+    @:view var fonts:ListView<Font>;
+
+    private function init():Void {
+        var values = Font.enumerateFonts(true);
+        values.sort(function(a:Font, b:Font) {
+            return switch [a.fontType, b.fontType] {
+                case [FontType.DEVICE, _]: 1;
+                case [_, FontType.DEVICE]: -1;
+                case _: 0;
+            }
+        });
+        fonts.data = values;
+    }
+
+    private function fontViewFactory() return new FontLabelView();
+}
--- a/src/client/haxe/ru/m/tankz/view/popup/FontPopup.yaml
+++ b/src/client/haxe/ru/m/tankz/view/popup/FontPopup.yaml
@@ -0,0 +1,27 @@
+---
+view:
+  $type: haxework.gui.VGroupView
+  geometry.size.width: 400
+  geometry.size.height: 80%
+  geometry.padding: 10
+  geometry.hAlign: center
+  geometry.vAlign: middle
+  skinId: dark
+  views:
+    - id: fonts
+      $type: haxework.gui.list.VListView
+      geometry.size.stretch: true
+      factory: $this:fontViewFactory
+      +onItemSelect: $code:function(item) close(item.data)
+      scroll:
+        $type: haxework.gui.list.VScrollBarView
+        skinId: scroll.vertical
+    - $type: haxework.gui.HGroupView
+      geometry.size.width: 100%
+      geometry.margin.top: 10
+      layout.hAlign: right
+      views:
+        - $type: haxework.gui.ButtonView
+          skinId: button.simple
+          text: Cancel
+          +onPress: $code:reject('cancel')
--- a/src/client/haxe/ru/m/tankz/view/settings/ActionView.hx
+++ b/src/client/haxe/ru/m/tankz/view/settings/ActionView.hx
@@ -30,7 +30,7 @@ class KeyboardMap {

    public static function getName(key: Int): String {
        if (instance == null) instance = new KeyboardMap();
-        return key == -1 ? "<NONE>" : instance.data.exists(key) ? instance.data.get(key) : Std.string(key);
+        return key == -1 ? "(NONE)" : instance.data.exists(key) ? instance.data.get(key) : Std.string(key);
    }
 }