lone-cloud/huegasm
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

minor improvements for mobile

Browse source
This commit is contained in:
Egor 2016-10-18 18:01:35 -07:00
parent 0d423a838b
commit 424a5c5511
16 changed files with 40 additions and 151 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
mobile/app/pods/components/hue-controls/template.hbs
View file

@ -1,7 +1,7 @@
{{#if ready}}
<div id="navigation">
{{#each tabData as |tab|}}
<span class="navigation-item pointer text-uppercase {{if tab.selected "active"}}" {{action "changeTab" tab.name}}>{{tab.name}}</span>
<span class="navigation-item text-uppercase {{if tab.selected "active"}}" {{action "changeTab" tab.name}}>{{tab.name}}</span>
{{/each}}
<div id="settings">
<span data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" id="settings-itemSettings">

31
mobile/app/pods/components/light-group/component.js
View file

@ -13,7 +13,6 @@ const {
export default Component.extend({
elementId: 'active-lights',
classNames: ['light-group', 'horizontal-light-group'],
isHovering: false,
activeLights: A(),
// list of all the lights in the hue system
@ -122,36 +121,6 @@ export default Component.extend({
activeLights.pushObject(id);
this.set('syncLight', id);
}
},
lightStartHover(id){
let hoveredLight = this.get('lightsList').filter(function(light){
return light.activeClass !== 'unreachable' && light.id === id[0];
});
if(!isEmpty(hoveredLight) && this.get('noHover') !== true){
$.ajax(this.get('apiURL') + '/lights/' + id + '/state', {
data: JSON.stringify({"alert": "lselect"}),
contentType: 'application/json',
type: 'PUT'
});
}
this.set('isHovering', true);
},
lightStopHover(id){
let hoveredLight = this.get('lightsList').filter(function(light){
return light.activeClass !== 'unreachable' && light.id === id[0];
});
if(!isEmpty(hoveredLight) && this.get('noHover') !== true){
$.ajax(this.get('apiURL') + '/lights/' + id + '/state', {
data: JSON.stringify({"alert": "none"}),
contentType: 'application/json',
type: 'PUT'
});
}
this.set('isHovering', false);
}
}
});

2
mobile/app/pods/components/light-group/template.hbs
View file

@ -1,5 +1,5 @@
{{#each lightsList as |light|}}
<div class="{{light.activeClass}} light{{light.id}}" data-toggle="tooltip" data-placement="top auto" {{action "clickLight" light.id}} {{action "lightStartHover" light.id on="mouseEnter"}} {{action "lightStopHover" light.id on="mouseLeave"}}>
<div class="{{light.activeClass}} light{{light.id}}" data-toggle="tooltip" data-placement="top auto" {{action "clickLight" light.id}}>
<img class="hueLight" width="40" src="assets/images/lights/{{light.type}}.svg">
</div>
{{/each}}

31
mobile/app/pods/components/music-tab/component.js
View file

@ -226,20 +226,6 @@ export default Component.extend(helperMixin, visualizerMixin, {
});
},
dragOver() {
let dragLeaveTimeoutHandle = this.get('dragLeaveTimeoutHandle');
this.set('dragging', true);
if (dragLeaveTimeoutHandle) {
clearTimeout(dragLeaveTimeoutHandle);
}
},
dragLeave(){
// need to delay the dragLeave notification to avoid flickering ( hovering over some page elements causes this event to be sent )
this.set('dragLeaveTimeoutHandle', setTimeout(()=>{ this.set('dragging', false); }, 500));
},
simulateKick(/*mag, ratioKickMag*/) {
let activeLights = this.get('activeLights'),
lightsData = this.get('lightsData'),
@ -387,10 +373,6 @@ export default Component.extend(helperMixin, visualizerMixin, {
}
});
this.$().on('drop', '#play-list-area', (event)=>{
this.send('dropFiles', event.dataTransfer.files);
});
// demo tracks
if(this.get('firstVisit')){
this.send('handleNewSoundCloudURL', 'https://soundcloud.com/mrsuicidesheep/candyland-speechless-feat-rkcb');
@ -806,19 +788,6 @@ export default Component.extend(helperMixin, visualizerMixin, {
clickSpeaker(){
this.simulateKick(1);
},
dropFiles(files){
this.setProperties({
dragging: false,
draggingOverPlayListArea: false
});
this.send('handleNewFiles', files);
},
playerListAreaDragOver(){
this.set('draggingOverPlayListArea', true);
},
playerListAreaDragLeave(){
this.set('draggingOverPlayListArea', false);
},
handleNewFiles(files){
let self = this,
playQueue = this.get('playQueue'),

16
mobile/app/pods/components/music-tab/template.hbs
View file

@ -84,20 +84,16 @@
</div>
{{else}}
{{#if usingLocalAudio}}
<div id="play-list-area" class={{playListAreaClass}} {{action "addLocalAudio"}} {{action "playerListAreaDragOver" on="dragOver"}} {{action "playerListAreaDragLeave" on="dragLeave"}} {{action "dropFiles" on="drop"}}>
{{#if (or playQueueEmpty dragging)}}
<div id="play-list-area" class={{playListAreaClass}} {{action "addLocalAudio"}}>
{{#if playQueueEmpty}}
<div id="dragHere">
{{#if dragging}}
Drag your music files here
{{else}}
Add your music files here
{{/if}}
</div>
{{paper-icon "library-music" class=dimmerOnClass}}
{{/if}}
{{#each playQueue as |item index|}}
<div class="playlist-item pointer track{{index}} {{if (eq index playQueuePointer) "active"}} {{if dragging "hidden"}}" {{action "goToSong" index true bubbles=false}}>
<div class="playlist-item track{{index}} {{if (eq index playQueuePointer) "active"}} {{if dragging "hidden"}}" {{action "goToSong" index true bubbles=false}}>
{{#if item.picture}}
<img class="album-art" src={{item.picture}}>
{{else}}
@ -119,7 +115,7 @@
{{/if}}
</div>
<span class="audio-remove-button pointer" {{action "removeAudio" index bubbles=false}}>{{paper-icon "close" classNames="close"}}</span>
<span class="audio-remove-button" {{action "removeAudio" index bubbles=false}}>{{paper-icon "close" classNames="close"}}</span>
</div>
{{/each}}
</div>
@ -128,7 +124,7 @@
</div>
</div>
<div id="slide-toggle" class="text-center pointer row" {{action "slideTogglePlayerBottom"}}>
<div id="slide-toggle" class="text-center row" {{action "slideTogglePlayerBottom"}}>
<div class="col-xs-offset-5 col-xs-2">
{{paper-icon beatDetectionAreaArrowIcon id="beat-detection-area-arrow-icon"}}
</div>
@ -193,7 +189,7 @@
<div class="rivet8"></div>
<div id="beat-speaker-center-outer">
<div id="beat-speaker-center-inner" class="pointer" {{action "clickSpeaker"}}></div>
<div id="beat-speaker-center-inner" {{action "clickSpeaker"}}></div>
</div>
</div>
</div>

4
mobile/app/styles/common.scss
View file

@ -9,7 +9,3 @@
.no-text-decoration {
text-decoration: none !important;
}
.pointer {
cursor: pointer;
}

1
mobile/app/styles/dimmer.scss
View file

@ -78,7 +78,6 @@ body.dimmerOn {
#dimmer {
display: inline-block;
cursor: pointer;
width: 40px;
height: 40px;
background: url(images/huegasm.png) center center no-repeat;

12
mobile/app/styles/hue-controls.scss
View file

@ -5,10 +5,6 @@
}
}
#color-row {
cursor: pointer;
}
#hue-controls {
max-width: 1200px;
position: relative;
@ -30,7 +26,6 @@
padding: 0 10px 0 10px;
&.active {
font-weight: bold;
cursor: default;
text-decoration: none !important;
}
&:hover {
@ -58,13 +53,9 @@
z-index: 3;
}
#picker {
cursor: crosshair;
}
#loop-addition {
position: absolute;
left: 35px;
left: 33px;
top: 15px;
font-size: 16px;
}
@ -72,7 +63,6 @@
#settings {
z-index: 3;
text-align: right;
cursor: pointer;
float: right;
position: relative;
}

2
mobile/app/styles/light-group.scss
View file

@ -7,7 +7,6 @@
}
.light-inactive {
cursor: pointer;
position: relative;
}
@ -30,7 +29,6 @@
}
.light-active {
cursor: pointer;
img {
transition-duration: 0.3s;
transition-property: transform;

14
mobile/app/styles/music-tab.scss
View file

@ -173,16 +173,6 @@
font-weight: bold;
}
#play-list-area.drag-here-highlight {
background-color: white;
border: 5px dotted #5383ff;
}
#play-list-area.dragging-over {
background-color: darken(white, 5%);
box-shadow: inset 0 0 20px 0 rgba(0, 0, 0, 1);
}
#file-input {
width: 1px;
height: 1px;
@ -242,10 +232,6 @@
margin-bottom: 10px;
}
.star {
cursor: auto !important;
}
#beat-option-button-group {
margin: 20px 0 10px 0;
}

8
mobile/app/styles/noui-slider.scss
View file

@ -16,18 +16,10 @@
background: grey;
}
.noUi-base {
cursor: pointer;
}
.noUi-connect {
background-color: $secondaryThemeColor;
}
.noUi-handle {
cursor: pointer;
}
.noUi-horizontal .noUi-handle {
width: 0.4em;
height: 1.3em;

12
mobile/app/styles/paper.scss
View file

@ -1,9 +1,5 @@
@import 'ember-paper';
.paper-icon {
cursor: pointer;
}
md-checkbox .md-icon, .md-off, .md-on {
border-color: inherit !important;
}
@ -26,10 +22,6 @@ md-checkbox .md-label {
}
}
md-switch[disabled=disabled], md-switch[disabled=disabled] .md-container, md-slider[disabled=disabled] {
cursor: not-allowed;
}
md-progress-circular {
margin: 0 auto 20px auto !important;
}
@ -38,10 +30,6 @@ md-progress-linear {
margin-bottom: 50px !important;
}
md-slider {
cursor: pointer;
}
md-slider.md-default-theme .md-thumb:after {
border-color: $secondaryThemeColor;
background-color: $secondaryThemeColor;

48
web/app/pods/components/light-group/component.js
View file

@ -124,34 +124,38 @@ export default Component.extend({
}
},
lightStartHover(id){
let hoveredLight = this.get('lightsList').filter(function(light){
return light.activeClass !== 'unreachable' && light.id === id[0];
});
if(!isEmpty(hoveredLight) && this.get('noHover') !== true){
$.ajax(this.get('apiURL') + '/lights/' + id + '/state', {
data: JSON.stringify({"alert": "lselect"}),
contentType: 'application/json',
type: 'PUT'
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];
});
}
this.set('isHovering', true);
if(!isEmpty(hoveredLight) && this.get('noHover') !== true){
$.ajax(this.get('apiURL') + '/lights/' + id + '/state', {
data: JSON.stringify({"alert": "lselect"}),
contentType: 'application/json',
type: 'PUT'
});
}
this.set('isHovering', true);
}
},
lightStopHover(id){
let hoveredLight = this.get('lightsList').filter(function(light){
return light.activeClass !== 'unreachable' && light.id === id[0];
});
if(!isEmpty(hoveredLight) && this.get('noHover') !== true){
$.ajax(this.get('apiURL') + '/lights/' + id + '/state', {
data: JSON.stringify({"alert": "none"}),
contentType: 'application/json',
type: 'PUT'
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];
});
}
this.set('isHovering', false);
if(!isEmpty(hoveredLight) && this.get('noHover') !== true){
$.ajax(this.get('apiURL') + '/lights/' + id + '/state', {
data: JSON.stringify({"alert": "none"}),
contentType: 'application/json',
type: 'PUT'
});
}
this.set('isHovering', false);
}
}
}
});

2
web/app/pods/components/music-tab/template.hbs
View file

@ -20,7 +20,7 @@
-->{{/if}}<!--
--><span data-toggle="tooltip" data-placement="top" class="bootstrap-tooltip" id="volumeMutedTooltip"
data-title={{volumeMutedTooltipTxt}} {{action "volumeMutedChanged"}}>{{paper-icon icon=volumeIcon class=volumeMutedClass}}</span><!--
-->{{range-slider start=volume min=0 max=100 connect=filledConnect on-slide="volumeChanged" id="volume-bar" class="hidden-xs"}}
-->{{range-slider start=volume min=0 max=100 connect=filledConnect on-slide="volumeChanged" id="volume-bar"}}
<div id="player-time-controls">{{timeElapsedTxt}} / {{timeTotalTxt}}</div>
{{/if}}

2
web/app/styles/hue-controls.scss
View file

@ -68,7 +68,7 @@
#loop-addition {
position: absolute;
left: 35px;
left: 33px;
top: 15px;
font-size: 16px;
}

4
web/app/styles/music-tab.scss
View file

@ -332,11 +332,13 @@
#save-beat-preferences-star {
position: absolute;
top: 3px;
top: 5px;
left: 5px;
z-index: 1000;
md-icon {
color: $secondaryThemeColor !important;
font-size: 25px;
cursor: default;
}
}