1
0
mirror of https://github.com/balkian/go5ears.git synced 2025-09-02 17:12:19 +00:00

Working playlist and persistence.

This commit is contained in:
J.Fernando Sánchez
2012-10-08 06:16:44 +02:00
parent 27388ebc09
commit 4ab5485cae
3 changed files with 183 additions and 110 deletions

View File

@@ -12,25 +12,22 @@
</head>
<body>
<div id="headerPage">
<p>Go5ears. Because Flash simply sucks!</p>
<p><audio controls="controls" preload="auto" tabindex="0" type="audio/mpeg">No funciona el tag html5</audio></p>
</div>
<div id="wrapper">
<div id="results">
<h3>Playlist</h3>
<p><input type="checkbox" data-bind="checked: shuffle" /> Shuffle</p>
<p><input type="checkbox" data-bind="checked: repeatAll" /> RepeatAll</p>
<p><input type="checkbox" data-bind="checked: repeat" /> RepeatOne</p>
<div data-bind="text: trackNumber">:)</div>
<div data-bind="text: current">:D</div>
<a href="#" data-bind="click: playNext">Next!</a>
<ul data-bind="foreach: playlist">
<div id="controls">
<input type="checkbox" data-bind="checked: shuffle" /> Shuffle
<input type="checkbox" data-bind="checked: repeatAll" /> RepeatAll
<input type="checkbox" data-bind="checked: repeat" /> RepeatOne
<!-- <ul data-bind="foreach: playlist">
<li data-bind="text: title"></li>
</ul>
</ul>-->
</div>
<audio id="audio" controls="controls" preload="auto" tabindex="0" type="audio/mpeg">No funciona el tag html5</audio>
<div>
<a href="#" data-bind="click: playPrevious">Prev!</a>
<a href="#" data-bind="click: playNext">Next!</a>
</div>
</div>
<div id="wrapper">
<div id="accordion" class="ui-accordion ui-widget ui-helper-reset ui-accordion-icons">
<h3 class="ui-accordion-header ui-helper-reset ui-state-active ui-corner-top" role="tab" aria-expanded="true" aria-selected="true" tabindex="0">
<span class="ui-icon ui-icon-triangle-1-s"></span>
@@ -40,14 +37,15 @@
<ul id="playlist" class="sortable" data-bind="sortable: playlist">
<li class="ui-state-default" data-bind="sortableItem: { item: $data, parentList: playlist }">
<div class="list-controls">
<span class="ui-icon ui-icon-play" data-bind="click: playSong, visible: ! isPlaying()">Play</span>
<span class="ui-icon ui-icon-pause" data-bind="click: pauseSong, visible: isPlaying()">Play</span>
<span class="ui-icon ui-icon-play" data-bind="click: $root.playSong, visible: ! isPlaying()">Play</span>
<span class="ui-icon ui-icon-pause" data-bind="click: $root.pauseSong, visible: isPlaying()">Play</span>
<span class="ui-icon ui-icon-circle-plus" data-bind="click: $root.addSong">Add</span>
<span class="ui-icon ui-icon-arrowthickstop-1-s"></span>
</div>
<div class="list-name" data-bind="text: formattedName()">
<span class="list-name" data-bind="text: formattedName()">
Name - Title
</div>
</span>
<span class="deletesong ui-icon ui-icon-trash" data-bind="click: $root.removeSong">Remove</span>
</li>
</ul>
</div> <h3 class="ui-accordion-header ui-helper-reset ui-state-active ui-corner-top" role="tab" aria-expanded="true" aria-selected="true" tabindex="0"><span class="ui-icon ui-icon-triangle-1-s"></span>
@@ -57,15 +55,15 @@
<form method="POST" action="#" data-bind="submit: getResults">
Search GoEar: <input type="search" name="goearsearch" data-bind="value: queryString">
</form>
<ul id="searchresults" class="sortable" data-bind="foreach: results">
<ul id="searchResults" class="sortable" data-bind="foreach: results">
<li class="ui-state-default">
<div class="list-controls">
<span class="ui-icon ui-icon-play" data-bind="click: playSong, visible: ! isPlaying()">Play</span>
<span class="ui-icon ui-icon-pause" data-bind="click: pauseSong, visible: isPlaying()">Play</span>
<span class="ui-icon ui-icon-play" data-bind="click: $root.playSong, visible: ! isPlaying()">Play</span>
<span class="ui-icon ui-icon-pause" data-bind="click: $root.pauseSong, visible: isPlaying()">Play</span>
<span class="ui-icon ui-icon-circle-plus" data-bind="click: $root.addSong">Add</span>
<span class="ui-icon ui-icon-arrowthickstop-1-s"></span>
</div>
<div class="list-name" data-bind="text: formattedName(), click: playSong">
<div class="list-name" data-bind="text: formattedName()">
Name - Title
</div>
</li>