Skip to content

Commit cc1b463

Browse files
kurtommykurtommy
committed
- Added Browse Controller, View, Service
- Added Playlist Controller, View, Service (now using Play Queue service) - Added PlayQueueService - Refactory services initialization for changing socket host [event driven] - Added Logger Services - Moved test-api page inside sidebar menu - Added Sidebar Menu directive, Views and dynamic list items fetching
1 parent 724d63b commit cc1b463

39 files changed

+566
-238
lines changed

‎queue.mock.js

+83
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
[
2+
{
3+
"uri":"USB/07 Samba Pa Ti (Azteca).mp3",
4+
"format":"",
5+
"bitdepth":"",
6+
"samplerate":"",
7+
"channels":"",
8+
"duration":"",
9+
"service":"mpd",
10+
"name":"Samba Pa Ti (Azteca)",
11+
"uid":"track:lMno5_7pzZEmqJzrWcr3Kx5ptpZYdXmeDi7C42_HDqs",
12+
"type":"track",
13+
"albums":[
14+
{
15+
"name":"Santana and Friends",
16+
"uid":"album:dkRSA30nNxqeWKnsiBjpMvclUAYvSXHCxG7VmNdK_cw"
17+
}
18+
],
19+
"artists":[
20+
{
21+
"name":"Santana",
22+
"uid":"artist:jvl4h_0X4CPsS5bSKslWWiWOM7-Jo3dnvisFuUPdBAc"
23+
}
24+
],
25+
"tracknumber":7,
26+
"date":"2006",
27+
"$$hashKey":"object:22"
28+
},
29+
{
30+
"uri":"spotify:track:7fwCv70WvpOD2unCceSNzr",
31+
"format":"",
32+
"bitdepth":"",
33+
"samplerate":"",
34+
"channels":"",
35+
"duration":"",
36+
"service":"spop",
37+
"name":"Little Glockenspiel",
38+
"uid":"track:-XU_fhGbls2UOImH8vB7D-60voGHTcla-aL8ocYsgns",
39+
"type":"track",
40+
"albums":[
41+
{
42+
"name":"The Black Hands (EP)",
43+
"uid":"album:D_D2vXKZ4gpo-A8TUxxIqa0fP6gO1ZartJJpo5dc4ew"
44+
}
45+
],
46+
"artists":[
47+
{
48+
"name":"Pavel Dovgal",
49+
"uid":"artist:mcI4-pQB83YoE_HtreSkZFeewkvixSaTVIUj9bDO5LI"
50+
}
51+
],
52+
"tracknumber":0,
53+
"date":"",
54+
"$$hashKey":"object:23"
55+
},
56+
{
57+
"uri":"spotify:track:3Cpk3Eioia9RUWzxsa1qKf",
58+
"format":"",
59+
"bitdepth":"",
60+
"samplerate":"",
61+
"channels":"",
62+
"duration":"",
63+
"service":"spop",
64+
"name":"Wild Song",
65+
"uid":"track:ZKn46MGgZVfuGC3Kn_SvZEu2FbScycQFD_PgRAuHPDw",
66+
"type":"track",
67+
"albums":[
68+
{
69+
"name":"The Black Hands (EP)",
70+
"uid":"album:D_D2vXKZ4gpo-A8TUxxIqa0fP6gO1ZartJJpo5dc4ew"
71+
}
72+
],
73+
"artists":[
74+
{
75+
"name":"Pavel Dovgal",
76+
"uid":"artist:mcI4-pQB83YoE_HtreSkZFeewkvixSaTVIUj9bDO5LI"
77+
}
78+
],
79+
"tracknumber":0,
80+
"date":"",
81+
"$$hashKey":"object:24"
82+
}
83+
]

‎src/app/browse/browse.controller.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
class BrowseController {
2-
constructor () {
2+
constructor (browseService) {
33
'ngInject';
4+
this.browseService = browseService;
45
}
56
}
67

‎src/app/browse/browse.html

+7-5
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
11
<div id="browse">
22
<div id="browseButtons">
3-
<button ng-class="{selected: browse.listBy === 'artist'}" ng-click="browse.getListBy('artist')">Artist</button>
4-
<button ng-class="{selected: browse.listBy === 'album'}" ng-click="browse.getListBy('album')">Album</button>
5-
<button ng-class="{selected: browse.listBy === 'genere'}" ng-click="browse.getListBy('genere')">Genere</button>
6-
<button ng-class="{selected: browse.listBy === 'track'}" ng-click="browse.getListBy('track')">Track</button>
3+
<button
4+
ng-repeat="filter in browse.browseService.filters"
5+
ng-class="{selected: browseService.listBy === 'artist'}"
6+
ng-click="browseService.getListBy('artist')">
7+
{{filter.name}}
8+
</button>
79
</div>
810
<div id="browseList">
9-
11+
1012
</div>
1113
</div>

‎src/app/components/logger/track-manager.directive.js

-25
This file was deleted.

‎src/app/components/logger/track-manager.html

-15
This file was deleted.

‎src/app/components/logger/track-manager.scss

-8
This file was deleted.

‎src/app/components/player-buttons/player-buttons.directive.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ class PlayerButtonsDirective {
77
templateUrl: 'app/components/player-buttons/player-buttons.html',
88
scope: false,
99
controller: PlayerButtonsController,
10-
controllerAs: 'vm',
10+
controllerAs: 'playerButtons',
1111
bindToController: true
1212
};
1313

@@ -16,9 +16,9 @@ class PlayerButtonsDirective {
1616
}
1717

1818
class PlayerButtonsController {
19-
constructor (player) {
19+
constructor (playerService) {
2020
'ngInject';
21-
this.player = player;
21+
this.playerService = playerService;
2222
}
2323
}
2424

‎src/app/components/player-buttons/player-buttons.html

+7-7
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
<div id="playerButtonsDirective">
2-
<button ng-if="vm.player.state.status !== 'play'" ng-click="vm.player.play()">Play</button>
3-
<button ng-if="vm.player.state.status === 'play'" ng-click="vm.player.pause()">Pause</button>
4-
<button ng-click="vm.player.stop()">Stop</button>
5-
<button ng-click="vm.player.prev()">Prev</button>
6-
<button ng-click="vm.player.next()">Next</button>
2+
<button ng-if="playerButtons.playerService.state.status !== 'play'" ng-click="playerButtons.playerService.play()">Play</button>
3+
<button ng-if="playerButtons.playerService.state.status === 'play'" ng-click="playerButtons.playerService.pause()">Pause</button>
4+
<button ng-click="playerButtons.playerService.stop()">Stop</button>
5+
<button ng-click="playerButtons.playerService.prev()">Prev</button>
6+
<button ng-click="playerButtons.playerService.next()">Next</button>
77
&nbsp; | &nbsp;
8-
<button ng-click="vm.player.rebuildSpopLibrary()">Spop</button>
9-
<button ng-click="vm.player.rebuildLibrary()">Rebuild</button>
8+
<button ng-click="playerButtons.playerService.rebuildSpopLibrary()">Spop</button>
9+
<button ng-click="playerButtons.playerService.rebuildLibrary()">Rebuild</button>
1010
</div>

‎src/app/components/player-buttons/player-buttons.scss

+1-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
#playerButtonsDirective {
22
border: solid 0px red;
33

4-
button {
5-
@extend .btn, .btn-success;
6-
}
4+
75
}

‎src/app/components/player-logger/player-logger.directive.js

+2-8
Original file line numberDiff line numberDiff line change
@@ -16,15 +16,9 @@ class PlayerLoggerDirective {
1616
}
1717

1818
class PlayerLoggerController {
19-
constructor (socketService) {
19+
constructor (loggerService) {
2020
'ngInject';
21-
socketService.on('printConsoleMessage', (data) => {
22-
this.log = '<br/>' + data + this.log;
23-
});
24-
}
25-
26-
clear() {
27-
this.log = '';
21+
this.loggerService = loggerService;
2822
}
2923
}
3024

‎src/app/components/player-logger/player-logger.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
<div id="playerLogger">
2-
<button ng-click="playerLogger.clear()">Clear console</button>
3-
<div id="log" ng-bind-html="playerLogger.log"></div>
2+
<button ng-click="playerLogger.loggerService.clear()">Clear console</button>
3+
<div id="log" ng-bind-html="playerLogger.loggerService.log"></div>
44
</div>

‎src/app/components/player-status/player-status.directive.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -16,10 +16,10 @@ class PlayerStatusDirective {
1616
}
1717

1818
class PlayerStatusController {
19-
constructor (player) {
19+
constructor (playerService) {
2020
'ngInject';
21-
this.player = player;
22-
console.log(this.player);
21+
this.playerService = playerService;
22+
//console.log(this.playerService);
2323
}
2424
}
2525

‎src/app/components/player-status/player-status.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<strong>mute</strong>: {{vm.player.state._mute}}
88
-->
99
<div id="playerStatus" class="col-sm-12">
10-
<span ng-repeat="(key, val) in playerStatus.player.state">
10+
<span ng-repeat="(key, val) in playerStatus.playerService.state">
1111
<strong>{{key}}: </strong> {{val}}
1212
</span>
1313
</div>

‎src/app/components/side-menu/side-menu.directive.js

+88
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
class PlayerButtonsDirective {
2+
constructor () {
3+
'ngInject';
4+
5+
let directive = {
6+
restrict: 'E',
7+
templateUrl: 'app/components/side-menu/side-menu.html',
8+
scope: false,
9+
controller: SideMenuController,
10+
controllerAs: 'sideMenu',
11+
bindToController: true
12+
};
13+
14+
return directive;
15+
}
16+
}
17+
18+
class SideMenuController {
19+
constructor ($rootScope, socketService, $state) {
20+
'ngInject';
21+
this.socketService = socketService;
22+
this.$state = $state;
23+
24+
this.visible = false;
25+
this.menuItems = [
26+
{
27+
id: 'home',
28+
name: 'Home',
29+
type: 'static',
30+
state: 'volumio.playback'
31+
},
32+
{
33+
id: 'components',
34+
name: 'Components',
35+
type: 'static',
36+
state: 'volumio.components'
37+
},
38+
{
39+
id: 'network',
40+
name: 'Network',
41+
type: 'dynamic'
42+
},
43+
{
44+
id: 'settings',
45+
name: 'Settings',
46+
type: 'Dynamic'
47+
},
48+
];
49+
50+
51+
this.init();
52+
$rootScope.$on('socket:init', () => {
53+
this.init();
54+
});
55+
}
56+
57+
toggleMenu() {
58+
this.visible = !this.visible;
59+
}
60+
61+
itemClick(item) {
62+
this.toggleMenu();
63+
if (item.type === 'static') {
64+
this.$state.go(item.state);
65+
} else {
66+
//TODO Dynamic page settins templates engine
67+
68+
}
69+
}
70+
71+
init() {
72+
this.registerListner();
73+
this.initService();
74+
}
75+
76+
registerListner() {
77+
this.socketService.on('setMenuItems', (data) => {
78+
//console.log(data);
79+
this.items = data;
80+
});
81+
}
82+
83+
initService() {
84+
this.socketService.emit('getMenuItems');
85+
}
86+
}
87+
88+
export default PlayerButtonsDirective;

‎src/app/components/side-menu/side-menu.html

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<button id="menuBtn" ng-click="sideMenu.toggleMenu()">Menu</button>
2+
<div id="menuList" class="btn-group-vertical" role="group" ng-if="sideMenu.visible" class="">
3+
<button ng-repeat="item in sideMenu.menuItems" type="button" name="button" ng-click="sideMenu.itemClick(item)">
4+
{{item.name}}
5+
</button>
6+
</div>
7+
</div>

‎src/app/components/side-menu/side-menu.scss

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
side-menu {
2+
position: relative;
3+
background-color: gray;
4+
#menuBtn {
5+
}
6+
#menuList {
7+
position: absolute;
8+
top: 34px;
9+
right:0px;
10+
width: 200px;
11+
&.ng-enter, &.ng-leave {
12+
transition: .3s linear all;
13+
}
14+
&.ng-enter {
15+
opacity: 0;
16+
}
17+
&.ng-enter.ng-enter-active {
18+
opacity:1;
19+
}
20+
&.ng-leave.ng-leave-active {
21+
opacity:0;
22+
}
23+
}
24+
25+
}

‎src/app/components/track-manager/track-manager.directive.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,9 +16,9 @@ class TrackManagerDirective {
1616
}
1717

1818
class TrackManagerController {
19-
constructor (player) {
19+
constructor (playerService) {
2020
'ngInject';
21-
this.player = player;
21+
this.playerService = playerService;
2222
}
2323
}
2424

0 commit comments

Comments
 (0)