diff --git a/html/images/homescreen128.png b/html/images/homescreen128.png new file mode 100644 index 0000000..711e0a3 Binary files /dev/null and b/html/images/homescreen128.png differ diff --git a/html/index.html b/html/index.html index 9b13b2e..004b461 100644 --- a/html/index.html +++ b/html/index.html @@ -2,6 +2,8 @@ ESP32 timed Switch + +

Scheduler

@@ -24,7 +26,7 @@ class Schedule { // Load from binary data var view = new DataView(buffer); for (var i = 0; i < 24; i++) { - this.schedule[i] = view.getUint32(i * 4); + this.schedule[i] = view.getUint16(i * 2); } }; @@ -53,7 +55,7 @@ class Schedule { return this.schedule.map(hour => { if (hour === 0xFFF) { // All segments on return { displayValue: ' ', class: 'on' }; - } else if (hour === 0x000) { // All segments off + } else if (hour === 0x00) { // All segments off return { displayValue: ' ', class: 'off' }; } else { return { displayValue: ' ', class: 'partial' }; @@ -93,12 +95,12 @@ class Schedule { serializeToArrayBuffer = function() { // Convert to binary data - var buffer = new ArrayBuffer(24 * 4); + var buffer = new ArrayBuffer(24 * 2); var view = new DataView(buffer); for (var i = 0; i < this.schedule.length; i++) { - view.setUint32(i * 4, this.schedule[i]); + view.setUint16(i * 2, this.schedule[i]); } - return buffer; + return view; }; } @@ -108,10 +110,26 @@ class Schedule { // Start of Angular var app = angular.module('plugSchedulerApp', []); +app.value('api_host', window.location.host); +app.factory("data", function(){ + var sharedData = { api_host: window.location.host} + return { + getSharedData: function () { + return sharedData; + } + }; +}); -app.controller('PlugScheduleController', ['$http', function($http) { +app.controller('ApiHostController', ['$scope', 'api_host', 'data', function( $scope, api_host, data) { + var ctrl = this; + $scope.data = data.getSharedData(); + window.ctrl = $scope +}]) + +app.controller('PlugScheduleController', ['$scope', '$http', 'data', function( $scope, $http, data) { var ctrl = this; ctrl.editMode = false; + $scope.data = data.getSharedData(); ctrl.$onInit = function() { ctrl.scheduleObj = new Schedule(); // Initialize with a default schedule @@ -120,11 +138,11 @@ app.controller('PlugScheduleController', ['$http', function($http) { ctrl.getSchedule = function() { if (ctrl.plugId === undefined) { - throw new Error('plugId is not defined'); + return; } // Fetch the schedule from the server for a given plug ID - var url = `/api/schedule/${ctrl.plugId}` + var url = `http://${$scope.data.api_host}/api/schedule/${ctrl.plugId}` $http.get(url, { responseType: 'arraybuffer' }).then(function(response) { ctrl.scheduleObj.loadFromArrayBuffer(response.data); ctrl.displaySchedule = ctrl.scheduleObj.serializeForDisplay(); @@ -148,7 +166,7 @@ app.controller('PlugScheduleController', ['$http', function($http) { // Send the updated schedule to the server ctrl.updateSchedule = function() { - var url = `/api/schedule/${ctrl.plugId}` + var url = `http://${$scope.data.api_host}/api/schedule/${ctrl.plugId}` var serializedSchedule = ctrl.scheduleObj.serializeToArrayBuffer(); $http.post(url, serializedSchedule, { @@ -162,11 +180,10 @@ app.controller('PlugScheduleController', ['$http', function($http) { console.log("successfully updated"); ctrl.displaySchedule = ctrl.scheduleObj.serializeForDisplay(); }, function(error) { - console.error('Error updating schedule:', error); + alert('Error updating schedule:', error); }); }; - // check all segments for a specific hour ctrl.checkAll = function(hourIndex) { ctrl.editMatrix[hourIndex].forEach(segment => { @@ -180,6 +197,37 @@ app.controller('PlugScheduleController', ['$http', function($http) { segment.value = 0; }); }; + ctrl.invertAll = function(hourIndex) { + ctrl.editMatrix[hourIndex].forEach(segment => { + var inverted = Math.abs( segment.value - 1) + segment.value = inverted; + }); + }; + + ctrl.checkPattern = function(hourIndex, results) { + for( index = 0; index < ctrl.editMatrix[hourIndex].length; index++){ + ctrl.editMatrix[hourIndex][index] = { value : results[index] }; + } + }; + + ctrl.checkHalf = function(hourIndex) { + ctrl.checkPattern( hourIndex, [1,1,1,1,1,1,0,0,0,0,0,0]); + }; + + ctrl.checkFourth = function(hourIndex) { + ctrl.checkPattern( hourIndex, [1,1,1,0,0,0,1,1,1,0,0,0]); + }; + + ctrl.checkSixth = function(hourIndex) { + ctrl.checkPattern( hourIndex, [1,1,0,0,1,1,0,0,1,1,0,0]); + }; + + ctrl.checkTwelveth = function(hourIndex) { + ctrl.checkPattern( hourIndex, [1,0,1,0,1,0,1,0,1,0,1,0]); + }; + + + }]); app.component('plugScheduleWidget', { @@ -188,22 +236,32 @@ app.component('plugScheduleWidget', { }, template: `
-

Schedule for Plug {{ $ctrl.plugId }}

+

Plug {{ $ctrl.plugId }}

{{ hour.displayValue }}
- +
+ + + + - +
{{ segment * 5 }}
+ {{ $index }} - - + + + + + + +
@@ -217,21 +275,29 @@ app.component('plugScheduleWidget', { // End of Angular - + - -
- - - - - - - - +
+
+ + + + + + + + +
+
-