/* House keeping */ var socket = new WebSocket('wss://' + document.domain + SCRIPT_NAME + '/ws/quest/' + quest_id + '/'); socket.oldSend = socket.send; socket.send = function(event_title, data) { data = JSON.stringify({event: event_title, data: data}); socket.oldSend.apply(this, [data]); } socket.events = {}; socket.onmessage = function(e) { let data = JSON.parse(e.data); let event = data.event; data = data.data; if (socket.events[event] === undefined) { return; } socket.events[event](data); } function load() { document.getElementById('chatWindow').scrollTop = document.getElementById('chatWindow').scrollHeight; let mtarea = document.getElementById('messageTextArea'); mtarea.addEventListener('keypress', function(event) { if (event.key == 'Enter' && !event.shiftKey) { let text = mtarea.value.trim(); mtarea.value = ''; if (text == '') { return; } document.getElementById('chatWindow').scrollTop = document.getElementById('chatWindow').scrollHeight; socket.send('message', {message: text, quest_id: quest_id}); } }); } /* Websocket events */ socket.events['message'] = function(data) { let msg_str = '
'; msg_str = '
' + data.name + ' '; msg_str += '' + strftime(data.date) + ' '; msg_str += 'No.' + data.message_id + '
'; msg_str += '
' + data.message + '

'; let mbox = document.getElementById('chatWindow'); mbox.innerHTML = mbox.innerHTML + msg_str; if ((mbox.scrollTop + mbox.offsetHeight) >= (mbox.scrollHeight - mbox.clientHeight / 2)) { mbox.scrollTop = mbox.scrollHeight; } } /* Helpers */ function padToTwo(number) { if (number<=99) { number = ("0"+number).slice(-2); } return number; } function strftime(date) { date = new Date(date * 1000); let date_str = date.getFullYear() + '-' + padToTwo(date.getMonth()+1) + '-' + padToTwo(date.getDate()) + ' '; date_str += padToTwo(date.getHours()) + ':' + padToTwo(date.getMinutes()) + ':' + padToTwo(date.getSeconds()); return date_str; } /* User-facing */ function quote(message_id) { let textbox = document.getElementById('messageTextArea'); textbox.value += '>>' + message_id + '\n'; textbox.focus(); } function showPreview(event, message_id) { let elem = document.getElementById('msg-' + message_id); if (!elem) { return; } let preview = document.getElementById('preview'); preview.innerHTML = elem.innerHTML; preview.style.display = ''; let x = event.clientX + 20 + 'px'; let y = event.clientY + 20 + 'px'; let maxWidth = window.innerWidth - event.clientX - 80 + 'px'; preview.style.top = y; preview.style.left = x; preview.style.maxWidth = maxWidth; } function clearPreview() { document.getElementById('preview').innerHTML = ''; document.getElementById('preview').style.display = 'none'; } function scrollToMsg(message_id) { let elem = document.getElementById('msg-' + message_id); if (!elem) { return; } elem.scrollIntoView(); }