From 3d28d7c009cabbff92cd54885e0b9493a9179117 Mon Sep 17 00:00:00 2001 From: lone-cloud Date: Tue, 27 Oct 2015 02:07:53 -0700 Subject: [PATCH] fixing bugs, more options playlist menu, better 'previous' when shuffling --- app/pods/components/music-tab/component.js | 65 ++++++++--- .../components/music-tab/mixins/visualizer.js | 6 +- app/pods/components/music-tab/template.hbs | 110 +++++++++--------- app/styles/app.scss | 16 +++ vendor/dancer.js | 5 + 5 files changed, 130 insertions(+), 72 deletions(-) diff --git a/app/pods/components/music-tab/component.js b/app/pods/components/music-tab/component.js index f71bf41..18ebafd 100644 --- a/app/pods/components/music-tab/component.js +++ b/app/pods/components/music-tab/component.js @@ -144,10 +144,12 @@ export default Em.Component.extend(helperMixin, visualizerMixin, { var playQueuePointer =this.get('playQueuePointer'), song = this.get('playQueue')[playQueuePointer]; - this.send('removeAudio', playQueuePointer); + if(song.local){ + this.send('removeAudio', playQueuePointer); + } else { + this.send('next', true); + } - debugger; - if(event.target.error.code === 2){ this.get('notify').alert({html: this.get('failedToDecodeFileHtml')(song.fileName)}); } else { @@ -251,9 +253,9 @@ export default Em.Component.extend(helperMixin, visualizerMixin, { this.changePlayerControl('volumeMuted', false); } }, - next(userTriggered) { + next(repeatAll) { var playQueuePointer = this.get('playQueuePointer'), - playQueueLength = this.get('playQueue.length'), + playQueue = this.get('playQueue'), nextSong = (playQueuePointer + 1), repeat = this.get('repeat'), shuffle = this.get('shuffle'); @@ -261,29 +263,30 @@ export default Em.Component.extend(helperMixin, visualizerMixin, { this.get('beatHistory').clear(); if(repeat === 2){ // repeating one song takes precedence over shuffling - if(playQueuePointer === -1 && playQueueLength > 0) { + if(playQueuePointer === -1 && playQueue.length > 0) { nextSong = 0; } else { nextSong = playQueuePointer; } - } else if(shuffle){ + } else if(shuffle){ // next shuffle song var shufflePlayed = this.get('shufflePlayed'); // played all the song in shuffle mode - if(shufflePlayed.length === playQueueLength){ + if(shufflePlayed.length === playQueue.length){ shufflePlayed.clear(); this.send('play', true); return; } + // we're going to assume that the song URL is the id do { - nextSong = Math.floor(Math.random() * playQueueLength); - } while(shufflePlayed.contains(nextSong)); + nextSong = Math.floor(Math.random() * playQueue.length); + } while(shufflePlayed.contains(playQueue[nextSong].url)); - shufflePlayed.pushObject(nextSong); - } else if(nextSong > playQueueLength-1){ - if(repeat === 1 || userTriggered){ - nextSong = nextSong % playQueueLength; + shufflePlayed.pushObject(playQueue[nextSong].url); + } else if(nextSong > playQueue.length-1){ + if(repeat === 1 || repeatAll){ + nextSong = nextSong % playQueue.length; } else { this.send('play', true); return; @@ -296,11 +299,37 @@ export default Em.Component.extend(helperMixin, visualizerMixin, { if(this.get('timeElapsed') > 5) { this.send('seekChanged', 0); } else { - var nextSong = this.get('playQueuePointer'); - nextSong--; + var nextSong = this.get('playQueuePointer'), + playQueue = this.get('playQueue'); - if(nextSong < 0) { - nextSong = this.get('playQueue.length') - 1; + if(this.get('shuffle') && !Em.isNone(playQueue[nextSong])) { // go to the previously shuffled song + var shufflePlayed = this.get('shufflePlayed'), + shuffledSongIndx = this.get('shufflePlayed').indexOf(playQueue[nextSong].url), + i = 0; + + if(shufflePlayed.length > 0 && shuffledSongIndx !== -1){ // only if there was one + nextSong = shuffledSongIndx - 1; + + if(nextSong < 0){ + nextSong = shufflePlayed.length - 1; + } + + playQueue.some(function(item){ // try to find the previous song id + if(item.url === shufflePlayed[nextSong]){ + nextSong = i; + return true; + } + i++; + + return false; + }); + } + } else { + nextSong--; + + if(nextSong < 0) { + nextSong = playQueue.length - 1; + } } this.send('goToSong', nextSong, true, true); diff --git a/app/pods/components/music-tab/mixins/visualizer.js b/app/pods/components/music-tab/mixins/visualizer.js index 1b66d6d..ae687c0 100644 --- a/app/pods/components/music-tab/mixins/visualizer.js +++ b/app/pods/components/music-tab/mixins/visualizer.js @@ -18,7 +18,7 @@ export default Em.Mixin.create({ this.get('storage').set('huegasm.currentVisName', currentVisName); }.observes('currentVisName'), - didInsertElement(){ + doDancerBind(){ var dancer = this.get('dancer'), canvasEl = Em.$('#visualization')[0], ctx = canvasEl.getContext('2d'), @@ -69,6 +69,10 @@ export default Em.Mixin.create({ } } }); + }, + + didInsertElement(){ + this.doDancerBind(); } }) ; diff --git a/app/pods/components/music-tab/template.hbs b/app/pods/components/music-tab/template.hbs index bb16e82..93cf79e 100644 --- a/app/pods/components/music-tab/template.hbs +++ b/app/pods/components/music-tab/template.hbs @@ -53,73 +53,77 @@
-{{#if usingLocalAudio}} - + {{#if usingLocalAudio}} + - + -{{paper-icon icon="shuffle" class=shuffleClass}} -{{paper-icon icon=repeatIcon class=repeatClass}} -{{paper-icon icon="clear-all" class="playerControllIcon"}} -{{/if}} + {{#if playQueueNotEmpty}} +
+ {{paper-icon icon="shuffle" class=shuffleClass}} + {{paper-icon icon=repeatIcon class=repeatClass}} + {{paper-icon icon="clear-all" class="playerControllIcon"}} +
+ {{/if}} + {{/if}} -{{#if usingMicSupported}} -{{paper-icon icon=micIcon class=usingMicAudioClass}} -{{/if}} + {{#if usingMicSupported}} + {{paper-icon icon=micIcon class=usingMicAudioClass}} + {{/if}}
{{#if usingMicAudio}} -
-{{paper-icon icon="mic"}} -
+
+ {{paper-icon icon="mic"}} +
{{else}} -{{#if usingLocalAudio}} -
- {{#if (or playQueueEmpty dragging)}} -
- {{#if dragging}} - Drag your music files here - {{else}} - Add your music files here - {{/if}} -
- {{paper-icon icon="library-music" class=dimmerOnClass}} - {{/if}} - - {{#each playQueue as |item index|}} -
- {{#if item.picture}} - - {{else}} - + {{#if usingLocalAudio}} +
+ {{#if (or playQueueEmpty dragging)}} +
+ {{#if dragging}} + Drag your music files here + {{else}} + Add your music files here + {{/if}} +
+ {{paper-icon icon="library-music" class=dimmerOnClass}} {{/if}} -
- {{#if item.title}} -
{{item.title}}
-
- {{#if item.artistUrl}} - {{item.artist}} + {{#each playQueue as |item index|}} +
+ {{#if item.picture}} + + {{else}} + + {{/if}} + +
+ {{#if item.title}} +
{{item.title}}
+
+ {{#if item.artistUrl}} + {{item.artist}} + {{else}} + {{item.artist}} + {{/if}} +
{{else}} - {{item.artist}} + {{item.fileName}} {{/if}}
- {{else}} - {{item.fileName}} - {{/if}} -
- {{paper-icon icon="close"}} + {{paper-icon icon="close"}} +
+ {{/each}}
- {{/each}} -
-{{/if}} + {{/if}} {{/if}}
diff --git a/app/styles/app.scss b/app/styles/app.scss index f7349ad..eb4ff5f 100644 --- a/app/styles/app.scss +++ b/app/styles/app.scss @@ -1025,3 +1025,19 @@ div.ember-modal-dialog { .keyboard-arrow-down { font-size: 20px; } + +#extraOptionsMenu { + z-index: 1; + background: rgba(0, 0, 0, 0.5); + padding: 3px 15px; + position: absolute; + bottom: -37px; + right: 17px; + border-radius: 0 0 5px 5px; + opacity: 0.3; +} + +#extraOptionsMenu:hover { + opacity: 1; + background: rgba(0, 0, 0, 0.7); +} diff --git a/vendor/dancer.js b/vendor/dancer.js index ab23f4a..2bb7e7b 100644 --- a/vendor/dancer.js +++ b/vendor/dancer.js @@ -388,6 +388,11 @@ this.isLoaded = false; this.progress = 0; + if(this.proc){ + this.proc.onaudioprocess = null; + delete this.proc; + } + this.proc = this.context.createScriptProcessor( SAMPLE_SIZE / 2, 1, 1 ); this.proc.onaudioprocess = function ( e ) {