diff --git a/socialdragon/templates/index.html b/socialdragon/templates/index.html index 0f39b87..9d8e970 100755 --- a/socialdragon/templates/index.html +++ b/socialdragon/templates/index.html @@ -95,25 +95,51 @@ var queue = []; var archive = []; -// Construct websocket url -var loc = window.location; -var ws_url = ((loc.protocol === "https:") ? "wss://" : "ws://") + loc.host + "/ws"; +function connectWebSocket(url) { + var webSocket = new WebSocket(url); -var exampleSocket = new WebSocket(ws_url); -exampleSocket.onopen = function (event) { - console.log("WS: Connection open"); -}; -exampleSocket.onmessage = function (event) { - console.log("WS: Received message"); - IT = JSON.parse(event.data); - if (IT["State"] === 1) { - queue.push(IT); - archive.push(IT); - if (archive.length > 5) { - archive.shift(); - } + webSocket.onopen = function(event) { + console.log("WebSocket: Connected"); + } + + webSocket.onmessage = function(event) { + console.log("WebSocket: Received Message"); + handleMessage(event.data); + } + + webSocket.onclose = function(event) { + console.log("WebSocket: Closed"); + setTimeout(function() { + connectWebSocket(url); + }, 5000); + } + + webSocket.onerror = function(event) { + console.warn("WebSocket: Error, closing socket"); + ws.close(); + } +} + +function handleMessage(message) { + var item = null; + try { + item = JSON.parse(message); + } catch (err) { + console.warn("MessageHandler: Failed Message JSON parsing"); + return; + } + if (item["State"] === 1) { + addItem(item); + } + +} + +function addItem(item) { + queue.push(item); + archive.push(item); + if (archive.length > 5) { + archive.shift(); } - console.log(event.data); } function displayNewSnap() { @@ -180,7 +206,12 @@ function setDisplayItem(item) { } } +// Construct websocket url +var loc = window.location; +var ws_url = ((loc.protocol === "https:") ? "wss://" : "ws://") + loc.host + "/ws"; + loadInitialSnaplist(); +connectWebSocket(ws_url);