From cd1c3ca379773fdb8a7efb64c260ae56c2563018 Mon Sep 17 00:00:00 2001
From: Eliot Berriot <contact@eliotberriot.com>
Date: Sun, 17 Dec 2017 17:23:29 +0100
Subject: [PATCH] Fixed #52: Added shuffling controls

---
 CHANGELOG                             |  1 +
 front/src/audio/queue.js              | 11 ++++++++++-
 front/src/components/audio/Player.vue | 10 +++++++++-
 3 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG b/CHANGELOG
index 2f6cbe48b..aa2b67dfa 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 bb3f0f905..4273fb9a6 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 8cdb261c5..c862660ad 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>