danbarber/mpd-client
1
0
Fork 0
mirror of https://github.com/danbee/mpd-client synced 2025-03-04 08:39:09 +00:00
Code Issues Releases Wiki Activity

Move markup into views.

Browse Source
This commit is contained in:
Dan Barber 2014-03-21 14:51:40 +00:00
parent 2d317e7057
commit f8276cf0e2
3 changed files with 30 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
assets/js/views/queue.html Normal file
View File

@ -0,0 +1,12 @@
<div id="queue" ng-controller="queue">
<header>
<a class="library" href="#!library">Library</a>
<h1>Queue</h1>
</header>
<ol class="songs">
<li ng-repeat="song in queueSongs" ng-class="{ playing: song.playing }">
<p class="title">{{ song.title }}</p>
<p class="artist">{{ song.artist }}</p>
</li>
</ol>
</div>

16
assets/js/views/transport.html Normal file
View File

@ -0,0 +1,16 @@
<div id="transport" ng-controller="transport">
<div class="scrubber">
<div class="time elapsed">{{ elapsedTime | formatLength }}</div>
<div class="time total">{{ totalTime | formatLength }}</div>
<div class="track">
<div class="marker" style="left: {{ markerPosition() }}%" ng-if="!stopped()"></div>
</div>
</div>
<nav class="controls">
<button ng-click="sendCommand('previous')">previous</button>
<button ng-click="sendCommand('pause')" ng-if="playing()">pause</button>
<button ng-click="sendCommand('play')" ng-if="!playing()">play</button>
<button ng-click="sendCommand('stop')">stop</button>
<button ng-click="sendCommand('next')">next</button>
</nav>
</div>

30
views/index.erb
View File

@ -10,34 +10,8 @@
<body> <body>
<div id="content"> <div id="content">
<div id="library"></div> <div id="library"></div>
<div id="queue" ng-controller="queue"> <ng-include src="'<%= asset_path 'views/queue.html' %>'"></ng-include>
<header>
<a class="library" href="#!library">Library</a>
<h1>Queue</h1>
</header>
<ol class="songs">
<li ng-repeat="song in queueSongs" ng-class="{ playing: song.playing }">
<p class="title">{{ song.title }}</p>
<p class="artist">{{ song.artist }}</p>
</li>
</ol>
</div>
</div>
<div id="transport" ng-controller="transport">
<div class="scrubber">
<div class="time elapsed">{{ elapsedTime | formatLength }}</div>
<div class="time total">{{ totalTime | formatLength }}</div>
<div class="track">
<div class="marker" style="left: {{ markerPosition() }}%" ng-if="!stopped()"></div>
</div>
</div>
<nav class="controls">
<button ng-click="sendCommand('previous')">previous</button>
<button ng-click="sendCommand('pause')" ng-if="playing()">pause</button>
<button ng-click="sendCommand('play')" ng-if="!playing()">play</button>
<button ng-click="sendCommand('stop')">stop</button>
<button ng-click="sendCommand('next')">next</button>
</nav>
</div> </div>
<ng-include src="'<%= asset_path 'views/transport.html' %>'"></ng-include>
</body> </body>
</html> </html>