WIP

src/ui/common/Messages.ts

@@ -23,8 +23,7 @@ class Message extends UIContainer {
     this.background = new UIBackground(this.view, this);
 
     this.text = builder.text(text, 0, 0, { color: "#DBEFF9", shadow: true, size: 16, center: false, vcenter: false });
-
-    UITools.drawBackground(this.text, this.background, 6);
+    this.background.drawAround(this.text, 6);
 
     let bounds = UITools.getBounds(this);
     this.setPosition(parent.view.getX(1) - bounds.width - 25, 25);

src/ui/common/Tooltip.ts

@@ -68,7 +68,7 @@ export class TooltipContainer extends UIContainer {
 
   update() {
     if (this.visible && this.item) {
-      let [width, height] = UITools.drawBackground(this.content, this.background, this.border);
+      let [width, height] = this.background.drawAround(this.content, this.border);
 
       let [x, y] = this.getBestPosition(this.item, width, height);
       x += this.border;

src/ui/common/UIBackground.ts

@@ -19,6 +19,19 @@ export class UIBackground {
     this.graphics = new UIBuilder(view, parent).graphics("background", 0, 0, false);
   }
 
+  /**
+   * Draw a background around a content
+   */
+  drawAround(content: UIContainer | Phaser.GameObjects.Text, border = 6): [number, number] {
+    if (content.parentContainer === this.parent) {
+      this.adaptToContent(content);
+      return [this.width, this.height];
+    } else {
+      console.error("Cannot draw background with different parents", content, this);
+      return [0, 0];
+    }
+  }
+
   /**
    * Adapt the background to cover a given content
    */

src/ui/common/UITools.ts

@@ -1,9 +1,4 @@
 import { range } from "../../common/Tools";
-import { UIBackground } from "./UIBackground";
-import { UIButton } from "./UIButton";
-import { UIContainer } from "./UIContainer";
-import { UIImage } from "./UIImage";
-import { UIText } from "./UIText";
 
 export type IBounded = {
   x: number
@@ -17,7 +12,7 @@ export type IBounded = {
  *
  * This is a workaround for a removeChildren bug
  */
-export function destroyChildren(obj: UIContainer, start = 0, end = obj.length - 1) {
+export function destroyChildren(obj: Phaser.GameObjects.Container, start = 0, end = obj.length - 1) {
   obj.list.slice(start, end + 1).forEach(child => child.destroy());
 }
 
@@ -29,22 +24,14 @@ export class UITools {
    * Check that a game object has transform and bounds available
    */
   static isSpatial(obj: any): obj is Phaser.GameObjects.Components.GetBounds & Phaser.GameObjects.Components.Transform {
-    return obj instanceof UIImage || obj instanceof UIText || obj instanceof UIContainer;
+    return obj instanceof Phaser.GameObjects.Image || obj instanceof Phaser.GameObjects.Text || obj instanceof Phaser.GameObjects.Container;
   }
 
   /**
    * Get the bounding rectanle of a displayed object, in screen space
    */
-  static getBounds(obj: UIContainer | (Phaser.GameObjects.GameObject & Phaser.GameObjects.Components.GetBounds)): IBounded {
-    let result: IBounded;
-
-    if (obj instanceof UIContainer) {
-      result = obj.getBounds();
-    } else {
-      result = obj.getBounds();
-    }
-
-    return result;
+  static getBounds(obj: Phaser.GameObjects.Container | (Phaser.GameObjects.GameObject & Phaser.GameObjects.Components.GetBounds)): IBounded {
+    return obj.getBounds();
   }
 
   /**
@@ -88,7 +75,7 @@ export class UITools {
   /**
    * Reposition an object to remain inside a container
    */
-  static keepInside(obj: UIButton | UIImage | UIContainer, rect: IBounded) {
+  static keepInside(obj: Phaser.GameObjects.Image | Phaser.GameObjects.Container, rect: IBounded) {
     let objbounds = UITools.getBounds(obj);
     let [x, y] = UITools.positionInside({ x: obj.x, y: obj.y, width: objbounds.width, height: objbounds.height }, rect);
 
@@ -158,17 +145,4 @@ export class UITools {
       return range(item_count).map(i => item_width / 2 + i * spacing);
     }
   }
-
-  /**
-   * Draw a background around a content
-   */
-  static drawBackground(content: UIContainer | UIText, background: UIBackground, border = 6): [number, number] {
-    if (content.parentContainer === background.parent) {
-      background.adaptToContent(content);
-      return [background.width, background.height];
-    } else {
-      console.error("Cannot draw background with different parents", content, background);
-      return [0, 0];
-    }
-  }
 }

src/ui/options/OptionsDialog.ts

@@ -1,8 +1,13 @@
+import { Battle } from "../../core/Battle";
 import { BaseView } from "../BaseView";
-import { BattleView } from "../battle/BattleView";
+import { MultiBattle } from "../battle/MultiBattle";
 import { UIButton } from "../common/UIButton";
 import { UIDialog } from "../common/UIDialog";
 
+function hasMulti<T extends BaseView>(view: T): view is T & { multi: MultiBattle, actual_battle: Battle } {
+  return ((view as any).multi instanceof MultiBattle) && ((view as any).actual_battle instanceof Battle);
+}
+
 /**
  * Dialog to display game options
  */
@@ -114,7 +119,7 @@ Kevin MacLeod - Musics";
       let token = await conn.publish(this.view.session, "Multiplayer invitation");
       this.displayMultiplayerToken(token);
 
-      if (this.view instanceof BattleView) {
+      if (hasMulti(this.view)) {
         await this.view.multi.setup(this.view, this.view.actual_battle, token, true);
       } else {
         // TODO