Up-in-the-Air – commitdiff

You can use Git to clone the repository via the web URL. Download snapshot (zip)
Introduce plumbing for audio themes
authorJulian Fietkau <git@fietkau.software>
Thu, 26 Sep 2024 02:38:20 +0000 (04:38 +0200)
committerJulian Fietkau <git@fietkau.software>
Thu, 26 Sep 2024 02:38:20 +0000 (04:38 +0200)
audio/music-classical.ogg [moved from audio/music.ogg with 100% similarity]
audio/sound1-classical.ogg [moved from audio/sound1.ogg with 100% similarity]
audio/sound2-classical.ogg [moved from audio/sound2.ogg with 100% similarity]
audio/sound3-classical.ogg [moved from audio/sound3.ogg with 100% similarity]
audio/sound4-classical.ogg [moved from audio/sound4.ogg with 100% similarity]
audio/sound5-classical.ogg [moved from audio/sound5.ogg with 100% similarity]
index.html
main.js

similarity index 100%
rename from audio/music.ogg
rename to audio/music-classical.ogg
similarity index 100%
rename from audio/sound1.ogg
rename to audio/sound1-classical.ogg
similarity index 100%
rename from audio/sound2.ogg
rename to audio/sound2-classical.ogg
similarity index 100%
rename from audio/sound3.ogg
rename to audio/sound3-classical.ogg
similarity index 100%
rename from audio/sound4.ogg
rename to audio/sound4-classical.ogg
similarity index 100%
rename from audio/sound5.ogg
rename to audio/sound5-classical.ogg
index 3d811f3daeb59de4109c9246cbf8ecd1816fcb90..eeea22eaa1ee717ba458825c33fe12fe0df68da2 100644 (file)
   .ui-page.options .controls p:last-child span:not(:first-child) {
     display: none;
   }
-  .ui-page.options .graphics *:not(.audio) label {
+  .ui-page.options .graphics *:not(.audio) label, .ui-page.options .audiotheme:not(.audio) label {
     display: inline;
     margin-left: 1ex;
   }
+  .game-upintheair.font-opendyslexic .ui-page.options .graphics *:not(.audio) label,
+  .game-upintheair.font-opendyslexic .ui-page.options .audiotheme:not(.audio) label {
+    margin-left: 0;
+  }
+  .game-upintheair.font-opendyslexic .ui-page.options .audiotheme:not(.audio) label {
+    margin-right: 1em;
+  }
   .ui-page.options p.annotation {
     margin-left: 1.6em;
   }
 <span>50</span>
 <button class="sounds">Test</button>
 </div>
+<div class="audiotheme">
+<template><label><input type="radio" name="upInTheAirGame-audiotheme" value="default"> Default</label></template>
+<span>Audio theme:</span>
+</div>
 </div>
 
 <div class="column">
diff --git a/main.js b/main.js
index 2678c366180c281fa353575afd63f763e3135ddb..0ebb237f507681ec158adbac9bf273b6267fb09c 100644 (file)
--- a/main.js
+++ b/main.js
@@ -25,7 +25,7 @@ function playRandomSound(game) {
     game.view.lastSoundsCache.splice(0, 1);
   }
   let sound = new THREE.Audio(game.view.audioListener);
-  sound.setBuffer(game.assets['audio']['sound' + index]);
+  sound.setBuffer(game.assets['audio']['sound' + index + '-' + game.settings['audio']['theme']]);
   sound.setVolume(game.settings['audio']['sounds']);
   sound.play();
 }
@@ -46,12 +46,6 @@ function loadAllAssets(game, renderProgressCallback) {
   ];
   return new Promise((resolve, reject) => {
     let todoList = {
-      'audio/music.ogg': 1636930,
-      'audio/sound1.ogg': 34002,
-      'audio/sound2.ogg': 34629,
-      'audio/sound3.ogg': 25399,
-      'audio/sound4.ogg': 16426,
-      'audio/sound5.ogg': 26122,
       'fonts/cookie.json': 37866,
       'textures/cloud0a.png': 568,
       'textures/cloud0b.png': 569,
@@ -97,6 +91,19 @@ function loadAllAssets(game, renderProgressCallback) {
         }
       }
     }
+    game.assets.audiothemes = [];
+    const audioThemes = {
+      'classical': [1636930, 34002, 34629, 25399, 16426, 26122],
+    }
+    for(let theme of Object.keys(audioThemes)) {
+      todoList['audio/music-' + theme + '.ogg'] = audioThemes[theme][0];
+      todoList['audio/sound1-' + theme + '.ogg'] = audioThemes[theme][1];
+      todoList['audio/sound2-' + theme + '.ogg'] = audioThemes[theme][2];
+      todoList['audio/sound3-' + theme + '.ogg'] = audioThemes[theme][3];
+      todoList['audio/sound4-' + theme + '.ogg'] = audioThemes[theme][4];
+      todoList['audio/sound5-' + theme + '.ogg'] = audioThemes[theme][5];
+      game.assets.audiothemes.push(theme);
+    }
     let total = Object.keys(todoList).map(k => todoList[k]).reduce((a, b) => a + b, 0);
     let progress = {};
     const loader = {
@@ -575,7 +582,7 @@ function animate(game, renderer, scene) {
 
   if(game.settings['audio']['music'] > 0.0 && game.view.music && !game.view.music.isPlaying) {
     const remainingRealTime = (game.timeTotal - game.timeProgress) / (game.settings['difficulty']['speed'] / 100);
-    if(remainingRealTime >= game.assets.audio.music.duration - 2) {
+    if(remainingRealTime >= game.assets['audio']['music-' + game.settings['audio']['theme']].duration - 2) {
       game.view.music.offset = 0;
       game.view.music.play();
     }
@@ -752,6 +759,7 @@ function loadSettings(game) {
     'audio': {
       'music': 0.5,
       'sounds': 0.5,
+      'theme': 'classical',
     },
     'feather': 'blue',
     'unlocks': [],
@@ -795,6 +803,10 @@ function loadSettings(game) {
       elem.parentNode.nextElementSibling.innerText = newValue;
     });
   }
+  let audioThemeRadio = ui.querySelector('.audiotheme input[value="' + settings['audio']['theme'] + '"]');
+  if(audioThemeRadio) {
+    audioThemeRadio.checked = true;
+  }
   for(let unlockedFeather of settings['unlocks']) {
     let label = document.createElement('label');
     let radio = document.createElement('input');
@@ -846,6 +858,10 @@ function applySettings(game) {
   for(let audioCategory of ['music', 'sounds']) {
     game.settings['audio'][audioCategory] = parseInt(ui.querySelector('.audio input[type=range].' + audioCategory).value, 10) / 100;
   }
+  let audioThemeRadio = ui.querySelector('.audiotheme input[name="upInTheAirGame-audiotheme"]:checked');
+  if(audioThemeRadio) {
+    game.settings['audio']['theme'] = audioThemeRadio.value;
+  }
   game.settings['feather'] = ui.querySelector('input[name="upInTheAirGame-feather"]:checked').value;
   game.settings['highcontrast'] = ui.querySelector('input[value="highcontrast"]').checked;
   game.settings['font'] = ui.querySelector('input[name="upInTheAirGame-font"]:checked').value;
@@ -1171,7 +1187,7 @@ game.ui.root.querySelectorAll('button.goto').forEach((btn) => {
       game.view.audioListener = new THREE.AudioListener();
       game.view.camera.add(game.view.audioListener);
       game.view.music = new THREE.Audio(game.view.audioListener);
-      game.view.music.setBuffer(game.assets.audio.music);
+      game.view.music.setBuffer(game.assets['audio']['music-' + game.settings['audio']['theme']]);
       game.view.music.setVolume(game.settings['audio']['music']);
     }
     let target = e.target.closest('button');
@@ -1309,7 +1325,7 @@ game.ui.moveToPage = (target, skipFade = false) => {
   if(target == 'pause') {
     game.view.music.stop();
   } else if(game.ui.currentPage == 'pause' && target == 'gameplay') {
-    game.view.music.offset = (game.timeProgress / (game.settings['difficulty']['speed'] / 100)) % game.assets.audio.music.duration;
+    game.view.music.offset = (game.timeProgress / (game.settings['difficulty']['speed'] / 100)) % game.assets['audio']['music-' + game.settings['audio']['theme']].duration;
     game.view.music.play();
   }
   game.ui.currentPage = target;
@@ -1368,6 +1384,26 @@ loadAllAssets(game, (progress) => {
   if(window.location.hostname == 'fietkau.media') {
     game.ui.root.querySelector('.ui-page.title .footer span:last-child').remove();
   }
+  if(!game.assets.audiothemes.includes(game.settings['audio']['theme'])) {
+    game.settings['audio']['theme'] = game.assets.audiothemes[0];
+  }
+  if(game.assets.audiothemes.length == 1) {
+    game.ui.root.querySelector('.ui-page.options .audiotheme').style.display = 'none';
+  }
+  let container = game.ui.root.querySelector('.ui-page.options .audiotheme');
+  for(let audioTheme of game.assets.audiothemes) {
+    let snippet = container.children[0].content.cloneNode(true).children[0];
+    snippet.children[0].value = audioTheme;
+    if(audioTheme == game.settings['audio']['theme']) {
+      snippet.children[0].checked = true;
+    }
+    snippet.children[0].addEventListener('change', () => {
+      applySettings(game);
+      game.view.music.setBuffer(game.assets['audio']['music-' + game.settings['audio']['theme']]);
+    });
+    snippet.childNodes[1].textContent = ' ' + audioTheme[0].toUpperCase() + audioTheme.slice(1);
+    container.appendChild(snippet);
+  }
   game.ui.moveToPage('title');
   init(window['game'], game.ui.root.querySelector('canvas'));
 }, (err) => {