function load() { //let intervalID = window.setInterval(get_active_torrents_ajax, 20000); let intervalID = window.setInterval(update, 5000); } function get_active_torrents_ajax() { let httpRequest; httpRequest = new XMLHttpRequest(); httpRequest.onreadystatechange = function() { if (httpRequest.readyState !== XMLHttpRequest.DONE) { return; } if (httpRequest.status !== 200) { return; } torrents = JSON.parse(httpRequest.responseText); let html_str = ''; for (let i = 0; i < torrents.length; i++) { html_str += '' html_str += '' + torrents[i].name + ''; html_str += '' + torrents[i].total_size_str + ''; html_str += '' + torrents[i].state + ''; html_str += '' + torrents[i].downrate_str + ''; html_str += '' + torrents[i].down_percent + '%'; html_str += '' + torrents[i].eta_str + ''; html_str += '' + torrents[i].uprate_str + ''; html_str += '' + torrents[i].tracker + ''; html_str += '' + torrents[i].rtorrent_id + ''; html_str += ''; } document.getElementById('torrents').children[1].innerHTML = html_str; }; httpRequest.open('GET', get_torrents_uri, true); httpRequest.send(); } var socket = new WebSocket('wss://' + window.location.hostname + ws_uri); 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); } socket.onclose = function(e) { console.log('WebSocket lost connection to server. Re-trying...'); // TODO: reconnect } /* Websocket receive */ socket.events['active_torrents'] = function(data) { let table = document.querySelector('#torrents tbody'); while (table.firstChild) { table.removeChild(table.firstChild); } data.forEach(function(torrent) { let template = document.querySelector('#torrent_template'); let node = document.importNode(template.content, true); for (let field of node.children[0].children) { field.textContent = torrent[field.className]; } table.appendChild(node); }); } socket.events['tracker_stats'] = function(data) { let table = document.querySelector('#tracker_stats tbody'); while (table.firstChild) { table.removeChild(table.firstChild); } for (let [tracker, values] of Object.entries(data)) { let template = document.querySelector('#tracker_template'); let node = document.importNode(template.content, true); node.children[0].children[0].textContent = tracker; for (let i = 0; i < values.length; i++) { node.children[0].children[i+1].textContent = values[i]; } table.appendChild(node); } } /* Websocket send */ function get_active_torrents() { socket.send('active_torrents', {}); } function get_tracker_stats() { socket.send('tracker_stats', {}); } /* Helper */ function update() { get_active_torrents(); get_tracker_stats(); }