Add an icon to select all songs in the queue.

Fixes tsquillario/Jamstash#220
This commit is contained in:
Hyzual 2015-10-26 22:57:52 +01:00
parent c758df2ac9
commit cc20a73efa
5 changed files with 98 additions and 6 deletions

View file

@ -20,6 +20,7 @@
<link href="" rel="stylesheet" type="text/css" data-name="theme" /> <link href="" rel="stylesheet" type="text/css" data-name="theme" />
<!-- build:css(app) styles/concat.min.css --> <!-- build:css(app) styles/concat.min.css -->
<link rel="stylesheet" href="player/player.css" /> <link rel="stylesheet" href="player/player.css" />
<link rel="stylesheet" href="queue/queue.css" />
<link rel="stylesheet" href="subsonic/subsonic.css" /> <link rel="stylesheet" href="subsonic/subsonic.css" />
<link rel="stylesheet" href="player/repeat-directive/repeat-directive.css" /> <link rel="stylesheet" href="player/repeat-directive/repeat-directive.css" />
<link rel="stylesheet" href="subsonic/breadcrumbs-directive/breadcrumbs-directive.css" /> <link rel="stylesheet" href="subsonic/breadcrumbs-directive/breadcrumbs-directive.css" />

14
app/queue/queue.css Normal file
View file

@ -0,0 +1,14 @@
.queue .icon {
height: 12px;
width: 12px;
}
.queue .icon-wrap {
float: left;
cursor: pointer;
padding: 6px;
}
.queue .icon-select-all {
fill: #4C4C4C;
}

View file

@ -1,4 +1,14 @@
<div class="headeractions"> <div class="queue headeractions">
<a
class="icon-wrap"
title="Select All"
ng-click="vm.selectAll()"
>
<svg class="icon">
<title>Select all songs</title>
<use xlink:href="images/sprite/iconic.svg#check" class="icon-select-all"></use>
</svg>
</a>
<a <a
class="buttonimg" class="buttonimg"
title="Shuffle Queue" title="Shuffle Queue"

View file

@ -42,6 +42,7 @@ function QueueController(
playSong : player.play, playSong : player.play,
removeSelectedSongsFromQueue: removeSelectedSongsFromQueue, removeSelectedSongsFromQueue: removeSelectedSongsFromQueue,
removeSongFromQueue : player.removeSong, removeSongFromQueue : player.removeSong,
selectAll : selectAll,
shuffleQueue : shuffleQueue, shuffleQueue : shuffleQueue,
toggleSelection : SelectedSongs.toggle, toggleSelection : SelectedSongs.toggle,
toggleStar : toggleStar toggleStar : toggleStar
@ -53,6 +54,15 @@ function QueueController(
$.fancybox.close(); $.fancybox.close();
} }
function selectAll() {
var allSelected = _.every(player.queue, 'selected');
if (allSelected) {
SelectedSongs.reset();
} else {
SelectedSongs.addSongs(player.queue);
}
}
function isPlayingSong(song) { function isPlayingSong(song) {
return angular.equals(song, player.getPlayingSong()); return angular.equals(song, player.getPlayingSong());
} }

View file

@ -2,13 +2,15 @@
describe("Queue controller", function () { describe("Queue controller", function () {
'use strict'; 'use strict';
var QueueContoller, $scope, player, subsonic, SelectedSongs, notifications, $q, deferred, song; var QueueContoller, _, $scope, player, subsonic, SelectedSongs, notifications, $q, deferred, song;
beforeEach(function () { beforeEach(function () {
module('jamstash.queue.controller'); module('jamstash.queue.controller');
SelectedSongs = jasmine.createSpyObj("SelectedSongs", [ SelectedSongs = jasmine.createSpyObj("SelectedSongs", [
"get" "addSongs",
"get",
"reset"
]); ]);
player = jasmine.createSpyObj("player", [ player = jasmine.createSpyObj("player", [
@ -30,12 +32,13 @@ describe("Queue controller", function () {
inject(function ($controller, $rootScope, _$q_, lodash) { inject(function ($controller, $rootScope, _$q_, lodash) {
$q = _$q_; $q = _$q_;
deferred = $q.defer(); deferred = $q.defer();
_ = lodash;
$scope = $rootScope.$new(); $scope = $rootScope.$new();
QueueContoller = $controller('QueueController', { QueueContoller = $controller('QueueController', {
$scope : $scope, $scope : $scope,
_ : lodash, _ : _,
player : player, player : player,
SelectedSongs: SelectedSongs, SelectedSongs: SelectedSongs,
subsonic : subsonic, subsonic : subsonic,
@ -54,6 +57,60 @@ describe("Queue controller", function () {
expect($.fancybox.close).toHaveBeenCalled(); expect($.fancybox.close).toHaveBeenCalled();
}); });
describe("selectAll() - Given that there were 2 songs in the queue", function() {
beforeEach(function() {
SelectedSongs.addSongs.and.callFake(function (songs) {
_.forEach(songs, function (song) {
song.selected = true;
});
});
SelectedSongs.reset.and.callFake(function () {
_.forEach(player.queue, function (song) {
song.selected = false;
});
});
player.queue = [
{ id: 7322 },
{ id: 5347 }
];
});
it("and none was selected, when I select all songs, then the 2 songs will be selected", function() {
player.queue[0].selected = false;
player.queue[1].selected = false;
QueueContoller.selectAll();
expect(SelectedSongs.addSongs).toHaveBeenCalledWith(player.queue);
expect(player.queue[0].selected).toBeTruthy();
expect(player.queue[1].selected).toBeTruthy();
});
it("and one was selected, when I select all songs, then the 2 songs will be selected", function() {
player.queue[0].selected = false;
player.queue[1].selected = true;
QueueContoller.selectAll();
expect(SelectedSongs.addSongs).toHaveBeenCalledWith(player.queue);
expect(player.queue[0].selected).toBeTruthy();
expect(player.queue[1].selected).toBeTruthy();
});
it("and all were selected, when I select all songs, then the 2 songs will be unselected", function() {
player.queue[0].selected = true;
player.queue[1].selected = true;
QueueContoller.selectAll();
expect(SelectedSongs.reset).toHaveBeenCalled();
expect(player.queue[0].selected).toBeFalsy();
expect(player.queue[1].selected).toBeFalsy();
});
});
it("shuffleQueue() - When I shuffle the queue, then the player's shuffleQueue will be called and the queue will be scrolled back to the first element", function () { it("shuffleQueue() - When I shuffle the queue, then the player's shuffleQueue will be called and the queue will be scrolled back to the first element", function () {
spyOn($.fn, 'scrollTo'); spyOn($.fn, 'scrollTo');