tegakituesday/shiritori
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Improve styling

Browse source
This commit is contained in:
Elnu 2023-04-14 19:06:30 -07:00
parent 96b97ca820
commit 1ff2aedc2d
2 changed files with 26 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

13
demo/shiritori.js
View file

@ -4,10 +4,13 @@ const input = document.querySelector("#shiritori-input");
const players = document.querySelector("#shiritori-players");
let id = null;
function displayWord(_word, end) {
function displayWord(_word, end, delay) {
let { word, reading } = _word;
p = document.createElement("p");
p.innerHTML = reading || word === reading ? (word === "" ? reading : `<ruby>${word}<rp>(</rp><rt>${reading}<rt/><rp>)</rp></ruby>`) : word;
if (delay != 0) {
p.style.animationDelay = `${delay}s`;
}
if (end) {
div.append(p);
} else {
@ -24,16 +27,16 @@ ws.onmessage = e => {
break;
case "word":
let waiting = data.author === id;
displayWord(data.word, true);
displayWord(data.word, true, 0);
input.placeholder = waiting ? "Waiting for other players..." : `${data.next_mora}…`;
input.disabled = waiting;
if (!waiting) input.focus();
break;
case "history":
console.log(data);
data.words.forEach(word => {
displayWord(word, false);
})
for (let i = 0; i < data.words.length; i++) {
displayWord(data.words[i], false, 0.1 * i);
}
break;
case "playerCount":
let otherPlayers = data.players - 1;