aboutsummaryrefslogtreecommitdiff
path: root/webAO
diff options
context:
space:
mode:
Diffstat (limited to 'webAO')
-rw-r--r--webAO/dom/resizeChatbox.ts11
-rw-r--r--webAO/dom/updateBackgroundPreview.ts17
-rw-r--r--webAO/styles/chatbox/acww.css3
-rw-r--r--webAO/styles/chatbox/chatboxes.js1
-rw-r--r--webAO/styles/chatbox/key.css4
-rw-r--r--webAO/styles/chatbox/sonic.css128
-rw-r--r--webAO/styles/chatbox/trilogy.css2
-rw-r--r--webAO/styles/chatbox/trilogy.svg28
-rw-r--r--webAO/utils/aoml.ts44
-rw-r--r--webAO/utils/setCookie.ts2
10 files changed, 201 insertions, 39 deletions
diff --git a/webAO/dom/resizeChatbox.ts b/webAO/dom/resizeChatbox.ts
index 887877d..0fb737d 100644
--- a/webAO/dom/resizeChatbox.ts
+++ b/webAO/dom/resizeChatbox.ts
@@ -3,13 +3,18 @@ import { CHATBOX } from "../client";
* Set the font size for the chatbox
*/
export function resizeChatbox() {
- const chatContainerBox = document.getElementById("client_chatcontainer")!;
+ const chatContainerBox = document.getElementById("client_chatcontainer");
+ const clockBox = document.getElementById("client_clock");
+ const trackstatusBox = document.getElementById("client_trackstatus");
+
const gameHeight = document.getElementById("client_background")!.offsetHeight;
chatContainerBox.style.fontSize = `${(gameHeight * 0.0521).toFixed(1)}px`;
+ clockBox.style.fontSize = `${(gameHeight * 0.0521).toFixed(1)}px`;
+ trackstatusBox.style.fontSize = `${(gameHeight * 0.0521).toFixed(1)}px`;
const trackstatus = <HTMLMarqueeElement>(document.getElementById("client_trackstatustext"));
- trackstatus.width = (trackstatus.offsetWidth - 1) + "px";
+ trackstatus.style.width = (trackstatus.offsetWidth - 1) + "px";
//clock
@@ -25,7 +30,7 @@ export function resizeChatbox() {
} else if (CHATBOX == "key") {
weekday = ["Sun.", "Mon.", "Tue.", "Wed.", "Thu.", "Fri.", "Sat."];
document.getElementById("client_clock_weekday")!.innerText = weekday[now.getDay()];
- document.getElementById("client_clock_date")!.innerText = String(now.getDay());
+ document.getElementById("client_clock_date")!.innerText = String(now.getDate());
}
}
diff --git a/webAO/dom/updateBackgroundPreview.ts b/webAO/dom/updateBackgroundPreview.ts
index b41ee8f..01b5c44 100644
--- a/webAO/dom/updateBackgroundPreview.ts
+++ b/webAO/dom/updateBackgroundPreview.ts
@@ -1,4 +1,6 @@
-import { AO_HOST } from '../client/aoHost'
+import { AO_HOST } from '../client/aoHost';
+import tryUrls from "../utils/tryUrls";
+
/**
* Update background preview.
*/
@@ -15,14 +17,13 @@ export function updateBackgroundPreview() {
if (background_select.selectedIndex === 0) {
background_filename.style.display = "initial";
- background_preview.src = `${AO_HOST}background/${encodeURI(
- background_filename.value.toLowerCase()
- )}/defenseempty.png`;
} else {
background_filename.style.display = "none";
- background_preview.src = `${AO_HOST}background/${encodeURI(
- background_select.value.toLowerCase()
- )}/defenseempty.png`;
}
+ tryUrls(`${AO_HOST}background/${encodeURI(
+ background_select.value.toLowerCase()
+ )}/defenseempty`).then((resp) => {
+ background_preview.src = resp;
+ });
}
-window.updateBackgroundPreview = updateBackgroundPreview; \ No newline at end of file
+window.updateBackgroundPreview = updateBackgroundPreview;
diff --git a/webAO/styles/chatbox/acww.css b/webAO/styles/chatbox/acww.css
index dd899b9..b0114b6 100644
--- a/webAO/styles/chatbox/acww.css
+++ b/webAO/styles/chatbox/acww.css
@@ -175,6 +175,7 @@
font-weight: bold;
padding-left: 1.5em;
padding-top: 0.5em;
+ font-size: 0.5em;
}
#client_clock_month {
@@ -192,6 +193,7 @@
background-size: 100% 40%;
border: 0.1em solid #00b63c;
border-radius: 100%;
+ font-size: 0.6em;
}
#client_clock_time {
@@ -219,4 +221,5 @@
border-radius: 50%;
border-top: none;
padding-top: 0.5em;
+ font-size: 0.5em;
} \ No newline at end of file
diff --git a/webAO/styles/chatbox/chatboxes.js b/webAO/styles/chatbox/chatboxes.js
index bc73109..9e52d43 100644
--- a/webAO/styles/chatbox/chatboxes.js
+++ b/webAO/styles/chatbox/chatboxes.js
@@ -19,6 +19,7 @@ export default [
'halla',
'homestuck',
'key',
+ 'sonic',
'yakuza',
'yttd',
'whentheycry',
diff --git a/webAO/styles/chatbox/key.css b/webAO/styles/chatbox/key.css
index 77f2e99..4debe72 100644
--- a/webAO/styles/chatbox/key.css
+++ b/webAO/styles/chatbox/key.css
@@ -167,6 +167,7 @@
text-shadow: -1px -1px 0 #d7e5d9, 1px -1px 0 #d7e5d9, -1px 1px 0 #d7e5d9, 1px 1px 0 #d7e5d9;
font-size: small;
line-height: 1;
+ font-size: 0.4em;
}
#client_clock_date {
@@ -178,7 +179,7 @@
margin: 0;
color: #ffe;
text-shadow: -1px -1px 0 #78320b, 1px -1px 0 #78320b, -1px 1px 0 #78320b, 1px 1px 0 #78320b;
- font-size: 3em;
+ font-size: 1.5em;
background: rgba(255,255,255,0.7);
border-radius: 100%;
line-height: 1.8;
@@ -200,6 +201,7 @@
border: #ffc89f 3px ridge;
border-radius: 100%;
line-height: 2;
+ font-size: 0.4em;
}
#client_clock_time {
diff --git a/webAO/styles/chatbox/sonic.css b/webAO/styles/chatbox/sonic.css
new file mode 100644
index 0000000..2da4aaf
--- /dev/null
+++ b/webAO/styles/chatbox/sonic.css
@@ -0,0 +1,128 @@
+.text_white {
+ color: #2e2315;
+}
+
+.text_blue {
+ color: #6bc6f7;
+}
+
+.text_green {
+ color: #00f700;
+}
+
+.text_red {
+ color: #f00;
+}
+
+.text_orange {
+ color: #ee7600;
+}
+
+.text_yellow {
+ color: #ff0;
+}
+
+.text_pink {
+ color: #ffc0cb;
+}
+
+.text_cyan {
+ color: #0ff;
+}
+
+.text_grey {
+ color: #bbb;
+}
+
+#client_chatcontainer {
+ display: block;
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ height: 30%;
+ width: 100%;
+ filter: none;
+}
+
+#client_name {
+ display: block;
+ position: absolute;
+ left: 6%;
+ top: 0;
+ height: 16%;
+ min-width: 5em;
+ font-size: 1em;
+ background: #5c4200;
+ margin: 0;
+ z-index: 1;
+ border-radius: 0.25em;
+ font-weight: bold;
+ text-transform: uppercase;
+}
+
+#client_inner_name {
+ text-justify: distribute;
+ line-height: 100%;
+ margin: 0;
+ color: white;
+}
+
+#client_chat {
+ display: block;
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ width: 98%;
+ width: calc(100% - 0.27em);
+ height: 98%;
+ margin: auto;
+ border: solid #a99460 0.15em;
+ border-radius: 0.25em;
+ background-color: #e3dab6;
+ font-size: 1em;
+ font-weight: 600;
+ text-shadow: 0 1px #FFF;
+ word-break: keep-all;
+ overflow-wrap: break-word;
+ text-align: left;
+ overflow: hidden;
+ scroll-behavior: smooth;
+}
+
+#client_inner_chat {
+ padding: 8% 6%;
+ margin: 1px;
+ line-height: 100%;
+}
+
+#client_chatwaiting {
+ display: block;
+ position: absolute;
+ right: 2%;
+ bottom: 15%;
+ color: #5c4200;
+ transform: rotate(90deg);
+ animation: idling 0.4s linear infinite;
+}
+
+@keyframes idling {
+ 0% {
+ right: 0;
+ }
+
+ 50% {
+ right: 2%;
+ }
+
+ 100% {
+ right: 0;
+ }
+}
+
+#client_trackstatus {
+ display: none;
+}
+
+#client_clock {
+ display: none;
+} \ No newline at end of file
diff --git a/webAO/styles/chatbox/trilogy.css b/webAO/styles/chatbox/trilogy.css
index 80a7467..db68133 100644
--- a/webAO/styles/chatbox/trilogy.css
+++ b/webAO/styles/chatbox/trilogy.css
@@ -47,7 +47,7 @@
top: 0;
left: 5%;
padding: 0 3em;
- height: 20%;
+ height: 23%;
min-width: 10%;
border-image-source: url('trilogy.svg');
border-image-slice: 3 fill;
diff --git a/webAO/styles/chatbox/trilogy.svg b/webAO/styles/chatbox/trilogy.svg
index f3b3131..1657eca 100644
--- a/webAO/styles/chatbox/trilogy.svg
+++ b/webAO/styles/chatbox/trilogy.svg
@@ -1,4 +1,26 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg version="1.1" viewBox="0 0 90 90" xmlns="http://www.w3.org/2000/svg">
-<path transform="matrix(.99608 0 0 .99608 .090012 .090008)" d="m89.763 63.531-26.128 26.189-36.993 0.043265-26.189-26.128-0.043265-36.993 26.128-26.189 36.993-0.043265 26.189 26.128z" fill="#2989bc" stroke="#fff" stroke-width=".5"/>
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ version="1.1"
+ viewBox="0 0 90 90"
+ id="svg4"
+ sodipodi:docname="trilogy.svg"
+ inkscape:version="1.2.2 (732a01da63, 2022-12-09)"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:svg="http://www.w3.org/2000/svg">
+ <defs
+ id="defs8" />
+ <sodipodi:namedview
+ id="namedview6"
+ pagecolor="#ffffff"
+ bordercolor="#000000"
+ borderopacity="0.25" />
+ <path
+ d="M 90,65 65,90 H 25 L 0,65 V 25 L 25,0 h 40 l 25,25 z"
+ fill="#2989bc"
+ stroke="#ffffff"
+ stroke-width="0.500821"
+ id="path2"
+ sodipodi:nodetypes="ccccccccc" />
</svg>
diff --git a/webAO/utils/aoml.ts b/webAO/utils/aoml.ts
index fbdee21..5b5da5f 100644
--- a/webAO/utils/aoml.ts
+++ b/webAO/utils/aoml.ts
@@ -35,9 +35,9 @@ const aomlParser = (text: string) => {
const mlConfig = (AO_HOST: string) => {
const defaultUrl = `${AO_HOST}themes/default/chat_config.ini`
- let aomlParsed: Promise<{[key: string]: Aoml}> = request(defaultUrl).then((data) => aomlParser(data));
+ let aomlParsed: Promise<{ [key: string]: Aoml }> = request(defaultUrl).then((data) => aomlParser(data));
+
-
const createIdentifiers = async () => {
const identifiers = new Map<string, Aoml>()
@@ -45,7 +45,7 @@ const mlConfig = (AO_HOST: string) => {
if (value.start && value.end) {
identifiers.set(value.start, value)
identifiers.set(value.end, value)
- }
+ }
}
return identifiers
}
@@ -54,7 +54,7 @@ const mlConfig = (AO_HOST: string) => {
for (const [ruleName, value] of Object.entries(await aomlParsed)) {
if (value?.start && value?.end) {
startingIdentifiers.add(value.start)
- }
+ }
}
return startingIdentifiers
}
@@ -68,29 +68,29 @@ const mlConfig = (AO_HOST: string) => {
for (const letter of text) {
let currentSelector = document.createElement('span')
let currentIdentifier = identifiers.get(letter)
- const currentClosingLetter = closingStack[closingStack.length-1]
+ const currentClosingLetter = closingStack[closingStack.length - 1]
const keepChar = Number(currentIdentifier?.remove) === 0
-
- if (startIdentifiers.has(letter)) {
- const color = identifiers.get(letter).color.split(',')
- const r = color[0]
- const g = color[1]
- const b = color[2]
- colorStack.push([r,g,b])
- closingStack.push(currentIdentifier.end)
+ if (currentClosingLetter === letter) {
+ const r = colorStack[colorStack.length - 1][0]
+ const g = colorStack[colorStack.length - 1][1]
+ const b = colorStack[colorStack.length - 1][2]
const currentColor = `color: rgb(${r},${g},${b});`
currentSelector.setAttribute('style', currentColor)
+ closingStack.pop()
+ colorStack.pop()
if (keepChar) {
currentSelector.innerHTML = letter
}
- } else if (currentClosingLetter === letter) {
- const r = colorStack[colorStack.length-1][0]
- const g = colorStack[colorStack.length-1][1]
- const b = colorStack[colorStack.length-1][2]
+ }
+ else if (startIdentifiers.has(letter)) {
+ const color = identifiers.get(letter).color.split(',')
+ const r = color[0]
+ const g = color[1]
+ const b = color[2]
+ colorStack.push([r, g, b])
+ closingStack.push(currentIdentifier.end)
const currentColor = `color: rgb(${r},${g},${b});`
currentSelector.setAttribute('style', currentColor)
- closingStack.pop()
- colorStack.pop()
if (keepChar) {
currentSelector.innerHTML = letter
}
@@ -99,9 +99,9 @@ const mlConfig = (AO_HOST: string) => {
if (colorStack.length === 0) {
currentSelector.className = `text_${defaultColor}`
} else {
- const r = colorStack[colorStack.length-1][0]
- const g = colorStack[colorStack.length-1][1]
- const b = colorStack[colorStack.length-1][2]
+ const r = colorStack[colorStack.length - 1][0]
+ const g = colorStack[colorStack.length - 1][1]
+ const b = colorStack[colorStack.length - 1][2]
const currentColor = `color: rgb(${r},${g},${b});`
currentSelector.setAttribute('style', currentColor)
}
diff --git a/webAO/utils/setCookie.ts b/webAO/utils/setCookie.ts
index 084fa20..f9ac5d2 100644
--- a/webAO/utils/setCookie.ts
+++ b/webAO/utils/setCookie.ts
@@ -5,6 +5,6 @@
* @param {any} value The value of that cookie option
*/
const setCookie = (cname: String, value: any) => {
- document.cookie = `${cname}=${value}`;
+ document.cookie = `${cname}=${value};SameSite=Strict`;
};
export default setCookie;