Ainias/wordRotator
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Musikbuttons hinzugefügt

Browse Source
This commit is contained in:
silas
2018-09-26 14:01:33 +02:00
parent be130a99e8
commit c13dfc378f
16 changed files with 1229 additions and 527 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
src/module/Application/pwa/html/application/menu.html
View File

@@ -16,87 +16,24 @@
<div class='height-60 max-width flex-center'>
<div id = 'level'></div>
<!--<div id='level'>-->
<!--<div class="segment segment-parent layer-2 rotate-360">-->
<!--<div class="child-container">-->
<!--<div class="segment segment-parent rotate-360">-->
<!--<div class="child-container">-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">W</div>-->
<!--</div>-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">O</div>-->
<!--</div>-->
<!--<br>-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">O</div>-->
<!--</div>-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">&nbsp;</div>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--<div class="segment segment-parent rotate-360">-->
<!--<div class="child-container">-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">R</div>-->
<!--</div>-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">D</div>-->
<!--</div>-->
<!--<br>-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">&nbsp;</div>-->
<!--</div>-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">R</div>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--<br>-->
<!--<div class="segment segment-parent rotate-360">-->
<!--<div class="child-container">-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">R</div>-->
<!--</div>-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">&nbsp;</div>-->
<!--</div>-->
<!--<br>-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">D</div>-->
<!--</div>-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">R</div>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--<div class="segment segment-parent rotate-360">-->
<!--<div class="child-container">-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">&nbsp;</div>-->
<!--</div>-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">O</div>-->
<!--</div>-->
<!--<br>-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">O</div>-->
<!--</div>-->
<!--<div class="segment segment-leaf">-->
<!--<div class="leaf-element">W</div>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<span id='level-number-container' class = 'visible in-main-menu'>
<span id='level-number'>1</span>
</span>
</div>
<div class='height-20 max-width flex-center'>
<button class='button max-height text-center' id='play-button'><span data-translation="play"></span></button>
<div class='height-30 flex-center fill-me'>
<button class='button grow text-center' id='play-button'><span data-translation="play"></span></button>
<div class = 'max-width'>
<label class="switch">
<img src = 'img/speaker.svg'>
<input type="checkbox" class = "setting" id = "play-sound">
<span class="slider"></span>
</label>
<label class="switch right">
<img src = 'img/music.svg'>
<input type="checkbox" class = "setting" id = "play-music">
<span class="slider"></span>
</label>
</div>
</div>
</div>

5
src/module/Application/pwa/js/site/LevelSite.js
View File

@@ -5,6 +5,7 @@ import {WordRotatorDb} from "../WordRotatorDb";
import {ScaleHelper, SoundManager} from "../../../../../js/lib/pwa-assets";
import {EndSite} from "./EndSite";
import {WordRotatorBaseSite} from "./WordRotatorBaseSite";
import {SettingsManager} from "../../../../../js/lib/pwa-core";
export class LevelSite extends WordRotatorBaseSite {
constructor(siteManager) {
@@ -33,8 +34,10 @@ export class LevelSite extends WordRotatorBaseSite {
coinCounterTimer: null,
};
let settingsManager = SettingsManager.getInstance();
let soundManager = SoundManager.getInstance();
soundManager.set("sound/single_coin_fall_on_concrete_.mp3", SoundManager.CHANNELS.SOUND);
soundManager.set({audio: "sound/single_coin_fall_on_concrete_.mp3", muted: !settingsManager.getSetting("play-sound")}, SoundManager.CHANNELS.SOUND);
return super.onConstruct(args);
}

26
src/module/Application/pwa/js/site/MenuSite.js
View File

@@ -1,9 +1,10 @@
import {WordRotatorBaseSite} from "./WordRotatorBaseSite";
import {LevelSite} from "./LevelSite";
import {ScaleHelper} from "../../../../../js/lib/pwa-assets";
import {ScaleHelper, SoundManager} from "../../../../../js/lib/pwa-assets";
import {TemplateContainer} from "../wordrotator/Segment/TemplateContainer";
import {MainMenuLevel} from "../wordrotator/Level/MainMenuLevel";
import {Helper, InitPromise} from "../../../../../js/lib/pwa-lib";
import {SettingsManager} from "../../../../../js/lib/pwa-core";
export class MenuSite extends WordRotatorBaseSite {
constructor(siteManager) {
@@ -115,6 +116,29 @@ export class MenuSite extends WordRotatorBaseSite {
}
});
}
let settingsManager = SettingsManager.getInstance();
let soundManager = SoundManager.getInstance();
let playMusicButton = this.findBy("#play-music");
playMusicButton.checked = settingsManager.getSetting("play-music", true);
playMusicButton.addEventListener("change", () => {
settingsManager.setSetting("play-music", playMusicButton.checked);
soundManager.set({muted: !playMusicButton.checked}, SoundManager.CHANNELS.MUSIC);
if (playMusicButton.checked){
soundManager.play(SoundManager.CHANNELS.MUSIC);
}
});
let playSoundButton = this.findBy("#play-sound");
playSoundButton.checked = settingsManager.getSetting("play-sound", true);
playSoundButton.addEventListener("change", () => {
settingsManager.setSetting("play-sound", playSoundButton.checked);
soundManager.set({muted: !playSoundButton.checked}, SoundManager.CHANNELS.SOUND);
// if (playSoundButton.checked){
// soundManager.play(SoundManager.CHANNELS.MUSIC);
// }
});
}
onPause(args) {