aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--webAO/client.html22
-rw-r--r--webAO/client.js13
-rw-r--r--webAO/master.js1
-rw-r--r--webAO/styles/classic.css22
-rw-r--r--webAO/styles/client.css8
-rw-r--r--webAO/styles/default.css2
-rw-r--r--webAO/styles/soj.css2
7 files changed, 26 insertions, 44 deletions
diff --git a/webAO/client.html b/webAO/client.html
index bda32ff..dd6531a 100644
--- a/webAO/client.html
+++ b/webAO/client.html
@@ -18,8 +18,6 @@
</head>
<body>
- <span id="sound"></span>
- <div id="here"></div>
<div id="client_loading">
<h1 id="client_loadingtext">Loading</h1>
<button class="client_reconnect" onclick="ReconnectButton()">Reconnect</button>
@@ -283,18 +281,17 @@
</span>
<br>
<br>
- <div class="slider">Music
- <input id="client_mvolume" class="long" type="range" min="0" max="100" value="80"
- onchange="changeMusicVolume()">
- </div>
- <div class="slider">SFX
- <input id="client_svolume" class="long" type="range" min="0" max="100" value="70"
+ <p>Music</p>
+ <audio id="client_musicaudio" onvolumechange="changeMusicVolume()" controls loop></audio>
+
+ <p>SFX</p>
+ <input id="client_svolume" class="long" type="range" min="0" max="100" value="70"
onchange="changeSFXVolume()">
- </div>
- <div class="slider">Blip
- <input id="client_bvolume" class="long" type="range" min="0" max="100" value="60"
+
+ <p>Blip</p>
+ <input id="client_bvolume" class="long" type="range" min="0" max="100" value="60"
onchange="changeBlipVolume()">
- </div>
+ <br>
<br>
<button id="char_change" alt="Change" class="client_button hover_button" onclick="changeCharacter()">Change
Character</button>
@@ -379,6 +376,7 @@
<template id="music">
<meta name="frame-title" lang="en" content="Music">
+ <input id="client_musicsearch" style="display:none"></input>
<select id="client_musiclist" size="5" onchange="musiclist_click(event)">
</select>
</template>
diff --git a/webAO/client.js b/webAO/client.js
index 807ba46..04797da 100644
--- a/webAO/client.js
+++ b/webAO/client.js
@@ -371,7 +371,7 @@ class Client extends EventEmitter {
document.querySelector('#client_themeselect [value="' + cookietheme + '"]').selected = true;
reloadTheme();
- document.getElementById("client_mvolume").value = getCookie("musicVolume");
+ document.getElementById("client_musicaudio").volume = getCookie("musicVolume");
changeMusicVolume();
document.getElementById("client_svolume").value = getCookie("sfxVolume");
changeSFXVolume();
@@ -411,7 +411,7 @@ class Client extends EventEmitter {
* @param {number?} song the song to be played
*/
sendMusic(song) {
- this.sendServer(`MC#${song}`);
+ this.sendServer(`MC#${song}#${this.charID}#%`);
}
/**
@@ -588,7 +588,6 @@ class Client extends EventEmitter {
*/
handleRMC(args) {
viewport.music.pause();
- viewport.music = new Audio(this.musicList[args[1]]);
const music = viewport.music;
// Music offset + drift from song loading
music.totime = args[1];
@@ -1170,9 +1169,6 @@ class Viewport {
"cyan"
];
- this.blip = new Audio(AO_HOST + "sounds/general/sfx-blipmale.wav");
- this.blip.volume = 0.5;
-
// Allocate multiple blip audio channels to make blips less jittery
this.blipChannels = new Array(6);
@@ -1185,7 +1181,7 @@ class Viewport {
this.shoutaudio = new Audio();
- this.music = new Audio();
+ this.music = document.getElementById("client_musicaudio");
this.music.play();
this.updater = null;
@@ -1839,8 +1835,7 @@ window.area_click = area_click;
* Triggered by the music volume slider.
*/
export function changeMusicVolume() {
- viewport.music.volume = document.getElementById("client_mvolume").value / 100;
- setCookie("musicVolume", document.getElementById("client_mvolume").value);
+ setCookie("musicVolume", document.getElementById("client_musicaudio").volume);
}
window.changeMusicVolume = changeMusicVolume;
diff --git a/webAO/master.js b/webAO/master.js
index 43d7ba9..f2711d2 100644
--- a/webAO/master.js
+++ b/webAO/master.js
@@ -133,6 +133,7 @@ function onMessage(e) {
checkOnline(i, `${args[2]}:${args[3]}`);
}
checkOnline(-1, "127.0.0.1:50001");
+ masterserver.close();
}
else if (header === "SN") {
const args = msg.split("#");
diff --git a/webAO/styles/classic.css b/webAO/styles/classic.css
index eef35c6..b59cf32 100644
--- a/webAO/styles/classic.css
+++ b/webAO/styles/classic.css
@@ -3,11 +3,7 @@ body {
}
img {
- image-rendering: -moz-crisp-edges;
- image-rendering: -o-crisp-edges;
- image-rendering: -webkit-optimize-contrast;
- image-rendering: crisp-edges;
- -ms-interpolation-mode: nearest-neighbor;
+ image-rendering: pixelated;
}
.text_white {
@@ -43,7 +39,7 @@ img {
}
.text_rainbow {
- background-color: rgb(255, 255, 255);
+ background-color: #fff;
background-image: repeating-linear-gradient(to right,
red 0% 8%, orange 8% 16%, yellow 16% 24%, green 24% 32%, blue 32% 40%,
red 40% 48%, orange 48% 56%, yellow 56% 64%, green 64% 72%, blue 72% 80%,
@@ -88,11 +84,11 @@ img {
min-width: 3.25em;
text-justify: distribute;
letter-spacing: 0.075em;
- background: rgb(56, 56, 163, 0.5);
- box-shadow: 0.075em 0.075em rgb(0, 56, 163, 0.5) inset;
+ background: rgba(56, 56, 163, 0.5);
+ box-shadow: 0.075em 0.075em rgba(0, 56, 163, 0.5) inset;
left: 0;
top: 60.4%;
- border-color: rgb(255, 255, 255, 0.5);
+ border-color: rgba(255, 255, 255, 0.5);
border-style: ridge groove groove ridge;
border-width: 0.2em;
border-radius: 0.2em;
@@ -107,11 +103,11 @@ img {
width: calc(100% - 0.275em);
margin: auto;
height: 31.25%;
- border-color: rgb(255, 255, 255, 0.5);
+ border-color: rgba(255, 255, 255, 0.5);
border-style: ridge groove groove ridge;
border-width: 0.15em;
border-radius: 0.3em;
- background-color: rgb(0, 0, 16, 0.5);
+ background-color: rgba(0, 0, 16, 0.5);
top: 66.5%;
position: absolute;
word-break: keep-all;
@@ -170,7 +166,7 @@ img {
position: absolute;
content: "";
pointer-events: none;
- background: repeating-linear-gradient(transparent, transparent 3px, rgb(255, 255, 255, 0.2) 3px, rgb(255, 255, 255, 0.2) 4px);
+ background: repeating-linear-gradient(transparent, transparent 3px, rgba(255, 255, 255, 0.2) 3px, rgba(255, 255, 255, 0.2) 4px);
top: 0;
left: 0;
width: 100%;
@@ -185,7 +181,7 @@ img {
#client_iccontrols:after {
content: "";
pointer-events: none;
- background: repeating-linear-gradient(transparent, transparent 3px, rgb(255, 255, 255, 0.2) 3px, rgb(255, 255, 255, 0.2) 4px);
+ background: repeating-linear-gradient(transparent, transparent 3px, rgba(255, 255, 255, 0.2) 3px, rgba(255, 255, 255, 0.2) 4px);
top: 0;
left: 0;
width: 100%;
diff --git a/webAO/styles/client.css b/webAO/styles/client.css
index 841ec83..4c3f80f 100644
--- a/webAO/styles/client.css
+++ b/webAO/styles/client.css
@@ -346,14 +346,6 @@
border-width: 3px;
}
-.slider {
- padding-right: 4px;
- width: 80%;
- align-self: center;
- margin-left: auto;
- margin-right: auto;
-}
-
#client_defense_hp {
text-align: left;
}
diff --git a/webAO/styles/default.css b/webAO/styles/default.css
index 50b57c0..8ce47bd 100644
--- a/webAO/styles/default.css
+++ b/webAO/styles/default.css
@@ -43,7 +43,7 @@ img {
}
.text_rainbow {
- background-color: rgb(255, 255, 255);
+ background-color: #fff;
background-image: repeating-linear-gradient(to right,
red 0% 8%, orange 8% 16%, yellow 16% 24%, green 24% 32%, blue 32% 40%,
red 40% 48%, orange 48% 56%, yellow 56% 64%, green 64% 72%, blue 72% 80%,
diff --git a/webAO/styles/soj.css b/webAO/styles/soj.css
index 98e2634..023e5cb 100644
--- a/webAO/styles/soj.css
+++ b/webAO/styles/soj.css
@@ -35,7 +35,7 @@ body {
}
.text_rainbow {
- background-color: rgb(255, 255, 255);
+ background-color: #fff;
background-image: repeating-linear-gradient(to right,
red 0% 8%, orange 8% 16%, yellow 16% 24%, green 24% 32%, blue 32% 40%,
red 40% 48%, orange 48% 56%, yellow 56% 64%, green 64% 72%, blue 72% 80%,