diff --git a/app/components/bridge-controls.js b/app/components/bridge-controls.js
index 9cb501b..d2cbbe2 100644
--- a/app/components/bridge-controls.js
+++ b/app/components/bridge-controls.js
@@ -5,7 +5,9 @@ export default Em.Component.extend({
bridgeUsername: null,
+ groupsData: null,
lightsData: null,
+ activeLights: null,
numLights: function(){
var lightsData = this.get('lightsData'), numLights = 0;
@@ -19,18 +21,27 @@ export default Em.Component.extend({
return numLights;
}.property('lightsData'),
- lightsApiURL: function(){
- return 'http://' + this.get('bridgeIp') + '/api/' + this.get('bridgeUsername') + '/lights';
+ apiURL: function(){
+ return 'http://' + this.get('bridgeIp') + '/api/' + this.get('bridgeUsername');
}.property('bridgeIp', 'bridgeUsername'),
- didInsertElement: function() {
+ init: function() {
+ this._super();
+ var self = this;
+
+ Em.$.get(this.get('apiURL') + '/groups', function (result, status) {
+ if (status === 'success' ) {
+ self.set('groupsData', result);
+ }
+ });
+
this.set('lightsDataIntervalHandle', setInterval(this.updateLightData.bind(this), 1000));
},
updateLightData: function(){
var self = this;
- Em.$.get(this.get('lightsApiURL'), function (result, status) {
+ Em.$.get(this.get('apiURL') + '/lights', function (result, status) {
if (status === 'success' && JSON.stringify(self.get('lightsData')) !== JSON.stringify(result) ) {
self.set('lightsData', result);
} else if(status !== 'success' ) {
diff --git a/app/components/bridge-finder.js b/app/components/bridge-finder.js
index 8836163..462e379 100644
--- a/app/components/bridge-finder.js
+++ b/app/components/bridge-finder.js
@@ -22,7 +22,9 @@ export default Em.Component.extend({
},
// find the bridge ip here
- didInsertElement: function () {
+ init: function () {
+ this._super();
+
if(this.get('bridgeIp') === null){
var self = this;
diff --git a/app/components/controls/lights-control.js b/app/components/controls/lights-control.js
index e7babc1..784ec7d 100644
--- a/app/components/controls/lights-control.js
+++ b/app/components/controls/lights-control.js
@@ -4,9 +4,37 @@ export default Em.Component.extend({
lightsDataIntervalHandle: null,
- lightsApiURL: null,
+ apiURL: null,
lightsData: null,
+ activeLights: null,
+
+ groupSelection: null,
+ groupsData: null,
+ groupsArrData: function(){
+ var groupsData = this.get('groupsData'), groupsArrData = [];
+
+ for (var key in groupsData) {
+ if (groupsData.hasOwnProperty(key)) {
+ groupsArrData.push({name: groupsData[key].name, id: key});
+ }
+ }
+
+ return groupsArrData;
+ }.property('groupsData'),
+
+ onGroupSelectionChange: function(){
+ debugger;
+ }.observes('groupSelection'),
+
+ modalData: null,
+ isShowingLightsModal: false,
+ actions: {
+ clickLight: function(id, data){
+ this.set('modalData', {data:data, id:id});
+ this.toggleProperty('isShowingLightsModal');
+ }
+ },
// determines whether the lights are on/off for the lights switch
lightsOn: function(){
@@ -43,43 +71,43 @@ export default Em.Component.extend({
if (lightsData.hasOwnProperty(key)) {
switch(lightsData[key].modelid){
case 'LCT001':
- lightsList.push('a19');
+ lightsList.push({type: 'a19', name: lightsData[key].name, id: key, data: lightsData[key] });
break;
case 'LCT002':
- lightsList.push('br30');
+ lightsList.push({type: 'br30', name: lightsData[key].name, id: key, data: lightsData[key]});
break;
case 'LCT003':
- lightsList.push('gu10');
+ lightsList.push({type: 'gu10', name: lightsData[key].name, id: key, data: lightsData[key]});
break;
case 'LST001':
- lightsList.push('lightstrip');
+ lightsList.push({type: 'lightstrip', name: lightsData[key].name, id: key, data: lightsData[key]});
break;
case 'LLC010':
- lightsList.push('lc_iris');
+ lightsList.push({type: 'lc_iris', name: lightsData[key].name, id: key, data: lightsData[key]});
break;
case 'LLC011':
- lightsList.push('lc_bloom');
+ lightsList.push({type: 'lc_bloom', name: lightsData[key].name, id: key, data: lightsData[key]});
break;
case 'LLC012':
- lightsList.push('lc_bloom');
+ lightsList.push({type: 'lc_bloom', name: lightsData[key].name, id: key, data: lightsData[key]});
break;
case 'LLC006':
- lightsList.push('lc_iris');
+ lightsList.push({type: 'lc_iris', name: lightsData[key].name, id: key, data: lightsData[key]});
break;
case 'LLC007':
- lightsList.push('lc_aura');
+ lightsList.push({type: 'lc_aura', name: lightsData[key].name, id: key, data: lightsData[key]});
break;
case 'LLC013':
- lightsList.push('storylight');
+ lightsList.push({type: 'storylight', name: lightsData[key].name, id: key, data: lightsData[key]});
break;
case 'LWB004':
- lightsList.push('a19');
+ lightsList.push({type: 'a19', name: lightsData[key].name, id: key, data: lightsData[key]});
break;
case 'LLC020':
- lightsList.push('huego');
+ lightsList.push({type: 'huego', name: lightsData[key].name, id: key, data: lightsData[key]});
break;
default:
- lightsList.push('a19');
+ lightsList.push({type: 'a19', name: lightsData[key].name, id: key, data: lightsData[key]});
}
}
}
@@ -104,7 +132,7 @@ export default Em.Component.extend({
// if the internal lights state is different than the one from lightsData ( user manually toggled the switch ), send the request to change the bulbs state
if(lightsOn !== lightsOnSystem){
for (let key in lightsData) {
- Em.$.ajax(this.get('lightsApiURL') + '/' + key + '/state', {
+ Em.$.ajax(this.get('apiURL') + '/lights/' + key + '/state', {
data: JSON.stringify({"on": lightsOn}),
contentType: 'application/json',
type: 'PUT'
@@ -126,7 +154,7 @@ export default Em.Component.extend({
// if the internal lights state is different than the one from lightsData ( user manually toggled the switch ), send the request to change the bulbs state
if(lightsBrightness !== lightsBrightnessSystem){
for (let key in lightsData) {
- Em.$.ajax(this.get('lightsApiURL') + '/' + key + '/state', {
+ Em.$.ajax(this.get('apiURL') + '/lights/' + key + '/state', {
data: JSON.stringify({"bri": lightsBrightness}),
contentType: 'application/json',
type: 'PUT'
diff --git a/app/components/controls/lights-modal-control.js b/app/components/controls/lights-modal-control.js
new file mode 100644
index 0000000..d1a1344
--- /dev/null
+++ b/app/components/controls/lights-modal-control.js
@@ -0,0 +1,13 @@
+import Em from 'ember';
+
+export default Em.Component.extend({
+ actions: {
+ clickLight: function(){
+ this.sendAction();
+ }
+ },
+
+ modalData: null,
+
+ lightsApiURL: null
+});
diff --git a/app/components/controls/party-control.js b/app/components/controls/party-control.js
index a322721..7950c4e 100644
--- a/app/components/controls/party-control.js
+++ b/app/components/controls/party-control.js
@@ -8,6 +8,7 @@ export default Em.Component.extend({
numLights: 0,
lightsData: null,
+ activeLights: null,
strobeOnInervalHandle: null,
strobeSat: 0,
@@ -37,21 +38,21 @@ export default Em.Component.extend({
this.set('strobeOnInervalHandle', setInterval(this.strobeStep.bind(this), 200));
} else { // revert the light system to pre-strobe
- var preStrobeOnLightsDataCache = this.get('preStrobeOnLightsDataCache');
+ var preStrobeOnLightsDataCache = this.get('preStrobeOnLightsDataCache'), updateLight = function (lightIndx) {
+ Em.$.ajax(self.get('lightsApiURL') + '/' + lightIndx + '/state', {
+ data: JSON.stringify({
+ 'on': preStrobeOnLightsDataCache[lightIndx].state.on,
+ 'sat': preStrobeOnLightsDataCache[lightIndx].state.sat,
+ 'bri': preStrobeOnLightsDataCache[lightIndx].state.bri
+ }),
+ contentType: 'application/json',
+ type: 'PUT'
+ });
+ };
for (let key in lightsData) {
if (lightsData.hasOwnProperty(key)) {
- setTimeout(function () {
- Em.$.ajax(self.get('lightsApiURL') + '/' + key + '/state', {
- data: JSON.stringify({
- 'on': preStrobeOnLightsDataCache[key].state.on,
- 'sat': preStrobeOnLightsDataCache[key].state.sat,
- 'bri': preStrobeOnLightsDataCache[key].state.bri
- }),
- contentType: 'application/json',
- type: 'PUT'
- });
- }, 2000);
+ setTimeout(updateLight(key), 2000);
}
}
@@ -60,7 +61,7 @@ export default Em.Component.extend({
}.observes('strobeOn'),
strobeStep: function () {
- var lightsData = this.get('lightsData'), lastStrobeLight = (this.get('lastStrobeLight') + 1) % (this.get('numLights') + 1), self = this;
+ var lastStrobeLight = (this.get('lastStrobeLight') + 1) % (this.get('numLights') + 1), self = this;
Em.$.ajax(this.get('lightsApiURL') + '/' + lastStrobeLight + '/state', {
data: JSON.stringify({'on': true, 'transitiontime': 0, 'alert': 'select'}),
diff --git a/app/styles/app.scss b/app/styles/app.scss
index eeb714c..96dac80 100644
--- a/app/styles/app.scss
+++ b/app/styles/app.scss
@@ -1,4 +1,6 @@
@import 'ember-paper';
+@import "ember-modal-dialog/ember-modal-structure";
+@import "ember-modal-dialog/ember-modal-appearance";
#pressButtonBridgeImg {
width: 200px;
@@ -10,12 +12,6 @@
text-decoration: none;
}
-.md-subheader-content {
- max-width: 500px;
- margin-right: auto;
- margin-left: auto;
-}
-
md-list {
max-width: 600px;
margin-right: auto;
@@ -27,3 +23,28 @@ md-list {
margin-right: auto;
margin-left: auto;
}
+
+img.hueLight.active {
+ border-radius: 50%;
+ border: #94ffa0 2px solid;
+}
+
+img.hueLight.inactive {
+ border-radius: 50%;
+ border: #d2d3d6 2px solid;
+}
+
+
+.hueLight:hover {
+ cursor: pointer;
+ -webkit-transition-duration: 0.5s;
+ transition-duration: 0.5s;
+ -webkit-transform: scale(1.2);
+ transform: scale(1.2);
+ -webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
+ transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
+}
+
+.ember-modal-overlay.translucent {
+ background-color: #000000;
+}
diff --git a/app/templates/components/bridge-controls.hbs b/app/templates/components/bridge-controls.hbs
index 8af38d3..578f389 100644
--- a/app/templates/components/bridge-controls.hbs
+++ b/app/templates/components/bridge-controls.hbs
@@ -1,9 +1,9 @@
{{#paper-list}}
- {{controls/lights-control lightsApiURL=lightsApiURL lightsData=lightsData}}
+ {{controls/lights-control apiURL=apiURL lightsData=lightsData groupsData=groupsData activeLights=activeLights}}
{{paper-divider}}
- {{controls/party-control lightsApiURL=lightsApiURL lightsData=lightsData numLights=numLights}}
+ {{controls/party-control apiURL=apiURL lightsData=lightsData numLights=numLights activeLights=activeLights}}
{{/paper-list}}
\ No newline at end of file
diff --git a/app/templates/components/controls/lights-control.hbs b/app/templates/components/controls/lights-control.hbs
index ffff981..cf867f7 100644
--- a/app/templates/components/controls/lights-control.hbs
+++ b/app/templates/components/controls/lights-control.hbs
@@ -2,13 +2,13 @@
{{#paper-item class="item"}}
{{#each lightsList as |light|}}
-
+
{{/each}}
{{/paper-item}}
{{#paper-item class="item"}}
{{paper-icon icon="power-settings-new"}}
-
Light:
+Power
{{#paper-switch checked=lightsOn}} {{lightsOnTxt}} {{/paper-switch}} {{/paper-item}} @@ -16,4 +16,13 @@ {{paper-icon icon="brightness-4"}}Brightness
{{paper-slider flex=true min='1' max='254' value=lightsBrightness disabled=brightnessControlDisabled}} -{{/paper-item}} \ No newline at end of file +{{/paper-item}} + +{{#paper-item class="item"}} + {{paper-icon icon="group"}} +Active Group
+ {{x-select content=groupsArrData selection=groupSelection optionValuePath="content.lights" + optionLabelPath="content.name"}} +{{/paper-item}} + +{{controls/lights-modal-control modalData=modalData apiURL=apiURL action="clickLight" isShowingLightsModal=isShowingLightsModal}} \ No newline at end of file diff --git a/app/templates/components/controls/lights-modal-control.hbs b/app/templates/components/controls/lights-modal-control.hbs new file mode 100644 index 0000000..ed0dca3 --- /dev/null +++ b/app/templates/components/controls/lights-modal-control.hbs @@ -0,0 +1,8 @@ +{{#if isShowingLightsModal}} + {{#modal-dialog close="clickLight" + alignment="center" + translucentOverlay=true}} + TODO + + {{/modal-dialog}} +{{/if}} \ No newline at end of file diff --git a/package.json b/package.json index 897398b..345b9ff 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,9 @@ "ember-data": "1.13.7", "ember-disable-proxy-controllers": "^1.0.0", "ember-export-application-global": "^1.0.3", + "ember-modal-dialog": "0.7.7", "ember-paper": "0.2.6", + "emberx-select": "1.1.4", "liquid-fire": "0.21.2" } } diff --git a/tests/integration/components/controls/lights-modal-control-test.js b/tests/integration/components/controls/lights-modal-control-test.js new file mode 100644 index 0000000..8e68381 --- /dev/null +++ b/tests/integration/components/controls/lights-modal-control-test.js @@ -0,0 +1,26 @@ +import { moduleForComponent, test } from 'ember-qunit'; +import hbs from 'htmlbars-inline-precompile'; + +moduleForComponent('controls/lights-modal-control', 'Integration | Component | controls/lights modal control', { + integration: true +}); + +test('it renders', function(assert) { + assert.expect(2); + + // Set any properties with this.set('myProperty', 'value'); + // Handle any actions with this.on('myAction', function(val) { ... }); + + this.render(hbs`{{controls/lights-modal-control}}`); + + assert.equal(this.$().text().trim(), ''); + + // Template block usage: + this.render(hbs` + {{#controls/lights-modal-control}} + template block text + {{/controls/lights-modal-control}} + `); + + assert.equal(this.$().text().trim(), 'template block text'); +});