diff --git a/CHANGELOG b/CHANGELOG index 2f6cbe48bca3afd1cc77de5dd01a7d77f660ef12..aa2b67dfa748c9d0236c3ed78de7b681bac575ea 100644 --- a/CHANGELOG +++ b/CHANGELOG @@ -9,6 +9,7 @@ Changelog as a favorite (#53) - Shortcuts: avoid collisions between shortcuts by using the exact modifier (#53) - Player: Added looping controls and shortcuts (#52) +- Player: Added shuffling controls and shortcuts (#52) 0.2.6 (2017-12-15) diff --git a/front/src/audio/queue.js b/front/src/audio/queue.js index bb3f0f9055fafa10deac458b7806d9f857ef1a8f..4273fb9a630dd098458b532cd85f5bdb96399aba 100644 --- a/front/src/audio/queue.js +++ b/front/src/audio/queue.js @@ -1,10 +1,12 @@ +import Vue from 'vue' +import _ from 'lodash' + import logger from '@/logging' import cache from '@/cache' import config from '@/config' import Audio from '@/audio' import backend from '@/audio/backend' import radios from '@/radios' -import Vue from 'vue' import url from '@/utils/url' import auth from '@/auth' @@ -316,6 +318,13 @@ class Queue { } } + shuffle () { + let tracks = this.tracks + let shuffled = _.shuffle(tracks) + this.clean() + this.appendMany(shuffled) + } + } let queue = new Queue() diff --git a/front/src/components/audio/Player.vue b/front/src/components/audio/Player.vue index 8cdb261c535023f50dc218b1712aeb3b099489d2..c862660ad60ed0960cc5b0e66a2380810cdef9b7 100644 --- a/front/src/components/audio/Player.vue +++ b/front/src/components/audio/Player.vue @@ -97,7 +97,14 @@ class="repeat orange secondary icon"> </i> </div> - <div class="three wide column"></div> + <div + @click="queue.shuffle()" + :disabled="queue.tracks.length === 0" + title="Shuffle your queue" + class="two wide column control"> + <i :class="['ui', 'random', 'secondary', {'disabled': queue.tracks.length === 0}, 'icon']" ></i> + </div> + <div class="one wide column"></div> <div @click="queue.clean()" :disabled="queue.tracks.length === 0" @@ -114,6 +121,7 @@ @keydown.ctrl.up.prevent.exact="queue.incrementVolume(0.1)" @keydown.f.prevent.exact="favoriteTracks.toggle(queue.currentTrack.id)" @keydown.l.prevent.exact="queue.toggleLooping" + @keydown.s.prevent.exact="queue.shuffle" /> </div>