ninya9k
/
anonstream
1
1
フォーク 0
コード イシュー プルリクエスト プロジェクト リリース アクティビティ

Indent with 2 spaces in js

このコミットが含まれているのは:
n9k 2022-02-15 10:16:10 +00:00
親 694c6a4995
コミット 60b0cb1ebc
1個のファイルの変更、112行の追加、111行の削除
統計情報を表示 Patchファイルをダウンロード Diffファイルをダウンロード すべてのファイルを展開 すべてのファイルを折り畳む

223
anonstream/static/anonstream.js
ファイルの表示

@ -7,32 +7,32 @@ const jsmarkup_info_title = '<header id="info_js__title" data-js="true"></header
const jsmarkup_chat_messages = '<ul id="chat-messages_js" data-js="true"></ul>'; const jsmarkup_chat_messages = '<ul id="chat-messages_js" data-js="true"></ul>';
const jsmarkup_chat_form = `\ const jsmarkup_chat_form = `\
<form id="chat-form_js" data-js="true" action="/chat" method="post"> <form id="chat-form_js" data-js="true" action="/chat" method="post">
<input id="chat-form_js__nonce" type="hidden" name="nonce" value=""> <input id="chat-form_js__nonce" type="hidden" name="nonce" value="">
<textarea id="chat-form_js__comment" name="comment" maxlength="512" required placeholder="Send a message..." rows="1"></textarea> <textarea id="chat-form_js__comment" name="comment" maxlength="512" required placeholder="Send a message..." rows="1"></textarea>
<div id="chat-live"> <div id="chat-live">
<span id="chat-live__ball"></span> <span id="chat-live__ball"></span>
<span id="chat-live__status">Not connected to chat</span> <span id="chat-live__status">Not connected to chat</span>
</div> </div>
<input id="chat-form_js__submit" type="submit" value="Chat" disabled> <input id="chat-form_js__submit" type="submit" value="Chat" disabled>
</form>`; </form>`;
const insert_jsmarkup = () => { const insert_jsmarkup = () => {
if (document.getElementById("info_js") === null) { if (document.getElementById("info_js") === null) {
const parent = document.getElementById("info"); const parent = document.getElementById("info");
parent.insertAdjacentHTML("beforeend", jsmarkup_info); parent.insertAdjacentHTML("beforeend", jsmarkup_info);
} }
if (document.getElementById("info_js__title") === null) { if (document.getElementById("info_js__title") === null) {
const parent = document.getElementById("info_js"); const parent = document.getElementById("info_js");
parent.insertAdjacentHTML("beforeend", jsmarkup_info_title); parent.insertAdjacentHTML("beforeend", jsmarkup_info_title);
} }
if (document.getElementById("chat-messages_js") === null) { if (document.getElementById("chat-messages_js") === null) {
const parent = document.getElementById("chat__messages"); const parent = document.getElementById("chat__messages");
parent.insertAdjacentHTML("beforeend", jsmarkup_chat_messages); parent.insertAdjacentHTML("beforeend", jsmarkup_chat_messages);
} }
if (document.getElementById("chat-form_js") === null) { if (document.getElementById("chat-form_js") === null) {
const parent = document.getElementById("chat__form"); const parent = document.getElementById("chat__form");
parent.insertAdjacentHTML("beforeend", jsmarkup_chat_form); parent.insertAdjacentHTML("beforeend", jsmarkup_chat_form);
} }
} }
insert_jsmarkup(); insert_jsmarkup();
@ -42,109 +42,110 @@ const info_title = document.getElementById("info_js__title");
const chat_messages_parent = document.getElementById("chat__messages"); const chat_messages_parent = document.getElementById("chat__messages");
const chat_messages = document.getElementById("chat-messages_js"); const chat_messages = document.getElementById("chat-messages_js");
const on_websocket_message = (event) => { const on_websocket_message = (event) => {
const receipt = JSON.parse(event.data); const receipt = JSON.parse(event.data);
switch (receipt.type) { switch (receipt.type) {
case "error": case "error":
console.log("ws error", receipt); console.log("ws error", receipt);
break; break;
case "init": case "init":
console.log("ws init", receipt); console.log("ws init", receipt);
chat_form_nonce.value = receipt.nonce; chat_form_nonce.value = receipt.nonce;
info_title.innerText = receipt.title; info_title.innerText = receipt.title;
break; break;
case "title": case "title":
console.log("ws title", receipt); console.log("ws title", receipt);
info_title.innerText = receipt.title; info_title.innerText = receipt.title;
break; break;
case "ack": case "ack":
console.log("ws ack", receipt); console.log("ws ack", receipt);
if (chat_form_nonce.value === receipt.nonce) { if (chat_form_nonce.value === receipt.nonce) {
chat_form_comment.value = ""; chat_form_comment.value = "";
} else { } else {
console.log("nonce does not match ack", chat_form_nonce, receipt); console.log("nonce does not match ack", chat_form_nonce, receipt);
} }
chat_form_submit.disabled = false; chat_form_submit.disabled = false;
chat_form_nonce.value = receipt.next; chat_form_nonce.value = receipt.next;
break; break;
case "reject": case "reject":
console.log("ws reject", receipt); console.log("ws reject", receipt);
alert(`Rejected: ${receipt.notice}`); alert(`Rejected: ${receipt.notice}`);
chat_form_submit.disabled = false; chat_form_submit.disabled = false;
break; chat_form_nonce.value = receipt.next;
break;
case "chat": case "chat":
console.log("ws chat", receipt); console.log("ws chat", receipt);
const chat_message = document.createElement("li"); const chat_message = document.createElement("li");
chat_message.classList.add("chat-message"); chat_message.classList.add("chat-message");
const chat_message_name = document.createElement("span"); const chat_message_name = document.createElement("span");
chat_message_name.classList.add("chat-message__name"); chat_message_name.classList.add("chat-message__name");
chat_message_name.innerText = receipt.name; chat_message_name.innerText = receipt.name;
//chat_message_name.dataset.color = receipt.color; // not working in any browser //chat_message_name.dataset.color = receipt.color; // not working in any browser
chat_message_name.style.color = receipt.color; chat_message_name.style.color = receipt.color;
const chat_message_markup = document.createElement("span"); const chat_message_markup = document.createElement("span");
chat_message_markup.classList.add("chat-message__markup"); chat_message_markup.classList.add("chat-message__markup");
chat_message_markup.innerHTML = receipt.markup; chat_message_markup.innerHTML = receipt.markup;
chat_message.insertAdjacentElement("beforeend", chat_message_name); chat_message.insertAdjacentElement("beforeend", chat_message_name);
chat_message.insertAdjacentHTML("beforeend", ":&nbsp;"); chat_message.insertAdjacentHTML("beforeend", ":&nbsp;");
chat_message.insertAdjacentElement("beforeend", chat_message_markup); chat_message.insertAdjacentElement("beforeend", chat_message_markup);
chat_messages.insertAdjacentElement("beforeend", chat_message); chat_messages.insertAdjacentElement("beforeend", chat_message);
chat_messages_parent.scrollTo({ chat_messages_parent.scrollTo({
left: 0, left: 0,
top: chat_messages_parent.scrollTopMax, top: chat_messages_parent.scrollTopMax,
behavior: "smooth", behavior: "smooth",
}); });
break; break;
default: default:
console.log("incomprehensible websocket message", receipt); console.log("incomprehensible websocket message", receipt);
} }
}; };
const chat_live_ball = document.getElementById("chat-live__ball"); const chat_live_ball = document.getElementById("chat-live__ball");
const chat_live_status = document.getElementById("chat-live__status"); const chat_live_status = document.getElementById("chat-live__status");
let ws; let ws;
let websocket_backoff = 2000; // 2 seconds let websocket_backoff = 2000; // 2 seconds
const connect_websocket = () => { const connect_websocket = () => {
if (ws !== undefined && (ws.readyState === ws.CONNECTING || ws.readyState === ws.OPEN)) { if (ws !== undefined && (ws.readyState === ws.CONNECTING || ws.readyState === ws.OPEN)) {
console.log("refusing to open another websocket"); console.log("refusing to open another websocket");
return; return;
}
chat_live_ball.style.borderColor = "gold";
chat_live_status.innerText = "Connecting to chat...";
ws = new WebSocket(`ws://${document.domain}:${location.port}/live?token=${encodeURIComponent(token)}`);
ws.addEventListener("open", (event) => {
chat_form_submit.disabled = false;
chat_live_ball.style.borderColor = "green";
chat_live_status.innerText = "Connected to chat";
websocket_backoff = 2000; // 2 seconds
});
ws.addEventListener("close", (event) => {
console.log("websocket closed", event);
chat_form_submit.disabled = true;
chat_live_ball.style.borderColor = "maroon";
chat_live_status.innerText = "Disconnected from chat";
if (!ws.successor) {
ws.successor = true;
setTimeout(connect_websocket, websocket_backoff);
websocket_backoff = Math.min(32000, websocket_backoff * 2);
} }
chat_live_ball.style.borderColor = "gold"; });
chat_live_status.innerText = "Connecting to chat..."; ws.addEventListener("error", (event) => {
ws = new WebSocket(`ws://${document.domain}:${location.port}/live?token=${encodeURIComponent(token)}`); console.log("websocket error", event);
ws.addEventListener("open", (event) => { chat_form_submit.disabled = true;
chat_form_submit.disabled = false; chat_live_ball.style.borderColor = "maroon";
chat_live_ball.style.borderColor = "green"; chat_live_status.innerText = "Error connecting to chat";
chat_live_status.innerText = "Connected to chat"; });
websocket_backoff = 2000; // 2 seconds ws.addEventListener("message", on_websocket_message);
});
ws.addEventListener("close", (event) => {
console.log("websocket closed", event);
chat_form_submit.disabled = true;
chat_live_ball.style.borderColor = "maroon";
chat_live_status.innerText = "Disconnected from chat";
if (!ws.successor) {
ws.successor = true;
setTimeout(connect_websocket, websocket_backoff);
websocket_backoff = Math.min(32000, websocket_backoff * 2);
}
});
ws.addEventListener("error", (event) => {
console.log("websocket error", event);
chat_form_submit.disabled = true;
chat_live_ball.style.borderColor = "maroon";
chat_live_status.innerText = "Error connecting to chat";
});
ws.addEventListener("message", on_websocket_message);
} }
connect_websocket(); connect_websocket();
@ -155,8 +156,8 @@ const chat_form_nonce = document.getElementById("chat-form_js__nonce");
const chat_form_comment = document.getElementById("chat-form_js__comment"); const chat_form_comment = document.getElementById("chat-form_js__comment");
const chat_form_submit = document.getElementById("chat-form_js__submit"); const chat_form_submit = document.getElementById("chat-form_js__submit");
chat_form.addEventListener("submit", (event) => { chat_form.addEventListener("submit", (event) => {
event.preventDefault(); event.preventDefault();
const payload = {comment: chat_form_comment.value, nonce: chat_form_nonce.value}; const payload = {comment: chat_form_comment.value, nonce: chat_form_nonce.value};
chat_form_submit.disabled = true; chat_form_submit.disabled = true;
ws.send(JSON.stringify(payload)); ws.send(JSON.stringify(payload));
}); });