1 'use strict'; |
1 'use strict'; |
2 |
2 |
3 var servers = [ |
3 var gServers = [ |
4 { |
4 { |
5 name: 'bird', |
5 name: 'bird', |
6 url: 'w:/192.168.0.10', |
6 url: 'ws:/192.168.0.10', |
7 websserver: null |
7 websocket: null, |
8 }, |
8 }, |
9 //{ |
9 //{ |
10 // name: "fox", |
10 // name: "fox", |
11 // url: "ws://192.168.0.11", |
11 // url: "ws://192.168.0.11", |
12 // , websserver: null |
12 // , websserver: null |
13 //}, |
13 //}, |
14 |
14 |
15 ]; |
15 ]; |
16 |
16 |
17 var buttons = [ |
17 //var gButtons = [ |
18 { |
18 // { |
19 id: "bt_black", |
19 // id: "bt_black", |
20 command: "black" |
20 // command: "black" |
|
21 // } |
|
22 //]; |
|
23 |
|
24 |
|
25 function $(expr) { |
|
26 return document.querySelector(expr); |
|
27 } |
|
28 |
|
29 function $$(expr) { |
|
30 return Array.from(document.querySelectorAll(expr)); |
|
31 } |
|
32 |
|
33 function sendCommand(str) { |
|
34 gServers.forEach(function(server) { |
|
35 if (server.websocket && server.websocket.readyState == WebSocket.OPEN) { |
|
36 server.websocket.send(str) |
|
37 } else { |
|
38 updateStatus(); |
|
39 } |
|
40 }); |
|
41 } |
|
42 |
|
43 function updateStatus() { |
|
44 var nb_servers = gServers.length; |
|
45 var nb_servers_ok = 0; |
|
46 |
|
47 gServers.forEach(function(server) { |
|
48 if (server.websocket && server.websocket.readyState == WebSocket.OPEN) { |
|
49 nb_servers_ok++; |
|
50 if (server.status_box) { |
|
51 server.status_box.innerHTML = |
|
52 '<span class="status-txt status-ok">OK</span>'; |
|
53 } |
|
54 } else if (server.status_box) { |
|
55 server.status_box.innerHTML = |
|
56 '<span class="status-txt status-alert">KO</span>'; |
|
57 } |
|
58 }); |
|
59 |
|
60 var main_status_box = $('#main-status-box'); |
|
61 if (!main_status_box) |
|
62 return; |
|
63 |
|
64 if (nb_servers_ok === 0) { |
|
65 main_status_box.innerHTML = |
|
66 '<big class="status-txt status-alert">! KO !</big>'; |
|
67 } else if (nb_servers === nb_servers_ok) { |
|
68 main_status_box.innerHTML = |
|
69 '<big class="status-txt status-ok">OK</big>'; |
|
70 } else if (nb_servers_ok < nb_servers) { |
|
71 main_status_box.innerHTML = |
|
72 '<big class="status-txt status-warning">warning !</big>'; |
21 } |
73 } |
22 ]; |
74 } |
23 |
75 |
24 function init() { |
76 function init() { |
|
77 updateStatus(); |
|
78 |
|
79 var substatus_box = $('#substatus-box'); |
|
80 gServers.forEach(function(server) { |
|
81 if (substatus_box) { |
|
82 server.status_box = document.createElement('div'); |
|
83 server.status_box.className = 'substatus'; |
|
84 substatus_box.appendChild(server.status_box); |
|
85 } |
|
86 server.websocket = new WebSocket(server.url); |
|
87 server.websocket.addEventListener('open', function (evt) { |
|
88 updateStatus(); |
|
89 }); |
|
90 }); |
|
91 |
|
92 var mutable_bt = $('#mutable-cmd-bt'); |
|
93 var mutable_input = $('#mutable-cmd-input'); |
|
94 if (mutable_bt && mutable_input) { |
|
95 mutable_bt.addEventListener('click', function(evt) { |
|
96 cmd = mutable_input.value; |
|
97 |
|
98 if (cmd) |
|
99 sendCommand(cmd); |
|
100 }); |
|
101 } |
|
102 |
|
103 $$('.cmd-bt').forEach(function(elt) { |
|
104 elt.addEventListener('click', function(evt) { |
|
105 cmd = elt.getAttribute('data-cmd'); |
|
106 if (cmd) |
|
107 sendCommand(cmd); |
|
108 }); |
|
109 }); |
|
110 |
25 |
111 |
26 } |
112 } |
27 |
113 |
28 |
114 |
29 document.addEventListener("DOMContentLoaded", function(e) { |
115 document.addEventListener('DOMContentLoaded', function(e) { |
30 //console.log("DOM loaded"); |
116 //console.log("DOM loaded"); |
|
117 init(); |
31 }); |
118 }); |
32 |
119 |