diff options
| -rw-r--r-- | .bowerrc | 3 | ||||
| -rw-r--r-- | bower.json | 18 | ||||
| -rw-r--r-- | package.json | 17 | ||||
| -rw-r--r-- | src/BeerDuke.js | 287 | ||||
| -rw-r--r-- | src/BeerDukeController.js | 77 | ||||
| -rw-r--r-- | src/BeerDukeTap.js | 85 | ||||
| -rw-r--r-- | src/controller.html | 16 | ||||
| -rw-r--r-- | src/tap.html | 16 | ||||
| -rw-r--r-- | src/templates/controller.html | 8 | ||||
| -rw-r--r-- | src/templates/footer.html | 4 | ||||
| -rw-r--r-- | src/templates/settings.html | 30 | ||||
| -rw-r--r-- | src/templates/tap.html | 2 |
12 files changed, 300 insertions, 263 deletions
diff --git a/.bowerrc b/.bowerrc new file mode 100644 index 0000000..6ff629d --- /dev/null +++ b/.bowerrc @@ -0,0 +1,3 @@ +{ + "directory": "fuck" +} diff --git a/bower.json b/bower.json new file mode 100644 index 0000000..9440f4d --- /dev/null +++ b/bower.json @@ -0,0 +1,18 @@ +{ + "name": "beer-duke", + "version": "0.0.0", + "authors": [ + "Trygve Laugstøl <trygvis@inamo.no>" + ], + "license": "MIT", + "ignore": [ + "**/.*", + "node_modules", + "bower_components", + "test", + "tests" + ], + "dependencies": { + "angular-route": "~1.4.5" + } +} diff --git a/package.json b/package.json index a1ae283..88358e6 100644 --- a/package.json +++ b/package.json @@ -6,21 +6,6 @@ "author": "", "license": "MIT", "devDependencies": { - "jspm": "^0.16.0", - "jspm-git": "^0.3.3" - }, - "jspm": { - "directories": { - "baseURL": "src" - }, - "dependencies": { - "angular": "npm:angular@^1.4.5", - "angular-route": "npm:angular-route@^1.4.5" - }, - "devDependencies": { - "core-js": "npm:core-js@^1.1.0", - "traceur": "github:jmcriffey/bower-traceur@0.0.91", - "traceur-runtime": "github:jmcriffey/bower-traceur-runtime@0.0.91" - } + "bower": "^1.5.2" } } diff --git a/src/BeerDuke.js b/src/BeerDuke.js index 82f37c2..6f88016 100644 --- a/src/BeerDuke.js +++ b/src/BeerDuke.js @@ -1,166 +1,191 @@ -import angular from 'angular'; +(function () { + 'use strict'; -class SettingsController { - constructor(BeerDukeSettings) { - this.settings = BeerDukeSettings; - } -} + function SettingsController($log, $location, BeerDukeSettings) { + var ctrl = this; -class BeerDukeSettings { - constructor() { - this.clientId = BeerDukeSettings.load('clientId') || 'beer-duke-' + Math.round(Math.random() * 100000); - console.log('this =', this); - this.showSettings = BeerDukeSettings.load('showSettings') == 'true' || false; - } + ctrl.clientId = BeerDukeSettings.clientId(); + ctrl.showSettings = BeerDukeSettings.showSettings(); - save() { - BeerDukeSettings.store('clientId', clientId); - BeerDukeSettings.store('showSettings', showSettings); - } + ctrl.save = function () { + BeerDukeSettings.clientId(ctrl.clientId); + BeerDukeSettings.showSettings(ctrl.showSettings); + BeerDukeSettings.save(); - static store(key, value) { - window.localStorage[key] = angular.toJson(value); - return value; + $location.path('/') + } } - static load(key) { - let x = window.localStorage[key]; - console.log('key =', key, 'x =', x); - return angular.fromJson(x); - } -} + function BeerDukeSettings() { -class BeerDukeService { - constructor($timeout, $rootScope, BeerDukeSettings) { - this.$timeout = $timeout; - this.$rootScope = $rootScope; + function save() { + store('clientId', clientId_); + store('showSettings', showSettings_); + } - this.connected_ = false; - this.messages = []; - } + function store(key, value) { + window.localStorage[key] = angular.toJson(value); + return value; + } - static xxx() { - return new BeerDukeSettings(); - } + function load(key) { + var x = window.localStorage[key]; + if (typeof x === 'undefined') { + return x; + } - connect(type, opts) { - this.opts = opts || {}; - - console.log('BeerDukeSettings =', BeerDukeSettings); - let clientId = BeerDukeSettings.clientId + "-" + type; - console.log('clientId =', clientId); - let client = new Paho.MQTT.Client("wss://trygvis.io:9001/", clientId); - client.onConnectionLost = (a) => { - this.$timeout(() => { - this.$rootScope.$apply(() => { - this.onConnectionLost(a); - }) - }); - }; - client.onMessageArrived = (a) => { - this.$timeout(() => { - this.$rootScope.$apply(() => { - this.onMessageArrived(a); - }) - }); - }; + return angular.fromJson(x); + } - this.client = client; + var clientId_ = load('clientId') || 'beer-duke-' + Math.round(Math.random() * 100000); + var showSettings_ = load('showSettings') || false; + save(); - this.client.connect({ - onSuccess: () => { - this.$timeout(() => { - this.$rootScope.$apply(() => { - this.onConnect(); - }) - }); + function clientId(x) { + if (x) { + clientId_ = x; } - }); - } + return clientId_; + } - get connected() { - return this.connected_; + function showSettings(x) { + if (x) { + showSettings_ = x; + } + return showSettings_; + } + + return { + clientId: clientId, + showSettings: showSettings, + load: load, + save: save + } } - onConnect() { - console.log('Connected'); + function BeerDukeService($log, $timeout, $rootScope, BeerDukeSettings) { + var self = this; + var connected_ = false; + var messages = []; + var callbacks = {}; + + function connect(type) { + var clientId = BeerDukeSettings.clientId() + "-" + type; + var client = new Paho.MQTT.Client("wss://trygvis.io:9001/", clientId); + client.onConnectionLost = function (a) { + $timeout(function () { + $rootScope.$apply(function () { + onConnectionLost(a); + }) + }); + }; + client.onMessageArrived = function () { + var args = arguments; + $timeout(function () { + $rootScope.$apply(function () { + onMessageArrived.apply(self, args); + }) + }); + }; + + self.client = client; + + self.client.connect({ + onSuccess: function () { + var args = arguments; + $timeout(function () { + $rootScope.$apply(function () { + onConnect.apply(self, args); + }) + }); + } + }); + } - this.connected_ = true; + function subscribe(name) { + return self.client.subscribe(name); + } - if (this.opts.onConnect) { - try { - this.opts.onConnect(); - } catch (e) { - } + function connected() { + return self.connected_; } - //this.client.subscribe("/beer-duke"); - } + function onConnect() { + $log.info('Connected'); - onConnectionLost(responseObject) { - this.connected_ = false; + self.connected_ = true; - //if (responseObject.errorCode !== 0) - console.log("onConnectionLost:", responseObject); - console.log("onConnectionLost:", responseObject.errorMessage); - } + invoke('onConnect'); + } - onMessageArrived(message) { - console.log("onMessageArrived:" + message.payloadString); + function invoke(name, args) { + var fn = callbacks[name]; - this.messages.push(message); + if (typeof fn === 'function') { + try { + return fn.apply(undefined, args); + } catch (e) { + $log.warn('exception calling ' + name, e); + } + } + } + + function onConnectionLost(responseObject) { + self.connected_ = false; - if (this.opts.onMessageArrived) { + //if (responseObject.errorCode !== 0) + $log.warn("onConnectionLost:", responseObject); + $log.warn("onConnectionLost:", responseObject.errorMessage); + } + + function onMessageArrived(message) { + messages.push(message); try { - let m = angular.fromJson(message); - this.opts.onMessageArrived(m); + var m = angular.fromJson(message); + invoke('onMessageArrived', [m]); } catch (e) { + $log.warn('could not parse json', e); } } - } - requestBeer(code) { - let message = new Paho.MQTT.Message(angular.toJson({code: code})); - message.destinationName = "/beer-duke"; - this.client.send(message); + function submit(destination, payload) { + var message = new Paho.MQTT.Message(angular.toJson(payload)); + message.destinationName = destination; + self.client.send(message); + } + + return { + messages: messages, + submit: submit, + connect: connect, + subscribe: subscribe, + connected: connected, + callbacks: callbacks + } } -} -class MqttController { - constructor(BeerDukeService) { - this.BeerDukeService = BeerDukeService; + function config($routeProvider) { + $routeProvider + .when('/settings', { + controller: SettingsController, + controllerAs: 'ctrl', + templateUrl: 'templates/settings.html' + }) + .otherwise({ + redirectTo: '/' + }) } - get connected() { - return this.BeerDukeService.connected; + function run($rootScope, BeerDukeSettings, BeerDukeService) { + $rootScope.settings = BeerDukeSettings; + $rootScope.mqtt = { + connected: BeerDukeService.connected + } } -} - -function config($routeProvider) { - console.log('BeerDuke: config'); - $routeProvider - .when('/settings', { - controller: SettingsController, - controllerAs: 'ctrl', - templateUrl: 'templates/settings.html' - }) - .otherwise({ - redirectTo: '/' - }) -} - -function run($rootScope, BeerDukeSettings, BeerDukeService) { - $rootScope.settings = BeerDukeSettings; - $rootScope.mqtt = { - get connected() { - return BeerDukeService.connected - } - }; -} - -angular.module('BeerDuke', ['ngRoute']) - .controller('MqttController', MqttController) - .service('BeerDukeService', BeerDukeService) - .factory('BeerDukeSettings', () => new BeerDukeSettings()) - .config(config) - .run(run); + + angular.module('BeerDuke', ['ngRoute']) + .factory('BeerDukeService', BeerDukeService) + .factory('BeerDukeSettings', BeerDukeSettings) + .config(config) + .run(run); +}()); diff --git a/src/BeerDukeController.js b/src/BeerDukeController.js index 85a47f4..8aeafb8 100644 --- a/src/BeerDukeController.js +++ b/src/BeerDukeController.js @@ -1,46 +1,43 @@ -import angular from 'angular'; -import 'angular-route'; -import './BeerDuke.js'; - -class BeerDukeControllerController { - constructor(BeerDukeService) { - this.BeerDukeService = BeerDukeService; - - this.BeerDukeService.connect('controller', { - onConnect: this.onConnect, - onMessageArrived: this.onMessageArrived - }); +(function () { + 'use strict'; + + function BeerDukeControllerController($log, BeerDukeService, BeerDukeSettings) { + var ctrl = this; + + if (BeerDukeSettings.showSettings()) { + ctrl.code = 123; + ctrl.email = 'foo@example.org'; + } + + ctrl.requestBeer = function () { + var payload = { + code: this.code, + email: this.email + }; + $log.info('payload', payload); + + BeerDukeService.submit('/beer-duke', payload); + }; + + BeerDukeService.callbacks.onMessageArrived = function (m) { + ctrl.lastCode = m.code; + } } - requestBeer() { - let code = this.code; - - console.log('code', code); - this.BeerDukeService.requestBeer(code); + function run(BeerDukeService) { + BeerDukeService.connect('controller'); } - onConnect() { - console.log('onConnect'); + function config($routeProvider) { + $routeProvider + .when('/', { + controller: BeerDukeControllerController, + controllerAs: 'ctrl', + templateUrl: 'templates/controller.html' + }); } - onMessageArrived(msg) { - console.log('msg =', msg); - } -} - -function run(BeerDukeService) { - //BeerDukeService.connect('controller'); -} - -function config($routeProvider) { - $routeProvider - .when('/', { - controller: BeerDukeControllerController, - controllerAs: 'ctrl', - templateUrl: 'templates/controller.html' - }); -} -angular.module('BeerDukeController', ['ngRoute', 'BeerDuke']) - .run(run) - .config(config) - .controller('BeerDukeControllerController', BeerDukeControllerController); + angular.module('BeerDukeController', ['ngRoute', 'BeerDuke']) + .run(run) + .config(config); +}()); diff --git a/src/BeerDukeTap.js b/src/BeerDukeTap.js index 3392e85..ed12a17 100644 --- a/src/BeerDukeTap.js +++ b/src/BeerDukeTap.js @@ -1,45 +1,54 @@ -import angular from 'angular'; -import 'angular-route'; -import './BeerDuke.js'; +(function () { + 'use strict'; -class BeerDukeTapController { - constructor($timeout, BeerDukeSettings) { - console.log('BeerDukeTapController', this); + function BeerDukeTapController($log, $timeout, BeerDukeService) { + var ctrl = this; - this.$timeout = $timeout; - this.settings = BeerDukeSettings; + rotateCode(); + self.count = 0; + self.code = ''; - this.rotateCode(); - this.count = 0; - this.code = ''; + function rotateCode() { + self.code = '' + self.count++; + $timeout(function () { + rotateCode(); + }, 1000); + } + + BeerDukeService.callbacks.onConnect = function () { + BeerDukeService.subscribe('/beer-duke'); + }; + BeerDukeService.callbacks.onMessageArrived = function (m) { + $log.info('m.payloadString =', m.payloadString); + var payload = angular.fromJson(m.payloadString); + + var code = payload.code; + var email = payload.email; + + if (typeof code !== 'string' && typeof email !== 'string') { + $log.warn('bad payload', payload.code); + return; + } + + ctrl.message = payload; + }; + + BeerDukeService.connect('tap'); } - - rotateCode() { - this.code = '' + this.count++; - this.$timeout(() => { - this.rotateCode(); - }, 1000); + + function run(BeerDukeService) { } -} -class TapSettingsController { - constructor() { + function config($routeProvider) { + $routeProvider + .when('/', { + controller: BeerDukeTapController, + controllerAs: 'ctrl', + templateUrl: 'templates/tap.html' + }); } -} - -function run(BeerDukeService) { - BeerDukeService.connect('tap'); -} - -function config($routeProvider) { - $routeProvider - .when('/', { - controller: BeerDukeTapController, - controllerAs: 'ctrl', - templateUrl: 'templates/tap.html' - }); -} - -angular.module('BeerDukeTap', ['BeerDuke', 'ngRoute']) - .run(run) - .config(config); + + angular.module('BeerDukeTap', ['BeerDuke', 'ngRoute']) + .run(run) + .config(config); +}()); diff --git a/src/controller.html b/src/controller.html index bbb34ca..33477f9 100644 --- a/src/controller.html +++ b/src/controller.html @@ -1,18 +1,12 @@ <html> <head> - <script type="application/javascript" src="jspm_packages/system.src.js"></script> <script type="application/javascript" src="mqttws31.js"></script> - <script type="application/javascript" src="config.js"></script> - <script type="text/ecmascript"> - Promise.all([ - System.import('angular'), - System.import('BeerDukeController')]) - .then(function (modules) { - modules[0].bootstrap(document, ['BeerDukeController']); - }); - </script> + <script type="application/javascript" src="bower_components/angular/angular.js"></script> + <script type="application/javascript" src="bower_components/angular-route/angular-route.js"></script> + <script type="application/javascript" src="BeerDuke.js"></script> + <script type="application/javascript" src="BeerDukeController.js"></script> </head> -<body> +<body ng-app="BeerDukeController"> <div ng-view></div> </body> </html> diff --git a/src/tap.html b/src/tap.html index 47a05ca..5196b97 100644 --- a/src/tap.html +++ b/src/tap.html @@ -1,18 +1,12 @@ <html> <head> - <script type="application/javascript" src="jspm_packages/system.src.js"></script> <script type="application/javascript" src="mqttws31.js"></script> - <script type="application/javascript" src="config.js"></script> - <script type="text/ecmascript"> - Promise.all([ - System.import('angular'), - System.import('BeerDukeTap')]) - .then(function (modules) { - modules[0].bootstrap(document, ['BeerDukeTap']); - }); - </script> + <script type="application/javascript" src="bower_components/angular/angular.js"></script> + <script type="application/javascript" src="bower_components/angular-route/angular-route.js"></script> + <script type="application/javascript" src="BeerDuke.js"></script> + <script type="application/javascript" src="BeerDukeTap.js"></script> </head> -<body> +<body ng-app="BeerDukeTap"> <div ng-view></div> </body> </html> diff --git a/src/templates/controller.html b/src/templates/controller.html index eb0efab..bd8cbf5 100644 --- a/src/templates/controller.html +++ b/src/templates/controller.html @@ -1,9 +1,13 @@ -<div ng-controller="MqttController as mqtt"> - <div ng-controller="BeerDukeControllerController as ctrl"> +<div> + <div> <label> Code from tap: <input type="number" ng-model="ctrl.code"> </label> + <label> + Your email address + <input type="email" ng-model="ctrl.email"> + </label> <button ng-click="ctrl.requestBeer()">Request Beer!</button> </div> diff --git a/src/templates/footer.html b/src/templates/footer.html index 17483ae..182554d 100644 --- a/src/templates/footer.html +++ b/src/templates/footer.html @@ -1,5 +1,5 @@ -<div ng-if="settings.showSettings"> +<div ng-if="settings.showSettings()"> <hr/> <a href="#/settings">settings</a><br/> - connected = {{mqtt.connected}} + connected = {{mqtt.connected()}} </div> diff --git a/src/templates/settings.html b/src/templates/settings.html index 5147065..f118e47 100644 --- a/src/templates/settings.html +++ b/src/templates/settings.html @@ -1,14 +1,22 @@ -<div> +<div ng-init="clientId = ctrl.settings.clientId(); showSettings = ctrl.settings.showSettings()"> <h2>Settings</h2> - <a href="#/">back</a> - <label> - showSettings - <input type="checkbox" ng-model="ctrl.settings.showSettings"> - </label> - - <label> - clientId - <input type="text" ng-model="ctrl.settings.clientId"> - </label> + + <p> + <button ng-click="ctrl.save()">back</button> + </p> + + <p> + <label> + showSettings + <input type="checkbox" ng-model="ctrl.showSettings"> + </label> + </p> + + <p> + <label> + clientId + <input type="text" ng-model="ctrl.clientId"> + </label> + </p> </div> diff --git a/src/templates/tap.html b/src/templates/tap.html index c266f2d..48d5e37 100644 --- a/src/templates/tap.html +++ b/src/templates/tap.html @@ -1,5 +1,5 @@ <div> - Code: {{ctrl.code}} + Last: {{ctrl.message | json}} <ng-include src="'templates/footer.html'"/> </div> |