Start working with animations

src/act1.js

@@ -2,8 +2,36 @@
     var act1 = {};
 
     var controlPanelSprite = kontra.sprite({x: 16, y: 13, width: 3, height: 2});
+    var doorSpriteSheet = null;
+    var doorAnimation = null;
 
     act1.init = function() {
+        doorSpriteSheet = kontra.spriteSheet({
+            image: kontra.assets.images['stasis_door-sheet'],
+            frameWidth: 23,
+            frameHeight: 20,
+            animations: {
+                closed: {
+                    frames: 0
+                },
+                opened: {
+                    frames: 2
+                },
+                open: {
+                    frames: '0..2',
+                    frameRate: 6
+                },
+                close: {
+                    frames: '2..0',
+                    frameRate: 6
+                }
+            }
+        });
+        doorAnimation = kontra.sprite({
+            x: 72, y: 8,
+            animations: doorSpriteSheet.animations
+        });
+
         if (muri.currentRoom === 'stasis_dark') {
             muri.get('bubble')
                 .story([
@@ -15,6 +43,14 @@
     };
 
     act1.update = function() {
+        if (muri.currentRoom === 'stasis') {
+            doorAnimation.closed.update();
+            if (muri.get('mouse').clickedOn(doorAnimation)) {
+                muri.get('mouse').releaseClick();
+                doorAnimation.playAnimation('open');
+            }
+        }
+
         if (muri.get('mouse').clickedOn(controlPanelSprite)) {
             muri.get('mouse').releaseClick();
 
@@ -33,6 +69,9 @@
     };
 
     act1.render = function() {
+        if (muri.currentRoom === 'stasis') {
+            doorAnimation.closed.render();
+        }
     };
 
     muri.modules.push(act1);

src/mouse.js

@@ -16,6 +16,8 @@
             mouseSprite.x = Math.floor(evt.offsetX/8);
             mouseSprite.y = Math.floor(evt.offsetY/8);
         }
+        // DEBUGGING PURPOSE
+        console.log(mouseSprite.x, mouseSprite.y);
     };
     canvas.addEventListener('click', clickEvent);
 

src/muri.js

@@ -51,7 +51,7 @@ var muri = (function() {
             image: kontra.assets.images['room_'+room]
         });
     };
-    muri.currentRoom = 'stasis_dark';
+    muri.currentRoom = 'stasis';
     muri.modules = [];
     muri.get = function(moduleName) {
         for (var i in muri.modules)
@@ -62,7 +62,8 @@ var muri = (function() {
     muri.setup = function() {
         kontra.assets.load(
             'room_stasis_dark.gif',
-            'room_stasis.gif'
+            'room_stasis.gif',
+            'stasis_door-sheet.png'
         ).then(function() {
             document.getElementById('loading').style.display = 'none';
             var rooms = {