Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

adding shuffle, making buttons bigger, clean up style

  • Loading branch information...
commit f71d5f378ec4c95fdc79964334bdf4c1e57c1a16 1 parent d8a2bee
@bahamas10 authored
Showing with 64 additions and 37 deletions.
  1. +4 −0 README.md
  2. +9 −6 site/index.html
  3. +51 −31 site/static/js/webamp.js
View
4 README.md
@@ -107,6 +107,10 @@ Return an object with an album or artist as the key, and a list of song or album
An object representing the possible themes to use
+#### /api/conf
+
+An object representing non-private config variables
+
Known Issues
------------
View
15 site/index.html
@@ -43,17 +43,20 @@ <h5 class="current-theme">default</h5>
<li class="artist"></li>
</ul>
</div>
- <div id="audio" class="span8">
- <audio controls preload="auto" autobuffer></audio>
+ <div id="audio" class="span2">
<div id="controls">
<span class="btn-group">
- <button class="btn btn-mini prev"><i class="icon-white icon-backward"></i></button>
- <button class="btn btn-mini play"><i class="icon-white icon-play"></i></button>
- <button class="btn btn-mini next"><i class="icon-white icon-forward"></i></button>
+ <button class="btn prev"><i class="icon-white icon-backward"></i></button>
+ <button class="btn play"><i class="icon-white icon-play"></i></button>
+ <button class="btn next"><i class="icon-white icon-forward"></i></button>
</span>
- <button class="btn btn-mini repeat"><img height="13" width="14" src="/static/img/whiterepeat.png"></button>
+ <button class="btn repeat"><img style="margin-top: -4px" height="13" width="14" src="/static/img/whiterepeat.png"></button>
+ <button class="btn shuffle"><i class="icon-white icon-random"></i></button>
</div>
</div>
+ <div class="span6">
+ <audio controls preload="auto" autobuffer></audio>
+ </div>
</footer>
</body>
</html>
View
82 site/static/js/webamp.js
@@ -1,22 +1,23 @@
var cache = {
- 'artists': null,
- 'albums': null,
- 'songs': null,
- 'songs_by_album': null,
- 'albums_by_artist': null,
- 'conf': null,
- 'themes': null
- },
- current_artist = null,
- playlist = [],
- playlist_pos = 0,
- options = {
- 'repeat': 0
- },
- orig_title = '',
- orig_favicon = '/testing.ico',
- article_re = /^the |^a /,
- $data, $audio, $divs, $nowplaying, $dropdown, $themes,
+ artists: null,
+ albums: null,
+ songs: null,
+ songs_by_album: null,
+ albums_by_artist: null,
+ conf: null,
+ themes: null
+};
+var current_artist = null;
+var playlist = [];
+var playlist_pos = 0;
+var options = {
+ repeat: 0,
+ shuffle: false
+};
+var orig_title = document.title;
+var orig_favicon = '/testing.ico';
+var article_re = /^the |^a /;
+var $data, $audio, $divs, $nowplaying, $dropdown, $themes,
$header, $footer, $music_list, $controls, $active_div;
$(document).ready(function() {
@@ -39,25 +40,25 @@ function start() {
$header = $('#header');
$footer = $('#footer');
$divs = {
- 'artists': null,
- 'albums': null,
- 'songs': null
+ artists: null,
+ albums: null,
+ songs: null
};
$nowplaying = {
- 'img': $('#nowplaying img.album-art'),
- 'artist': $('#nowplaying li.artist'),
- 'album': $('#nowplaying li.album'),
- 'song': $('#nowplaying li.song')
+ img: $('#nowplaying img.album-art'),
+ artist: $('#nowplaying li.artist'),
+ album: $('#nowplaying li.album'),
+ song: $('#nowplaying li.song')
};
$controls = {
- 'prev': $('#controls .prev'),
- 'play': $('#controls .play'),
- 'next': $('#controls .next'),
- 'repeat': $('#controls .repeat')
+ prev: $('#controls .prev'),
+ play: $('#controls .play'),
+ next: $('#controls .next'),
+ repeat: $('#controls .repeat'),
+ shuffle: $('#controls .shuffle')
};
$dropdown = $('select');
$themes = $('#themes');
- orig_title = document.title;
$data.html('');
@@ -235,6 +236,15 @@ function start() {
break;
}
});
+ $controls.shuffle.click(function() {
+ var $this = $(this);
+ options.shuffle = !options.shuffle;
+ if (options.shuffle) {
+ $this.addClass('active');
+ } else {
+ $this.removeClass('active');
+ }
+ });
// Themes
Object.keys(cache.themes).forEach(function(theme) {
@@ -309,7 +319,17 @@ function populate_list($item, target, ids) {
}
function next() {
- if (options.repeat !== 2) playlist_pos++;
+ // repeat 1
+ if (options.repeat === 2) return _play();
+
+ if (options.shuffle) {
+ var pos = playlist_pos;
+ while (pos === playlist_pos)
+ pos = Math.floor(Math.random() * playlist.length)
+ playlist_pos = pos;
+ } else {
+ playlist_pos++;
+ }
_play();
}
Please sign in to comment.
Something went wrong with that request. Please try again.