65 řádky
2.1 KiB
JavaScript
65 řádky
2.1 KiB
JavaScript
|
$(function () {
|
||
|
let main = $(".thread + hr");
|
||
|
|
||
|
main.after(
|
||
|
'<div id="live-info" class="box inline-block"><span id="live-indicator"></span> <span id="live-status"></span></div><br>'
|
||
|
);
|
||
|
|
||
|
$("#live-indicator").css("background-color", "orange");
|
||
|
$("#live-status").text("Připojování...");
|
||
|
|
||
|
let thread = window.location.pathname.split("/").slice(-2);
|
||
|
let protocol;
|
||
|
|
||
|
if (window.location.protocol === "https:") {
|
||
|
protocol = "wss:";
|
||
|
} else {
|
||
|
protocol = "ws:";
|
||
|
}
|
||
|
|
||
|
let last_post = $(".thread").find(".post").last().attr("id");
|
||
|
|
||
|
let ws_location = `${protocol}//${window.location.host}/live/${thread[0]}/${thread[1]}/${last_post}`;
|
||
|
let ws = new WebSocket(ws_location);
|
||
|
|
||
|
ws.addEventListener("open", function (_) {
|
||
|
$("#live-indicator").css("background-color", "lime");
|
||
|
$("#live-status").text("Připojeno pro nové příspěvky");
|
||
|
});
|
||
|
|
||
|
ws.addEventListener("message", function (msg) {
|
||
|
let data = JSON.parse(msg.data);
|
||
|
|
||
|
switch (data.type) {
|
||
|
case "created":
|
||
|
$(".thread").append(data.html + "<br>");
|
||
|
update_expandable($(`#${data.id} .expandable`));
|
||
|
update_reltimes($(`#${data.id}`).find("time"));
|
||
|
break;
|
||
|
case "updated":
|
||
|
$(`#${data.id}`).replaceWith(data.html);
|
||
|
update_expandable($(`#${data.id} .expandable`));
|
||
|
update_reltimes($(`#${data.id}`).find("time"));
|
||
|
break;
|
||
|
case "removed":
|
||
|
if (data.id === parseInt(thread[1])) {
|
||
|
ws.close();
|
||
|
$("#live-indicator").css("background-color", "red");
|
||
|
$("#live-status").text("Vlákno bylo odstraněno");
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
$(`#${data.id}`).next("br").remove();
|
||
|
$(`#${data.id}`).remove();
|
||
|
break;
|
||
|
default:
|
||
|
break;
|
||
|
}
|
||
|
});
|
||
|
|
||
|
ws.addEventListener("close", function (_) {
|
||
|
$("#live-indicator").css("background-color", "red");
|
||
|
$("#live-status").text("Odpojeno, obnov stránku");
|
||
|
});
|
||
|
});
|