From 530416eaf81817131a673be66d4589d4e3bf98f1 Mon Sep 17 00:00:00 2001
From: James Barnsley <james@barnsley.nz>
Date: Sun, 22 Jan 2017 12:54:20 +1300
Subject: [PATCH] Clear tracklist button (fixes #43)

---
 src/js/services/mopidy/actions.js |  4 ++++
 src/js/views/Queue.js             | 23 ++++++++++++++++++++++-
 src/scss/global/_core.scss        |  1 +
 3 files changed, 27 insertions(+), 1 deletion(-)

diff --git a/src/js/services/mopidy/actions.js b/src/js/services/mopidy/actions.js
index d8890730..1e42f4d7 100755
--- a/src/js/services/mopidy/actions.js
+++ b/src/js/services/mopidy/actions.js
@@ -94,6 +94,10 @@ export function reorderTracklist( indexes, insert_before ){
 	}
 }
 
+export function clearTracklist(){
+	return instruct('tracklist.clear');
+}
+
 export function play(){
 	return instruct('playback.play');
 }
diff --git a/src/js/views/Queue.js b/src/js/views/Queue.js
index 37bde442..db32cb7f 100755
--- a/src/js/views/Queue.js
+++ b/src/js/views/Queue.js
@@ -6,6 +6,7 @@ import FontAwesome from 'react-fontawesome'
 
 import TrackList from '../components/TrackList'
 import Track from '../components/Track'
+import Dater from '../components/Dater'
 import SidebarToggleButton from '../components/SidebarToggleButton'
 import FullPlayer from '../components/FullPlayer'
 import ArtistSentence from '../components/ArtistSentence'
@@ -42,6 +43,18 @@ class Queue extends React.Component{
 		this.props.mopidyActions.reorderTracklist( indexes, index )
 	}
 
+	renderQueueStats(){
+		var total_time = 0
+
+		return (
+			<div className="queue-stats grey-text">
+				<span>{this.props.current_tracklist.length} tracks</span>
+				&nbsp;&nbsp;|&nbsp;&nbsp;
+				{this.props.current_tracklist.length > 0 ? <Dater type="total-time" data={this.props.current_tracklist} /> : <span>0 mins</span>}
+			</div>
+		)
+	}
+
 	renderRadio(){
 		if (!this.props.radio || !this.props.radio.enabled) return null
 
@@ -65,16 +78,24 @@ class Queue extends React.Component{
 	}
 
 	render(){
+		var actions = (
+			<button onClick={() => this.props.mopidyActions.clearTracklist()}>
+				<FontAwesome name="trash" />&nbsp;
+				Clear
+			</button>
+		)
+
 		return (
 			<div className="view queue-view">
 			
-				<Header icon="play" title="Now playing" />
+				<Header icon="play" title="Now playing" actions={actions} />
 
 				<FullPlayer />
 
 				{ this.renderRadio() }
 
 				<section className="list-wrapper">
+
 					<TrackList
 						show_source_icon={true}
 						context="queue"
diff --git a/src/scss/global/_core.scss b/src/scss/global/_core.scss
index 04edf57e..037309a0 100755
--- a/src/scss/global/_core.scss
+++ b/src/scss/global/_core.scss
@@ -34,6 +34,7 @@ main {
 		color: inherit;
 		text-decoration: none;
 		border-bottom: 1px dotted transparent;
+		cursor: pointer;
 
 		&:hover {
 			border-color: #000000;