25 24 fix audio

.gitignore

@@ -8,3 +8,4 @@ node_modules
 app/TODO
 /app/renderer.js
 /app/main.js
+.vscode/tasks.json

src/renderer/components/menu_pause.ts

@@ -35,8 +35,8 @@ export default class ComponentPauseMenu {
 
     // create a controller with this menu given as a reference, push 2 methods of the menu
     return this.cursor.create(this, -70, -16, [
-      this.continue,
-      this.cancel
+      this.continue.bind(this),
+      this.cancel.bind(this)
     ]);
   }
 

src/renderer/index.ts

@@ -20,7 +20,7 @@ const stateClasses = [
   PuzzleMenuState
 ];
 
-ui()
+ui()  
 
 // Create instance of each known state class and register them to the game
 // instance.

src/renderer/states/mode_puzzle.ts

@@ -26,6 +26,7 @@ export default class ModePuzzle extends CoreStage {
   private level_index  : number
   private steps_left   : number
   private bg           : Phaser.Sprite
+
   constructor() {
     super()
     this.playfield0    = new ComponentPlayfield(0)
@@ -48,6 +49,7 @@ export default class ModePuzzle extends CoreStage {
    */
   create() {
     this.bg = game.add.sprite(0, 0, "mode_puzzle_bg")
+    this.bg.anchor.setTo(0.5, 0);
 
     this.tick   = -1
     this.seed   = 'puzzle'
@@ -138,6 +140,7 @@ export default class ModePuzzle extends CoreStage {
 
   /** calls the render functions of the timer and playfield0 */
   render() {
+    this.bg.x = game.world.centerX;
     this.timer.render();
     this.step_display.render();
 

src/renderer/ui/audio.js → src/renderer/ui/audio.ts

@@ -1,19 +1,21 @@
+import game from 'core/game'
 import Ui from 'ui/mode'
-import m  from 'mithril'
+import * as m  from 'mithril'
 
-let audio_sfx_volume = 100
-let audio_msx_volume = 100
-let muted            = false
+let audio_sfx_volume : number = 100
+let audio_msx_volume : number = 100
+let muted : boolean = false
 
-function render(){
+export default function render() { 
   return m('form',[
     m('.check_box.sfx',[
       m("input[type='range']",{
         min:"0",
         max:"100",
         value: audio_sfx_volume,
         oninput: function(e){
-         audio_sfx_volume = e.target.value
+          audio_sfx_volume = e.target.value
+          game.sounds.set_sfx_volume(audio_sfx_volume * 0.01)
         }
       }),
       m('.val',[
@@ -27,7 +29,8 @@ function render(){
         max:"100",
         value: audio_msx_volume,
         oninput: function(e){
-         audio_msx_volume = e.target.value
+          audio_msx_volume = e.target.value
+          game.sounds.set_msx_volume(audio_msx_volume * 0.01)
         }
       }),
       m('.val',[
@@ -46,8 +49,6 @@ function render(){
       }),
       m('.val', ['Mute all Audio'])
     ])
-
   ])
 }
 
-export default render

src/renderer/ui/input.js → src/renderer/ui/input.ts

@@ -1,15 +1,19 @@
 import Ui from 'ui/mode'
-import m from 'mithril'
-import electron from 'electron'
+import * as m from 'mithril'
+import * as electron from 'electron'
 import Store   from 'common/store'
-import keycode from 'keycode'
+import * as keycode from 'keycode'
 
 const store = new Store()
 
 const {ipcRenderer: ipc} = electron
 let setting = null
 let inputs  = store.get('inputs')
 
+declare var window: {
+  document: any,
+  navigator: any,
+}
 
 function setkey(key){
   return(function(){
@@ -83,13 +87,13 @@ function storekey(v){
   m.redraw()
 }
 
-document.onclick = function (e) {
+window.document.onclick = function (e) {
   if (setting != null && e.target.className != 'input setting') {
     setting = null
   }
 }
 
-document.onkeydown = function (e) {
+window.document.onkeydown = function (e) {
   if (e.keyCode === 70) { //f (for fullscreen)
     ipc.send('fullscreen')
   } else if (e.keyCode === 27) { //esc
@@ -108,7 +112,7 @@ document.onkeydown = function (e) {
 
 function poll_gamepad(){
   if (setting === null){ return }
-  const gg = navigator.getGamepads()
+  const gg = window.navigator.getGamepads()
   if (gg[0] === null &&
       gg[1] === null &&
       gg[2] === null &&

src/renderer/ui/main.js → src/renderer/ui/main.ts

@@ -1,13 +1,16 @@
-import m          from 'mithril'
+import * as m          from 'mithril'
 import Ui         from 'ui/mode'
 import UiInput    from 'ui/input'
 import UiNetwork  from 'ui/network'
 import UiAudio    from 'ui/audio'
 import UiReplay   from 'ui/replay'
-import electron   from 'electron'
+import * as electron from 'electron'
 
 const {ipcRenderer: ipc} = electron
 
+declare var window: {
+  document: any
+}
 
 function class_tab(new_mode){
   if (Ui.mode === new_mode){
@@ -35,7 +38,7 @@ function nav(){
 function content(){
   if      (Ui.mode === 'input')  { return m('.content.settings_input'  ,UiInput()   )}
   else if (Ui.mode === 'network'){ return m('.content.settings_network',UiNetwork() )}
-  else if (Ui.mode === 'audio')  { return m('.content.settings_audio'  ,UiAudio()   )}
+  else if (Ui.mode === 'audio')  { return m('.content.settings_audio'  ,UiAudio())}
   else if (Ui.mode === 'replay') { return m('.content.settings_replay' ,UiReplay()  )}
 }
 
@@ -51,13 +54,13 @@ function render(){
     }
   }}
 
-  const el = document.getElementById('ui')
+  const el = window.document.getElementById('ui')
   m.mount(el, app)
 }
 
 ipc.on('reload',function(event,data){
   Ui.mode = data.mode
-  document.getElementById('game').classList.add('hide')
+  window.document.getElementById('game').classList.add('hide')
   m.redraw()
 })
 

src/renderer/ui/network.js → src/renderer/ui/network.ts

@@ -1,11 +1,11 @@
-import m        from 'mithril'
+import * as m   from 'mithril'
 import Ui       from 'ui/mode'
 import Store    from 'common/store'
-import electron from 'electron'
+import * as electron from 'electron'
 
 const store = new Store()
 
-const {ipcRenderer: ipc} = electron
+import {ipcRenderer as ipc} from 'electron'
 
 let inputs  = store.get('network.host_port')
 let host_port = {value: store.get('network.host_port'), setValue: function(v) {host_port.value = v}}

src/renderer/ui/replay.js → src/renderer/ui/replay.ts

@@ -1,9 +1,9 @@
-import m        from 'mithril';
+import * as m   from 'mithril'
 import Ui       from 'ui/mode'
 import Store    from 'common/store'
-import electron from 'electron'
+import * as electron from 'electron'
 
-const {ipcRenderer: ipc} = electron
+import {ipcRenderer as ipc} from 'electron'
 const store = new Store()
 
 let replay_files = []
@@ -24,9 +24,6 @@ function click_reveal_replay_dir(){
 function click_change_replay_dir(){
   ipc.send('replay-dir-change')
 }
-function click_change_replay_dir(){
-  ipc.send('replay-dir-change')
-}
 function click_reset_replay_dir(){
   ipc.send('replay-dir-reset')
 }
@@ -38,7 +35,7 @@ function click_replay_play(file){
 }
 function click_replay_remove(file){
   return function(){
-    i = replay_files.indexOf(file)
+    let i = replay_files.indexOf(file)
     replay_files.splice(i, 1)
     ipc.send('replay-delete',file)
   }