fix(edit): Add configuration for serial port in editing mode

Configuration for serial port, wifi ssid and password are available in editing mode of a box
sensebox · Dec 3, 2018 · 4354322 · 4354322
1 parent 6076f39
commit 4354322
Show file tree

Hide file tree

Showing 3 changed files with 94 additions and 16 deletions.
diff --git a/app/scripts/controllers/account.box.edit.script.js b/app/scripts/controllers/account.box.edit.script.js
@@ -14,36 +14,65 @@
     vm.serialPort = 'Serial1';
     vm.boxScript = '';
     vm.showConfiguration = false;
+    vm.showSerialPort = false;
+    vm.compiling = false;
+    vm.wifi = {
+      ssid: '',
+      password: ''
+    };
 
-    vm.changeSerialPort = changeSerialPort;
+    vm.generateScript = generateScript;
+    vm.compile = compile;
 
     activate();
 
     ////
 
     function activate () {
-      if (boxData.model.startsWith('homeV2')) {
+      if (boxData.model.startsWith('homeV2Wifi')) {
         vm.showConfiguration = true;
       }
 
+      if (boxData.model === 'homeV2WifiFeinstaub') {
+        vm.showSerialPort = true;
+      }
+
       return getScript();
     }
 
-    function changeSerialPort () {
+    function generateScript () {
       vm.boxScript = 'Neuer Sketch wird generiert...';
 
       return getScript();
     }
 
     function getScript () {
       return AccountService.getScript(boxData._id, {
-        serialPort: vm.serialPort
+        serialPort: vm.serialPort,
+        ssid: vm.wifi.ssid,
+        password: vm.wifi.password
       })
         .then(function (response) {
           vm.boxScript = response;
         })
         .catch(function () {
         });
     }
+
+    function compile () {
+      vm.compiling = true;
+
+      return AccountService.compileSketch({
+        board: 'sensebox-mcu',
+        sketch: vm.boxScript
+      })
+        .then(function () {
+        })
+        .catch(function () {
+        })
+        .finally(function () {
+          vm.compiling = false;
+        });
+    }
   }
 })();
diff --git a/app/scripts/services/account.js b/app/scripts/services/account.js
@@ -5,9 +5,9 @@
     .module('app.services', [])
     .factory('AccountService', AccountService);
 
-  AccountService.$inject = ['$http', '$q', 'moment', 'app', 'AuthenticationService', 'Box'];
+  AccountService.$inject = ['$http', '$q', '$window', 'moment', 'app', 'AuthenticationService', 'Box'];
 
-  function AccountService ($http, $q, moment, app, AuthenticationService, Box) {
+  function AccountService ($http, $q, $window, moment, app, AuthenticationService, Box) {
     var service = {
       signup: signup,
       login: login,
@@ -26,7 +26,8 @@
       deleteBox: deleteBox,
       deleteMeasurement: deleteMeasurement,
       postNewBox: postNewBox,
-      deleteAccount: deleteAccount
+      deleteAccount: deleteAccount,
+      compileSketch: compileSketch
     };
 
     return service;
@@ -235,5 +236,15 @@
         })
         .catch(failed);
     }
+
+    function compileSketch (data) {
+      return $http.post('https://compiler.sensebox.de/compile', data)
+        .then(function (response) {
+          var url = encodeURI('https://compiler.sensebox.de/download?id=' + response.data.data.id + '&board=sensebox-mcu');
+
+          return $window.open(url, '_self');
+        })
+        .catch(failed);
+    }
   }
 })();
diff --git a/app/views/account.box.edit.script.html b/app/views/account.box.edit.script.html
@@ -3,22 +3,60 @@ <h2 style="margin-top: 0px; margin-bottom: 0px">{{'EDIT_SCRIPT'|translate}}</h2>
 
 <div ng-if="script.showConfiguration">
   <h3>Konfiguration</h5>
-  <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4" style="height: 90px; text-align: left; margin-top: 15px;">
-    <div class="form-group">
-      <label for="groupTag">Anschluss (Feinstaubsensor)</label>
-      <div class="input-group xxxl">
-        <select id="groupTag" class="form-control" style="border-radius: 4px;" ng-model="script.serialPort" ng-change="script.changeSerialPort()">
-          <!---->
+  <form class="form-inline">
+    <div class="form-group" ng-if="script.showSerialPort">
+      <label for="serialport">Anschluss</label>
+      <div class="input-group"
+        uib-tooltip-html="'<img src=\'/images/serialports.png\'></img>'"
+        tooltip-placement="bottom"
+        tooltip-trigger="'mouseenter'">
+        <select type="text" class="form-control" id="serialport" ng-model="script.serialPort" ng-change="script.generateScript()">
           <option value="Serial1">Serial 1</option>
           <option value="Serial2">Serial 2</option>
         </select>
+        <div class="input-group-addon">
+          <span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
+        </div>
       </div>
     </div>
-  </div>
+    <div class="form-group has-warning has-feedback">
+      <label for="ssid">WiFi SSID</label>
+      <div class="input-group"
+        uib-tooltip="Der Name (SSID) wird im Klartext übertragen"
+        tooltip-placement="top"
+        tooltip-trigger="'mouseenter'">
+        <input type="text" class="form-control" id="ssid" ng-model="script.wifi.ssid" ng-model-options="{ debounce: 500 }" ng-change="script.generateScript()">
+        <span class="form-control-feedback" aria-hidden="true"></span>
+        <div class="input-group-addon">
+          <span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
+        </div>
+      </div>
+    </div>
+    <div class="form-group has-warning has-feedback" >
+      <label for="password">WiFi Password</label>
+      <div class="input-group"
+        uib-tooltip="Das Passwort wird im Klartext übertragen"
+        tooltip-placement="top"
+        tooltip-trigger="'mouseenter'">
+        <input type="password" class="form-control" id="password" ng-model="script.wifi.password" ng-model-options="{ debounce: 500 }" ng-change="script.generateScript()">
+        <span class="form-control-feedback" aria-hidden="true"></span>
+        <div class="input-group-addon">
+          <span class="glyphicon glyphicon-info-sign" aria-hidden="true" ></span>
+        </div>
+      </div>
+    </div>
+    <button type="button" class="btn btn-success" ng-click="script.compile()" ng-disabled="script.compiling">
+        <i class="fa fa-circle-o-notch fa-spin fa-fw" ng-if="script.compiling"></i> Kompilieren
+    </button>
+  </form>
 </div>
 
-<div>
-  <textarea class="form-control" ng-model="script.boxScript" onclick="this.select()" style="height:350px;font-family:monospace;font-size:80%;resize: vertical;"></textarea>
+<br>
+
+<div class="row">
+  <div class="col-lg-12">
+    <textarea class="form-control" ng-model="script.boxScript" onclick="this.select()" style="height:350px;font-family:monospace;font-size:80%;resize: vertical;"></textarea>
+  </div>
 </div>
 
 <br>