const UI_TITEL = 0; const UI_LABEL = 1; const UPDATE_LABEL = 6; const UI_BUTTON = 2; const UI_SWITCHER = 3; const UPDATE_SWITCHER = 7; const UI_PAD = 4; const UI_CPAD = 5; const UI_SLIDER = 8; const UPDATE_SLIDER = 9; const UI_NUMBER = 10; const UPDATE_NUMBER = 11; const UI_TEXT_INPUT = 12; const UPDATE_TEXT_INPUT = 13; const UI_GRAPH = 14; const CLEAR_GRAPH = 15; const ADD_GRAPH_POINT = 16; const FOR = 0; const BACK = 1; const LEFT = 2; const RIGHT = 3; const CENTER = 4; // Colors const C_TURQUOISE = 0; const C_EMERALD = 1; const C_PETERRIVER = 2; const C_WETASPHALT = 3; const C_SUNFLOWER = 4; const C_CARROT = 5; const C_ALIZARIN = 6; const C_NONE = 7; function colorClass(colorId) { colorId = Number(colorId); switch (colorId) { case C_TURQUOISE: return "turquoise"; break; case C_EMERALD: return "emerald"; break; case C_PETERRIVER: return "peterriver"; break; case C_WETASPHALT: return "wetasphalt"; break; case C_SUNFLOWER: return "sunflower"; break; case C_CARROT: return "carrot" break; case C_ALIZARIN: return "alizarin" break; case C_NONE: return "" break; default: return ""; } } var websock; function restart() { $(document).add('*').off(); $("#row").html(""); websock.close(); start(); } function conStatusError() { $("#conStatus").removeClass("color-green"); $("#conStatus").addClass("color-red"); $("#conStatus").text("Error / No Connection (click me to retry)"); $("#conStatus").off(); $("#conStatus").on({ 'click': restart }); } function start() { websock = new WebSocket('ws://' + window.location.hostname + '/ws'); websock.onopen = function(evt) { console.log('websock open'); $("#conStatus").addClass("color-green"); $("#conStatus").text("Connected"); }; websock.onclose = function(evt) { console.log('websock close'); conStatusError(); }; websock.onerror = function(evt) { console.log(evt); conStatusError(); }; websock.onmessage = function(evt) { console.log(evt); var data = JSON.parse(evt.data); var e = document.body; var center = ""; switch (data.type) { case UI_TITEL: document.title = data.label; $('#mainHeader').html(data.label); break; case UI_LABEL: $('#row').append("
" + data.label + "

" + data.value + "
"); break; case UI_BUTTON: $('#row').append("
" + data.label + "

"); $('#' + data.id).on({ 'touchstart': function(e) { e.preventDefault(); buttonclick(data.id, true) } }); $('#' + data.id).on({ 'touchend': function(e) { e.preventDefault(); buttonclick(data.id, false) } }); break; case UI_SWITCHER: var label = "