From ce0c9d36ac22bb94632d5b44da190bb7bffeced0 Mon Sep 17 00:00:00 2001 From: lone-cloud Date: Sun, 12 Mar 2017 13:46:51 -0700 Subject: [PATCH] update uislider, remove fancy speaker from mobile, active lights overflow if they don't fit on a single line, dont alert lights on hover if they're user disabled, new ember paper should fix slider issues --- .../pods/components/light-group/component.js | 7 +- chrome/app/styles/light-group.scss | 1 + chrome/package.json | 5 +- .../pods/components/hue-controls/component.js | 8 +- .../pods/components/music-tab/component.js | 5 - .../pods/components/music-tab/template.hbs | 17 ---- mobile/app/styles/app.scss | 1 - mobile/app/styles/fancy-speaker.scss | 98 ------------------- mobile/app/styles/light-group.scss | 1 + mobile/app/styles/music-tab.scss | 5 - mobile/ember-cordova/cordova/config.xml | 2 +- mobile/package.json | 5 +- .../pods/components/light-group/component.js | 7 +- web/app/styles/light-group.scss | 1 + web/package.json | 5 +- 15 files changed, 19 insertions(+), 149 deletions(-) delete mode 100644 mobile/app/styles/fancy-speaker.scss diff --git a/chrome/app/pods/components/light-group/component.js b/chrome/app/pods/components/light-group/component.js index 3c88967..1c4b8dc 100644 --- a/chrome/app/pods/components/light-group/component.js +++ b/chrome/app/pods/components/light-group/component.js @@ -125,9 +125,10 @@ export default Component.extend({ } }, lightStartHover(id) { - let hoveredLight = this.get('lightsList').filter(function (light) { - return light.activeClass !== 'unreachable' && light.id === id[0]; - }); + let activeLights = this.get('activeLights'), + hoveredLight = this.get('lightsList').filter(function (light) { + return light.activeClass !== 'unreachable' && light.id === id[0] && activeLights.indexOf(id) !== -1; + }); if (!isEmpty(hoveredLight) && this.get('noHover') !== true) { $.ajax(this.get('apiURL') + '/lights/' + id + '/state', { diff --git a/chrome/app/styles/light-group.scss b/chrome/app/styles/light-group.scss index a01528f..be9df28 100644 --- a/chrome/app/styles/light-group.scss +++ b/chrome/app/styles/light-group.scss @@ -3,6 +3,7 @@ margin: 5px auto; display: flex; justify-content: center; + flex-wrap: wrap; .tooltip.top { margin-top: 1px; margin-left: 2px; diff --git a/chrome/package.json b/chrome/package.json index 49635d0..754d827 100644 --- a/chrome/package.json +++ b/chrome/package.json @@ -25,7 +25,7 @@ "ember-cli-htmlbars": "^1.0.1", "ember-cli-htmlbars-inline-precompile": "^0.3.1", "ember-cli-inject-live-reload": "^1.3.1", - "ember-cli-nouislider": "^0.12.0", + "ember-cli-nouislider": "^0.13.0", "ember-cli-release": "0.2.8", "ember-cli-shims": "^1.0.2", "ember-cli-sass": "^6.0.0", @@ -40,7 +40,6 @@ "ember-resolver": "^2.0.3", "ember-truth-helpers": "^1.2.0", "ember-source": "^2.11.0", - "loader.js": "^4.0.7", - "nouislider": "^9.0.0" + "loader.js": "^4.0.7" } } \ No newline at end of file diff --git a/mobile/app/pods/components/hue-controls/component.js b/mobile/app/pods/components/hue-controls/component.js index 38fc013..6a3e314 100644 --- a/mobile/app/pods/components/hue-controls/component.js +++ b/mobile/app/pods/components/hue-controls/component.js @@ -195,12 +195,6 @@ export default Component.extend({ 'TIP: Your sensitivity settings are saved per song as indicated by the red star icon in the top left corner. These settings they will be restored if you ever listen to the same song again.', position: 'top' }, - { - element: '#beat-container', - intro: 'An interactive speaker that will bump when a beat is registered.

' + - 'TIP: Click on the center of the speaker to simulate a beat.', - position: 'top' - }, { element: '#lights-tab', intro: 'This is the lights tab. Here you\'ll be able to change various light properties:
' + @@ -232,7 +226,7 @@ export default Component.extend({ // it's VERY ugly but it works... the jQuery massacre :'( intro.onchange((element) => { - if(element.id === '' || element.id === 'music-tab' || element.id === 'playlist' || element.id === 'player-area' || element.id === 'beat-option-row' || element.id === 'beat-option-button-group' || element.id === 'beat-container' || element.id === 'using-mic-audio-tooltip' || element.nodeName === 'MD-MENU'){ + if(element.id === '' || element.id === 'music-tab' || element.id === 'playlist' || element.id === 'player-area' || element.id === 'beat-option-row' || element.id === 'beat-option-button-group' || element.id === 'using-mic-audio-tooltip' || element.nodeName === 'MD-MENU'){ $('.navigation-item').eq(1).click(); } else { $('.navigation-item').eq(0).click(); diff --git a/mobile/app/pods/components/music-tab/component.js b/mobile/app/pods/components/music-tab/component.js index 8de43a9..3ce5fcd 100644 --- a/mobile/app/pods/components/music-tab/component.js +++ b/mobile/app/pods/components/music-tab/component.js @@ -244,11 +244,6 @@ export default Component.extend(helperMixin, visualizerMixin, { $(event.target).addClass('removed'); }); - // prevent space/text selection when the user repeatedly clicks on the center - $('#beat-container').on('mousedown', '#beat-speaker-center-inner', function (event) { - event.preventDefault(); - }); - $(document).keypress((event) => { if (event.which === 32 && event.target.type !== 'text') { this.send('play'); diff --git a/mobile/app/pods/components/music-tab/template.hbs b/mobile/app/pods/components/music-tab/template.hbs index 8c36220..4ef92da 100644 --- a/mobile/app/pods/components/music-tab/template.hbs +++ b/mobile/app/pods/components/music-tab/template.hbs @@ -160,23 +160,6 @@
{{paper-checkbox value=colorloopMode onChange=(action (mut colorloopMode)) label="Colorloop"}}
- -
-
-
-
-
-
-
-
-
-
- -
-
-
-
-
{{music-tab/add-soundcloud-sound-modal action="handleNewSoundCloudURL" isShowingModal=isShowingAddSoundCloudModal}} \ No newline at end of file diff --git a/mobile/app/styles/app.scss b/mobile/app/styles/app.scss index ce5e475..38011fc 100644 --- a/mobile/app/styles/app.scss +++ b/mobile/app/styles/app.scss @@ -9,7 +9,6 @@ @import 'bridge-finder'; @import 'common'; @import 'dimmer'; -@import 'fancy-speaker'; @import 'introjs'; @import 'hue-controls'; @import 'light-group'; diff --git a/mobile/app/styles/fancy-speaker.scss b/mobile/app/styles/fancy-speaker.scss deleted file mode 100644 index 9809c43..0000000 --- a/mobile/app/styles/fancy-speaker.scss +++ /dev/null @@ -1,98 +0,0 @@ -$centersize: 80px; -$center1size: 205px; -$bezelsize: 240px; - -%base { - border-radius: 100%; -} -%rivet { - position: absolute; - height: 8px; - width: 8px; - background-color: #555; - border-radius: 100%; - box-shadow: inset 0 0 3px #000, 0 0 2px #000; -} - -#beat-speaker-center-inner { - @extend %base; - height: $centersize; - width: $centersize; - position: absolute; - bottom: 47px; - right: 47px; - -webkit-filter: blur(1px); - filter: blur(1px); - background: rgb(0,0,0); - background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,1) 0%, rgba(79,79,79,1) 0%, rgba(0,0,0,1) 100%); - background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(0,0,0,1)), color-stop(0%,rgba(79,79,79,1)), color-stop(100%,rgba(0,0,0,1))); - background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,1) 0%,rgba(79,79,79,1) 0%,rgba(0,0,0,1) 100%); - background: -o-radial-gradient(center, ellipse cover, rgba(0,0,0,1) 0%,rgba(79,79,79,1) 0%,rgba(0,0,0,1) 100%); - background: -ms-radial-gradient(center, ellipse cover, rgba(0,0,0,1) 0%,rgba(79,79,79,1) 0%,rgba(0,0,0,1) 100%); - background: radial-gradient(ellipse at center, rgba(0,0,0,1) 0%,rgba(79,79,79,1) 0%,rgba(0,0,0,1) 100%); - box-shadow: 0 0 10px rgba(0, 0, 0, 1); -} -#beat-speaker-center-outer { - @extend %base; - position: absolute; - top: 16px; - left: 16px; - height: $center1size; - width: $center1size; - border: 15px solid #333; - box-shadow: -3px -3px 15px rgba(0, 0, 0, 0.4), inset -3px -3px 15px rgba(0, 0, 0, 0.5); - background: -moz-linear-gradient(130deg, rgba(117, 117, 117, 1) 55%, rgba(220, 220, 220, 1) 100%); - background: -webkit-linear-gradient(130deg, rgba(117, 117, 117, 1) 55%, rgba(220, 220, 220, 1) 100%); - background: -o-linear-gradient(130deg, rgba(117, 117, 117, 1) 55%, rgba(220, 220, 220, 1) 100%); - background: -ms-linear-gradient(130deg, rgba(117, 117, 117, 1) 55%, rgba(220, 220, 220, 1) 100%); - background: linear-gradient(130deg, rgba(117, 117, 117, 1) 55%, rgba(220, 220, 220, 1) 100%); -} -.bezel { - @extend %base; - margin: 0 auto; - height: $bezelsize; - width: $bezelsize; - position: relative; - background-color: #A8A8A8; - box-shadow: 0 0 10px rgba(0, 0, 0, 0.8), inset 3px 3px 10px rgba(0, 0, 0, 0.8), 0 0 2px rgba(0, 0, 0, 0.8), inset 0 0 30px -5px rgba(0, 0, 0, 0.8); -} -.rivet1 { - @extend %rivet; - top: 6px; - left: 50%; -} -.rivet2 { - @extend %rivet; - bottom: 6px; - left: 50%; -} -.rivet3 { - @extend %rivet; - top: 50%; - left: 6px; -} -.rivet4 { - @extend %rivet; - top: 50%; - right: 6px; -} -.rivet5 { - @extend %rivet; - top: 18%; - left: 13.7%; -} -.rivet6 { - @extend %rivet; - top: 18%; - right: 13.5%; -} -.rivet7 { - @extend %rivet; - bottom: 17%; - left: 13.5%; -} -.rivet8 { - @extend %rivet; - bottom: 17%; - right: 13.5%; -} diff --git a/mobile/app/styles/light-group.scss b/mobile/app/styles/light-group.scss index d9f9519..39a1012 100644 --- a/mobile/app/styles/light-group.scss +++ b/mobile/app/styles/light-group.scss @@ -3,6 +3,7 @@ margin: 0 auto; display: flex; justify-content: center; + flex-wrap: wrap; } .toggleable-light { diff --git a/mobile/app/styles/music-tab.scss b/mobile/app/styles/music-tab.scss index b61830a..b9655e3 100644 --- a/mobile/app/styles/music-tab.scss +++ b/mobile/app/styles/music-tab.scss @@ -266,11 +266,6 @@ } } -#beat-container { - display: flex; - margin-bottom: 10px; -} - #add-music-choices { min-width: initial; right: 0; diff --git a/mobile/ember-cordova/cordova/config.xml b/mobile/ember-cordova/cordova/config.xml index b2a66d6..b3a29bc 100644 --- a/mobile/ember-cordova/cordova/config.xml +++ b/mobile/ember-cordova/cordova/config.xml @@ -1,5 +1,5 @@ - + Huegasm diff --git a/mobile/package.json b/mobile/package.json index 05efd99..8ef3a68 100644 --- a/mobile/package.json +++ b/mobile/package.json @@ -27,7 +27,7 @@ "ember-cli-htmlbars": "^1.0.1", "ember-cli-htmlbars-inline-precompile": "^0.3.1", "ember-cli-inject-live-reload": "^1.3.1", - "ember-cli-nouislider": "^0.12.0", + "ember-cli-nouislider": "^0.13.0", "ember-cli-release": "^0.2.8", "ember-cli-shims": "^1.0.2", "ember-cli-sass": "^6.0.0", @@ -43,7 +43,6 @@ "ember-resolver": "^2.0.3", "ember-truth-helpers": "^1.2.0", "ember-source": "^2.11.0", - "loader.js": "^4.0.7", - "nouislider": "^9.0.0" + "loader.js": "^4.0.7" } } \ No newline at end of file diff --git a/web/app/pods/components/light-group/component.js b/web/app/pods/components/light-group/component.js index 594e294..1121adb 100644 --- a/web/app/pods/components/light-group/component.js +++ b/web/app/pods/components/light-group/component.js @@ -125,9 +125,10 @@ export default Component.extend({ }, lightStartHover(id) { if (!window.matchMedia || (window.matchMedia("(min-width: 768px)").matches)) { - let hoveredLight = this.get('lightsList').filter(function (light) { - return light.activeClass !== 'unreachable' && light.id === id[0]; - }); + let activeLights = this.get('activeLights'), + hoveredLight = this.get('lightsList').filter(function (light) { + return light.activeClass !== 'unreachable' && light.id === id[0] && activeLights.indexOf(id) !== -1; + }); if (!isEmpty(hoveredLight) && this.get('noHover') !== true) { $.ajax(this.get('apiURL') + '/lights/' + id + '/state', { diff --git a/web/app/styles/light-group.scss b/web/app/styles/light-group.scss index 60cd737..dc6ee4e 100644 --- a/web/app/styles/light-group.scss +++ b/web/app/styles/light-group.scss @@ -4,6 +4,7 @@ max-width: 800px; display: flex; justify-content: center; + flex-wrap: wrap; .tooltip.top { margin-top: 1px; margin-left: 2px; diff --git a/web/package.json b/web/package.json index 2129eed..1dda4b9 100644 --- a/web/package.json +++ b/web/package.json @@ -25,7 +25,7 @@ "ember-cli-htmlbars": "^1.0.1", "ember-cli-htmlbars-inline-precompile": "^0.3.1", "ember-cli-inject-live-reload": "^1.3.1", - "ember-cli-nouislider": "^0.12.0", + "ember-cli-nouislider": "^0.13.0", "ember-cli-release": "0.2.8", "ember-cli-shims": "^1.0.2", "ember-cli-sass": "^6.0.0", @@ -40,7 +40,6 @@ "ember-resolver": "^2.0.3", "ember-truth-helpers": "^1.2.0", "ember-source": "^2.11.0", - "loader.js": "^4.0.7", - "nouislider": "^9.0.0" + "loader.js": "^4.0.7" } } \ No newline at end of file