yetangitu/Jamstash
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

.022 can be installed anywhere, Chrome App support, JSONP implementation

Browse source
This commit is contained in:
Trevor Squillario 2012-03-06 12:42:26 -05:00
parent 9c7157941f
commit 7de6c89b74
6 changed files with 157 additions and 124 deletions
Download patch file Download diff file Expand all files Collapse all files

1
README
View file

@ -21,6 +21,7 @@ External Subsonic Music Player
1/18/2012 .019 rating support, random playlist, new preferences added 1/18/2012 .019 rating support, random playlist, new preferences added
1/25/2012 .020 table layout for songs, bug fixes, display tweaks 1/25/2012 .020 table layout for songs, bug fixes, display tweaks
2/22/2012 .021 added sidebar for chat and now playing, bug fixes 2/22/2012 .021 added sidebar for chat and now playing, bug fixes
3/6/2012 .022 can be installed anywhere, Chrome App support, JSONP implementation
TO DO: (In no particular order...) TO DO: (In no particular order...)
- Jukebox Control - Jukebox Control

BIN
images/subsonic-36.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.5 KiB

66
index.html
View file

@ -7,7 +7,7 @@
<link rel="icon" href="images/subsonic_32x32.png" sizes="32x32"/> <link rel="icon" href="images/subsonic_32x32.png" sizes="32x32"/>
<link href="style/Style.css" rel="stylesheet" type="text/css" /> <link href="style/Style.css" rel="stylesheet" type="text/css" />
<link href="js/fancybox/jquery.fancybox-1.3.4.css" rel="stylesheet" type="text/css" /> <link href="js/fancybox/jquery.fancybox-1.3.4.css" rel="stylesheet" type="text/css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="js/audiojs/audio.min.js" type="text/javascript"></script> <script src="js/audiojs/audio.min.js" type="text/javascript"></script>
<script src="js/jquery.scrollTo-1.4.2-min.js" type="text/javascript"></script> <script src="js/jquery.scrollTo-1.4.2-min.js" type="text/javascript"></script>
<script src="js/jquery.disable.text.select.pack.js" type="text/javascript"></script> <script src="js/jquery.disable.text.select.pack.js" type="text/javascript"></script>
@ -17,6 +17,7 @@
<script src="js/jquery.periodic.js" type="text/javascript"></script> <script src="js/jquery.periodic.js" type="text/javascript"></script>
<script src="js/jquery.shuffle.js" type="text/javascript"></script> <script src="js/jquery.shuffle.js" type="text/javascript"></script>
<script src="js/fancybox/jquery.fancybox-1.3.4.pack.js" type="text/javascript"></script> <script src="js/fancybox/jquery.fancybox-1.3.4.pack.js" type="text/javascript"></script>
<script src="js/jquery.linkify-1.0-min.js" type="text/javascript"></script>
<script src="js/app.js" type="text/javascript"></script> <script src="js/app.js" type="text/javascript"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function () { $(document).ready(function () {
@ -363,6 +364,11 @@
} }
return false; return false;
}); });
$('#action_ShufflePlaylist').live('click', function () {
$('#TrackContainer tr.song').shuffle();
refreshRowColor();
return false;
});
// Player Click Events // Player Click Events
$('#PlayTrack').live('click', function () { $('#PlayTrack').live('click', function () {
@ -421,15 +427,14 @@
var AutoPlaylistSize = $('#AutoPlaylistSize').val(); var AutoPlaylistSize = $('#AutoPlaylistSize').val();
$.cookie('AutoAlbumSize', AutoAlbumSize, { expires: 365 }); $.cookie('AutoAlbumSize', AutoAlbumSize, { expires: 365 });
$.cookie('AutoPlaylistSize', AutoPlaylistSize, { expires: 365 }); $.cookie('AutoPlaylistSize', AutoPlaylistSize, { expires: 365 });
var subdirectory = $('#SubDirectory').val(); var server = $('#Server').val();
if (subdirectory != "") { if (server != "") {
$.cookie('subdirectory', subdirectory, { expires: 365 }); $.cookie('Server', server, { expires: 365 });
} }
var applicationname = $('#ApplicationName').val(); var applicationname = $('#ApplicationName').val();
if (applicationname != "") { if (applicationname != "") {
$.cookie('applicationname', applicationname, { expires: 365 }); $.cookie('ApplicationName', applicationname, { expires: 365 });
} }
location.reload(true);
}); });
$('input#Password').keydown(function (e) { $('input#Password').keydown(function (e) {
var unicode = e.charCode ? e.charCode : e.keyCode; var unicode = e.charCode ? e.charCode : e.keyCode;
@ -442,16 +447,10 @@
$.cookie('password', null); $.cookie('password', null);
$.cookie('AutoAlbumSize', null); $.cookie('AutoAlbumSize', null);
$.cookie('AutoPlaylistSize', null); $.cookie('AutoPlaylistSize', null);
$.cookie('SubDirectory', null); $.cookie('Server', null);
$.cookie('ApplicationName', null); $.cookie('ApplicationName', null);
location.reload(true); location.reload(true);
}); });
$('#StyleSwitcher').live('change', function () {
var style = $(this).val();
$('link').attr('href', style);
$.cookie('css', style, { expires: 365, path: '/' });
location.reload(true);
});
}); // End document.ready }); // End document.ready
$(window).load(function () { $(window).load(function () {
@ -561,7 +560,6 @@
<li><a href="#tabLibrary">Music Library</a></li> <li><a href="#tabLibrary">Music Library</a></li>
<li><a href="#tabCurrent">Current Playlist</a></li> <li><a href="#tabCurrent">Current Playlist</a></li>
<li><a href="#tabPlaylists">Playlists</a></li> <li><a href="#tabPlaylists">Playlists</a></li>
<!--<li><a href="#tabCurrentPlaylist">Current Playlist</a></li>-->
<li><a href="#tabPreferences" class="last">Preferences</a></li> <li><a href="#tabPreferences" class="last">Preferences</a></li>
</ul> </ul>
<div class="toploading"></div> <div class="toploading"></div>
@ -625,6 +623,7 @@
<a href="#" class="button" id="action_NewPlaylist" onclick="newPlaylist(); return false;" title="New Playlist">+ New</a> <a href="#" class="button" id="action_NewPlaylist" onclick="newPlaylist(); return false;" title="New Playlist">+ New</a>
<a href="#" class="button" id="action_DeletePlaylist" title="Delete Playlist">Delete</a> <a href="#" class="button" id="action_DeletePlaylist" title="Delete Playlist">Delete</a>
<a href="#" class="button" id="action_SavePlaylist" title="Save Playlist">Save</a> <a href="#" class="button" id="action_SavePlaylist" title="Save Playlist">Save</a>
<a href="#" class="button" id="action_ShufflePlaylist" title="Shuffle Playlist"><img src="images/fork_11x12.png" /></a>
<a href="#" class="button" id="action_RemoveSongs" title="Remove selected song(s) from playlist">Remove Song(s)</a> <a href="#" class="button" id="action_RemoveSongs" title="Remove selected song(s) from playlist">Remove Song(s)</a>
</div> </div>
<div class="clear"></div> <div class="clear"></div>
@ -653,8 +652,8 @@
$('#Password').val($.cookie('password')); $('#Password').val($.cookie('password'));
$('#AutoAlbumSize').val($.cookie('AutoAlbumSize')); $('#AutoAlbumSize').val($.cookie('AutoAlbumSize'));
$('#AutoPlaylistSize').val($.cookie('AutoPlaylistSize')); $('#AutoPlaylistSize').val($.cookie('AutoPlaylistSize'));
$('#SubDirectory').val($.cookie('subdirectory')); $('#Server').val($.cookie('Server'));
$('#ApplicationName').val($.cookie('applicationname')); $('#ApplicationName').val($.cookie('ApplicationName'));
}); });
</script> </script>
<div class="actions floatleft"> <div class="actions floatleft">
@ -664,14 +663,27 @@
<div class="clear"></div> <div class="clear"></div>
<div class="lgsection floatleft"> <div class="lgsection floatleft">
<div class="subsection floatleft"> <div class="subsection floatleft">
<label for="Username">Username</label><br /> <h3 class="title">Login</h3>
<label for="Username">Username <span class="red">*</span></label><br />
<input type="text" id="Username" name="Username" class="large"/><br /> <input type="text" id="Username" name="Username" class="large"/><br />
<label for="Password">Password</label><br /> <label for="Password">Password <span class="red">*</span></label><br />
<input type="password" id="Password" name="Password" class="large"/><br /><br /> <input type="password" id="Password" name="Password" class="large"/><br />
<label for="Server">Server <span class="red">*</span></label><br />
<input type="text" id="Server" name="Server" class="xlarge" title="Subsonic Server URL Ex: http://host:port/subsonic"/><br />
</div>
<div class="clear"></div>
<div class="subsection floatleft">
<h3 class="title">Options</h3>
<label for="AutoAlbumSize">Auto Album Size (Default 15)</label><br />
<input type="text" id="AutoAlbumSize" name="AutoAlbumSize" class="large" title="Number of Albums to Get on the Music Library tab"/><br />
<label for="AutoPlaylistSize">Auto Playlist Size (Default 25)</label><br />
<input type="text" id="AutoPlaylistSize" name="AutoPlaylistSize" class="large" title="Number of Songs to Get on the Playlist tab"/><br />
<label for="ApplicationName">Application Name (Default MiniSub)</label><br />
<input type="text" id="ApplicationName" name="ApplicationName" class="large" title="Custom Player Name"/><br />
</div> </div>
<div class="subsection floatleft"> <div class="subsection floatleft">
<h3 class="title">Keyboard Shortcuts</h3>
<ul class="preferences"> <ul class="preferences">
<li class="title">Keyboard Shortcuts</li>
<li><em>[a-z]</em> Click the Album list, use to quickly browse to an artist</li> <li><em>[a-z]</em> Click the Album list, use to quickly browse to an artist</li>
<li><em>Spacebar</em> Play/Pause</li> <li><em>Spacebar</em> Play/Pause</li>
<li><em>&rarr;</em> Next Track</li> <li><em>&rarr;</em> Next Track</li>
@ -680,19 +692,6 @@
</ul> </ul>
</div> </div>
<div class="clear"></div> <div class="clear"></div>
<div class="subsection floatleft">
<label for="AutoAlbumSize">Auto Album Size (Default 15)</label><br />
<input type="text" id="AutoAlbumSize" name="AutoAlbumSize" class="large" title="Number of albums to get on the Music Library tab"/><br />
<label for="AutoPlaylistSize">Auto Playlist Size (Default 25)</label><br />
<input type="text" id="AutoPlaylistSize" name="AutoPlaylistSize" class="large" title="Number of songs to get on the Playlist tab"/><br />
</div>
<div class="subsection floatleft">
<label for="SubDirectory">Subdirectory</label><br />
<input type="text" id="SubDirectory" name="SubDirectory" class="large" title="Used for custom installations (Tomcat)"/><br />
<label for="ApplicationName">Application Name (Default MiniSub)</label><br />
<input type="text" id="ApplicationName" name="ApplicationName" class="large" title="Used for custom player name"/><br />
</div>
<div class="clear"></div>
</div> </div>
<div class="clear"></div> <div class="clear"></div>
</div> </div>
@ -732,7 +731,6 @@
<div class="clear"></div> <div class="clear"></div>
</div><!-- end #content --> </div><!-- end #content -->
<!--<div class="floatright"><a href="#" title="Launch external player" onclick="popOut(); return false;"><img src="images/new_window_12x12.png" /></a></div>-->
</div><!-- end #container --> </div><!-- end #container -->
</body> </body>
</html> </html>

189
js/app.js
View file

@ -1,20 +1,21 @@
// Global Variables // Global Variables
var hostURL = location.href; var hostURL = location.href;
var baseURL; var baseURL;
if ($.cookie('subdirectory')) { if ($.cookie('Server')) {
baseURL = location.protocol + '//' + location.host + '/' + $.cookie('subdirectory') + '/rest'; baseURL = $.cookie('Server') + '/rest';
} else {
baseURL = location.protocol + '//' + location.host + '/rest';
} }
var applicationName; var applicationName;
if ($.cookie('applicationname')) { if ($.cookie('ApplicationName')) {
applicationName = $.cookie('applicationname'); applicationName = $.cookie('ApplicationName');
} else { } else {
applicationName = 'MiniSub'; applicationName = 'MiniSub';
} }
var username = $.cookie('username'); var username = $.cookie('username');
var password = $.cookie('password'); var password = $.cookie('password');
var auth = makeBaseAuth(username, password); var auth = makeBaseAuth(username, password);
var passwordenc = 'enc:' + HexEncode($.cookie('password'));
var version = '1.7.0';
function loadTabContent(tab) { function loadTabContent(tab) {
switch (tab) { switch (tab) {
case '#tabLibrary': case '#tabLibrary':
@ -28,10 +29,8 @@ function loadTabContent(tab) {
loadPlaylists(); loadPlaylists();
break; break;
case '#tabPreferences': case '#tabPreferences':
//loadPreferences();
break; break;
default: default:
//alert('default');
break; break;
} }
} }
@ -44,12 +43,10 @@ function loadArtists(refresh) {
if (content === "") { if (content === "") {
// Load Artist List // Load Artist List
$.ajax({ $.ajax({
url: baseURL + '/getIndexes.view?v=1.6.0&c=' + applicationName + '&f=json', url: baseURL + '/getIndexes.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp',
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
beforeSend: function (req) { timeout: 10000,
req.setRequestHeader('Authorization', auth);
},
success: function (data) { success: function (data) {
if (data["subsonic-response"].status === 'ok') { if (data["subsonic-response"].status === 'ok') {
var indexlist, indexname; var indexlist, indexname;
@ -94,9 +91,10 @@ function loadArtists(refresh) {
} }
function getAlbums(id, action, appendto) { function getAlbums(id, action, appendto) {
$.ajax({ $.ajax({
url: baseURL + '/getMusicDirectory.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + id, url: baseURL + '/getMusicDirectory.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp&id=' + id,
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -159,9 +157,10 @@ function getAlbumListBy(id) {
size = $.cookie('AutoAlbumSize'); size = $.cookie('AutoAlbumSize');
} }
$.ajax({ $.ajax({
url: baseURL + '/getAlbumList.view?v=1.6.0&c=' + applicationName + '&f=json&size=' + size + '&type=' + id, url: baseURL + '/getAlbumList.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp&size=' + size + '&type=' + id,
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -207,9 +206,10 @@ function getRandomSongList(action, appendto) {
size = $.cookie('AutoPlaylistSize'); size = $.cookie('AutoPlaylistSize');
} }
$.ajax({ $.ajax({
url: baseURL + '/getRandomSongs.view?v=1.6.0&c=' + applicationName + '&f=json&size=' + size, url: baseURL + '/getRandomSongs.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp&size=' + size,
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -268,7 +268,7 @@ function generateAlbumHTML(rowcolor, childid, parentid, coverart, title, artist,
html += '<a class=\"rate\" href=\"\" title=\"Add To Favorites\"></a>'; html += '<a class=\"rate\" href=\"\" title=\"Add To Favorites\"></a>';
} }
html += '</td>'; html += '</td>';
html += '<td class=\"albumart\"><img src=\"' + baseURL + '/getCoverArt.view?v=1.6.0&c=' + applicationName + '&f=json&size=50&id=' + coverart + '\" /></td>'; html += '<td class=\"albumart\"><img src=\"' + baseURL + '/getCoverArt.view?v=1.6.0&c=' + applicationName + '&f=jsonp&size=50&id=' + coverart + '\" /></td>';
html += '<td class=\"album\">' + title + '</td>'; html += '<td class=\"album\">' + title + '</td>';
html += '<td class=\"artist\">' + artist + '</td>'; html += '<td class=\"artist\">' + artist + '</td>';
html += '</tr>'; html += '</tr>';
@ -294,7 +294,7 @@ function generateSongHTML(rowcolor, childid, parentid, track, title, artist, alb
html += '<td class=\"track\">' + track + '</td>'; html += '<td class=\"track\">' + track + '</td>';
html += '<td class=\"title\">' + title + '</td>'; html += '<td class=\"title\">' + title + '</td>';
html += '<td class=\"artist\">' + artist + '</td>'; html += '<td class=\"artist\">' + artist + '</td>';
html += '<td class=\"album\">' + album + '<img src=\"' + baseURL + '/getCoverArt.view?v=1.6.0&c=' + applicationName + '&f=json&size=25&id=' + coverart + '\" /></td>'; html += '<td class=\"album\">' + album + '<img src=\"' + baseURL + '/getCoverArt.view?v=1.6.0&c=' + applicationName + '&f=jsonp&size=25&id=' + coverart + '\" /></td>';
html += '<td class=\"time\">' + m + ':' + s + '</td>'; html += '<td class=\"time\">' + m + ':' + s + '</td>';
html += '</tr>'; html += '</tr>';
return html; return html;
@ -315,9 +315,10 @@ function refreshRowColor() {
var scrobbled = false; var scrobbled = false;
function playSong(el, songid, albumid) { function playSong(el, songid, albumid) {
$.ajax({ $.ajax({
url: baseURL + '/getMusicDirectory.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + albumid, url: baseURL + '/getMusicDirectory.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp&id=' + albumid,
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -339,9 +340,9 @@ function playSong(el, songid, albumid) {
$('#songdetails_song').attr('parentid', albumid); $('#songdetails_song').attr('parentid', albumid);
$('#songdetails_song').attr('childid', songid); $('#songdetails_song').attr('childid', songid);
$('#songdetails_artist').html(artist + ' - ' + album); $('#songdetails_artist').html(artist + ' - ' + album);
$('#coverartimage').attr('href', baseURL + '/getCoverArt.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + coverart); $('#coverartimage').attr('href', baseURL + '/getCoverArt.view?v=1.6.0&c=' + applicationName + '&f=jsonp&id=' + coverart);
$('#coverartimage img').attr('src', baseURL + '/getCoverArt.view?v=1.6.0&c=' + applicationName + '&f=json&size=56&id=' + coverart); $('#coverartimage img').attr('src', baseURL + '/getCoverArt.view?v=1.6.0&c=' + applicationName + '&f=jsonp&size=56&id=' + coverart);
audio.load(baseURL + '/stream.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + songid); audio.load(baseURL + '/stream.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp&id=' + songid);
audio.play(); audio.play();
$('table.songlist tr.song').removeClass('playing'); $('table.songlist tr.song').removeClass('playing');
$(el).addClass('playing'); $(el).addClass('playing');
@ -355,9 +356,10 @@ function playSong(el, songid, albumid) {
function scrobbleSong(submission) { function scrobbleSong(submission) {
var songid = $('#songdetails_song').attr('childid'); var songid = $('#songdetails_song').attr('childid');
$.ajax({ $.ajax({
url: baseURL + '/scrobble.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + songid + "&submission=" + submission, url: baseURL + '/scrobble.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp&id=' + songid + "&submission=" + submission,
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -370,9 +372,10 @@ function scrobbleSong(submission) {
} }
function rateSong(songid, rating) { function rateSong(songid, rating) {
$.ajax({ $.ajax({
url: baseURL + '/setRating.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + songid + "&rating=" + rating, url: baseURL + '/setRating.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp&id=' + songid + "&rating=" + rating,
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -425,9 +428,10 @@ function autoPlay() {
} }
function search(type, query) { function search(type, query) {
$.ajax({ $.ajax({
url: baseURL + '/search2.view?v=1.6.0&c=' + applicationName + '&f=json&query=' + query, url: baseURL + '/search2.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp&query=' + query,
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -464,41 +468,15 @@ function search(type, query) {
}); });
} }
var starttime; var starttime;
function loadChatMessages() {
$.ajax({
url: baseURL + '/getChatMessages.view?v=1.6.0&c=' + applicationName + '&f=json',
method: 'GET',
dataType: 'json',
beforeSend: function (req) {
req.setRequestHeader('Authorization', auth);
},
success: function (data) {
$('#ChatMsgs').empty();
var sorted = data["subsonic-response"].chatMessages.chatMessage.sort(function (a, b) {
return a.time - b.time;
});
$.each(sorted, function (i, msg) {
var chathtml = '<div class=\"msg\">';
chathtml += '<span class=\"time\">' + $.format.date(new Date(parseInt(msg.time, 10)), 'hh:mm:ss a') + '</span> ';
chathtml += '<span class=\"user\">' + msg.username + '</span></br>';
chathtml += '<span class=\"msg\">' + msg.message + '</span>';
chathtml += '</div>';
$(chathtml).appendTo("#ChatMsgs");
if (i === 1) {
starttime = msg.time;
}
});
}
});
}
var updater; var updater;
function updateChatMessages() { function updateChatMessages() {
updater = $.periodic({ period: 1000, decay: 1.5, max_period: 1800000 }, function () { updater = $.periodic({ period: 1000, decay: 1.5, max_period: 1800000 }, function () {
$.ajax({ $.ajax({
periodic: this, periodic: this,
url: baseURL + '/getChatMessages.view?v=1.6.0&c=' + applicationName + '&f=json&since=' + starttime, url: baseURL + '/getChatMessages.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp&since=' + starttime,
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -516,6 +494,7 @@ function updateChatMessages() {
var sorted = msgs.sort(function (a, b) { var sorted = msgs.sort(function (a, b) {
return a.time - b.time; return a.time - b.time;
}); });
var x = 1;
$.each(sorted, function (i, msg) { $.each(sorted, function (i, msg) {
var chathtml = '<div class=\"msg\">'; var chathtml = '<div class=\"msg\">';
chathtml += '<span class=\"time\">' + $.format.date(new Date(parseInt(msg.time, 10)), 'hh:mm:ss a') + '</span> '; chathtml += '<span class=\"time\">' + $.format.date(new Date(parseInt(msg.time, 10)), 'hh:mm:ss a') + '</span> ';
@ -523,10 +502,12 @@ function updateChatMessages() {
chathtml += '<span class=\"msg\">' + msg.message + '</span>'; chathtml += '<span class=\"msg\">' + msg.message + '</span>';
chathtml += '</div>'; chathtml += '</div>';
$(chathtml).appendTo("#ChatMsgs"); $(chathtml).appendTo("#ChatMsgs");
if (i === 1) { if (x === sorted.length) {
starttime = msg.time; starttime = msg.time;
} }
x++;
}); });
$("#ChatMsgs").linkify();
$("#ChatMsgs").attr({ scrollTop: $("#ChatMsgs").attr("scrollHeight") }); $("#ChatMsgs").attr({ scrollTop: $("#ChatMsgs").attr("scrollHeight") });
} }
} }
@ -538,15 +519,16 @@ function stopUpdateChatMessages() {
} }
function addChatMessage(msg) { function addChatMessage(msg) {
$.ajax({ $.ajax({
type: 'POST', type: 'GET',
url: baseURL + '/addChatMessage.view', url: baseURL + '/addChatMessage.view',
data: { v: "1.6.0", c: applicationName, f: "json", message: msg }, dataType: 'jsonp',
timeout: 10000,
data: { u: username, p: passwordenc, v: version, c: applicationName, f: "jsonp", message: msg },
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
success: function () { success: function () {
updater.reset(); updater.reset();
//loadChatMessages();
}, },
traditional: true // Fixes POST with an array in JQuery 1.4 traditional: true // Fixes POST with an array in JQuery 1.4
}); });
@ -557,9 +539,10 @@ function updateNowPlaying() {
updaterNowPlaying = $.periodic({ period: 4000, decay: 1.5, max_period: 1800000 }, function () { updaterNowPlaying = $.periodic({ period: 4000, decay: 1.5, max_period: 1800000 }, function () {
$.ajax({ $.ajax({
periodic: this, periodic: this,
url: baseURL + '/getNowPlaying.view?v=1.6.0&c=' + applicationName + '&f=json', url: baseURL + '/getNowPlaying.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp',
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -611,14 +594,21 @@ function loadPlaylists(refresh) {
if (content === "") { if (content === "") {
// Load Playlists // Load Playlists
$.ajax({ $.ajax({
url: baseURL + '/getPlaylists.view?v=1.6.0&c=' + applicationName + '&f=json', url: baseURL + '/getPlaylists.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp',
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
success: function (data) { success: function (data) {
$.each(data["subsonic-response"].playlists.playlist, function (i, playlist) { var playlists = [];
if (data["subsonic-response"].playlists.playlist.length > 0) {
playlists = data["subsonic-response"].playlists.playlist;
} else {
playlists[0] = data["subsonic-response"].playlists.playlist;
}
$.each(playlists, function (i, playlist) {
var html = ""; var html = "";
html += '<li id=\"' + playlist.id + '\" class=\"item\">'; html += '<li id=\"' + playlist.id + '\" class=\"item\">';
html += '<span>' + playlist.name + '</span>'; html += '<span>' + playlist.name + '</span>';
@ -634,14 +624,21 @@ function loadPlaylists(refresh) {
function loadPlaylistsForMenu(menu) { function loadPlaylistsForMenu(menu) {
$('#' + menu).empty(); $('#' + menu).empty();
$.ajax({ $.ajax({
url: baseURL + '/getPlaylists.view?v=1.6.0&c=' + applicationName + '&f=json', url: baseURL + '/getPlaylists.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp',
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
success: function (data) { success: function (data) {
$.each(data["subsonic-response"].playlists.playlist, function (i, playlist) { var playlists = [];
if (data["subsonic-response"].playlists.playlist.length > 0) {
playlists = data["subsonic-response"].playlists.playlist;
} else {
playlists[0] = data["subsonic-response"].playlists.playlist;
}
$.each(playlists, function (i, playlist) {
if (menu === 'submenu_AddCurrentToPlaylist') { if (menu === 'submenu_AddCurrentToPlaylist') {
$("<a href=\"#\" onclick=\"javascript:addToPlaylist('" + playlist.id + "', 'current'); return false;\">" + playlist.name + "</a><br />").appendTo("#" + menu); $("<a href=\"#\" onclick=\"javascript:addToPlaylist('" + playlist.id + "', 'current'); return false;\">" + playlist.name + "</a><br />").appendTo("#" + menu);
} else { } else {
@ -656,9 +653,10 @@ function newPlaylist() {
var reply = prompt("Choose a name for your new playlist.", ""); var reply = prompt("Choose a name for your new playlist.", "");
if (reply) { if (reply) {
$.ajax({ $.ajax({
url: baseURL + '/createPlaylist.view?v=1.6.0&c=' + applicationName + '&f=json&name=' + reply, url: baseURL + '/createPlaylist.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp&name=' + reply,
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -670,9 +668,10 @@ function newPlaylist() {
} }
function deletePlaylist(id) { function deletePlaylist(id) {
$.ajax({ $.ajax({
url: baseURL + '/deletePlaylist.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + id, url: baseURL + '/deletePlaylist.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp&id=' + id,
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -698,9 +697,10 @@ function addToPlaylist(playlistid, from) {
// Get songs from playlist // Get songs from playlist
var currentsongs = []; var currentsongs = [];
$.ajax({ $.ajax({
url: baseURL + '/getPlaylist.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + playlistid, url: baseURL + '/getPlaylist.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp&id=' + playlistid,
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -727,9 +727,11 @@ function addToPlaylist(playlistid, from) {
}); });
if (count > 0) { if (count > 0) {
$.ajax({ $.ajax({
type: 'POST', type: 'GET',
url: baseURL + '/createPlaylist.view', url: baseURL + '/createPlaylist.view',
data: { v: "1.6.0", c: applicationName, f: "json", playlistId: playlistid, songId: currentsongs }, dataType: 'jsonp',
timeout: 10000,
data: { u: username, p: passwordenc, v: version, c: applicationName, f: "jsonp", playlistId: playlistid, songId: currentsongs },
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -746,9 +748,11 @@ function addToPlaylist(playlistid, from) {
}); });
} else { } else {
$.ajax({ $.ajax({
type: 'POST', type: 'GET',
url: baseURL + '/createPlaylist.view', url: baseURL + '/createPlaylist.view',
data: { v: "1.6.0", c: applicationName, f: "json", name: 'New Playlist', songId: selected }, dataType: 'jsonp',
timeout: 10000,
data: { u: username, p: passwordenc, v: version, c: applicationName, f: "jsonp", name: 'New Playlist', songId: selected },
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -761,6 +765,7 @@ function addToPlaylist(playlistid, from) {
traditional: true // Fixes POST with an array in JQuery 1.4 traditional: true // Fixes POST with an array in JQuery 1.4
}); });
} }
setTimeout(function () { $('div.submenu').fadeOut(); }, 100);
} }
} }
function addToCurrent() { function addToCurrent() {
@ -777,9 +782,11 @@ function savePlaylist(playlistid) {
}); });
if (songs.length > 0) { if (songs.length > 0) {
$.ajax({ $.ajax({
type: 'POST', type: 'GET',
url: baseURL + '/createPlaylist.view', url: baseURL + '/createPlaylist.view',
data: { v: "1.6.0", c: applicationName, f: "json", playlistId: playlistid, songId: songs }, dataType: 'jsonp',
timeout: 10000,
data: { u: username, p: passwordenc, v: version, c: applicationName, f: "jsonp", playlistId: playlistid, songId: songs },
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -793,9 +800,10 @@ function savePlaylist(playlistid) {
} }
function getPlaylist(id, action, appendto) { function getPlaylist(id, action, appendto) {
$.ajax({ $.ajax({
url: baseURL + '/getPlaylist.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + id, url: baseURL + '/getPlaylist.view?u=' + username + '&p=' + passwordenc + '&v=' + version + '&c=' + applicationName + '&f=jsonp&id=' + id,
method: 'GET', method: 'GET',
dataType: 'json', dataType: 'jsonp',
timeout: 10000,
beforeSend: function (req) { beforeSend: function (req) {
req.setRequestHeader('Authorization', auth); req.setRequestHeader('Authorization', auth);
}, },
@ -858,6 +866,13 @@ function makeBaseAuth(user, password) {
var hash = $.base64Encode(tok); var hash = $.base64Encode(tok);
return "Basic " + hash; return "Basic " + hash;
} }
function HexEncode(n) {
for (var u = "0123456789abcdef", i = [], r = [], t = 0; t < 256; t++)
i[t] = u.charAt(t >> 4) + u.charAt(t & 15);
for (t = 0; t < n.length; t++)
r[t] = i[n.charCodeAt(t)];
return r.join("")
}
function findKeyForCode(code) { function findKeyForCode(code) {
var map = { 'keymap': [ var map = { 'keymap': [
{ 'key': 'a', 'code': 65 }, { 'key': 'a', 'code': 65 },

3
js/jquery.linkify-1.0-min.js vendored Normal file
View file

@ -0,0 +1,3 @@
// encoding: utf-8
// $.fn.linkify 1.0 - MIT/GPL Licensed - More info: http://github.com/maranomynet/linkify/
(function(b){var x=/(^|["'(\s]|&lt;)(www\..+?\..+?)((?:[:?]|\.+)?(?:\s|$)|&gt;|[)"',])/g,y=/(^|["'(\s]|&lt;)((?:(?:https?|ftp):\/\/|mailto:).+?)((?:[:?]|\.+)?(?:\s|$)|&gt;|[)"',])/g,z=function(h){return h.replace(x,'$1<a href="<``>://$2">$2</a>$3').replace(y,'$1<a href="$2">$2</a>$3').replace(/"<``>/g,'"http')},s=b.fn.linkify=function(c){if(!b.isPlainObject(c)){c={use:(typeof c=='string')?c:undefined,handleLinks:b.isFunction(c)?c:arguments[1]}}var d=c.use,k=s.plugins||{},l=[z],f,m=[],n=c.handleLinks;if(d==undefined||d=='*'){for(var i in k){l.push(k[i])}}else{d=b.isArray(d)?d:b.trim(d).split(/ *, */);var o,i;for(var p=0,A=d.length;p<A;p++){i=d[p];o=k[i];if(o){l.push(o)}}}this.each(function(){var h=this.childNodes,t=h.length;while(t--){var e=h[t];if(e.nodeType==3){var a=e.nodeValue;if(a.length>1&&/\S/.test(a)){var q,r;f=f||b('<div/>')[0];f.innerHTML='';f.appendChild(e.cloneNode(false));var u=f.childNodes;for(var v=0,g;(g=l[v]);v++){var w=u.length,j;while(w--){j=u[w];if(j.nodeType==3){a=j.nodeValue;if(a.length>1&&/\S/.test(a)){r=a;a=a.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;');a=b.isFunction(g)?g(a):a.replace(g.re,g.tmpl);q=q||r!=a;r!=a&&b(j).after(a).remove()}}}}a=f.innerHTML;if(n){a=b('<div/>').html(a);m=m.concat(a.find('a').toArray().reverse());a=a.contents()}q&&b(e).after(a).remove()}}else if(e.nodeType==1&&!/^(a|button|textarea)$/i.test(e.tagName)){arguments.callee.call(e)}}});n&&n(b(m.reverse()));return this};s.plugins={mailto:{re:/(^|["'(\s]|&lt;)([^"'(\s&]+?@.+\.[a-z]{2,7})(([:?]|\.+)?(\s|$)|&gt;|[)"',])/gi,tmpl:'$1<a href="mailto:$2">$2</a>$3'}}})(jQuery);

22
style/Style.css
View file

@ -12,6 +12,14 @@ img
border: none; border: none;
background: none; background: none;
} }
h3.title
{
font-weight: bold;
font-size: 14px;
font-variant: small-caps;
padding: 0;
margin: 5px 0;
}
.border { border: 2px solid #d9d9d9; } .border { border: 2px solid #d9d9d9; }
.floatleft { float: left; } .floatleft { float: left; }
@ -25,7 +33,7 @@ img
.padright { padding: 0 10px 0 0; } .padright { padding: 0 10px 0 0; }
.odd { background: #fff; } .odd { background: #fff; }
.even { background: #f4f4f4; } .even { background: #f4f4f4; }
.red { color: #E64F4C; }
.italic { font-style: italic; } .italic { font-style: italic; }
#container { #container {
@ -36,7 +44,8 @@ img
#nav #nav
{ {
height: 36px; height: 36px;
padding: 4px 0 0 5px; padding: 4px 0 0 52px;
background: url('../images/subsonic-36.png') no-repeat 6px 2px;
} }
#nav ul #nav ul
{ {
@ -557,6 +566,7 @@ background-color: #8dbdd8;
background: #fff; background: #fff;
padding: 5px 10px; padding: 5px 10px;
margin: 2px 0 0 1px; margin: 2px 0 0 1px;
z-index:99;
} }
.submenu a .submenu a
{ {
@ -760,7 +770,7 @@ ul.preferences li
{ {
color: #646464; color: #646464;
font-size: 11px; font-size: 11px;
padding: 6px 0; padding: 8px 0;
} }
ul.preferences li.title ul.preferences li.title
{ {
@ -845,6 +855,12 @@ input.large
width: 180px; width: 180px;
margin: 5px; margin: 5px;
} }
input.xlarge
{
border: 1px solid #DCDCDC;
width: 350px;
margin: 5px;
}
input.chat input.chat
{ {
border: 1px solid #ffffff; border: 1px solid #ffffff;