From 1412d7dc7869bbe604d79601ffdd8e08564be0c7 Mon Sep 17 00:00:00 2001 From: Aaron Fischer Date: Tue, 15 Aug 2017 17:04:39 +0200 Subject: [PATCH] Try to add a avatar .... not sure if this is possible --- src/assets/images/player.png | Bin 0 -> 214 bytes src/main.js | 7 +++-- src/muri.js | 51 +++++++++++++++++++++++------------ 3 files changed, 39 insertions(+), 19 deletions(-) create mode 100644 src/assets/images/player.png diff --git a/src/assets/images/player.png b/src/assets/images/player.png new file mode 100644 index 0000000000000000000000000000000000000000..591983ec19789a9568a5dd787fee30593f97eec9 GIT binary patch literal 214 zcmeAS@N?(olHy`uVBq!ia0vp^tRT$61|)m))t&+=&H|6fVg?3oVGw3ym^DWND9B#o z>Fdh=kb|F}+4{xOBd35uvY8S|xv6<2KrRD=b5UwyNotBhd1gt5g1e`0K#E=} zJ5b!m)5S4_hyV7Vl|ZIdcwjzZ9{F+LSuewJ?3= zL=J)YZ1+3K1&lU(KfmL3D0DYsKj+kNA|!O?)=$h90b;AqDJG|YEcA5sb6Mw<&;$S> CbU(lV literal 0 HcmV?d00001 diff --git a/src/main.js b/src/main.js index 244c78e..59fcde4 100644 --- a/src/main.js +++ b/src/main.js @@ -50,14 +50,15 @@ kontra.assets.load( 'room_stasis_dark.png', - 'room_stasis.png' + 'room_stasis.png', + 'player.png' ).then(function() { document.getElementById('loading').style.display = 'none'; if (kontra.store.get('current-room') === null) kontra.store.set('current-room', 'stasis_dark'); - muri.talk([ + muri.bubble.talk([ 'Uh ...', 'Where I am? ...', 'It is so dark in here, I can\'t even see my bare hands. I can\'t remember a thing and my brain hurts so bad. What happened here?' @@ -76,9 +77,11 @@ render: function() { var currentRoom = kontra.store.get('current-room'); rooms[currentRoom].render(); + muri.bubble.render(); } }); + muri.init(); loop.start(); }); })(); diff --git a/src/muri.js b/src/muri.js index 65e463b..cea7f2a 100644 --- a/src/muri.js +++ b/src/muri.js @@ -1,22 +1,39 @@ var muri = { - bubble: function(text, position=[2, 7], delay=3, callback=false) { - var bubble = document.getElementById('bubble'); - bubble.style.display = ''; - bubble.style.left = position[0]*8; - bubble.style.top = position[1]*8; - bubble.innerHTML = text; - setTimeout(function() { - bubble.style.display = 'none'; - if (callback !== false) callback.call(); - }, delay*1000); + init: function() { + muri.bubble.playerSprite = kontra.sprite({x: 0, y: 0, image: kontra.assets.images.player }) }, - talk: function(texts, position) { - if (texts.length === 0) return; - var text = texts.shift(); - var delay = Math.ceil(text.length/13); - this.bubble(text, position, delay, function() { - muri.talk(texts, position); - }); + bubble: { + isActive: false, + playerSprite: false, + + show: function(text, position=[2, 7], delay=3, callback=false) { + muri.bubble.isActive = true; + var bubble = document.getElementById('bubble'); + bubble.style.display = ''; + bubble.style.left = position[0]*8; + bubble.style.top = position[1]*8; + bubble.innerHTML = text; + setTimeout(function() { + muri.bubble.isActive = false; + bubble.style.display = 'none'; + if (callback !== false) callback.call(); + }, delay*1000); + }, + + talk: function(texts, position) { + if (texts.length === 0) return; + var text = texts.shift(); + var delay = Math.ceil(text.length/13); + muri.bubble.show(text, position, delay, function() { + muri.bubble.talk(texts, position); + }); + }, + + render: function() { + if (muri.bubble.isActive) { + muri.bubble.playerSprite.render(); + } + } } };