[client] add PackView

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

@@ -129,6 +129,10 @@ class AppTheme extends Theme {
             "skin.background.color" => red,
         ]));
 
+        register(new Style("button.menu", [
+            "_" => null,
+        ], ["border", "light"]));
+
         registerButton("settings", "cog-solid.svg");
         registerButton("close", "times-circle-solid.svg");
         registerButton("next", "arrow-alt-circle-right-solid.svg");

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

@@ -10,6 +10,7 @@ import ru.m.tankz.game.GameInit;
 import ru.m.tankz.game.GameState;
 import ru.m.tankz.network.NetworkManager;
 import ru.m.tankz.Type;
+import ru.m.tankz.view.common.PackView;
 import ru.m.tankz.view.network.RoomFrame;
 import ru.m.tankz.view.network.RoomListFrame;
 import ru.m.tankz.view.popup.LoginPopup;
@@ -26,7 +27,7 @@ using ru.m.tankz.view.ViewUtil;
     @:provide static var appUpdater:Updater;
     @:provide static var levelBundle:ILevelBundle;
 
-    @:view var packs:DataView<PackId, ButtonView>;
+    @:view var packs:DataView<PackId, PackView>;
     @:view var username:LabelView;
     @:view("login") var loginButton:ButtonView;
     @:view("logout") var logoutButton:ButtonView;

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

@@ -5,6 +5,7 @@ views:
     overflow.y: scroll
     views:
       - $type: haxework.view.group.VGroupView
+        geometry.width: 100%
         layout.margin: 10
         layout.hAlign: center
         views:
@@ -15,10 +16,12 @@ views:
             geometry.margin.bottom: 30
           - id: packs
             $type: haxework.view.data.DataView
+            geometry.width: 100%
             layout:
-              $type: haxework.view.layout.VerticalLayout
+              $type: haxework.view.layout.TailLayout
+              rowSize: 3
               margin: 10
-            factory: ~packButtonFactory
+            factory: ~ru.m.tankz.view.common.PackView.factory
             +onDataSelect: ~startGame
           - $type: haxework.view.SpriteView
             style: line

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

@@ -41,8 +41,8 @@ class ViewUtil {
         return result.join(oneline ? " " : "\n");
     }
 
-    public static function toPackLabel(packId:PackId):String {
+    public static function toPackLabel(packId:PackId, separator=" #"):String {
-        return packId.name != PackId.DEFAULT ? '${packId.type} #${packId.name}' : packId.type;
+        return packId.name != PackId.DEFAULT ? '${packId.type}${separator}${packId.name}' : packId.type;
     }
 
     public static function toActionLabel(action:TankAction):String {

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

@@ -0,0 +1,28 @@
+package ru.m.tankz.view.common;
+
+import haxework.view.form.LabelView;
+import haxework.view.group.VGroupView;
+import ru.m.tankz.Type;
+
+using ru.m.tankz.view.ViewUtil;
+
+@:template class PackView extends VGroupView {
+
+    public var data(default, set):PackId;
+
+    @:view var label:LabelView;
+
+    private function set_data(value:PackId):PackId {
+        if (data != value) {
+            data = value;
+            label.text = data.toPackLabel("\n");
+        }
+        return data;
+    }
+
+    public static function factory(index:Int, value:PackId):PackView {
+        var result = new PackView();
+        result.data = value;
+        return result;
+    }
+}

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

@@ -0,0 +1,12 @@
+---
+style: button.menu
+geometry.width: 200
+geometry.height: 150
+geometry.padding: 5
+layout.hAlign: center
+content.buttonMode: true
+content.mouseChildren: false
+views:
+  - id: label
+    $type: haxework.view.form.LabelView
+    font.size: 22

src/editor/haxe/ru/m/tankz/editor/view/PackFrame.hx

@@ -117,6 +117,7 @@ using ru.m.tankz.view.ViewUtil;
         data.name = levelName.text;
         pack.data[data.id] = data;
         levels.data = pack.data;
+        level = data;
         storage.write(pack.id, pack);
     }
 

src/editor/haxe/ru/m/tankz/editor/view/PackListFrame.hx

@@ -6,6 +6,7 @@ import haxework.view.frame.FrameView;
 import ru.m.tankz.bundle.ILevelBundle;
 import ru.m.tankz.config.Config;
 import ru.m.tankz.editor.FileUtil;
+import ru.m.tankz.editor.view.PackView;
 import ru.m.tankz.editor.view.popup.PackPopup;
 import ru.m.tankz.Type;
 import ru.m.tankz.util.LevelUtil;
@@ -13,7 +14,7 @@ import ru.m.tankz.util.LevelUtil;
 @:template class PackListFrame extends FrameView<Dynamic> {
     public static inline var ID = "pack_list";
 
-    @:view("packs") var packView:DataView<PackId, PackView>;
+    @:view("packs") var packView:ActionDataView<PackId, PackView, PackAction>;
 
     @:provide static var levelBundle:ILevelBundle;
     @:provide static var switcher:FrameSwitcher;
@@ -28,20 +29,19 @@ import ru.m.tankz.util.LevelUtil;
         packView.data = storage.packList();
     }
 
-    private function onPackAction(value:PackId, action:String):Void {
+    private function onPackAction(value:PackId, action:PackAction):Void {
         switch action {
-            case "export":
+            case EXPORT:
                 var pack:LevelPack = storage.read(value);
                 FileUtil.save({
                     name: '${value}.zip',
                     content: LevelUtil.pack(pack.data),
                 });
-            case "edit":
+            case EDIT:
                 switcher.change(PackFrame.ID, storage.read(value));
-            case "delete":
+            case DELETE:
                 storage.delete(value);
                 packView.data = storage.packList();
-            case _:
         }
     }
 

src/editor/haxe/ru/m/tankz/editor/view/PackListFrame.yaml

@@ -8,7 +8,7 @@ views:
         text: New
         +onPress: ~create()
       - id: packs
-        $type: haxework.view.data.DataView
+        $type: haxework.view.data.ActionDataView
         layout:
           $type: haxework.view.layout.VerticalLayout
           margin: 5

src/editor/haxe/ru/m/tankz/editor/view/PackView.hx

@@ -9,12 +9,18 @@ import ru.m.tankz.Type;
 
 using ru.m.tankz.view.ViewUtil;
 
+enum PackAction {
+    EXPORT;
+    EDIT;
+    DELETE;
+}
+
 @:template class PackView extends HGroupView implements IListItemView<PackId> {
 
     public var item_index(default, default):Int;
     public var data(default, set):PackId;
 
-    private var actionSignal(get, null):Signal2<PackId, String>;
+    private var actionSignal(get, null):Signal2<PackId, PackAction>;
 
     @:view var label:ButtonView;
 
@@ -24,21 +30,21 @@ using ru.m.tankz.view.ViewUtil;
         return data;
     }
 
-    private function get_actionSignal():Signal2<PackId, String> {
+    private function get_actionSignal():Signal2<PackId, PackAction> {
-        var dataView:DataView<PackId, PackView> = cast parent;
+        var dataView:ActionDataView<PackId, PackView, PackAction> = cast parent;
         return dataView.onDataAction;
     }
 
     private function export():Void {
-        actionSignal.emit(data, "export");
+        actionSignal.emit(data, EXPORT);
     }
 
     private function edit():Void {
-        actionSignal.emit(data, "edit");
+        actionSignal.emit(data, EDIT);
     }
 
     private function delete():Void {
-        actionSignal.emit(data, "delete");
+        actionSignal.emit(data, DELETE);
     }
 
     public static function factory(index:Int, value:PackId):PackView {