Start with the first act

src/act1.js

@@ -1,7 +1,13 @@
 (function() {
     var act1 = {};
 
-    muri.get('bubble').talk(['Hi', 'I Think, this works ...', 'This looks kinda cool. I think , I can work with that to build a nice little adventure game with some clicky things.', 'Just need to find out a way to click on things.']);
+    muri.get('bubble')
+        .story([
+            [['Beep ...', 'Click, Click, Click ...'], [20, 15]],
+            [['Urgh ... ....', 'What is wrong with me? ...'], [5, 40]]
+        ]).then(function() {
+            console.log("asdf");
+        })
 
     act1.update = function() {
     };

src/bubble.js

@@ -2,7 +2,8 @@
     var bubble = {};
 
     var isactive = false;
-    var show = function(text, position, callback) {
+    var show = function(text, position) {
+        return new Promise(function(resolve) {
             isactive = true;
 
             var dom = document.getElementById('bubble');
@@ -17,7 +18,7 @@
                     setTimeout(function() {
                         isactive = false;
                         dom.style.display = 'none';
-                    callback.call();
+                        return resolve();
                     }, 4000);
                     return;
                 }
@@ -25,17 +26,31 @@
                 setTimeout(show, 150);
             };
             show();
+        });
     };
     
-    bubble.talk = function(texts, position, callback) {
+    bubble.talk = function(texts, position) {
+        return new Promise(function(resolve) {
             if (texts.length === 0) {
-            if (callback !== undefined) callback.call();
+                return resolve();
-            return;
             }
             var text = texts.shift();
-        show(text, position || [5, 40], function() {
+            show(text, position || [5, 40]).then(function() {
                 bubble.talk(texts, position);
             });
+        });
+    };
+
+    bubble.story = function(talkList) {
+        return new Promise(function(resolve, reject) {
+            if (talkList.length === 0) {
+                return resolve();
+            }
+            var params = talkList.shift();
+            bubble.talk(params[0], params[1]).then(function() {
+                bubble.story(talkList);
+            });
+        });
     };
 
     bubble.name = 'bubble';

src/index_dev.html

@@ -10,6 +10,7 @@
   </div>
 </div>
 <p id="loading">loading game ...</p>
+<button id="newGame">New Game</button>
 
 <script src="vendor/kontra.js"></script>
 <script src="muri.js"></script>

src/muri.js

@@ -58,16 +58,19 @@ var muri = (function() {
                 return muri.modules[i];
     };
 
-    muri.start = function() {
+    muri.newGame = function() {
+        kontra.store.set('current-room', 'stasis_dark');
+    };
+
+    muri.setup = function() {
         kontra.assets.load(
             'player.png',
-            'room_stasis_dark.png',
+            'room_stasis_dark.gif',
-            'room_stasis.png'
+            'room_stasis.gif'
         ).then(function() {
             document.getElementById('loading').style.display = 'none';
             if (kontra.store.get('current-room') === null)
-                kontra.store.set('current-room', 'stasis_dark');
+                kontra.store.set('current-room', 'stasis');
-
             var rooms = {
                 stasis_dark: bg('stasis_dark'),
                 stasis: bg('stasis')
@@ -95,4 +98,5 @@ var muri = (function() {
     return muri;
 }());
 
-window.onload = muri.start;
+document.getElementById('newGame').addEventListener('click', muri.newGame);
+window.onload = muri.setup;