mirror of
https://github.com/monkeytypegame/monkeytype.git
synced 2026-01-12 18:34:05 +08:00
reworked tribe result table
This commit is contained in:
parent
d7d7a071fa
commit
c838283c15
3 changed files with 62 additions and 26 deletions
|
|
@ -215,11 +215,14 @@ function mp_refreshTestUserList() {
|
|||
$(".tribeResult table tbody").append(`
|
||||
<tr class="player ${me}" socketId="${user.socketId}">
|
||||
<td class="name">${user.name}</td>
|
||||
<td class="wpm">-</td>
|
||||
<td class="acc">-</td>
|
||||
<td class="progress" colspan="3">
|
||||
<div class="barBg">
|
||||
<div class="bar" style="width: 0%;"></div>
|
||||
<td><div class="wpm">-</div><div class="acc">-</div></td>
|
||||
<td><div class="raw">-</div><div class="con">-</div></td>
|
||||
<td><div class="char">-</div><div class="other">-</div></td>
|
||||
<td class="progressAndGraph">
|
||||
<div class="progress">
|
||||
<div class="barBg">
|
||||
<div class="bar" style="width: 0%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="pos"><span class="num">-</span><span class="points"></span></td>
|
||||
|
|
@ -676,22 +679,20 @@ MP.socket.on("mp_room_user_finished", (data) => {
|
|||
$(`.tribeResult table .player[socketId=${data.socketId}] .acc`).text(
|
||||
data.result.acc + "%"
|
||||
);
|
||||
$(`.tribeResult table .player[socketId=${data.socketId}] .progress`).remove();
|
||||
$(`.tribeResult table .player[socketId=${data.socketId}] .raw`).remove();
|
||||
$(`.tribeResult table .player[socketId=${data.socketId}] .con`).remove();
|
||||
$(`.tribeResult table .player[socketId=${data.socketId}] .char`).remove();
|
||||
$(`.tribeResult table .player[socketId=${data.socketId}] .acc`).after(`
|
||||
<td class="raw"></div>
|
||||
<td class="con"></div>
|
||||
<td class="char"></div>
|
||||
`);
|
||||
// $(`.tribeResult table .player[socketId=${data.socketId}] .progress`).remove();
|
||||
// $(`.tribeResult table .player[socketId=${data.socketId}] .raw`).remove();
|
||||
// $(`.tribeResult table .player[socketId=${data.socketId}] .con`).remove();
|
||||
// $(`.tribeResult table .player[socketId=${data.socketId}] .char`).remove();
|
||||
// $(`.tribeResult table .player[socketId=${data.socketId}] .acc`).after(`
|
||||
// <td class="raw"></div>
|
||||
// <td class="con"></div>
|
||||
// <td class="char"></div>
|
||||
// `);
|
||||
$(`.tribeResult table .player[socketId=${data.socketId}] .raw`).text(
|
||||
data.result.raw
|
||||
);
|
||||
let val = "";
|
||||
if (!data.result.invalid && !data.result.failed && !data.result.outOfTime) {
|
||||
val = data.result.char;
|
||||
} else if (data.result.afk) {
|
||||
let val = "-";
|
||||
if (data.result.afk) {
|
||||
val = "afk";
|
||||
} else if (data.result.invalid) {
|
||||
val = "invalid";
|
||||
|
|
@ -700,12 +701,20 @@ MP.socket.on("mp_room_user_finished", (data) => {
|
|||
} else if (data.result.outOfTime) {
|
||||
val = "out of time";
|
||||
}
|
||||
$(`.tribeResult table .player[socketId=${data.socketId}] .char`).text(val);
|
||||
$(`.tribeResult table .player[socketId=${data.socketId}] .other`).text(val);
|
||||
$(`.tribeResult table .player[socketId=${data.socketId}] .char`).text(
|
||||
data.result.char
|
||||
);
|
||||
$(`.tribeResult table .player[socketId=${data.socketId}] .con`).text(
|
||||
data.result.con + "%"
|
||||
);
|
||||
|
||||
if (config.mode !== "time") {
|
||||
if (data.result.failed || data.result.invalid) {
|
||||
$(`.tribePlayers .player[socketId=${data.socketId}]`).addClass("failed");
|
||||
$(`.tribeResult .player[socketId=${data.socketId}]`).addClass("failed");
|
||||
}
|
||||
|
||||
if (config.mode !== "time" && !data.result.failed) {
|
||||
$(`.tribePlayers .player[socketId=${data.socketId}] .bar`)
|
||||
.stop(true, false)
|
||||
.animate(
|
||||
|
|
@ -729,6 +738,9 @@ MP.socket.on("mp_room_user_finished", (data) => {
|
|||
|
||||
MP.socket.on("mp_room_winner", (data) => {
|
||||
let pos = 1;
|
||||
if (data.official) {
|
||||
hideResultCountdown();
|
||||
}
|
||||
data.sorted.forEach((sid) => {
|
||||
$(`.tribeResult table [socketId=${sid.sid}] .pos .num`).text(
|
||||
`${pos}${Misc.getNumberSuffix(pos)}`
|
||||
|
|
|
|||
|
|
@ -1584,22 +1584,32 @@ key {
|
|||
tr td:first-child {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
tbody tr {
|
||||
color: var(--text-color);
|
||||
&.me {
|
||||
color: var(--main-color);
|
||||
}
|
||||
.progressAndGraph {
|
||||
width: 25%;
|
||||
}
|
||||
.acc,
|
||||
.con,
|
||||
.other {
|
||||
opacity: 0.5;
|
||||
}
|
||||
.crown {
|
||||
width: 1px;
|
||||
}
|
||||
.pos {
|
||||
width: 1px;
|
||||
width: 5.6rem;
|
||||
.num {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.points {
|
||||
opacity: 0.5;
|
||||
font-size: 0.6rem;
|
||||
vertical-align: super;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -2284,6 +2294,9 @@ key {
|
|||
.player.me .progress .barBg .bar {
|
||||
background: var(--main-color);
|
||||
}
|
||||
.player.failed {
|
||||
opacity: 0.25;
|
||||
}
|
||||
}
|
||||
|
||||
.tribePlayers {
|
||||
|
|
|
|||
|
|
@ -1254,11 +1254,22 @@
|
|||
<thead>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td>wpm</td>
|
||||
<td>acc</td>
|
||||
<td>raw</td>
|
||||
<td>consistency</td>
|
||||
<td>characters</td>
|
||||
<td>
|
||||
wpm
|
||||
<br />
|
||||
acc
|
||||
</td>
|
||||
<td>
|
||||
raw
|
||||
<br />
|
||||
consistency
|
||||
</td>
|
||||
<td>
|
||||
characters
|
||||
<br />
|
||||
other
|
||||
</td>
|
||||
<td></td>
|
||||
<td>pos</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue