Главная Обзор Помощь
Зарегистрироваться Войти
jamesperet
/
home-automation
Следить 1
В избранное 0
Ответвить 0

Просмотр исходного кода
Webpage light button

The button in the dashboard page sends an http request with vue to the relay controller on the server. The relay controller checks if the relay ID exists, changes state and broadcasts thru socket.io to all dashboard pages.

James Peret лет %!s(int64=7): %!d(string=назад)
Родитель
57f18298e0
Сommit
660213d698
2 измененных файлов с 75 добавлено и 7 удалено
Показать статистику Diff
  1. 31 5
      relay_controller.js
  2. 44 2
      views/index.html

+ 31 - 5
relay_controller.js
Просмотреть файл 

@@ -1,20 +1,46 @@
1 1 
 var logger = require('winston');
2 
-var relay_status = [ 1, 1, 1, 1]
3 2
4 3 
 module.exports.start = function(router, channel){
5 4 
   logger.info("Starting Relay controller module");
6 5
7 6 
   router.post('/switch_relay', function (req, res) {
8 7 
     logger.info("Received request for switching relays", req.body);
9 
-    channel.emit('news', { hello: 'again' });
8 
+    if(req.body != undefined){
9 
+      var relay = req.body;
10 
+      if(relay.code != undefined && relay.status != undefined){
11 
+        var done = switchRelay(relay.code, relay.status);
12 
+        if(done){
13 
+            channel.emit('relay_switch', { code: relay.code, status: relay.status });
14 
+        }
15 
+      }
16 
+    }
10 17 
     res.sendStatus(200);
11 18 
   });
12 19
13 20 
 }
14 21
15 22 
 module.exports.monitor = function(socket, channel){
16 
-  channel.emit('news', { hello: 'world' });
17 
-  socket.on('my other event', function (data) {
18 
-    logger.info("Receiveid data", data);
23 
+  socket.on('relay_switch_update', function (data) {
24 
+    logger.info("relay_switch_update", data);
25 
+    socket.emit("relay_switch", relay_status[0]);
19 26 
   });
20 27 
 }
28 
+
29 
+var relay_status = [
30 
+  {
31 
+    code: "L01",
32 
+    status: true
33 
+  }
34 
+]
35 
+
36 
+var switchRelay = function(code, status){
37 
+  switch (code) {
38 
+    case "L01":
39 
+      // switch on light relay
40 
+      relay_status[0].status = status;
41 
+      return true;
42 
+      break;
43 
+    default:
44 
+      return false;
45 
+  }
46 
+}

+ 44 - 2
views/index.html
Просмотреть файл 

@@ -92,8 +92,8 @@
92 92 
       <div class="col-sm-4">
93 93 
         <div class="statcard">
94 94 
           <i class="fa fa-lightbulb-o icon-header" aria-hidden="true"></i>
95 
-          <button type="button" class="btn btn-outline-secondary " style="float: right; margin-top: 2px;">Turn On</button>
96 
-          <h3 class="statcard-number">OFF</h3>
95 
+          <button type="button" class="btn btn-outline-secondary " v-on:click="switchLight01(false)" style="float: right; margin-top: 2px;">{{light01_btn}}</button>
96 
+          <h3 class="statcard-number">{{light01}}</h3>
97 97 
           <span class="statcard-title">Light</span>
98 98
99 99 
         </div>
 
@@ -128,12 +128,31 @@
128 128 
 <script>
129 129 
   var socket = io.connect('http://localhost:3100/');
130 130
131 
+  var http_post = function(url, data){
132 
+    var xhr = new XMLHttpRequest();
133 
+    xhr.open("POST", url, true);
134 
+    xhr.setRequestHeader('Content-Type', 'application/json');
135 
+    xhr.send(JSON.stringify(data));
136 
+  }
137 
+
131 138 
   var app = new Vue({
132 139 
     el: "#app",
133 140 
     data: {
134 141 
       temperature_external: "--",
142 
+      light01 : "--",
143 
+      light01_status : undefined,
144 
+      light01_btn : ""
135 145 
     },
136 146 
     methods: {
147 
+      switchLight01: function(){
148 
+        var status;
149 
+        if(app.light01_status == true){
150 
+          status = false;
151 
+        } else {
152 
+          status = true;
153 
+        }
154 
+        http_post("/switch_relay", { code: "L01", status: status})
155 
+      },
137 156 
       example: function(example_var){
138 157 
         app.example();
139 158 
       }
 
@@ -145,4 +164,27 @@
145 164 
     app.temperature_external = temp + "ºC";
146 165 
   });
147 166
167 
+  socket.on('relay_switch', function (data) {
168 
+    console.log(data)
169 
+    var status = "ON";
170 
+    var btn = "Turn Off"
171 
+    if(data.status == false){
172 
+      status = "OFF"
173 
+      btn = "Turn On"
174 
+    }
175 
+    switch (data.code) {
176 
+      case "L01":
177 
+        app.light01 = status;
178 
+        app.light01_status = data.status
179 
+        app.light01_btn = btn
180 
+        break;
181 
+    }
182 
+  });
183 
+
184 
+  socket.emit('relay_switch_update', {});
185 
+  setInterval(function () {
186 
+    socket.emit('relay_switch_update', {});
187 
+  }, 5000);
188 
+
189 
+
148 190 
 </script>