diff --git a/app/index.html b/app/index.html index a7b962b..683c8ce 100644 --- a/app/index.html +++ b/app/index.html @@ -17,6 +17,8 @@ + + {{content-for 'head-footer'}} diff --git a/app/pods/components/hue-controls/component.js b/app/pods/components/hue-controls/component.js index 9026e14..8d043ef 100644 --- a/app/pods/components/hue-controls/component.js +++ b/app/pods/components/hue-controls/component.js @@ -1,7 +1,7 @@ import Em from 'ember'; export default Em.Component.extend({ - classNames: ['container-fluid'], + classNames: ['container'], elementId: 'hueControls', bridgeIp: null, diff --git a/app/pods/components/hue-controls/template.hbs b/app/pods/components/hue-controls/template.hbs index 661eedc..0e2c73d 100644 --- a/app/pods/components/hue-controls/template.hbs +++ b/app/pods/components/hue-controls/template.hbs @@ -6,7 +6,7 @@ {{/each}} -
+
{{paper-icon icon="group"}} diff --git a/app/pods/components/lights-tab/component.js b/app/pods/components/lights-tab/component.js index cca5cce..fd452ea 100644 --- a/app/pods/components/lights-tab/component.js +++ b/app/pods/components/lights-tab/component.js @@ -1,7 +1,7 @@ import Em from 'ember'; export default Em.Component.extend({ - classNames: ['col-lg-4', 'col-lg-offset-4', 'col-sm-6', 'col-sm-offset-3', 'col-xs-12'], + classNames: ['col-lg-4', 'col-lg-offset-4', 'col-md-6', 'col-md-offset-3', 'col-xs-12'], classNameBindings: ['active::hidden'], activeLights: [], @@ -44,6 +44,8 @@ export default Em.Component.extend({ self = this, xy = this.rgbToXy(rgb[0], rgb[1], rgb[2]); + this.set('colorLoopOn', false); + this.get('activeLights').forEach(function (light) { Em.$.ajax(self.get('apiURL') + '/lights/' + light + '/state', { data: JSON.stringify({"xy": xy}), @@ -63,17 +65,39 @@ export default Em.Component.extend({ return "toggleColorpicker"; }.property('trial'), - colorLoopOn: function(){ - var lightsData = this.get('lightsData'); + // COLOR LOOP related stuff + colorLoopOn: false, + colorLoopDependenciesChanged: function(){ + var lightsData = this.get('lightsData'), newValue; if(this.get('strobeOn')){ - return false; + newValue = false; + } else { + newValue = this.get('activeLights').some(function(light) { + return lightsData[light].state.effect === 'colorloop'; + }); } - return this.get('activeLights').some(function(light) { + this.set('colorLoopOn', newValue); + }.observes('lightsData.@each.state.effect', 'activeLights.[]', 'strobeOn'), + onColorLoopOnChange: function(){ + var lightsData = this.get('lightsData'), activeLights = this.get('activeLights'), colorLoopsOn = this.get('colorLoopOn'), self = this; + + var colorLoopsOnSystem = activeLights.some(function(light) { return lightsData[light].state.effect === 'colorloop'; }); - }.property('lightsData.@each.state.effect', 'activeLights.[]', 'strobeOn'), + + // 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(colorLoopsOn !== colorLoopsOnSystem){ + activeLights.forEach(function (light) { + Em.$.ajax(self.get('apiURL') + '/lights/' + light + '/state', { + data: JSON.stringify({"effect": colorLoopsOn ? 'colorloop' : 'none'}), + contentType: 'application/json', + type: 'PUT' + }); + }); + } + }.observes('colorLoopOn'), // determines whether the lights are on/off for the lights switch lightsOn: function(){ @@ -120,24 +144,7 @@ export default Em.Component.extend({ } }.observes('lightsOn'), - onColorLoopOnChange: function(){ - var lightsData = this.get('lightsData'), activeLights = this.get('activeLights'), colorLoopsOn = this.get('colorLoopOn'), self = this; - var colorLoopsOnSystem = activeLights.some(function(light) { - return lightsData[light].state.effect === 'colorloop'; - }); - - // 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(colorLoopsOn !== colorLoopsOnSystem){ - activeLights.forEach(function (light) { - Em.$.ajax(self.get('apiURL') + '/lights/' + light + '/state', { - data: JSON.stringify({"effect": colorLoopsOn ? 'colorloop' : 'none'}), - contentType: 'application/json', - type: 'PUT' - }); - }); - } - }.observes('colorLoopOn'), onBrightnessChanged: function(){ var lightsData = this.get('lightsData'), lightsBrightnessSystem = false, lightsBrightness = this.get('lightsBrightness'), activeLights = this.get('activeLights'), self = this; diff --git a/app/pods/components/music-tab/component.js b/app/pods/components/music-tab/component.js index c936add..795f849 100644 --- a/app/pods/components/music-tab/component.js +++ b/app/pods/components/music-tab/component.js @@ -3,8 +3,9 @@ import musicControlMixin from './mixins/music-tab'; import visualizerMixin from './mixins/visualizer'; export default Em.Component.extend(musicControlMixin, visualizerMixin, { - classNames: ['col-lg-8', 'col-lg-offset-2', 'col-sm-10', 'col-sm-offset-1', 'col-xs-12'], + classNames: ['col-lg-10', 'col-lg-offset-1', 'col-xs-12'], classNameBindings: ['active::hidden'], + elementId: 'musicTab', onActiveChange: function(){ if(this.get('active')){ @@ -15,6 +16,25 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, { }.observes('active'), actions: { + search: function(){ + var q = $('#query').val(), doSearch = function(){ + var request = gapi.client.youtube.search.list({ + q: q, + part: 'snippet', + key: 'AIzaSyAkwv6RD184j6o5wRfblYWNlV_njt6RXIc' + }); + + request.execute(function(response) { + var str = JSON.stringify(response.result); + $('#search-container').html('
' + str + '
'); + }); + }; + if(!gapi.client.youtube){ + gapi.client.load('youtube', 'v3', doSearch); + } else { + doSearch(); + } + }, useYoutubeAudio: function(){ var audioStream = this.get('audioStream'); @@ -25,6 +45,20 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, { this.set('audioStream', null); } + var onPlayerReady = function(){ + console.log('ready'); + }, onPlayerStateChange = function(){ + console.log('onPlayerStateChange'); + }; + + //var youtubePlayer = new YT.Player('ytplayer', { + // events: { + // 'onReady': onPlayerReady, + // 'onStateChange': onPlayerStateChange + // } + //}); + // + //this.set('youtubePlayer', youtubePlayer); document.title = 'Youtube - Huegasm'; }, useLocalAudio: function(){ @@ -224,9 +258,11 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, { audioModeChanged(value){ if(value === 1) { this.startUsingMic(); + } else if(value === 2){ + this.send('useYoutubeAudio'); + } else { + this.send('useLocalAudio'); } - - this.set('audioMode', value); }, clickSpeaker(){ this.simulateKick(1); @@ -501,7 +537,7 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, { }); // prevent space/text selection when the user repeatedly clicks on the center - Em.$('#beatSpeakerContainer').on('mousedown', '#beatSpeakerCenter', function(event) { + Em.$('#beatSpeakerContainer').on('mousedown', '#beatSpeakerCenterInner', function(event) { event.preventDefault(); }); @@ -519,5 +555,9 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, { event.preventDefault(); } }); + + window.onYouTubeIframeAPIReady = function() { + debugger; + }; } }); diff --git a/app/pods/components/music-tab/mixins/music-tab.js b/app/pods/components/music-tab/mixins/music-tab.js index db3502a..0ff5795 100644 --- a/app/pods/components/music-tab/mixins/music-tab.js +++ b/app/pods/components/music-tab/mixins/music-tab.js @@ -118,7 +118,7 @@ export default Em.Mixin.create({ paused: false, // audio: playing or paused playing: false, - + youtubePlayer: null, fadeOutNotification: false, speakerViewed: true, @@ -300,7 +300,7 @@ export default Em.Mixin.create({ if (this.get(type)) { tooltipTxt = 'Pause'; - } else if(this.get('timeElapsed') === this.get('timeTotal')){ + } else if(this.get('timeElapsed') === this.get('timeTotal') && this.get('timeTotal') !== 0){ tooltipTxt = 'Replay'; } diff --git a/app/pods/components/music-tab/template.hbs b/app/pods/components/music-tab/template.hbs index ee08eee..97107dd 100644 --- a/app/pods/components/music-tab/template.hbs +++ b/app/pods/components/music-tab/template.hbs @@ -1,4 +1,5 @@
+ {{#if (or usingLocalAudio usingMicAudio)}}
@@ -6,7 +7,6 @@ {{#if usingLocalAudio}} {{range-slider start=seekPosition min=0 max=100 id="seekSlider" slide="seekChanged"}} - {{#if playQueueMultiple}} {{paper-icon icon="skip-previous" class="playerControllIcon"}}