Mercurial > brewboard / file comparison

comparison: image/w/js/webui.js

image/w/js/webui.js

branch
stable
changeset 46
aaa095986ede
parent 42
c6a1a6ca5437
child 77
66c77497d86d
equal deleted inserted replaced
35:1625e565ca31 46:aaa095986ede
1 document.getElementById("test").innerHTML = "WebSocket is not connected"; 1 document.getElementById("test").innerHTML = "WebSocket is not connected";
2 2
3 var websocket = new WebSocket('ws://'+location.hostname+'/ws'); 3 var websocket = new WebSocket('ws://'+location.hostname+'/ws');
4 var slider = document.getElementById("myRange"); 4
5 5 var Beep= new Audio( "data:audio/wav;base64,//uQRAAAAWMSLwUIYAAsYkXgoQwAEaYLWfkWgAI0wWs/ItAAAGDgYtAgAyN+QWaAAihwMWm4G8QQRDiMcCBcH3Cc+CDv/7xA4Tvh9Rz/y8QADBwMWgQAZG/ILNAARQ4GLTcDeIIIhxGOBAuD7hOfBB3/94gcJ3w+o5/5eIAIAAAVwWgQAVQ2ORaIQwEMAJiDg95G4nQL7mQVWI6GwRcfsZAcsKkJvxgxEjzFUgfHoSQ9Qq7KNwqHwuB13MA4a1q/DmBrHgPcmjiGoh//EwC5nGPEmS4RcfkVKOhJf+WOgoxJclFz3kgn//dBA+ya1GhurNn8zb//9NNutNuhz31f////9vt///z+IdAEAAAK4LQIAKobHItEIYCGAExBwe8jcToF9zIKrEdDYIuP2MgOWFSE34wYiR5iqQPj0JIeoVdlG4VD4XA67mAcNa1fhzA1jwHuTRxDUQ//iYBczjHiTJcIuPyKlHQkv/LHQUYkuSi57yQT//uggfZNajQ3Vmz+ Zt//+mm3Wm3Q576v////+32///5/EOgAAADVghQAAAAA//uQZAUAB1WI0PZugAAAAAoQwAAAEk3nRd2qAAAAACiDgAAAAAAABCqEEQRLCgwpBGMlJkIz8jKhGvj4k6jzRnqasNKIeoh5gI7BJaC1A1AoNBjJgbyApVS4IDlZgDU5WUAxEKDNmmALHzZp0Fkz1FMTmGFl1FMEyodIavcCAUHDWrKAIA4aa2oCgILEBupZgHvAhEBcZ6joQBxS76AgccrFlczBvKLC0QI2cBoCFvfTDAo7eoOQInqDPBtvrDEZBNYN5xwNwxQRfw8ZQ5wQVLvO8OYU+mHvFLlDh05Mdg7BT6YrRPpCBznMB2r//xKJjyyOh+cImr2/4doscwD6neZjuZR4AgAABYAAAABy1xcdQtxYBYYZdifkUDgzzXaXn98Z0oi9ILU5mBjFANmRwlVJ3/6jYDAmxaiDG3/6xjQQCCKkRb/6kg/wW+kSJ5//rLobkLSiKmqP/0ikJuDaSaSf/6JiLYLEYnW/+kXg1WRVJL/9EmQ1YZIsv/6Qzwy5qk7/+tEU0nkls3/zIUMPKNX/6yZLf+kFgAfgGyLFAUwY//uQZAUABcd5UiNPVXAAAApAAAAAE0VZQKw9ISAAACgAAAAAVQIygIElVrFkBS+Jhi+EAuu+lKAkYUEIsmEAEoMeDmCETMvfSHTGkF5RWH7kz/ESHWPAq/kcCRhqBtMdokPdM7vil7RG98A2sc7zO6ZvTdM7pmOUAZTnJW+NXxqmd41dqJ6mLTXxrPpnV8avaIf5SvL7pndPvPpndJR9Kuu8fePvuiuhorgWjp7Mf/PRjxcFCPDkW31srioCExivv9lcwKEaHsf/7ow2Fl1T/9RkXgEhYElAoCLFtMArxwivDJJ+bR1HTKJdlEoTELCIqgEwVGSQ+hIm0NbK8WXcTEI0UPoa2NbG4y2K00JEWbZavJXkYaqo9CRHS55FcZTjKEk3NKoCYUnSQ 0rWxrZbFKbKIhOKPZe1cJKzZSaQrIyULHDZmV5K4xySsDRKWOruanGtjLJXFEmwaIbDLX0hIPBUQPVFVkQkDoUNfSoDgQGKPekoxeGzA4DUvnn4bxzcZrtJyipKfPNy5w+9lnXwgqsiyHNeSVpemw4bWb9psYeq//uQZBoABQt4yMVxYAIAAAkQoAAAHvYpL5m6AAgAACXDAAAAD59jblTirQe9upFsmZbpMudy7Lz1X1DYsxOOSWpfPqNX2WqktK0DMvuGwlbNj44TleLPQ+Gsfb+GOWOKJoIrWb3cIMeeON6lz2umTqMXV8Mj30yWPpjoSa9ujK8SyeJP5y5mOW1D6hvLepeveEAEDo0mgCRClOEgANv3B9a6fikgUSu/DmAMATrGx7nng5p5iimPNZsfQLYB2sDLIkzRKZOHGAaUyDcpFBSLG9MCQALgAIgQs2YunOszLSAyQYPVC2YdGGeHD2dTdJk1pAHGAWDjnkcLKFymS3RQZTInzySoBwMG0QueC3gMsCEYxUqlrcxK6k1LQQcsmyYeQPdC2YfuGPASCBkcVMQQqpVJshui1tkXQJQV0OXGAZMXSOEEBRirXbVRQW7ugq7IM7rPWSZyDlM3IuNEkxzCOJ0ny2ThNkyRai1b6ev//3dzNGzNb//4uAvHT5sURcZCFcuKLhOFs8mLAAEAt4UWAAIABAAAAAB4qbHo0tIjVkUU//uQZAwABfSFz3ZqQAAAAAngwAAAE1HjMp2qAAAAACZDgAAAD5UkTE1UgZEUExqYynN1qZvqIOREEFmBcJQkwdxiFtw0qEOkGYfRDifBui9MQg4QAHAqWtAWHoCxu1Yf4VfWLPIM2mHDFsbQEVGwyqQoQcwnfHeIkNt9YnkiaS1oizycqJrx4KOQjahZxWbcZgztj2c49nKmkId44S71j0c8eV9yDK6uPRzx5X18eDvjvQ6yKo9ZSS6l//8elePK/Lf//IInrOF/FvDoADYAGBMGb7 FtErm5MXMlmPAJQVgWta7Zx2go+8xJ0UiCb8LHHdftWyLJE0QIAIsI+UbXu67dZMjmgDGCGl1H+vpF4NSDckSIkk7Vd+sxEhBQMRU8j/12UIRhzSaUdQ+rQU5kGeFxm+hb1oh6pWWmv3uvmReDl0UnvtapVaIzo1jZbf/pD6ElLqSX+rUmOQNpJFa/r+sa4e/pBlAABoAAAAA3CUgShLdGIxsY7AUABPRrgCABdDuQ5GC7DqPQCgbbJUAoRSUj+NIEig0YfyWUho1VBBBA//uQZB4ABZx5zfMakeAAAAmwAAAAF5F3P0w9GtAAACfAAAAAwLhMDmAYWMgVEG1U0FIGCBgXBXAtfMH10000EEEEEECUBYln03TTTdNBDZopopYvrTTdNa325mImNg3TTPV9q3pmY0xoO6bv3r00y+IDGid/9aaaZTGMuj9mpu9Mpio1dXrr5HERTZSmqU36A3CumzN/9Robv/Xx4v9ijkSRSNLQhAWumap82WRSBUqXStV/YcS+XVLnSS+WLDroqArFkMEsAS+eWmrUzrO0oEmE40RlMZ5+ODIkAyKAGUwZ3mVKmcamcJnMW26MRPgUw6j+LkhyHGVGYjSUUKNpuJUQoOIAyDvEyG8S5yfK6dhZc0Tx1KI/gviKL6qvvFs1+bWtaz58uUNnryq6kt5RzOCkPWlVqVX2a/EEBUdU1KrXLf40GoiiFXK///qpoiDXrOgqDR38JB0bw7SoL+ZB9o1RCkQjQ2CBYZKd/+VJxZRRZlqSkKiws0WFxUyCwsKiMy7hUVFhIaCrNQsKkTIsLivwKKigsj8XYlwt/WKi2N4d//uQRCSAAjURNIHpMZBGYiaQPSYyAAABLAAAAAAAACWAAAAApUF/Mg+0aohSIRobBAsMlO//Kk4soosy1JSFRYWaLC4qZBYWFRGZdwqKiwkNBVmoWFSJkWFxX4FFRQWR+LsS4W/rFRb//////////////////////////// /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////VEFHAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAU291bmRib3kuZGUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMjAwNGh0dHA6Ly93d3cuc291bmRib3kuZGUAAAAAAAAAACU=" );
6 6
7 var BBScreen={ 7 var BBScreen={
8 8
9 Screen: -1,
10 Subscreen: 0,
11 setTimer: function(v){
12 $("#timer").text('');
13 if (v == 0) {
14 $("#timer").css("font-size", "18px");
15 $("#timer").css("font-weight", "normal");
16 $("#timer").css("font-family", "Verdana, Arial, sans-serif");
17 } else {
18 $("#timer").css("font-size", "36px");
19 $("#timer").css("font-weight", "bold");
20 $("#timer").css("font-family", "Courier New, Lucida Console");
21 }
22 },
23 clearScreen: function(){
24 $("#mltline").hide();
25 $("#mlt_table").hide();
26 $("#mlt00").hide();
27 $("#mlt20").hide();
28 $("#mlt01").hide();
29 $("#mlt21").hide();
30 $("#midline").hide();
31 this.setTimer(0);
32 $("#mid00").hide();
33 $("#mid20").hide();
34 $("#mid00").css("background-color", "#e7e7e7");
35 $("#mid00").css("color", "black");
36 $("#hltline").hide();
37 $("#hlt_table").hide();
38 $("#hlt00").hide();
39 $("#hlt20").hide();
40 $("#hlt01").hide();
41 $("#hlt21").hide();
42 $("#hlt01").css("background-color", "#e7e7e7");
43 $("#hlt01").css("color", "black");
44 $("#row_info").hide();
45 $("#prompt").hide();
46 $("#button_nee").css("background-color", "#e7e7e7");
47 $("#button_nee").css("color", "black");
48 $("#note").hide();
49 $("#brew").hide();
50 },
51 setScreen: function(s){
52 Screen = parseInt(s,10);
53 switch (Screen) {
54 case 0: this.clearScreen();
55 $("#mltline").show();
56 $("#mlt_table").show();
57 $("#but00").text('Hand');
58 $("#but20").text('Auto');
59 $("#mlt00").show();
60 $("#mlt20").show();
61 $("#midline").show();
62 this.setTimer(0);
63 $("#hltline").show();
64 $("#hlt_table").show();
65 $("#hlt01").show();
66 $("#but04").text('Info');
67 // No tools button on the web.
68 break;
69 case 2: this.clearScreen();
70 $("#row_info").show();
71 break;
72 case 96: break; // Automaat show recipe and Stop / Start
73 case 98: break; // Delay start
74 case 99: this.clearScreen(); // heatup
75 $("#mltline").show();
76 $("#mlt_table").show();
77 $("#midline").show();
78 $("#hltline").show();
79 $("#hlt_table").show();
80 break;
81 case 100: // All handled at Subscreen
82 case 101:
83 case 102:
84 case 103:
85 case 104:
86 case 105:
87 case 106:
88 case 107: break;
89 case 108: this.clearScreen();
90 $("#mltline").show(); // to boil
91 $("#mlt_table").show();
92 $("#mlt00").show();
93 $("#mlt20").show();
94 $("#but00").text('+sp');
95 $("#but20").text('-sp');
96 break;
97 case 109: this.clearScreen();
98 $("#mltline").show(); // boil
99 $("#mlt_table").show();
100 $("#mlt00").show();
101 $("#mlt20").show();
102 $("#but00").text('+sp');
103 $("#but20").text('-sp');
104 $("#midline").show();
105 $("#mid00").show();
106 $("#mid20").show();
107 $("#but02").text('+%');
108 $("#but22").text('-%');
109 this.setTimer(1);
110 $("#hltline").show();
111 $("#hlt01").show();
112 $("#hlt21").show();
113 $("#but04").text('+1m');
114 $("#but24").text('-1m');
115 break;
116 case 110: // whirlpool 9
117 case 111: // cooling H
118 case 112: // whirlpool 7
119 case 113: // cooling M
120 case 114: // whirlpool 6
121 case 115: // cooling C
122 case 116: // whirlpool 2
123 break;
124 case 117: this.clearScreen();
125 $("#note").show();
126 $("#note_msg").text('Brouwen is gereed.');
127 break;
128 case 118: this.clearScreen();
129 $("#note").show();
130 $("#note_msg").text('Brouwen is afgebroken.');
131 break;
132 case 97:
133 case 200: this.clearScreen();
134 $("#prompt").show();
135 break;
136 case 201: this.clearScreen();
137 $("#mltline").show();
138 $("#but00").text('+sp');
139 $("#but20").text('-sp');
140 $("#but01").text('Pomp');
141 $("#but21").text('Aan');
142 $("#midline").show();
143 $("#hltline").show();
144 $("#but03").text('+sp');
145 $("#but23").text('-sp');
146 $("#but04").text('Stop');
147 $("#but24").text('Aan');
148 $("#hlt01").show();
149 $("#hlt01").css("background-color", "#575757");
150 $("#hlt01").css("color", "white");
151 break;
152 default: this.clearScreen();
153 console.log("this is default screen "+Screen);
154 break;
155 }
156 },
157 setSubscreen: function(s){
158 Subscreen = parseInt(s,10);
159 console.log("Screen:"+Screen+" Sub:"+Subscreen);
160 if (Screen == 96) {
161 this.clearScreen();
162 if (Subscreen == 0) {
163 $("#prompt").show();
164 $("#button_ja").text('Ja');
165 $("#button_nee").text('Nee');
166 } else if (Subscreen == 1) {
167 $("#brew").show();
168 }
169 } else if ((Screen >= 100) && (Screen < 108)) {
170 this.clearScreen();
171 $("#mltline").show();
172 $("#mlt_table").show();
173 $("#midline").show();
174 $("#hltline").show();
175 $("#hlt_table").show();
176 switch (Subscreen) {
177 case 0: // MASH_NONE
178 case 1: // MASH_WAITTEMP
179 $("#mlt00").show();
180 $("#mlt20").show();
181 $("#but00").text('+sp');
182 $("#but20").text('-sp');
183 break;
184 case 2: // MASH_REST
185 this.setTimer(1);
186 $("#mid00").show();
187 $("#mid20").show();
188 $("#but02").text('+1m');
189 $("#but22").text('-1m');
190 break;
191 case 3: // MASH_ADD
192 case 4: // MASH_IODINE
193 case 5: // MASH_REMOVE
194 case 6: // MASH_INFUSE
195 this.setTimer(0);
196 $("#mid00").show();
197 $("#mid00").css("background-color", "#575757");
198 $("#mid00").css("color", "white");
199 $("#mid20").show();
200 $("#but02").text('Halt');
201 $("#but22").text('Ok');
202 break;
203 };
204 } else if ((Screen == 111) || (Screen == 113) || (Screen == 115)) { // cooling H,M,C
205 this.clearScreen();
206 if (Subscreen == 0) {
207 $("#prompt").show();
208 $("#button_ja").text('Start');
209 $("#button_nee").text('Stop');
210 $("#button_nee").css("background-color", "#575757");
211 $("#button_nee").css("color", "white");
212 } else if (Subscreen == 1) {
213 $("#mltline").show();
214 $("#mlt_table").show();
215 $("#mlt00").show();
216 $("#mlt20").show();
217 $("#but00").text('+1');
218 $("#but20").text('-1');
219 $("#hltline").show();
220 $("#hlt01").show();
221 $("#but04").text('Stop');
222 $("#hlt01").css("background-color", "#575757");
223 $("#hlt01").css("color", "white");
224 }
225 } else if ((Screen == 110) || (Screen == 112) || (Screen == 114) || (Screen == 116)) { // whirlpools
226 this.clearScreen();
227 if (Subscreen == 0) {
228 $("#prompt").show();
229 $("#button_ja").text('Start');
230 $("#button_nee").text('Stop');
231 $("#button_nee").css("background-color", "#575757");
232 $("#button_nee").css("color", "white");
233 } else if (Subscreen == 1) {
234 $("#mltline").show();
235 $("#mlt_table").show();
236 $("#midline").show();
237 this.setTimer(1);
238 $("#mid00").show();
239 $("#mid20").show();
240 $("#but02").text('-1m');
241 $("#but22").text('+1m');
242 $("#hltline").show();
243 $("#hlt21").show();
244 $("#but24").text('Pomp');
245 }
246 };
247 },
9 MLT_pv: function(s) { 248 MLT_pv: function(s) {
10 $("#mlt_pv").text(s); 249 $("#mlt_pv").text(s);
11 }, 250 },
12 MLT_sp: function(s) { 251 MLT_sp: function(s) {
13 $("#mlt_sp").text(s); 252 $("#mlt_sp").text(s);
253 if (Screen == 201) {
254 if (s != "") {
255 $("#mlt00").show();
256 $("#mlt20").show();
257 $("#mlt01").show();
258 $("#mlt21").show();
259 $("#mlt_table").show();
260 }
261 }
14 }, 262 },
15 MLT_power: function(s) { 263 MLT_power: function(s) {
16 $("#mlt_power").text(s); 264 $("#mlt_power").text(s);
265 if (Screen == 201) {
266 if (s != "") {
267 $("#but21").text('Uit');
268 } else {
269 $("#but21").text('Aan');
270 }
271 }
17 }, 272 },
18 MLT_led: function(s) { 273 MLT_led: function(s) {
19 if (s == 0) 274 if (s == 0)
20 $("#mlt_led").css("background-color", "#270"); 275 $("#mlt_led").css("background-color", "#270");
21 else 276 else
30 HLT_pv: function(s) { 285 HLT_pv: function(s) {
31 $("#hlt_pv").text(s); 286 $("#hlt_pv").text(s);
32 }, 287 },
33 HLT_sp: function(s) { 288 HLT_sp: function(s) {
34 $("#hlt_sp").text(s); 289 $("#hlt_sp").text(s);
290 if (Screen == 201) {
291 if (s != "") {
292 $("#hlt00").show();
293 $("#hlt20").show();
294 $("#hlt21").show();
295 $("#hlt_table").show();
296 }
297 }
35 }, 298 },
36 HLT_power: function(s) { 299 HLT_power: function(s) {
37 $("#hlt_power").text(s); 300 $("#hlt_power").text(s);
301 if (Screen == 201) {
302 if (s != "") {
303 $("#but24").text('Uit');
304 } else {
305 $("#but24").text('Aan');
306 }
307 }
38 }, 308 },
39 HLT_led: function(s) { 309 HLT_led: function(s) {
40 if (s == 0) 310 if (s == 0)
41 $("#hlt_led").css("background-color", "#270"); 311 $("#hlt_led").css("background-color", "#270");
42 else 312 else
46 $("#top_msg").text(s); 316 $("#top_msg").text(s);
47 }, 317 },
48 Timer: function(s) { 318 Timer: function(s) {
49 $("#timer").text(s); 319 $("#timer").text(s);
50 }, 320 },
321 Brew1: function(s) {
322 $("#brew_msg1").text(s);
323 },
324 Brew2: function(s) {
325 $("#brew_msg2").text(s);
326 },
327 Beep: function(s) {
328 var loop = parseInt(s,10);
329 Beep.pause();
330 Beep.loop = false;
331 for (i = 0; i < loop; i++) {
332 Beep.play();
333 }
334 },
51 }; 335 };
52 336
53 var BrewBoard = { 337 var BrewBoard = {
54 338
55 p_msg:function(e){ 339 p_msg:function(e){
56 var b=this; 340 var b=this;
57 var a=JSON.parse(e); 341 var a=JSON.parse(e);
58 var c={ 342 var c={
343 main: function(v){
344 BBScreen.setScreen(v)
345 },
346 sub: function(v){
347 BBScreen.setSubscreen(v)
348 },
59 mlt_pv:function(v){ 349 mlt_pv:function(v){
60 BBScreen.MLT_pv(v) 350 BBScreen.MLT_pv(v)
61 }, 351 },
62 mlt_sp:function(v){ 352 mlt_sp:function(v){
63 BBScreen.MLT_sp(v) 353 BBScreen.MLT_sp(v)
87 BBScreen.Topmessage(v) 377 BBScreen.Topmessage(v)
88 }, 378 },
89 timer:function(v){ 379 timer:function(v){
90 BBScreen.Timer(v) 380 BBScreen.Timer(v)
91 }, 381 },
382 beep:function(v){
383 BBScreen.Beep(v)
384 },
385 brew1:function(v){
386 BBScreen.Brew1(v)
387 },
388 brew2:function(v){
389 BBScreen.Brew2(v)
390 },
92 }; 391 };
93 console.log(e);
94 $.each(a,function(k,v){ 392 $.each(a,function(k,v){
95 if (typeof(c[k])!="undefined"){ 393 if (typeof(c[k])!="undefined"){
96 c[k](v) 394 c[k](v)
97 } 395 }
98 }); 396 });
99 } 397 }
100 }; 398 };
101 399
102 400
103 function sendMsg() { 401 function sendTouch(x, y) {
104 //websocket.send("sup playa!"); 402 websocket.send('{"touch":{"x":'+x+',"y":'+y+'}}');
105 websocket.send('L50');
106 console.log('Sent message to websocket');
107 } 403 }
108 404
109 405
406 /* Define keys in the screens and their actions. */
407 $("#ok_info").click( function() { sendTouch(160,220); });
408 $("#ok_note").click( function() { sendTouch(160,220); });
409 $("#mlt00").click( function() { sendTouch( 35, 46); });
410 $("#mlt20").click( function() { sendTouch(285, 46); });
411 $("#mlt01").click( function() { sendTouch( 35, 96); });
412 $("#mlt21").click( function() { sendTouch(285, 96); });
413 $("#mid00").click( function() { sendTouch( 35,140); });
414 $("#mid20").click( function() { sendTouch(285,140); });
415 $("#hlt00").click( function() { sendTouch( 35,170); });
416 $("#hlt20").click( function() { sendTouch(285,170); });
417 $("#hlt01").click( function() { sendTouch( 35,220); });
418 $("#hlt21").click( function() { sendTouch(285,220); });
419 $("#button_ja").click( function() { sendTouch( 80,120); });
420 $("#button_nee").click( function() { sendTouch(240,120); });
421 $("#button_stop").click( function() { sendTouch( 35,220); });
422 $("#button_start").click( function() { sendTouch(285,220); });
423
110 websocket.onopen = function(evt) { 424 websocket.onopen = function(evt) {
111 console.log('WebSocket connection opened'); 425 console.log('WebSocket connection opened');
112 // websocket.send("It's open! Hooray!!!"); 426 document.getElementById("test").innerHTML = "";
113 document.getElementById("test").innerHTML = "WebSocket is connected!";
114 } 427 }
115 428
116 /* 429 /*
117 * Process received websocket messages. 430 * Process received websocket messages.
118 */ 431 */

Mercurial Repository: brewboard

mercurial