Fork of the espurna firmware for `mhsw` switches
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1358 lines
39 KiB

8 years ago
8 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
6 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
6 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
6 years ago
6 years ago
7 years ago
6 years ago
6 years ago
8 years ago
7 years ago
8 years ago
8 years ago
8 years ago
7 years ago
8 years ago
7 years ago
7 years ago
6 years ago
6 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
8 years ago
8 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
7 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
7 years ago
6 years ago
6 years ago
8 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
7 years ago
6 years ago
6 years ago
6 years ago
8 years ago
6 years ago
6 years ago
8 years ago
6 years ago
8 years ago
6 years ago
8 years ago
6 years ago
8 years ago
7 years ago
7 years ago
8 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
8 years ago
8 years ago
7 years ago
7 years ago
6 years ago
7 years ago
7 years ago
7 years ago
7 years ago
8 years ago
  1. var websock;
  2. var password = false;
  3. var maxNetworks;
  4. var maxSchedules;
  5. var messages = [];
  6. var free_size = 0;
  7. var webhost;
  8. var numChanged = 0;
  9. var numReboot = 0;
  10. var numReconnect = 0;
  11. var numReload = 0;
  12. var useWhite = false;
  13. var now = 0;
  14. var ago = 0;
  15. // -----------------------------------------------------------------------------
  16. // Messages
  17. // -----------------------------------------------------------------------------
  18. function initMessages() {
  19. messages[1] = "Remote update started";
  20. messages[2] = "OTA update started";
  21. messages[3] = "Error parsing data!";
  22. messages[4] = "The file does not look like a valid configuration backup or is corrupted";
  23. messages[5] = "Changes saved. You should reboot your board now";
  24. messages[7] = "Passwords do not match!";
  25. messages[8] = "Changes saved";
  26. messages[9] = "No changes detected";
  27. messages[10] = "Session expired, please reload page...";
  28. }
  29. function sensorName(id) {
  30. var names = [
  31. "DHT", "Dallas", "Emon Analog", "Emon ADC121", "Emon ADS1X15",
  32. "HLW8012", "V9261F", "ECH1560", "Analog", "Digital",
  33. "Events", "PMSX003", "BMX280", "MHZ19", "SI7021",
  34. "SHT3X I2C", "BH1750"
  35. ];
  36. if (1 <= id && id <= names.length) {
  37. return names[id - 1];
  38. }
  39. return null;
  40. }
  41. function magnitudeType(type) {
  42. var types = [
  43. "Temperature", "Humidity", "Pressure",
  44. "Current", "Voltage", "Active Power", "Apparent Power",
  45. "Reactive Power", "Power Factor", "Energy", "Energy (delta)",
  46. "Analog", "Digital", "Events",
  47. "PM1.0", "PM2.5", "PM10", "CO2", "Lux"
  48. ];
  49. if (1 <= type && type <= types.length) {
  50. return types[type - 1];
  51. }
  52. return null;
  53. }
  54. function magnitudeError(error) {
  55. var errors = [
  56. "OK", "Out of Range", "Warming Up", "Timeout", "Wrong ID",
  57. "Data Error", "I2C Error", "GPIO Error"
  58. ];
  59. if (0 <= error && error < errors.length) {
  60. return errors[error];
  61. }
  62. return "Error " + error;
  63. }
  64. // -----------------------------------------------------------------------------
  65. // Utils
  66. // -----------------------------------------------------------------------------
  67. $.fn.enterKey = function (fnc) {
  68. return this.each(function () {
  69. $(this).keypress(function (ev) {
  70. var keycode = (ev.keyCode ? ev.keyCode : ev.which);
  71. if (keycode == '13') {
  72. fnc.call(this, ev);
  73. }
  74. })
  75. })
  76. }
  77. function keepTime() {
  78. if (0 === now) { return; }
  79. var date = new Date(now * 1000);
  80. var text = date.toISOString().substring(0, 19).replace("T", " ");
  81. $("input[name='now']").val(text);
  82. $("span[name='now']").html(text);
  83. $("span[name='ago']").html(ago);
  84. now++;
  85. ago++;
  86. }
  87. // http://www.the-art-of-web.com/javascript/validate-password/
  88. function checkPassword(str) {
  89. // at least one lowercase and one uppercase letter or number
  90. // at least five characters (letters, numbers or special characters)
  91. var re = /^(?=.*[A-Z\d])(?=.*[a-z])[\w~!@#$%^&*\(\)<>,.\?;:{}\[\]\\|]{5,}$/;
  92. return re.test(str);
  93. }
  94. function zeroPad(number, positions) {
  95. var zeros = "";
  96. for (var i = 0; i < positions; i++) {
  97. zeros += "0";
  98. }
  99. return (zeros + number).slice(-positions);
  100. }
  101. function loadTimeZones() {
  102. var time_zones = [
  103. -720, -660, -600, -570, -540,
  104. -480, -420, -360, -300, -240,
  105. -210, -180, -120, -60, 0,
  106. 60, 120, 180, 210, 240,
  107. 270, 300, 330, 345, 360,
  108. 390, 420, 480, 510, 525,
  109. 540, 570, 600, 630, 660,
  110. 720, 765, 780, 840
  111. ];
  112. for (var i in time_zones) {
  113. var value = time_zones[i];
  114. var offset = value >= 0 ? value : -value;
  115. var text = "GMT" + (value >= 0 ? "+" : "-") +
  116. zeroPad(parseInt(offset / 60, 10), 2) + ":" +
  117. zeroPad(offset % 60, 2);
  118. $("select[name='ntpOffset']").append(
  119. $("<option></option>").
  120. attr("value",value).
  121. text(text));
  122. }
  123. }
  124. function validateForm(form) {
  125. // password
  126. var adminPass1 = $("input[name='adminPass']", form).first().val();
  127. if (adminPass1.length > 0 && !checkPassword(adminPass1)) {
  128. alert("The password you have entered is not valid, it must have at least 5 characters, 1 lowercase and 1 uppercase or number!");
  129. return false;
  130. }
  131. var adminPass2 = $("input[name='adminPass']", form).last().val();
  132. if (adminPass1 !== adminPass2) {
  133. alert("Passwords are different!");
  134. return false;
  135. }
  136. return true;
  137. }
  138. function getValue(element) {
  139. if ($(element).attr("type") === "checkbox") {
  140. return $(element).is(":checked") ? 1 : 0;
  141. } else if ($(element).attr("type") === "radio") {
  142. if (!$(element).is(":checked")) {
  143. return null;
  144. }
  145. }
  146. return $(element).val();
  147. }
  148. function addValue(data, name, value) {
  149. // These fields will always be a list of values
  150. var is_group = [
  151. "ssid", "pass", "gw", "mask", "ip", "dns",
  152. "schEnabled", "schSwitch","schAction","schType","schHour","schMinute","schWDs",
  153. "relayBoot", "relayPulse", "relayTime",
  154. "mqttGroup", "mqttGroupInv", "relayOnDisc",
  155. "dczRelayIdx", "dczMagnitude",
  156. "tspkRelay", "tspkMagnitude",
  157. "ledMode",
  158. "adminPass"
  159. ];
  160. if (name in data) {
  161. if (!Array.isArray(data[name])) {
  162. data[name] = [data[name]];
  163. }
  164. data[name].push(value);
  165. } else if (is_group.indexOf(name) >= 0) {
  166. data[name] = [value];
  167. } else {
  168. data[name] = value;
  169. }
  170. }
  171. function getData(form) {
  172. var data = {};
  173. // Populate data
  174. $("input,select", form).each(function() {
  175. var name = $(this).attr("name");
  176. var value = getValue(this);
  177. if (null !== value) {
  178. addValue(data, name, value);
  179. }
  180. });
  181. // Post process
  182. addValue(data, "schSwitch", 0xFF);
  183. delete data["filename"];
  184. delete data["rfbcode"];
  185. return data;
  186. }
  187. function randomString(length, chars) {
  188. var mask = "";
  189. if (chars.indexOf("a") > -1) { mask += "abcdefghijklmnopqrstuvwxyz"; }
  190. if (chars.indexOf("A") > -1) { mask += "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; }
  191. if (chars.indexOf("#") > -1) { mask += "0123456789"; }
  192. if (chars.indexOf("@") > -1) { mask += "ABCDEF"; }
  193. if (chars.indexOf("!") > -1) { mask += "~`!@#$%^&*()_+-={}[]:\";'<>?,./|\\"; }
  194. var result = "";
  195. for (var i = length; i > 0; --i) {
  196. result += mask[Math.round(Math.random() * (mask.length - 1))];
  197. }
  198. return result;
  199. }
  200. function generateAPIKey() {
  201. var apikey = randomString(16, "@#");
  202. $("input[name='apiKey']").val(apikey);
  203. return false;
  204. }
  205. function getJson(str) {
  206. try {
  207. return JSON.parse(str);
  208. } catch (e) {
  209. return false;
  210. }
  211. }
  212. // -----------------------------------------------------------------------------
  213. // Actions
  214. // -----------------------------------------------------------------------------
  215. function sendAction(action, data) {
  216. websock.send(JSON.stringify({action: action, data: data}));
  217. }
  218. function sendConfig(data) {
  219. websock.send(JSON.stringify({config: data}));
  220. }
  221. function resetOriginals() {
  222. $("input,select").each(function() {
  223. $(this).attr("original", $(this).val());
  224. });
  225. numReboot = numReconnect = numReload = 0;
  226. }
  227. function doReload(milliseconds) {
  228. setTimeout(function() {
  229. window.location.reload();
  230. }, parseInt(milliseconds, 10));
  231. }
  232. /**
  233. * Check a file object to see if it is a valid firmware image
  234. * The file first byte should be 0xE9
  235. * @param {file} file File object
  236. * @param {Function} callback Function to call back with the result
  237. */
  238. function checkFirmware(file, callback) {
  239. var reader = new FileReader();
  240. reader.onloadend = function(evt) {
  241. if (FileReader.DONE === evt.target.readyState) {
  242. callback(0xE9 === evt.target.result.charCodeAt(0));
  243. }
  244. };
  245. var blob = file.slice(0, 1);
  246. reader.readAsBinaryString(blob);
  247. }
  248. function doUpgrade() {
  249. var file = $("input[name='upgrade']")[0].files[0];
  250. if (typeof file === "undefined") {
  251. alert("First you have to select a file from your computer.");
  252. return false;
  253. }
  254. if (file.size > free_size) {
  255. alert("Image it too large to fit in the available space for OTA. Consider doing a two-step update.");
  256. return false;
  257. }
  258. checkFirmware(file, function(ok) {
  259. if (!ok) {
  260. alert("The file does not seem to be a valid firmware image.");
  261. return;
  262. }
  263. var data = new FormData();
  264. data.append("upgrade", file, file.name);
  265. $.ajax({
  266. // Your server script to process the upload
  267. url: webhost + "upgrade",
  268. type: "POST",
  269. // Form data
  270. data: data,
  271. // Tell jQuery not to process data or worry about content-type
  272. // You *must* include these options!
  273. cache: false,
  274. contentType: false,
  275. processData: false,
  276. success: function(data, text) {
  277. $("#upgrade-progress").hide();
  278. if ("OK" === data) {
  279. alert("Firmware image uploaded, board rebooting. This page will be refreshed in 5 seconds.");
  280. doReload(5000);
  281. } else {
  282. alert("There was an error trying to upload the new image, please try again (" + data + ").");
  283. }
  284. },
  285. // Custom XMLHttpRequest
  286. xhr: function() {
  287. $("#upgrade-progress").show();
  288. var myXhr = $.ajaxSettings.xhr();
  289. if (myXhr.upload) {
  290. // For handling the progress of the upload
  291. myXhr.upload.addEventListener("progress", function(e) {
  292. if (e.lengthComputable) {
  293. $("progress").attr({ value: e.loaded, max: e.total });
  294. }
  295. } , false);
  296. }
  297. return myXhr;
  298. }
  299. });
  300. });
  301. return false;
  302. }
  303. function doUpdatePassword() {
  304. var form = $("#formPassword");
  305. if (validateForm(form)) {
  306. sendConfig(getData(form));
  307. }
  308. return false;
  309. }
  310. function checkChanges() {
  311. if (numChanged > 0) {
  312. var response = window.confirm("Some changes have not been saved yet, do you want to save them first?");
  313. if (response) {
  314. doUpdate();
  315. }
  316. }
  317. }
  318. function doAction(question, action) {
  319. checkChanges();
  320. if (question) {
  321. var response = window.confirm(question);
  322. if (false === response) {
  323. return false;
  324. }
  325. }
  326. sendAction(action, {});
  327. doReload(5000);
  328. return false;
  329. }
  330. function doReboot(ask) {
  331. var question = (typeof ask === "undefined" || false === ask) ?
  332. null :
  333. "Are you sure you want to reboot the device?";
  334. return doAction(question, "reboot");
  335. }
  336. function doReconnect(ask) {
  337. var question = (typeof ask === "undefined" || false === ask) ?
  338. null :
  339. "Are you sure you want to disconnect from the current WIFI network?";
  340. return doAction(question, "reconnect");
  341. }
  342. function doUpdate() {
  343. var form = $("#formSave");
  344. if (validateForm(form)) {
  345. // Get data
  346. sendConfig(getData(form));
  347. // Empty special fields
  348. $(".pwrExpected").val(0);
  349. $("input[name='pwrResetCalibration']").
  350. prop("checked", false).
  351. iphoneStyle("refresh");
  352. // Change handling
  353. numChanged = 0;
  354. setTimeout(function() {
  355. var response;
  356. if (numReboot > 0) {
  357. response = window.confirm("You have to reboot the board for the changes to take effect, do you want to do it now?");
  358. if (response) { doReboot(false); }
  359. } else if (numReconnect > 0) {
  360. response = window.confirm("You have to reconnect to the WiFi for the changes to take effect, do you want to do it now?");
  361. if (response) { doReconnect(false); }
  362. } else if (numReload > 0) {
  363. response = window.confirm("You have to reload the page to see the latest changes, do you want to do it now?");
  364. if (response) { doReload(0); }
  365. }
  366. resetOriginals();
  367. }, 1000);
  368. }
  369. return false;
  370. }
  371. function doBackup() {
  372. document.getElementById("downloader").src = webhost + "config";
  373. return false;
  374. }
  375. function onFileUpload(event) {
  376. var inputFiles = this.files;
  377. if (typeof inputFiles === "undefined" || inputFiles.length === 0) {
  378. return false;
  379. }
  380. var inputFile = inputFiles[0];
  381. this.value = "";
  382. var response = window.confirm("Previous settings will be overwritten. Are you sure you want to restore this settings?");
  383. if (!response) {
  384. return false;
  385. }
  386. var reader = new FileReader();
  387. reader.onload = function(e) {
  388. var data = getJson(e.target.result);
  389. if (data) {
  390. sendAction("restore", data);
  391. } else {
  392. alert(messages[4]);
  393. }
  394. };
  395. reader.readAsText(inputFile);
  396. return false;
  397. }
  398. function doRestore() {
  399. if (typeof window.FileReader !== "function") {
  400. alert("The file API isn't supported on this browser yet.");
  401. } else {
  402. $("#uploader").click();
  403. }
  404. return false;
  405. }
  406. function doFactoryReset() {
  407. var response = window.confirm("Are you sure you want to restore to factory settings?");
  408. if (response === false) {
  409. return false;
  410. }
  411. websock.send(JSON.stringify({"action": "factory_reset"}));
  412. doReload(5000);
  413. return false;
  414. }
  415. function doToggle(element, value) {
  416. var id = parseInt(element.attr("data"), 10);
  417. sendAction("relay", {id: id, status: value ? 1 : 0 });
  418. return false;
  419. }
  420. function doScan() {
  421. $("#scanResult").html("");
  422. $("div.scan.loading").show();
  423. sendAction("scan", {});
  424. return false;
  425. }
  426. function doHAConfig() {
  427. $("#haConfig").html("");
  428. sendAction("haconfig", {});
  429. return false;
  430. }
  431. function doDebugCommand() {
  432. var el = $("input[name='dbgcmd']");
  433. var command = el.val();
  434. el.val("");
  435. sendAction("dbgcmd", {command: command});
  436. return false;
  437. }
  438. // -----------------------------------------------------------------------------
  439. // Visualization
  440. // -----------------------------------------------------------------------------
  441. function toggleMenu() {
  442. $("#layout").toggleClass("active");
  443. $("#menu").toggleClass("active");
  444. $("#menuLink").toggleClass("active");
  445. }
  446. function showPanel() {
  447. $(".panel").hide();
  448. $("#" + $(this).attr("data")).show();
  449. if ($("#layout").hasClass("active")) { toggleMenu(); }
  450. $("input[type='checkbox']").
  451. iphoneStyle("calculateDimensions").
  452. iphoneStyle("refresh");
  453. }
  454. // -----------------------------------------------------------------------------
  455. // Relays & magnitudes mapping
  456. // -----------------------------------------------------------------------------
  457. function createRelayList(data, container, template_name) {
  458. var current = $("#" + container + " > div").length;
  459. if (current > 0) { return; }
  460. var template = $("#" + template_name + " .pure-g")[0];
  461. for (var i in data) {
  462. var line = $(template).clone();
  463. $("label", line).html("Switch #" + i);
  464. $("input", line).attr("tabindex", 40 + i).val(data[i]);
  465. line.appendTo("#" + container);
  466. }
  467. }
  468. function createMagnitudeList(data, container, template_name) {
  469. var current = $("#" + container + " > div").length;
  470. if (current > 0) { return; }
  471. var template = $("#" + template_name + " .pure-g")[0];
  472. for (var i in data) {
  473. var magnitude = data[i];
  474. var line = $(template).clone();
  475. $("label", line).html(magnitudeType(magnitude.type) + " #" + parseInt(magnitude.index, 10));
  476. $("div.hint", line).html(magnitude.name);
  477. $("input", line).attr("tabindex", 40 + i).val(magnitude.idx);
  478. line.appendTo("#" + container);
  479. }
  480. }
  481. // -----------------------------------------------------------------------------
  482. // Wifi
  483. // -----------------------------------------------------------------------------
  484. function delNetwork() {
  485. var parent = $(this).parents(".pure-g");
  486. $(parent).remove();
  487. }
  488. function moreNetwork() {
  489. var parent = $(this).parents(".pure-g");
  490. $(".more", parent).toggle();
  491. }
  492. function addNetwork() {
  493. var numNetworks = $("#networks > div").length;
  494. if (numNetworks >= maxNetworks) {
  495. alert("Max number of networks reached");
  496. return null;
  497. }
  498. var tabindex = 200 + numNetworks * 10;
  499. var template = $("#networkTemplate").children();
  500. var line = $(template).clone();
  501. $(line).find("input").each(function() {
  502. $(this).attr("tabindex", tabindex);
  503. tabindex++;
  504. });
  505. $(line).find(".button-del-network").on("click", delNetwork);
  506. $(line).find(".button-more-network").on("click", moreNetwork);
  507. line.appendTo("#networks");
  508. return line;
  509. }
  510. // -----------------------------------------------------------------------------
  511. // Relays scheduler
  512. // -----------------------------------------------------------------------------
  513. function delSchedule() {
  514. var parent = $(this).parents(".pure-g");
  515. $(parent).remove();
  516. }
  517. function moreSchedule() {
  518. var parent = $(this).parents(".pure-g");
  519. $("div.more", parent).toggle();
  520. }
  521. function addSchedule(event) {
  522. var numSchedules = $("#schedules > div").length;
  523. if (numSchedules >= maxSchedules) {
  524. alert("Max number of schedules reached");
  525. return null;
  526. }
  527. var tabindex = 200 + numSchedules * 10;
  528. var template = $("#scheduleTemplate").children();
  529. var line = $(template).clone();
  530. var type = (1 === event.data.schType) ? "switch" : "light";
  531. template = $("#" + type + "ActionTemplate").children();
  532. var actionLine = template.clone();
  533. $(line).find("#schActionDiv").append(actionLine);
  534. $(line).find("input").each(function() {
  535. $(this).attr("tabindex", tabindex);
  536. tabindex++;
  537. });
  538. $(line).find(".button-del-schedule").on("click", delSchedule);
  539. $(line).find(".button-more-schedule").on("click", moreSchedule);
  540. var ena = $(line).find(":checkbox");
  541. ena.prop("checked", false).iphoneStyle("refresh");
  542. line.appendTo("#schedules");
  543. return line;
  544. }
  545. // -----------------------------------------------------------------------------
  546. // Relays
  547. // -----------------------------------------------------------------------------
  548. function initRelays(data) {
  549. var current = $("#relays > div").length;
  550. if (current > 0) { return; }
  551. var template = $("#relayTemplate .pure-g")[0];
  552. for (var i=0; i<data.length; i++) {
  553. // Add relay fields
  554. var line = $(template).clone();
  555. $(".id", line).html(i);
  556. $("input", line).attr("data", i);
  557. line.appendTo("#relays");
  558. $(":checkbox", line).iphoneStyle({
  559. onChange: doToggle,
  560. resizeContainer: true,
  561. resizeHandle: true,
  562. checkedLabel: "ON",
  563. uncheckedLabel: "OFF"
  564. });
  565. // Populate the relay SELECTs
  566. $("select.isrelay").append(
  567. $("<option></option>").attr("value",i).text("Switch #" + i));
  568. }
  569. }
  570. function initRelayConfig(data) {
  571. var current = $("#relayConfig > div").length;
  572. if (current > 0) { return; }
  573. var template = $("#relayConfigTemplate").children();
  574. for (var i in data) {
  575. var relay = data[i];
  576. var line = $(template).clone();
  577. $("span.gpio", line).html(relay.gpio);
  578. $("span.id", line).html(i);
  579. $("select[name='relayBoot']", line).val(relay.boot);
  580. $("select[name='relayPulse']", line).val(relay.pulse);
  581. $("input[name='relayTime']", line).val(relay.pulse_ms);
  582. $("input[name='mqttGroup']", line).val(relay.group);
  583. $("select[name='mqttGroupInv']", line).val(relay.group_inv);
  584. $("select[name='relayOnDisc']", line).val(relay.on_disc);
  585. line.appendTo("#relayConfig");
  586. }
  587. }
  588. // -----------------------------------------------------------------------------
  589. // Sensors & Magnitudes
  590. // -----------------------------------------------------------------------------
  591. function initMagnitudes(data) {
  592. // check if already initialized
  593. var done = $("#magnitudes > div").length;
  594. if (done > 0) { return; }
  595. // add templates
  596. var template = $("#magnitudeTemplate").children();
  597. for (var i in data) {
  598. var magnitude = data[i];
  599. var line = $(template).clone();
  600. $("label", line).html(magnitudeType(magnitude.type) + " #" + parseInt(magnitude.index, 10));
  601. $("div.hint", line).html(magnitude.description);
  602. $("input", line).attr("data", i);
  603. line.appendTo("#magnitudes");
  604. }
  605. }
  606. // -----------------------------------------------------------------------------
  607. // Lights
  608. // -----------------------------------------------------------------------------
  609. function initColorRGB() {
  610. // check if already initialized
  611. var done = $("#colors > div").length;
  612. if (done > 0) { return; }
  613. // add template
  614. var template = $("#colorRGBTemplate").children();
  615. var line = $(template).clone();
  616. line.appendTo("#colors");
  617. // init color wheel
  618. $("input[name='color']").wheelColorPicker({
  619. sliders: "wrgbp"
  620. }).on("sliderup", function() {
  621. var value = $(this).wheelColorPicker("getValue", "css");
  622. sendAction("color", {rgb: value});
  623. });
  624. // init bright slider
  625. $("#brightness").on("change", function() {
  626. var value = $(this).val();
  627. var parent = $(this).parents(".pure-g");
  628. $("span", parent).html(value);
  629. sendAction("color", {brightness: value});
  630. });
  631. }
  632. function initColorHSV() {
  633. // check if already initialized
  634. var done = $("#colors > div").length;
  635. if (done > 0) { return; }
  636. // add template
  637. var template = $("#colorHSVTemplate").children();
  638. var line = $(template).clone();
  639. line.appendTo("#colors");
  640. // init color wheel
  641. $("input[name='color']").wheelColorPicker({
  642. sliders: "whsvp"
  643. }).on("sliderup", function() {
  644. var color = $(this).wheelColorPicker("getColor");
  645. var value = parseInt(color.h * 360, 10) + "," + parseInt(color.s * 100, 10) + "," + parseInt(color.v * 100, 10);
  646. sendAction("color", {hsv: value});
  647. });
  648. }
  649. function initChannels(num) {
  650. // check if already initialized
  651. var done = $("#channels > div").length > 0;
  652. if (done) { return; }
  653. // does it have color channels?
  654. var colors = $("#colors > div").length > 0;
  655. // calculate channels to create
  656. var max = num;
  657. if (colors) {
  658. max = num % 3;
  659. if ((max > 0) & useWhite) {
  660. max--;
  661. }
  662. }
  663. var start = num - max;
  664. var onChannelSliderChange = function() {
  665. var id = $(this).attr("data");
  666. var value = $(this).val();
  667. var parent = $(this).parents(".pure-g");
  668. $("span", parent).html(value);
  669. sendAction("channel", {id: id, value: value});
  670. };
  671. // add templates
  672. var template = $("#channelTemplate").children();
  673. for (var i=0; i<max; i++) {
  674. var channel_id = start + i;
  675. var line = $(template).clone();
  676. $("span.slider", line).attr("data", channel_id);
  677. $("input.slider", line).attr("data", channel_id).on("change", onChannelSliderChange);
  678. $("label", line).html("Channel " + (channel_id + 1));
  679. line.appendTo("#channels");
  680. $("select.islight").append(
  681. $("<option></option>").attr("value",i).text("Channel #" + i));
  682. }
  683. }
  684. // -----------------------------------------------------------------------------
  685. // RFBridge
  686. // -----------------------------------------------------------------------------
  687. function rfbLearn() {
  688. var parent = $(this).parents(".pure-g");
  689. var input = $("input", parent);
  690. sendAction("rfblearn", {id: input.attr("data-id"), status: input.attr("data-status")});
  691. }
  692. function rfbForget() {
  693. var parent = $(this).parents(".pure-g");
  694. var input = $("input", parent);
  695. sendAction("rfbforget", {id: input.attr("data-id"), status: input.attr("data-status")});
  696. }
  697. function rfbSend() {
  698. var parent = $(this).parents(".pure-g");
  699. var input = $("input", parent);
  700. sendAction("rfbsend", {id: input.attr("data-id"), status: input.attr("data-status"), data: input.val()});
  701. }
  702. function addRfbNode() {
  703. var numNodes = $("#rfbNodes > legend").length;
  704. var template = $("#rfbNodeTemplate").children();
  705. var line = $(template).clone();
  706. var status = true;
  707. $("span", line).html(numNodes);
  708. $(line).find("input").each(function() {
  709. $(this).attr("data-id", numNodes);
  710. $(this).attr("data-status", status ? 1 : 0);
  711. status = !status;
  712. });
  713. $(line).find(".button-rfb-learn").on("click", rfbLearn);
  714. $(line).find(".button-rfb-forget").on("click", rfbForget);
  715. $(line).find(".button-rfb-send").on("click", rfbSend);
  716. line.appendTo("#rfbNodes");
  717. return line;
  718. }
  719. // -----------------------------------------------------------------------------
  720. // Processing
  721. // -----------------------------------------------------------------------------
  722. function processData(data) {
  723. // title
  724. if ("app_name" in data) {
  725. var title = data.app_name;
  726. if ("app_version" in data) {
  727. title = title + " " + data.app_version;
  728. }
  729. $("span[name=title]").html(title);
  730. if ("hostname" in data) {
  731. title = data.hostname + " - " + title;
  732. }
  733. document.title = title;
  734. }
  735. Object.keys(data).forEach(function(key) {
  736. var i;
  737. var value = data[key];
  738. // ---------------------------------------------------------------------
  739. // Web mode
  740. // ---------------------------------------------------------------------
  741. if ("webMode" === key) {
  742. password = (1 === value);
  743. $("#layout").toggle(!password);
  744. $("#password").toggle(password);
  745. }
  746. // ---------------------------------------------------------------------
  747. // Actions
  748. // ---------------------------------------------------------------------
  749. if ("action" === key) {
  750. if ("reload" === data.action) { doReload(1000); }
  751. return;
  752. }
  753. // ---------------------------------------------------------------------
  754. // RFBridge
  755. // ---------------------------------------------------------------------
  756. if ("rfbCount" === key) {
  757. for (i=0; i<data.rfbCount; i++) { addRfbNode(); }
  758. return;
  759. }
  760. if ("rfbrawVisible" === key) {
  761. $("input[name='rfbcode']").attr("maxlength", 116);
  762. }
  763. if ("rfb" === key) {
  764. var nodes = data.rfb;
  765. for (i in nodes) {
  766. var node = nodes[i];
  767. $("input[name='rfbcode'][data-id='" + node.id + "'][data-status='" + node.status + "']").val(node.data);
  768. }
  769. return;
  770. }
  771. // ---------------------------------------------------------------------
  772. // Lights
  773. // ---------------------------------------------------------------------
  774. if ("rgb" === key) {
  775. initColorRGB();
  776. $("input[name='color']").wheelColorPicker("setValue", value, true);
  777. return;
  778. }
  779. if ("hsv" === key) {
  780. initColorHSV();
  781. // wheelColorPicker expects HSV to be between 0 and 1 all of them
  782. var chunks = value.split(",");
  783. var obj = {};
  784. obj.h = chunks[0] / 360;
  785. obj.s = chunks[1] / 100;
  786. obj.v = chunks[2] / 100;
  787. $("input[name='color']").wheelColorPicker("setColor", obj);
  788. return;
  789. }
  790. if ("brightness" === key) {
  791. $("#brightness").val(value);
  792. $("span.brightness").html(value);
  793. return;
  794. }
  795. if ("channels" === key) {
  796. var len = value.length;
  797. initChannels(len);
  798. for (i in value) {
  799. var ch = value[i];
  800. $("input.slider[data=" + i + "]").val(ch);
  801. $("span.slider[data=" + i + "]").html(ch);
  802. }
  803. return;
  804. }
  805. if ("useWhite" === key) {
  806. useWhite = value;
  807. }
  808. if ("colorVisible" === key) {
  809. $(".button-add-light-schedule").show();
  810. }
  811. if ("relayVisible" === key) {
  812. $(".button-add-switch-schedule").show();
  813. }
  814. // ---------------------------------------------------------------------
  815. // Sensors & Magnitudes
  816. // ---------------------------------------------------------------------
  817. if ("magnitudes" === key) {
  818. initMagnitudes(value);
  819. for (i in value) {
  820. var magnitude = value[i];
  821. var error = magnitude.error || 0;
  822. var text = (0 === error) ?
  823. magnitude.value + magnitude.units :
  824. magnitudeError(error);
  825. $("input[name='magnitude'][data='" + i + "']").val(text);
  826. }
  827. return;
  828. }
  829. // ---------------------------------------------------------------------
  830. // WiFi
  831. // ---------------------------------------------------------------------
  832. if ("maxNetworks" === key) {
  833. maxNetworks = parseInt(value, 10);
  834. return;
  835. }
  836. if ("wifi" === key) {
  837. for (i in value) {
  838. var wifi = value[i];
  839. var nwk_line = addNetwork();
  840. Object.keys(wifi).forEach(function(key) {
  841. $("input[name='" + key + "']", nwk_line).val(wifi[key]);
  842. });
  843. }
  844. return;
  845. }
  846. if ("scanResult" === key) {
  847. $("div.scan.loading").hide();
  848. $("#scanResult").show();
  849. }
  850. // -----------------------------------------------------------------------------
  851. // Home Assistant
  852. // -----------------------------------------------------------------------------
  853. if ("haConfig" === key) {
  854. $("#haConfig").show();
  855. }
  856. // -----------------------------------------------------------------------------
  857. // Relays scheduler
  858. // -----------------------------------------------------------------------------
  859. if ("maxSchedules" === key) {
  860. maxSchedules = parseInt(value, 10);
  861. return;
  862. }
  863. if ("schedule" === key) {
  864. for (i in value) {
  865. var schedule = value[i];
  866. var sch_line = addSchedule({ data: {schType: schedule["schType"] }});
  867. Object.keys(schedule).forEach(function(key) {
  868. var sch_value = schedule[key];
  869. $("input[name='" + key + "']", sch_line).val(sch_value);
  870. $("select[name='" + key + "']", sch_line).prop("value", sch_value);
  871. $(":checkbox[name='" + key + "']", sch_line).
  872. prop("checked", sch_value).
  873. iphoneStyle("refresh");
  874. });
  875. }
  876. return;
  877. }
  878. // ---------------------------------------------------------------------
  879. // Relays
  880. // ---------------------------------------------------------------------
  881. if ("relayStatus" === key) {
  882. initRelays(value);
  883. for (i in value) {
  884. // Set the status for each relay
  885. $("input.relayStatus[data='" + i + "']").
  886. prop("checked", value[i]).
  887. iphoneStyle("refresh");
  888. }
  889. return;
  890. }
  891. // Relay configuration
  892. if ("relayConfig" === key) {
  893. initRelayConfig(value);
  894. return;
  895. }
  896. // ---------------------------------------------------------------------
  897. // Domoticz
  898. // ---------------------------------------------------------------------
  899. // Domoticz - Relays
  900. if ("dczRelays" === key) {
  901. createRelayList(value, "dczRelays", "dczRelayTemplate");
  902. return;
  903. }
  904. // Domoticz - Magnitudes
  905. if ("dczMagnitudes" === key) {
  906. createMagnitudeList(value, "dczMagnitudes", "dczMagnitudeTemplate");
  907. return;
  908. }
  909. // ---------------------------------------------------------------------
  910. // Thingspeak
  911. // ---------------------------------------------------------------------
  912. // Thingspeak - Relays
  913. if ("tspkRelays" === key) {
  914. createRelayList(value, "tspkRelays", "tspkRelayTemplate");
  915. return;
  916. }
  917. // Thingspeak - Magnitudes
  918. if ("tspkMagnitudes" === key) {
  919. createMagnitudeList(value, "tspkMagnitudes", "tspkMagnitudeTemplate");
  920. return;
  921. }
  922. // ---------------------------------------------------------------------
  923. // General
  924. // ---------------------------------------------------------------------
  925. // Messages
  926. if ("message" === key) {
  927. window.alert(messages[value]);
  928. return;
  929. }
  930. // Web log
  931. if ("weblog" === key) {
  932. $("#weblog").append(value);
  933. $("#weblog").scrollTop($("#weblog")[0].scrollHeight - $("#weblog").height());
  934. return;
  935. }
  936. // Enable options
  937. var position = key.indexOf("Visible");
  938. if (position > 0 && position === key.length - 7) {
  939. var module = key.slice(0,-7);
  940. $(".module-" + module).show();
  941. return;
  942. }
  943. if ("now" === key) {
  944. now = value;
  945. ago = 0;
  946. return;
  947. }
  948. if ("free_size" === key) {
  949. free_size = parseInt(value, 10);
  950. }
  951. // Pre-process
  952. if ("network" === key) {
  953. value = value.toUpperCase();
  954. }
  955. if ("mqttStatus" === key) {
  956. value = value ? "CONNECTED" : "NOT CONNECTED";
  957. }
  958. if ("ntpStatus" === key) {
  959. value = value ? "SYNC'D" : "NOT SYNC'D";
  960. }
  961. if ("uptime" === key) {
  962. var uptime = parseInt(value, 10);
  963. var seconds = uptime % 60; uptime = parseInt(uptime / 60, 10);
  964. var minutes = uptime % 60; uptime = parseInt(uptime / 60, 10);
  965. var hours = uptime % 24; uptime = parseInt(uptime / 24, 10);
  966. var days = uptime;
  967. value = days + "d " + zeroPad(hours, 2) + "h " + zeroPad(minutes, 2) + "m " + zeroPad(seconds, 2) + "s";
  968. }
  969. // ---------------------------------------------------------------------
  970. // Matching
  971. // ---------------------------------------------------------------------
  972. var pre;
  973. var post;
  974. // Look for INPUTs
  975. var input = $("input[name='" + key + "']");
  976. if (input.length > 0) {
  977. if (input.attr("type") === "checkbox") {
  978. input.
  979. prop("checked", value).
  980. iphoneStyle("refresh");
  981. } else if (input.attr("type") === "radio") {
  982. input.val([value]);
  983. } else {
  984. pre = input.attr("pre") || "";
  985. post = input.attr("post") || "";
  986. input.val(pre + value + post);
  987. }
  988. }
  989. // Look for SPANs
  990. var span = $("span[name='" + key + "']");
  991. if (span.length > 0) {
  992. pre = span.attr("pre") || "";
  993. post = span.attr("post") || "";
  994. span.html(pre + value + post);
  995. }
  996. // Look for SELECTs
  997. var select = $("select[name='" + key + "']");
  998. if (select.length > 0) {
  999. select.val(value);
  1000. }
  1001. });
  1002. // Auto generate an APIKey if none defined yet
  1003. if ($("input[name='apiKey']").val() === "") {
  1004. generateAPIKey();
  1005. }
  1006. resetOriginals();
  1007. }
  1008. function hasChanged() {
  1009. var newValue, originalValue;
  1010. if ($(this).attr("type") === "checkbox") {
  1011. newValue = $(this).prop("checked");
  1012. originalValue = ($(this).attr("original") === "true");
  1013. } else {
  1014. newValue = $(this).val();
  1015. originalValue = $(this).attr("original");
  1016. }
  1017. var hasChanged = $(this).attr("hasChanged") || 0;
  1018. var action = $(this).attr("action");
  1019. if (typeof originalValue === "undefined") { return; }
  1020. if ("none" === action) { return; }
  1021. if (newValue !== originalValue) {
  1022. if (0 === hasChanged) {
  1023. ++numChanged;
  1024. if ("reconnect" === action) { ++numReconnect; }
  1025. if ("reboot" === action) { ++numReboot; }
  1026. if ("reload" === action) { ++numReload; }
  1027. $(this).attr("hasChanged", 1);
  1028. }
  1029. } else {
  1030. if (1 === hasChanged) {
  1031. --numChanged;
  1032. if ("reconnect" === action) { --numReconnect; }
  1033. if ("reboot" === action) { --numReboot; }
  1034. if ("reload" === action) { --numReload; }
  1035. $(this).attr("hasChanged", 0);
  1036. }
  1037. }
  1038. }
  1039. // -----------------------------------------------------------------------------
  1040. // Init & connect
  1041. // -----------------------------------------------------------------------------
  1042. function connect(host) {
  1043. if (typeof host === "undefined") {
  1044. host = window.location.href.replace("#", "");
  1045. } else {
  1046. if (host.indexOf("http") !== 0) {
  1047. host = "http://" + host + "/";
  1048. }
  1049. }
  1050. if (host.indexOf("http") !== 0) { return; }
  1051. webhost = host;
  1052. wshost = host.replace("http", "ws") + "ws";
  1053. if (websock) { websock.close(); }
  1054. websock = new WebSocket(wshost);
  1055. websock.onmessage = function(evt) {
  1056. var data = getJson(evt.data.replace(/\n/g, "\\n").replace(/\r/g, "\\r").replace(/\t/g, "\\t"));
  1057. if (data) {
  1058. processData(data);
  1059. }
  1060. };
  1061. }
  1062. $(function() {
  1063. initMessages();
  1064. loadTimeZones();
  1065. setInterval(function() { keepTime(); }, 1000);
  1066. $("#menuLink").on("click", toggleMenu);
  1067. $(".pure-menu-link").on("click", showPanel);
  1068. $("progress").attr({ value: 0, max: 100 });
  1069. $(".button-update").on("click", doUpdate);
  1070. $(".button-update-password").on("click", doUpdatePassword);
  1071. $(".button-reboot").on("click", doReboot);
  1072. $(".button-reconnect").on("click", doReconnect);
  1073. $(".button-wifi-scan").on("click", doScan);
  1074. $(".button-ha-config").on("click", doHAConfig);
  1075. $(".button-dbgcmd").on("click", doDebugCommand);
  1076. $("input[name='dbgcmd']").enterKey(doDebugCommand);
  1077. $(".button-settings-backup").on("click", doBackup);
  1078. $(".button-settings-restore").on("click", doRestore);
  1079. $(".button-settings-factory").on("click", doFactoryReset);
  1080. $("#uploader").on("change", onFileUpload);
  1081. $(".button-upgrade").on("click", doUpgrade);
  1082. $(".button-apikey").on("click", generateAPIKey);
  1083. $(".button-upgrade-browse").on("click", function() {
  1084. $("input[name='upgrade']")[0].click();
  1085. return false;
  1086. });
  1087. $("input[name='upgrade']").change(function (){
  1088. var file = this.files[0];
  1089. $("input[name='filename']").val(file.name);
  1090. });
  1091. $(".button-add-network").on("click", function() {
  1092. $(".more", addNetwork()).toggle();
  1093. });
  1094. $(".button-add-switch-schedule").on("click", { schType: "1" }, addSchedule);
  1095. $(".button-add-light-schedule").on("click", { schType: "2" }, addSchedule);
  1096. $(document).on("change", "input", hasChanged);
  1097. $(document).on("change", "select", hasChanged);
  1098. connect();
  1099. });