Merge branch 'master' into chrome

index.coffee

@@ -7,7 +7,12 @@ settings = require './settings.json!'
 utils = require './utils'
 
 draghint = document.getElementById 'draghint'
-chooser = document.getElementById 'chooser'
+
+if location.search? and location.search.substr(1)
+  window.url = location.search.substr(1)
+  if window.url.startsWith 'http'
+    window.url = settings.urlPrefix + window.url
+  [..., window.filename] = location.search.substr(1).split('/')
 
 service = analytics.getService 'GPemu'
 service.getConfig().addCallback (config) ->
@@ -44,17 +49,22 @@ stop = ->
   window.removeEventListener 'keydown', onkey
   window.clearInterval autosaver
 
+gain = null
+
 play = (rom, extension) ->
   Promise.resolve()
   .then ->
     throw new Error 'no rom!' if not rom
     retro.md5 = sparkmd5.ArrayBuffer.hash rom
+    retro.name = settings.extensions[extension]
     Promise.all([
       System.import settings.extensions[extension]
       localForage.getItem retro.md5
     ]).then ([core, save]) ->
       tracker.sendAppView 'play' if tracker?
       stop() if retro.running
+      document.getElementById('core-name').textContent = settings.extensions[extension]
+      document.getElementById('system-info').textContent = JSON.stringify core.get_system_info(), null, '  '
       retro.core = core
       core.load_game rom if rom
       core.unserialize new Uint8Array save if save?
@@ -64,6 +74,7 @@ play = (rom, extension) ->
       retro.player.inputs = [
         buttons: {}
       ]
+      document.getElementById('av-info').textContent = JSON.stringify retro.player.av_info, null, '  '
       autosaver = setInterval ->
         localForage.setItem retro.md5, new Uint8Array core.serialize()
       , 1000
@@ -118,14 +129,69 @@ window.addEventListener 'dragleave', (event) ->
   draghint.classList.remove 'hover'
   false
 
-window.addEventListener 'click', (event) ->
-  if not draghint.classList.contains 'hidden'
-    draghint.classList.add 'hover'
-    chooser.click()
-
-window.addEventListener 'focus', () ->
+window.addEventListener 'focus', ->
   draghint.classList.remove 'hover'
 
+menu = document.getElementById 'menu'
+window.addEventListener 'contextmenu', (event) ->
+  if draghint.classList.contains 'hidden'
+    if retro.classList.contains 'hidden'
+      retro.start()
+    else
+      retro.stop()
+    retro.classList.toggle 'hidden'
+    menu.classList.toggle 'hidden'
+    event.preventDefault()
+
+window.resume = ->
+  retro.classList.remove 'hidden'
+  menu.classList.add 'hidden'
+  retro.start()
+
+window.reset = ->
+  retro.stop()
+  retro.core.reset()
+  window.resume()
+
+window.mute = ->
+  if retro.player.destination.gain.value == 0
+    retro.player.destination.gain.value = 1
+    document.getElementById('mute').textContent = 'mute'
+  else
+    retro.player.destination.gain.value = 0
+    document.getElementById('mute').textContent = 'unmute'
+  window.resume()
+
+window.save = ->
+  a = document.createElement 'a'
+  document.body.appendChild a
+  a.classList.add 'hidden'
+  blob = new Blob [new Uint8Array retro.core.serialize()],
+    type: 'application/octet-binary'
+  url = URL.createObjectURL blob
+  a.href = url
+  a.download = retro.md5 + '.' + retro.name + '.sav'
+  a.click()
+  URL.revokeObjectURL url
+
+savechooser = document.getElementById 'savechooser'
+savechooser.addEventListener 'change', ->
+  file = this.files[0]
+  return if not file instanceof Blob
+  draghint.classList.add 'hidden'
+  reader = new FileReader()
+  reader.addEventListener 'load', (event) ->
+    retro.core.unserialize new Uint8Array reader.result
+    window.resume()
+  reader.readAsArrayBuffer file
+window.load = ->
+  savechooser.click()
+
+chooser = document.getElementById 'chooser'
 chooser.addEventListener 'change', ->
   draghint.classList.remove 'hover'
   load this.files[0]
+window.addEventListener 'click', (event) ->
+  if not draghint.classList.contains 'hidden'
+    draghint.classList.add 'hover'
+    chooser.click()

index.css

@@ -3,12 +3,10 @@ html, body, canvas {
   padding: 0;
   width: 100%;
   height: 100%;
-  overflow: hidden;
   -webkit-user-select: none;
   -ms-user-select: none;
   -moz-user-select: none;
   user-select: none;
-  background-color: black;
 }
 .draghint {
   display: table;
@@ -27,13 +25,19 @@ html, body, canvas {
   color: #999;
   font-family: 'Lora', serif;
 }
+.menu {
+  width: 50%;
+  margin: 0 auto;
+  -webkit-user-select: all;
+  user-select: all;
+}
 .hidden {
   display: none;
 }
 .hover {
   border-color: #333;
 }
-#chooser {
+.chooser {
   position: fixed;
   top: -1000px;
 }

index.html

@@ -8,11 +8,38 @@
 </head>
 <body>
   <div class="draghint hidden" id="draghint">
-    <input type="file" id="chooser"/>
+    <input type="file" id="chooser" class="chooser"/>
     <div class="dragtext">
       <h1>drag a game here to play</h1>
     </div>
   </div>
+  <div class="menu hidden" id="menu">
+    <input type="file" id="savechooser" class="chooser"/>
+    <div class="options">
+      <h1>Your game is paused.</h1>
+      <button class="resume" onclick="resume()">resume</button>
+      <button class="<re></re>set" onclick="reset()">reset</button>
+      <button class="save" onclick="save()">save game</button>
+      <button class="load" onclick="load()">load save</button>
+      <button id="mute" onclick="mute()">mute</button>
+    </div>
+    <div>
+      <h1>Controls:</h1>
+      <div>A button = A key</div>
+      <div>B button = B key</div>
+      <div>X button = X key</div>
+      <div>Y button = Y key</div>
+      <div>L button = L key</div>
+      <div>R button = R key</div>
+      <div>D-pad = arrow keys</div>
+    </div>
+    <div>
+      <h1>Core Info:</h1>
+      <pre id="core-name"></pre>
+      <pre id="system-info"></pre>
+      <pre id="av-info"></pre>
+    </div>
+  </div>
   <script src="google-analytics-bundle.js"></script>
   <script src="jspm_packages/github/jmcriffey/[email protected]/traceur-runtime.min.js"></script>
   <script src="jspm_packages/system-csp-production.js"></script>

settings.json

@@ -115,5 +115,6 @@
     "220": "8",
     "221": "6",
     "222": "7"
-  }
+  },
+  "urlPrefix": "https://crossorigin.me/"
 }