Multimap support implemented, Dialog Actions Callbacks implemented

src/components/map/map.js

@@ -6,14 +6,16 @@ class Map extends Phaser.GameObjects.Container {
 
   constructor(scene, images, x, y, children) {
     super(scene, x, y, children);
+
     this.character = null;
     this._graph = null;
     this._character = null;
-    // this._currentCharLocation = null;
+    this._locationsFrontIndex = 300;
+    this._locationsBackIndex = 100;
     this._isCharacterMoving = false;
     this._walkingSpeed = 16;
 
-    this._setImages(images);
+    this._setMapTiles(images);
     this._initGraph();
   }
 
@@ -24,8 +26,14 @@ class Map extends Phaser.GameObjects.Container {
 
   add(child, isOverActor = true) {
     if (child instanceof Phaser.GameObjects.GameObject) {
-      let index = isOverActor ? -3 : -1;
-      this.addAt(child, index);
+      if (isOverActor) {
+        // Locations over actor index range: 300+
+        this.addAt(child, this._locationsFrontIndex++);
+      } else {
+        // Locations under actor index, range 100-199
+        if (this._locationsBackIndex > 199) throw "Only 99 under actor locations is supported";
+        this.addAt(child, this._locationsBackIndex++);
+      }
     }
     this._graph.addNode(child.name, child);
   }
@@ -37,13 +45,16 @@ class Map extends Phaser.GameObjects.Container {
     this._graph.addLink(from.name, to.name);
   }
 
-  _setImages(images) {
-    images.forEach(image => this.addAt(image, -4));
+  _setMapTiles(images) {
+    // Map images index 0-99
+    if (images.length > 99) throw "Only 99 map tiles is supported";
+    images.forEach((image, index) => this.addAt(image, index));
   }
 
   setActorSprite(sprite) {
+    // Actor index, 100-199
     this._character && this.remove(this._character)
-    this.addAt(sprite, -2);
+    this.addAt(sprite, 100);
     this._character = sprite;
   }
 
@@ -59,16 +70,11 @@ class Map extends Phaser.GameObjects.Container {
   }
 
   _enterNextScene(location) {
-    this._isCharacterMoving = false;
-    this._character.anims.stop('walk');
-
     let locationSceneId = location.nextScene;
-
-    // this.scene.cameras.main.pan(location.x, location.y, 2000, 'Sine.easeInOut');
-
-    this.scene.scene.pause(this.scene.key);
-    this.scene.scene.run(locationSceneId);
-
+    this._character.anims.stop('walk');
+    this._isCharacterMoving = false;
+    this.scene.scene.run(locationSceneId, { mapSceneId: this.scene.scene.key });
+    this.scene.scene.pause(this.scene.scene.key);
   }
 
   _onTravelStarted() {
@@ -106,15 +112,15 @@ class Map extends Phaser.GameObjects.Container {
   _walkTo(location) {
     if (this._isCharacterMoving) return;
 
-    let currentLocation = this.scene.registry.get('actor-map-location');
+    let currentLocation = this.scene.registry.get('actor-map-location'); // TODO: This should have different ID depend of map
 
     // Already there?
     if (location.name === currentLocation.name) { // TODO: check why a full object comparison doesnt work?
       this._enterNextScene(location);
     } else {
       this._isCharacterMoving = true;
       let path = this._pathFinder.find(currentLocation.name, location.name).reverse();
-      let tween = this.scene.tweens.timeline({
+      this.scene.tweens.timeline({
         targets: [this._character],
         onComplete: () => this._enterNextScene(location),
         onStart: () => this._onTravelStarted(),

src/components/scenes/fadeable-scene/fadeable-scene.js

@@ -15,21 +15,22 @@ class FadeableScene extends Phaser.Scene {
   }
 
   fadeInRun(sceneId, data, time = this._fadeTime) {
-    // TODO: embebed it inside others with flag parameter
     data = Object.assign(data || {}, { fadeInTime: time });
     this.scene.run(sceneId, data);
   }
 
-  fadeInStart(sceneId, data, time = this._fadeTime) {
+  fadeInStart(sceneId, data, auxOutScenes = [], time = this._fadeTime) {
     data = Object.assign(data || {}, { fadeInTime: time });
+    auxOutScenes.forEach(sceneId => this.scene.stop(sceneId));
     this.scene.start(sceneId, data);
   }
 
-  fadeOutInStart(sceneId, data, time = this._fadeTime) {
+  fadeOutInStart(sceneId, data, auxOutScenes = [], time = this._fadeTime) {
     data = Object.assign(data || {}, { fadeInTime: time });
     let camera = this.cameras.main;
     camera.fade(time, 0, 0, 0, true, (cam, progress) => {
       if (progress === 1) {
+        auxOutScenes.forEach(sceneId => this.scene.stop(sceneId));
         this.scene.start(sceneId, data);
       };
     });

src/components/scenes/lens-scene/lens-scene.js

@@ -5,11 +5,17 @@ class LensScene extends PausableScene {
 
   constructor(sceneId, pauseSceneId) {
     super(sceneId, pauseSceneId);
+    this._mapSceneId = null;
     this._xLens = null;
     this._yLens = null;
     this._radioLens = null;
   }
 
+  init(data) {
+    super.init(data);
+    this._mapSceneId = data.mapSceneId;
+  }
+
   create() {
     this.sound.add('zoom').play();
 
@@ -33,7 +39,7 @@ class LensScene extends PausableScene {
 
   _buildBackButton(x, y) {
     const button = new Button(this, 'LEAVE', x, y, () => {
-      this.scene.resume('nav-scene');
+      this.scene.resume(this._mapSceneId);
       this.scene.stop(this.scene.key)
     }).setDepth(9999);
     this.add.existing(button);

src/components/scenes/room/dialog-manager/action/action.js

@@ -16,11 +16,16 @@ class Action {
     return conditions.every(condition => registry.get(condition.flag) == condition.value);
   }
 
+  get callback() {
+    const scene = this._dialogManager.scene;
+    return scene[this._data.callback].bind(scene); // ??? was executed before with action context
+  }
+
   get next() {
     return this._data.next;
   }
 
-  executeSet() {
+  executeSetters() {
     let registry = this._dialogManager.registry;
     this._data.set.forEach(set => registry.set(set.flag, set.value));
   }

src/components/scenes/room/dialog-manager/dialog-manager.js

@@ -3,7 +3,7 @@ import { NarrationFactory } from './narration';
 
 class DialogManager {
 
-  constructor(data, registry) {
+  constructor(scene, data, registry) {
     // dev only
     registry.set('isRadioAnswered', 'false')
     // ---
@@ -12,6 +12,7 @@ class DialogManager {
     this._narration = null;
     this._registry = registry;
     this._data = this._build(data);
+    this._scene = scene;
 
     this._getActiveNarration(this._narrationIndex);
   }
@@ -28,9 +29,17 @@ class DialogManager {
   }
 
   executeAction(action) {
-    action.executeSet();
-    this._narrationIndex = action.next;
-    this._getActiveNarration(this._narrationIndex);
+    action.executeSetters();
+    action.callback && action.callback();
+
+    if (action.next) {
+      this._narrationIndex = action.next;
+      this._getActiveNarration(this._narrationIndex);
+    }
+  }
+
+  get scene() {
+    return this._scene;
   }
 
   get registry() {

src/components/scenes/room/room-scene.js

@@ -1,21 +1,19 @@
+import { PausableScene } from '../pausable-scene';
 import { DialogManager } from './dialog-manager';
 
-class RoomScene extends Phaser.Scene {
+class RoomScene extends PausableScene {
 
-  constructor(name, dialogData) {
-    super(name);
+  constructor(name, pauseSceneId, dialogData) {
+    super(name, pauseSceneId);
     this._dialogData = dialogData;
     this._dialogManager = null;
     this._textGroup = null;
 
   }
 
-  preload() {
-  }
-
   create() {
     this._dialogUIGroup = this.add.group();
-    this._dialogManager = new DialogManager(this._dialogData, this.registry);
+    this._dialogManager = new DialogManager(this, this._dialogData, this.registry);
 
     let narration = this._dialogManager.narration;
     this._buildDialogUI(narration);

src/components/ui/loot-panel/loot-panel.js

@@ -79,6 +79,7 @@ class Checkbox extends Phaser.GameObjects.Container {
   }
 
   _getDroppInPos(point, boxBounds, cellSize) {
+    // TODO: Use Phaser.Math.Snap ?
     for (var x = boxBounds.x + (cellSize / 2); x <= boxBounds.width + boxBounds.x; x += cellSize) {
       for (var y = boxBounds.y + (cellSize / 2); y <= boxBounds.height + boxBounds.y; y += cellSize) {
         if (Phaser.Math.Distance.Between(point.x, point.y, x + this.x, y + this.y) <= 50 && this._getItemInPosition(x, y) === undefined) {

src/main.js

@@ -2,26 +2,29 @@ import Phaser from 'phaser';
 import { AntennaScene } from './scenes/antenna-scene';
 import { IntroScene } from './scenes/intro-scene';
 import { LoaderScene } from './scenes/loader-scene';
-import ModuleScene from './scenes/module-scene/module-scene';
+import ModuleScene from './scenes/module-scene/module-scene'; // TODO: ???
 import { NavScene } from './scenes/nav-scene';
+import { NavUnderScene } from './scenes/nav-under-scene';
 import { PauseScene } from './scenes/pause-scene';
 import { StationScene } from './scenes/station-scene';
 
+
 let config = {
   type: Phaser.AUTO,
   width: 1280,
   height: 720,
   loader: {
     path: 'assets/'
   },
-  audio: {
-    disableWebAudio: true
-  },
+  // audio: {
+  //   disableWebAudio: true
+  // },
   scene: [
     LoaderScene,
     IntroScene,
     PauseScene,
     NavScene,
+    NavUnderScene,
 
     // Locations
     ModuleScene,

src/scenes/antenna-scene/antenna-scene.js

@@ -4,7 +4,11 @@ import antennaDialogues from './dialogues.json';
 class AntennaScene extends RoomScene {
 
   constructor() {
-    super('antenna-scene', antennaDialogues);
+    super('antenna-scene', 'pause-scene', antennaDialogues);
+  }
+
+  goUnderground() {
+    this.fadeOutInStart('nav-under-scene', {}, ['nav-scene']);
   }
 
 }

src/scenes/antenna-scene/dialogues.json

@@ -1,7 +1,7 @@
 {
   "0": [
     {
-      "display": "*radio interferences*\n\n- Captain Moore? Here earth station trying to stablish connection...",
+      "display": "*radio interferences*\n\nLook like after the explosion a small hole have been opened on the floor of the room,\na strong smell is coming from there...",
       "conditions": [
         {
           "flag": "isRadioAnswered",
@@ -21,15 +21,15 @@
           ]
         },
         {
-          "display": "Fill oxygen tank",
+          "display": "Enter in the hole",
           "conditions": [],
-          "next": "2",
+          "callback": "goUnderground",
           "set": []
         }
       ]
     },
     {
-      "display": "The antenna station is quiet, thats not normal, I think the radio just get broken...",
+      "display": "The antenna station is quiet, thats not normal, I think the radio just got broken...",
       "conditions": [
         {
           "flag": "isRadioAnswered",
@@ -53,12 +53,5 @@
         }
       ]
     }
-  ],
-  "2": [
-    {
-      "display": "The oxygen tanks are full now",
-      "conditions": [],
-      "actions": []
-    }
   ]
 }

src/scenes/intro-scene/intro-scene.js

@@ -15,15 +15,15 @@ class IntroScene extends FadeableScene {
     const yCenter = camera.height / 2;
 
     this._text = this.add.text(xCenter, yCenter, '"Man in Mars"', { fontSize: 25 }).setOrigin(0.5);
-    this._textHelp = this.add.text(xCenter, yCenter + 100, '[PRESS TO CONTINUE]', { fontSize: 12 }).setOrigin(0.5);
+    this._textHelp = this.add.text(xCenter, yCenter + 100, '(PRESS TO START YOUR JOURNEY)', { fontSize: 12 }).setOrigin(0.5);
 
 
     this.input.once('pointerdown', () => this._onContinueTriggered());
   };
 
   _onContinueTriggered() {
 
-    this.time.delayedCall(5000, () => {
+    this.time.delayedCall(1000, () => {
       this.fadeOutInStart('nav-scene');
     });
     this.sound.add('theme').play();

src/scenes/nav-scene/nav-scene.js

@@ -88,7 +88,7 @@ class NavScene extends PausableScene {
   };
 
   _calcScrollSpeed(axis, b) {
-    return Phaser.Math.Difference(axis, b) * 320;
+    return Phaser.Math.Difference(axis, b) * 240;
   }
 
   _updateScroll() {

src/scenes/nav-scene/pack.json

@@ -60,11 +60,6 @@
         "url": "terrain-09.png",
         "type": "image"
       },
-      {
-        "key": "terrain",
-        "url": "terrain.png",
-        "type": "image"
-      },
       {
         "key": "antenna",
         "url": "antenna.png",

src/scenes/nav-under-scene/index.js

@@ -0,0 +1,2 @@
+export { default as NavUnderScene } from './nav-under-scene';
+