MQTT smart home web interface
Du kannst nicht mehr als 25 Themen auswählen Themen müssen mit entweder einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

lights.js 8.9KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265
  1. // --------------------------
  2. // bathroom
  3. // --------------------------
  4. const btnsBath = document.querySelectorAll("#bathroomlightauto, #bathroomlightbig, #bathroomlightsmall, #bathroomlightoff")
  5. // handle changes to bathroom lights
  6. subscribeTopic("bathroom/force_light", function (msg) {
  7. // clear all buttons
  8. for (const btn of btnsBath) {
  9. btn.checked = false
  10. }
  11. // activate proper button
  12. if (msg == "none") {
  13. const btn = document.querySelector("#bathroomlightauto")
  14. btn.checked = true
  15. } else if (msg == "big") {
  16. const btn = document.querySelector("#bathroomlightbig")
  17. btn.checked = true
  18. } else if (msg == "small") {
  19. const btn = document.querySelector("#bathroomlightsmall")
  20. btn.checked = true
  21. } else if (msg == "off") {
  22. const btn = document.querySelector("#bathroomlightoff")
  23. btn.checked = true
  24. } else {
  25. console.log("unknown bathroom/force_light msg " + msg)
  26. }
  27. })
  28. // set new bathroom light state
  29. for (const btn of btnsBath) {
  30. btn.addEventListener('change', function (e) {
  31. if (this.checked) {
  32. if (this == document.querySelector("#bathroomlightauto")) {
  33. setTopic("bathroom/force_light", "none")
  34. } else if (this == document.querySelector("#bathroomlightbig")) {
  35. setTopic("bathroom/force_light", "big")
  36. } else if (this == document.querySelector("#bathroomlightsmall")) {
  37. setTopic("bathroom/force_light", "small")
  38. } else if (this == document.querySelector("#bathroomlightoff")) {
  39. setTopic("bathroom/force_light", "off")
  40. } else {
  41. console.log("unknown bathroom/force_light btn value " + this.value)
  42. }
  43. }
  44. })
  45. }
  46. // handle bathroom sensors
  47. subscribeSensor("bathroom/temperature", "°C", "#bathtemp")
  48. subscribeSensor("bathroom/humidity", "%", "#bathhumid")
  49. subscribeSensor("bathroom/pressure", "mbar", "#bathpress", 100.0)
  50. subscribeSensor("bathroom/tvoc", "ppb", "#bathtvoc")
  51. subscribeSensor("bathroom/eco2", "ppm", "#batheco2")
  52. // --------------------------
  53. // livingroom
  54. // --------------------------
  55. const btnsKitchen = document.querySelectorAll("#kitchenon, #kitchenoff")
  56. const btnsWorkspace = document.querySelectorAll("#workspaceon, #workspaceoff, #workspacepc, #workspacebench")
  57. const btnsTv = document.querySelectorAll("#tvon, #tvamp, #tvbox, #tvoff")
  58. // handle changes to kitchen lights
  59. subscribeTopic("livingroom/light_kitchen", function (msg) {
  60. // clear all buttons
  61. for (const btn of btnsKitchen) {
  62. btn.checked = false
  63. }
  64. // activate proper button
  65. if (msg == "on") {
  66. const btn = document.querySelector("#kitchenon")
  67. btn.checked = true
  68. } else if (msg == "off") {
  69. const btn = document.querySelector("#kitchenoff")
  70. btn.checked = true
  71. } else {
  72. console.log("unknown livingroom/light_kitchen msg " + msg)
  73. }
  74. })
  75. // set new kitchen light state
  76. for (const btn of btnsKitchen) {
  77. btn.addEventListener('change', function (e) {
  78. if (this.checked) {
  79. if (this == document.querySelector("#kitchenon")) {
  80. setTopic("livingroom/light_kitchen", "on")
  81. } else if (this == document.querySelector("#kitchenoff")) {
  82. setTopic("livingroom/light_kitchen", "off")
  83. } else {
  84. console.log("unknown livingroom/light_kitchen btn value " + this.value)
  85. }
  86. }
  87. })
  88. }
  89. let state_light_pc = 0
  90. let state_light_bench = 0
  91. function setWorkspaceLightsButtons() {
  92. // clear all buttons
  93. for (const btn of btnsWorkspace) {
  94. btn.checked = false
  95. }
  96. // activate proper button
  97. if ((state_light_pc == 1) && (state_light_bench == 1)) {
  98. const btn = document.querySelector("#workspaceon")
  99. btn.checked = true
  100. } else if ((state_light_pc == 1) && (state_light_bench == 0)) {
  101. const btn = document.querySelector("#workspacepc")
  102. btn.checked = true
  103. } else if ((state_light_pc == 0) && (state_light_bench == 1)) {
  104. const btn = document.querySelector("#workspacebench")
  105. btn.checked = true
  106. } else {
  107. const btn = document.querySelector("#workspaceoff")
  108. btn.checked = true
  109. }
  110. }
  111. // handle changes to workspace lights
  112. subscribeTopic("livingroom/light_pc", function (msg) {
  113. if (msg == "on") {
  114. state_light_pc = 1
  115. } else if (msg == "off") {
  116. state_light_pc = 0
  117. } else {
  118. console.log("unknown livingroom/light_pc msg " + msg)
  119. }
  120. setWorkspaceLightsButtons()
  121. })
  122. subscribeTopic("livingroom/light_bench", function (msg) {
  123. if (msg == "on") {
  124. state_light_bench = 1
  125. } else if (msg == "off") {
  126. state_light_bench = 0
  127. } else {
  128. console.log("unknown livingroom/light_bench msg " + msg)
  129. }
  130. setWorkspaceLightsButtons()
  131. })
  132. // set new workspace light state
  133. for (const btn of btnsWorkspace) {
  134. btn.addEventListener('change', function (e) {
  135. if (this.checked) {
  136. if (this == document.querySelector("#workspaceon")) {
  137. state_light_pc = 1
  138. state_light_bench = 1
  139. setTopic("livingroom/light_pc", "on")
  140. setTopic("livingroom/light_bench", "on")
  141. } else if (this == document.querySelector("#workspaceoff")) {
  142. state_light_pc = 0
  143. state_light_bench = 0
  144. setTopic("livingroom/light_pc", "off")
  145. setTopic("livingroom/light_bench", "off")
  146. } else if (this == document.querySelector("#workspacepc")) {
  147. state_light_pc = 1
  148. state_light_bench = 0
  149. setTopic("livingroom/light_pc", "on")
  150. setTopic("livingroom/light_bench", "off")
  151. } else if (this == document.querySelector("#workspacebench")) {
  152. state_light_bench = 1
  153. state_light_pc = 0
  154. setTopic("livingroom/light_bench", "on")
  155. setTopic("livingroom/light_pc", "off")
  156. } else {
  157. console.log("unknown btn value " + this.value)
  158. }
  159. }
  160. })
  161. }
  162. let state_light_amp = 0
  163. let state_light_box = 0
  164. function setTvLightsButtons() {
  165. // clear all buttons
  166. for (const btn of btnsTv) {
  167. btn.checked = false
  168. }
  169. // activate proper button
  170. if ((state_light_amp == 1) && (state_light_box == 1)) {
  171. const btn = document.querySelector("#tvon")
  172. btn.checked = true
  173. } else if ((state_light_amp == 1) && (state_light_box == 0)) {
  174. const btn = document.querySelector("#tvamp")
  175. btn.checked = true
  176. } else if ((state_light_amp == 0) && (state_light_box == 1)) {
  177. const btn = document.querySelector("#tvbox")
  178. btn.checked = true
  179. } else {
  180. const btn = document.querySelector("#tvoff")
  181. btn.checked = true
  182. }
  183. }
  184. // handle changes to tv lights
  185. subscribeTopic("livingroom/light_amp", function (msg) {
  186. if (msg == "on") {
  187. state_light_amp = 1
  188. } else if (msg == "off") {
  189. state_light_amp = 0
  190. } else {
  191. console.log("unknown livingroom/light_amp msg " + msg)
  192. }
  193. setWorkspaceLightsButtons()
  194. })
  195. subscribeTopic("livingroom/light_box", function (msg) {
  196. if (msg == "on") {
  197. state_light_box = 1
  198. } else if (msg == "off") {
  199. state_light_box = 0
  200. } else {
  201. console.log("unknown livingroom/light_box msg " + msg)
  202. }
  203. setWorkspaceLightsButtons()
  204. })
  205. // set new tv light state
  206. for (const btn of btnsTv) {
  207. btn.addEventListener('change', function (e) {
  208. if (this.checked) {
  209. if (this == document.querySelector("#tvon")) {
  210. state_light_amp = 1
  211. state_light_box = 1
  212. setTopic("livingroom/light_amp", "on")
  213. setTopic("livingroom/light_box", "on")
  214. } else if (this == document.querySelector("#tvoff")) {
  215. state_light_amp = 0
  216. state_light_box = 0
  217. setTopic("livingroom/light_amp", "off")
  218. setTopic("livingroom/light_box", "off")
  219. } else if (this == document.querySelector("#tvamp")) {
  220. state_light_amp = 1
  221. state_light_box = 0
  222. setTopic("livingroom/light_amp", "on")
  223. setTopic("livingroom/light_box", "off")
  224. } else if (this == document.querySelector("#tvbox")) {
  225. state_light_box = 1
  226. state_light_amp = 0
  227. setTopic("livingroom/light_box", "on")
  228. setTopic("livingroom/light_amp", "off")
  229. } else {
  230. console.log("unknown btn value " + this.value)
  231. }
  232. }
  233. })
  234. }
  235. // handle livingroom sensors
  236. subscribeSensor("livingroom/temperature", "°C", "#livingtemp")
  237. subscribeSensor("livingroom/humidity", "%", "#livinghumid")
  238. subscribeSensor("livingroom/pressure", "mbar", "#livingpress", 100.0)
  239. subscribeSensor("livingroom/tvoc", "ppb", "#livingtvoc")
  240. subscribeSensor("livingroom/eco2", "ppm", "#livingeco2")