aboutsummaryrefslogtreecommitdiff
path: root/webAO
diff options
context:
space:
mode:
Diffstat (limited to 'webAO')
-rw-r--r--webAO/client.html3
-rw-r--r--webAO/client.js136
2 files changed, 98 insertions, 41 deletions
diff --git a/webAO/client.html b/webAO/client.html
index 8909fc9..c446480 100644
--- a/webAO/client.html
+++ b/webAO/client.html
@@ -362,7 +362,8 @@
<meta name="frame-title" lang="en" content="Settings">
<h2>Volume</h2>
<p>Music</p>
- <audio id="client_musicaudio" onvolumechange="changeMusicVolume()" controls loop></audio>
+ <input id="client_mvolume" class="long" type="range" min="0" max="1" value="1" step="0.01"
+ onchange="changeMusicVolume()">
<p>SFX</p>
<audio id="client_sfxaudio" onvolumechange="changeSFXVolume()" controls></audio>
diff --git a/webAO/client.js b/webAO/client.js
index f01ff64..7d06960 100644
--- a/webAO/client.js
+++ b/webAO/client.js
@@ -188,6 +188,8 @@ class Client extends EventEmitter {
this.on("FL", this.handleFL.bind(this));
this.on("LE", this.handleLE.bind(this));
this.on("EM", this.handleEM.bind(this));
+ this.on("FM", this.handleFM.bind(this));
+ this.on("FA", this.handleFA.bind(this));
this.on("SM", this.handleSM.bind(this));
this.on("MM", this.handleMM.bind(this));
this.on("BD", this.handleBD.bind(this));
@@ -448,7 +450,7 @@ class Client extends EventEmitter {
document.querySelector('#client_chatboxselect [value="' + cookiechatbox + '"]').selected = true;
setChatbox(cookiechatbox);
- document.getElementById("client_musicaudio").volume = getCookie("musicVolume") || 1;
+ document.getElementById("client_mvolume").value = getCookie("musicVolume") || 1;
changeMusicVolume();
document.getElementById("client_sfxaudio").volume = getCookie("sfxVolume") || 1;
changeSFXVolume();
@@ -738,8 +740,11 @@ class Client extends EventEmitter {
handleMC(args) {
const track = prepChat(args[1]);
let charID = Number(args[2]);
+ const showname = args[3] || "";
+ const looping = Boolean(args[4]);
+ const channel = Number(args[5]) || 0;
- const music = viewport.music;
+ const music = viewport.music[channel];
let musicname;
music.pause();
if(track.startsWith("http")) {
@@ -747,6 +752,7 @@ class Client extends EventEmitter {
} else {
music.src = MUSIC_HOST + encodeURI(track.toLowerCase());
}
+ music.loop = looping;
music.play();
try {
@@ -928,14 +934,17 @@ class Client extends EventEmitter {
}
resetMusiclist() {
- this.musics = [];
+ this.musics = [];
+ document.getElementById("client_musiclist").innerHTML = "";
+ }
+
+ resetArealist() {
this.areas = [];
- document.getElementById("client_musiclist").innerHTML = "";
- document.getElementById("areas").innerHTML = "";
+ document.getElementById("areas").innerHTML = "";
}
isAudio(trackname) {
- if (/\.(?:wav|mp3|mp4|ogg|opus)$/i.test(trackname) || // regex for file extenstions
+ if (trackname.includes(".") || // regex for file extenstions
trackname.startsWith("=") ||
trackname.startsWith("-")) // category markers
{
@@ -945,38 +954,46 @@ class Client extends EventEmitter {
}
}
+ addTrack(trackname) {
+ const newentry = document.createElement("OPTION");
+ newentry.text = trackname;
+ document.getElementById("client_musiclist").options.add(newentry);
+ this.musics.push(trackname);
+ }
+
handleMusicInfo(trackindex,trackname) {
if (this.isAudio(trackname)) {
- // After reached the audio put everything in the music list
- const newentry = document.createElement("OPTION");
- newentry.text = trackname;
- document.getElementById("client_musiclist").options.add(newentry);
- this.musics.push(trackname);
+ this.addTrack(trackname);
} else {
- const thisarea = {
- name: trackname,
- players: 0,
- status: "IDLE",
- cm: "",
- locked: "FREE"
- };
+ this.createArea(trackindex,trackname);
+ }
+ }
- this.areas.push(thisarea);
-
- // Create area button
- let newarea = document.createElement("SPAN");
- newarea.classList = "area-button area-default";
- newarea.id = "area" + trackindex;
- newarea.innerText = thisarea.name;
- newarea.title = "Players: <br>" +
- "Status: <br>" +
- "CM: ";
- newarea.onclick = function () {
- area_click(this);
- };
+ createArea(id,name) {
+ const thisarea = {
+ name: name,
+ players: 0,
+ status: "IDLE",
+ cm: "",
+ locked: "FREE"
+ };
- document.getElementById("areas").appendChild(newarea);
- }
+ this.areas.push(thisarea);
+
+ // Create area button
+ let newarea = document.createElement("SPAN");
+ newarea.classList = "area-button area-default";
+ newarea.id = "area" + id;
+ newarea.innerText = thisarea.name;
+ newarea.title = `Players: ${thisarea.players}\n` +
+ `Status: ${thisarea.status}\n` +
+ `CM: ${thisarea.cm}\n` +
+ `Area lock: ${thisarea.locked}`;
+ newarea.onclick = function () {
+ area_click(this);
+ };
+
+ document.getElementById("areas").appendChild(newarea);
}
/**
@@ -988,6 +1005,7 @@ class Client extends EventEmitter {
document.getElementById("client_loadingtext").innerHTML = "Loading Music";
if(args[1] === "0") {
this.resetMusiclist();
+ this.resetArealist();
}
for (let i = 2; i < args.length - 1; i++) {
@@ -1008,6 +1026,7 @@ class Client extends EventEmitter {
handleSM(args) {
document.getElementById("client_loadingtext").innerHTML = "Loading Music ";
this.resetMusiclist();
+ this.resetArealist();
for (let i = 1; i < args.length - 1; i++) {
// Check when found the song for the first time
@@ -1020,6 +1039,31 @@ class Client extends EventEmitter {
}
/**
+ * Handles updated music list
+ * @param {Array} args packet arguments
+ */
+ handleFM(args) {
+ this.resetMusiclist();
+
+ for (let i = 1; i < args.length - 1; i++) {
+ // Check when found the song for the first time
+ this.addTrack(safe_tags(args[i]));
+ }
+ }
+
+ /**
+ * Handles updated area list
+ * @param {Array} args packet arguments
+ */
+ handleFA(args) {
+ this.resetArealist();
+
+ for (let i = 1; i < args.length - 1; i++) {
+ this.createArea(i-1,safe_tags(args[i]));
+ }
+ }
+
+ /**
* Handles the "MusicMode" packet
* @param {Array} args packet arguments
*/
@@ -1225,11 +1269,9 @@ class Client extends EventEmitter {
switch (Number(args[0])) {
case 0: // playercount
this.areas[i].players = Number(args[i+1]);
- thisarea.innerText = `${this.areas[i].name} (${this.areas[i].players})`;
break;
case 1: // status
this.areas[i].status = safe_tags(args[i+1]);
- thisarea.classList = "area-button area-" + this.areas[i].status.toLowerCase();
break;
case 2:
this.areas[i].cm = safe_tags(args[i+1]);
@@ -1239,6 +1281,10 @@ class Client extends EventEmitter {
break;
}
+ thisarea.classList = "area-button area-" + this.areas[i].status.toLowerCase();
+
+ thisarea.innerText = `${this.areas[i].name} (${this.areas[i].players}) [${this.areas[i].status}]`;
+
thisarea.title = `Players: ${this.areas[i].players}\n` +
`Status: ${this.areas[i].status}\n` +
`CM: ${this.areas[i].cm}\n` +
@@ -1491,8 +1537,9 @@ class Viewport {
this.testimonyAudio = document.getElementById("client_testimonyaudio");
this.testimonyAudio.src = `${AO_HOST}sounds/general/sfx-guilty.wav`;
- this.music = document.getElementById("client_musicaudio");
- this.music.src = `${AO_HOST}sounds/music/trial (aa).mp3`;
+ this.music = new Array(3);
+ this.music.fill(new Audio(`${AO_HOST}sounds/music/trial (aa).mp3`))
+ .forEach(channel => channel.volume = 0.5);
this.updater = null;
this.testimonyUpdater = null;
@@ -1518,7 +1565,7 @@ class Viewport {
}
/**
- * Sets the volume of the blip sound.
+ * Sets the volume of the blip sounds.
* @param {number} volume
*/
set blipVolume(volume) {
@@ -1526,6 +1573,14 @@ class Viewport {
}
/**
+ * Sets the volume of the music.
+ * @param {number} volume
+ */
+ set musicVolume(volume) {
+ this.music.forEach(channel => channel.volume = volume);
+ }
+
+ /**
* Returns the path which the background is located in.
*/
get bgFolder() {
@@ -2355,7 +2410,8 @@ window.area_click = area_click;
* Triggered by the music volume slider.
*/
export function changeMusicVolume() {
- setCookie("musicVolume", document.getElementById("client_musicaudio").volume);
+ viewport.musicVolume = document.getElementById("client_mvolume").value;
+ setCookie("musicVolume", document.getElementById("client_mvolume").value);
}
window.changeMusicVolume = changeMusicVolume;
@@ -3079,4 +3135,4 @@ export function toggleShout(shout) {
selectedShout = shout;
}
}
-window.toggleShout = toggleShout; \ No newline at end of file
+window.toggleShout = toggleShout;
generated by cgit (git 2.34.1) at 2026-04-30 10:16:31 +0000