.021 added sidebar for chat and now playing, bug fixes
This commit is contained in:
parent
345c0da6e5
commit
c55389a3ff
7 changed files with 223 additions and 180 deletions
1
README
1
README
|
@ -20,6 +20,7 @@ External Subsonic Music Player
|
|||
1/9/2012 .018 added media keyboard bindings from @itchy
|
||||
1/18/2012 .019 rating support, random playlist, new preferences added
|
||||
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
|
||||
|
||||
TO DO: (In no particular order...)
|
||||
- Jukebox Control
|
||||
|
|
BIN
images/arrow_left_gl_12x12.png
Normal file
BIN
images/arrow_left_gl_12x12.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 213 B |
BIN
images/arrow_right_gl_12x12.png
Normal file
BIN
images/arrow_right_gl_12x12.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 199 B |
BIN
images/comment_stroke_gl_12x11.png
Normal file
BIN
images/comment_stroke_gl_12x11.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 263 B |
175
index.html
175
index.html
|
@ -100,7 +100,7 @@
|
|||
$('#AutoAlbumContainer li').removeClass('selected');
|
||||
$('#ArtistContainer li').removeClass('selected');
|
||||
$(this).addClass('selected');
|
||||
getAlbums($(this).attr("id"), '#AlbumRows');
|
||||
getAlbums($(this).attr("id"), '', '#AlbumRows');
|
||||
});
|
||||
$('#BottomIndex li a').live('click', function () {
|
||||
var el = '#index_' + $(this).text();
|
||||
|
@ -116,13 +116,13 @@
|
|||
$('tr.album a.play').live('click', function (e) {
|
||||
var albumid = $(this).parent().parent().attr('childid');
|
||||
var artistid = $(this).parent().parent().attr('parentid');
|
||||
getSongs(albumid, artistid, 'autoplay', '#CurrentPlaylistContainer');
|
||||
getAlbums(albumid, 'autoplay', '#CurrentPlaylistContainer');
|
||||
return false;
|
||||
});
|
||||
$('tr.album a.add').live('click', function (e) {
|
||||
var albumid = $(this).parent().parent().attr('childid');
|
||||
var artistid = $(this).parent().parent().attr('parentid');
|
||||
getSongs(albumid, artistid, 'add', '#CurrentPlaylistContainer');
|
||||
getAlbums(albumid, 'add', '#CurrentPlaylistContainer');
|
||||
return false;
|
||||
});
|
||||
$('tr.album a.rate').live('click', function (event) {
|
||||
|
@ -138,7 +138,7 @@
|
|||
$('tr.album').live('click', function (e) {
|
||||
var albumid = $(this).attr('childid');
|
||||
var artistid = $(this).attr('parentid');
|
||||
getSongs(albumid, artistid, '', '#AlbumRows');
|
||||
getAlbums(albumid, '', '#AlbumRows');
|
||||
return false;
|
||||
});
|
||||
// Track - Click Events
|
||||
|
@ -379,49 +379,37 @@
|
|||
changeTrack(prev);
|
||||
return false;
|
||||
});
|
||||
$('a#Chat').click(function () {
|
||||
var submenu = $('div#submenu_Chat');
|
||||
if (submenu.is(":visible")) {
|
||||
submenu.fadeOut();
|
||||
updater.cancel();
|
||||
} else {
|
||||
//loadChatMessages();
|
||||
updateChatMessages();
|
||||
$('div#submenu_NowPlaying').fadeOut();
|
||||
submenu.fadeIn(400);
|
||||
}
|
||||
$('input#ChatMsg').focus();
|
||||
$("a#coverartimage").fancybox({
|
||||
'hideOnContentClick': true,
|
||||
'type': 'image'
|
||||
});
|
||||
$('#action_AddChatMsg').click(function () {
|
||||
var msg = $('#ChatMsg').val();
|
||||
if (msg != '') {
|
||||
addChatMessage(msg);
|
||||
|
||||
// Side Bar Click Events
|
||||
$('#action_ToggleSideBar').live('click', function () {
|
||||
if ($.cookie('sidebar')) {
|
||||
$.cookie('sidebar', null);
|
||||
$('#SideBar').hide();
|
||||
stopUpdateChatMessages();
|
||||
stopUpdateNowPlaying();
|
||||
} else {
|
||||
$.cookie('sidebar', true, { expires: 365 });
|
||||
$('#SideBar').show();
|
||||
updateChatMessages();
|
||||
updateNowPlaying();
|
||||
}
|
||||
$('#ChatMsg').val("");
|
||||
resizeContent();
|
||||
return false;
|
||||
});
|
||||
$('input#ChatMsg').keydown(function (e) {
|
||||
var unicode = e.charCode ? e.charCode : e.keyCode;
|
||||
if (unicode == 13) {
|
||||
$('#action_AddChatMsg').click();
|
||||
var msg = $('#ChatMsg').val();
|
||||
if (msg != '') {
|
||||
addChatMessage(msg);
|
||||
}
|
||||
$('#ChatMsg').val("");
|
||||
}
|
||||
});
|
||||
$('a#NowPlaying').click(function () {
|
||||
var submenu = $('div#submenu_NowPlaying');
|
||||
if (submenu.is(":visible")) {
|
||||
submenu.fadeOut();
|
||||
updaterNowPlaying.cancel();
|
||||
} else {
|
||||
//loadChatMessages();
|
||||
updateNowPlaying();
|
||||
$('div#submenu_Chat').fadeOut();
|
||||
submenu.fadeIn(400);
|
||||
}
|
||||
});
|
||||
$("a#coverartimage").fancybox({
|
||||
'hideOnContentClick': true,
|
||||
'type': 'image'
|
||||
});
|
||||
|
||||
// Preferences Click Events
|
||||
$('#SavePreferences').live('click', function () {
|
||||
|
@ -433,6 +421,14 @@
|
|||
var AutoPlaylistSize = $('#AutoPlaylistSize').val();
|
||||
$.cookie('AutoAlbumSize', AutoAlbumSize, { expires: 365 });
|
||||
$.cookie('AutoPlaylistSize', AutoPlaylistSize, { expires: 365 });
|
||||
var subdirectory = $('#SubDirectory').val();
|
||||
if (subdirectory != "") {
|
||||
$.cookie('subdirectory', subdirectory, { expires: 365 });
|
||||
}
|
||||
var applicationname = $('#ApplicationName').val();
|
||||
if (applicationname != "") {
|
||||
$.cookie('applicationname', applicationname, { expires: 365 });
|
||||
}
|
||||
location.reload(true);
|
||||
});
|
||||
$('input#Password').keydown(function (e) {
|
||||
|
@ -446,14 +442,9 @@
|
|||
$.cookie('password', null);
|
||||
$.cookie('AutoAlbumSize', null);
|
||||
$.cookie('AutoPlaylistSize', null);
|
||||
});
|
||||
$('#SaveSubDirectory').live('click', function () {
|
||||
var subdirectory = $('#SubDirectory').val();
|
||||
if (subdirectory != "") {
|
||||
$.cookie('subdirectory', subdirectory, { expires: 365 });
|
||||
location.reload(true);
|
||||
}
|
||||
return false;
|
||||
$.cookie('SubDirectory', null);
|
||||
$.cookie('ApplicationName', null);
|
||||
location.reload(true);
|
||||
});
|
||||
$('#StyleSwitcher').live('change', function () {
|
||||
var style = $(this).val();
|
||||
|
@ -461,7 +452,7 @@
|
|||
$.cookie('css', style, { expires: 365, path: '/' });
|
||||
location.reload(true);
|
||||
});
|
||||
}); // End document.ready
|
||||
}); // End document.ready
|
||||
|
||||
$(window).load(function () {
|
||||
if ($.cookie('defaultsmwidth')) {
|
||||
|
@ -473,21 +464,40 @@
|
|||
$('#AlbumContainer').css({ 'margin-left': ulwidth + 'px' });
|
||||
$('#TrackContainer').css({ 'margin-left': ulwidth + 'px' });
|
||||
}
|
||||
if ($.cookie('sidebar') && $.cookie('username') && $.cookie('password')) {
|
||||
$('#SideBar').show();
|
||||
updateChatMessages();
|
||||
updateNowPlaying();
|
||||
}
|
||||
resizeContent();
|
||||
});
|
||||
$(window).resize(function () {
|
||||
resizeContent();
|
||||
resizeContent();
|
||||
});
|
||||
function resizeContent() {
|
||||
var screenwidth = $(window).width();
|
||||
$('.tabcontent').css({ 'height': (($(window).height() - 160)) + 'px' });
|
||||
$('.smsection').css({ 'height': (($(window).height() - 200)) + 'px' });
|
||||
var smheight = $('.smsection').height();
|
||||
var smwidth = $('.smsection').width();
|
||||
$('#BottomContainer').css({ 'top': smheight + 75 + 'px' });
|
||||
var screenwidth = $(window).width();
|
||||
$('#AlbumContainer').css({ 'width': (screenwidth - smwidth - 35) + 'px' });
|
||||
$('#TrackContainer').css({ 'width': (screenwidth - smwidth - 35) + 'px' });
|
||||
$('#CurrentPlaylistContainer').css({ 'width': (screenwidth - 35) + 'px' });
|
||||
if ($.cookie('sidebar')) {
|
||||
var tabwidth = $(window).width() - 218;
|
||||
if (tabwidth >= 700) {
|
||||
$('.tabcontent').css({ 'width': tabwidth + 'px' });
|
||||
}
|
||||
var sbheight = $(window).height() - 160;
|
||||
$('#SideBar').css({ 'height': sbheight + 'px' });
|
||||
$('#ChatMsgs').css({ 'height': (sbheight - 270) + 'px' });
|
||||
} else {
|
||||
var tabwidth = $(window).width() - 11;
|
||||
if (tabwidth >= 700) {
|
||||
$('.tabcontent').css({ 'width': tabwidth + 'px' });
|
||||
}
|
||||
}
|
||||
var tabwidth = $('.tabcontent').width();
|
||||
$('#AlbumContainer, #TrackContainer, #CurrentPlaylistContainer').css({ 'width': (tabwidth - smwidth - 30) + 'px' });
|
||||
$('#CurrentPlaylistContainer').css({ 'width': (tabwidth - 30) + 'px' });
|
||||
}
|
||||
function resizeSMSection(x) {
|
||||
var smwidth = $('.smsection').width();
|
||||
|
@ -644,31 +654,21 @@
|
|||
$('#AutoAlbumSize').val($.cookie('AutoAlbumSize'));
|
||||
$('#AutoPlaylistSize').val($.cookie('AutoPlaylistSize'));
|
||||
$('#SubDirectory').val($.cookie('subdirectory'));
|
||||
$('#ApplicationName').val($.cookie('applicationname'));
|
||||
});
|
||||
</script>
|
||||
<div class="actions floatleft"></div>
|
||||
<div class="actions floatleft">
|
||||
<a href="#" class="button" id="ResetPreferences" title="Reset Preferences">Reset</a>
|
||||
<a href="#" class="button" id="SavePreferences" title="Save Preferences">Save</a>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
<div class="nosection floatleft">
|
||||
<div class="lgsection floatleft">
|
||||
<div class="subsection floatleft">
|
||||
<label for="Username">Username</label><br />
|
||||
<input type="text" id="Username" name="Username" class="large"/><br />
|
||||
<label for="Password">Password</label><br />
|
||||
<input type="password" id="Password" name="Password" class="large"/><br /><br />
|
||||
<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 />
|
||||
<a href="#" class="button submit floatright" id="SavePreferences" title="Save">Save</a>
|
||||
<a href="#" class="button submit floatright" id="ResetPreferences" title="Reset">Reset</a>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
<div class="subsection floatleft">
|
||||
<label for="SubDirectory">Subdirectory</label><br />
|
||||
<small>*For custom installations</small><br />
|
||||
<input type="text" id="SubDirectory" name="SubDirectory" class="large"/><br />
|
||||
<a href="#" class="button submit floatright" id="SaveSubDirectory" title="Save">Save</a>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
<div class="subsection floatleft">
|
||||
<ul class="preferences">
|
||||
<li class="title">Keyboard Shortcuts</li>
|
||||
|
@ -679,10 +679,35 @@
|
|||
<li><span></span></li>
|
||||
</ul>
|
||||
</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 class="clear"></div>
|
||||
</div>
|
||||
|
||||
<div id="SideBar">
|
||||
<div id="NowPlaying">
|
||||
<div class="header"><img src="images/rss_12x12.png" /> Now Playing</div>
|
||||
<div id="NowPlayingList"><span class="user">Loading...</span></div>
|
||||
</div>
|
||||
<div id="Chat">
|
||||
<div class="header"><img src="images/chat_alt_stroke_12x12.png" /> Chat</div>
|
||||
<div id="ChatMsgs"></div>
|
||||
<div class="submit"><img src="images/comment_stroke_gl_12x11.png" /><input type="text" id="ChatMsg" class="chat" title="Hit [Enter] to Post" /></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Audio Player -->
|
||||
<div class="clear"></div>
|
||||
<div id="player">
|
||||
|
@ -701,19 +726,7 @@
|
|||
<div class="floatleft"><audio src="" preload="none" /></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="submenu_Chat" class="submenu shadow" style="display: none;">
|
||||
<div id="ChatMsgs"></div>
|
||||
<input type="text" id="ChatMsg" class="medium" /><a href="#" class="button" id="action_AddChatMsg" title="Add Chat Message"><img src="images/comment_stroke_12x11.png" /></a>
|
||||
</div>
|
||||
<div id="submenu_NowPlaying" class="submenu shadow" style="display: none;">
|
||||
<div id="NowPlayingList"><span class="user">Loading...</span></div>
|
||||
</div>
|
||||
<div class="playeractionssmall floatleft">
|
||||
<a href="#" class="button" id="Chat" title="Chat"><img src="images/chat_alt_stroke_12x12.png" /> Chat</a>
|
||||
<a href="#" class="button" id="NowPlaying" title="Now Playing"><img src="images/rss_12x12.png" /> Now Playing</a>
|
||||
<span id="Notifications"></span>
|
||||
</div>
|
||||
|
||||
<div class="playeractionssmall floatright"><a href="#" class="button" id="action_ToggleSideBar" title="Toggle Side Bar"><img src="images/arrow_right_gl_12x12.png" /></a></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
|
||||
|
|
142
js/app.js
142
js/app.js
|
@ -6,6 +6,12 @@ if ($.cookie('subdirectory')) {
|
|||
} else {
|
||||
baseURL = location.protocol + '//' + location.host + '/rest';
|
||||
}
|
||||
var applicationName;
|
||||
if ($.cookie('applicationname')) {
|
||||
applicationName = $.cookie('applicationname');
|
||||
} else {
|
||||
applicationName = 'MiniSub';
|
||||
}
|
||||
var username = $.cookie('username');
|
||||
var password = $.cookie('password');
|
||||
var auth = makeBaseAuth(username, password);
|
||||
|
@ -38,7 +44,7 @@ function loadArtists(refresh) {
|
|||
if (content == "") {
|
||||
// Load Artist List
|
||||
$.ajax({
|
||||
url: baseURL + '/getIndexes.view?v=1.6.0&c=subweb&f=json',
|
||||
url: baseURL + '/getIndexes.view?v=1.6.0&c=' + applicationName + '&f=json',
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -86,58 +92,20 @@ function loadArtists(refresh) {
|
|||
});
|
||||
}
|
||||
}
|
||||
function getAlbums(id, appendto) {
|
||||
function getAlbums(id, action, appendto) {
|
||||
$.ajax({
|
||||
url: baseURL + '/getMusicDirectory.view?v=1.6.0&c=subweb&f=json&id=' + id,
|
||||
url: baseURL + '/getMusicDirectory.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + id,
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
req.setRequestHeader('Authorization', auth);
|
||||
},
|
||||
success: function (data) {
|
||||
$("#AlbumRows").empty();
|
||||
if (data["subsonic-response"].directory.child != undefined) {
|
||||
// There is a bug in the API that doesn't return a JSON array for one artist
|
||||
var children = [];
|
||||
if (data["subsonic-response"].directory.child.length > 0) {
|
||||
children = data["subsonic-response"].directory.child;
|
||||
} else {
|
||||
children[0] = data["subsonic-response"].directory.child;
|
||||
}
|
||||
|
||||
var rowcolor;
|
||||
var albumhtml;
|
||||
$.each(children, function (i, child) {
|
||||
if (i % 2 == 0) {
|
||||
rowcolor = 'even';
|
||||
} else {
|
||||
rowcolor = 'odd';
|
||||
}
|
||||
albumhtml = generateAlbumHTML(rowcolor, child.id, child.parent, child.coverArt, child.title, child.artist, child.userRating);
|
||||
$(albumhtml).appendTo("#AlbumRows");
|
||||
});
|
||||
var header = generateAlbumHeaderHTML();
|
||||
$("#AlbumHeader").html(header);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
function getSongs(id, artistid, action, appendto) {
|
||||
$.ajax({
|
||||
url: baseURL + '/getMusicDirectory.view?v=1.6.0&c=subweb&f=json&id=' + id,
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
req.setRequestHeader('Authorization', auth);
|
||||
},
|
||||
success: function (data) {
|
||||
if (appendto == '#AlbumRows' && action == '') {
|
||||
if (action == '') {
|
||||
$('#AlbumRows').empty();
|
||||
var header = generateSongHeaderHTML();
|
||||
$("#AlbumHeader").html(header);
|
||||
}
|
||||
if (action == 'autoplay') {
|
||||
$('#CurrentPlaylistContainer').empty();
|
||||
$('#CurrentPlaylistContainer tbody').empty();
|
||||
}
|
||||
if (data["subsonic-response"].directory.child != undefined) {
|
||||
// There is a bug in the API that doesn't return a JSON array for one artist
|
||||
|
@ -150,27 +118,31 @@ function getSongs(id, artistid, action, appendto) {
|
|||
|
||||
var rowcolor;
|
||||
var albumhtml;
|
||||
var isDir;
|
||||
$.each(children, function (i, child) {
|
||||
if (i % 2 == 0) {
|
||||
rowcolor = 'even';
|
||||
} else {
|
||||
rowcolor = 'odd';
|
||||
}
|
||||
var track;
|
||||
if (child.track === undefined) { track = " "; } else { track = child.track; }
|
||||
var time = secondsToTime(child.duration);
|
||||
albumhtml = generateSongHTML(rowcolor, child.id, child.parent, track, child.title, child.artist, child.album, child.coverArt, child.userRating, time['m'], time['s']);
|
||||
/*
|
||||
if (appendto == '#AlbumRows') {
|
||||
if (i == 0) {
|
||||
//var backhtml = '<tr class=\"back\"><td colspan=\"6\"><a href=\"#\" onclick=\"javascript:getAlbums(\'' + artistid + '\', \'\', \'\', \'#AlbumRows\'); return false;\">« Back to ' + child.artist + '</a></td></tr>';
|
||||
var backhtml = '<a href=\"#\" onclick=\"javascript:getAlbums(\'' + artistid + '\', \'\', \'\', \'#AlbumRows\'); return false;\">' + child.artist + '</a>';
|
||||
$("#BreadCrumb").html($(backhtml));
|
||||
}
|
||||
isDir = child.isDir;
|
||||
if (isDir == true) {
|
||||
albumhtml = generateAlbumHTML(rowcolor, child.id, child.parent, child.coverArt, child.title, child.artist, child.userRating);
|
||||
} else {
|
||||
var track;
|
||||
if (child.track === undefined) { track = " "; } else { track = child.track; }
|
||||
var time = secondsToTime(child.duration);
|
||||
albumhtml = generateSongHTML(rowcolor, child.id, child.parent, track, child.title, child.artist, child.album, child.coverArt, child.userRating, time['m'], time['s']);
|
||||
}
|
||||
*/
|
||||
$(albumhtml).appendTo(appendto);
|
||||
});
|
||||
if (appendto == '#AlbumRows' && isDir == true) {
|
||||
var header = generateAlbumHeaderHTML();
|
||||
}
|
||||
if (appendto == '#AlbumRows' && isDir == false) {
|
||||
var header = generateSongHeaderHTML();
|
||||
}
|
||||
$("#AlbumHeader").html(header);
|
||||
if (action == 'autoplay') {
|
||||
autoPlay();
|
||||
}
|
||||
|
@ -186,7 +158,7 @@ function getAlbumListBy(id) {
|
|||
size = $.cookie('AutoAlbumSize');
|
||||
}
|
||||
$.ajax({
|
||||
url: baseURL + '/getAlbumList.view?v=1.6.0&c=subweb&f=json&size=' + size + '&type=' + id,
|
||||
url: baseURL + '/getAlbumList.view?v=1.6.0&c=' + applicationName + '&f=json&size=' + size + '&type=' + id,
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -234,7 +206,7 @@ function getRandomSongList(action, appendto) {
|
|||
size = $.cookie('AutoPlaylistSize');
|
||||
}
|
||||
$.ajax({
|
||||
url: baseURL + '/getRandomSongs.view?v=1.5.0&c=subweb&f=json&size=' + size,
|
||||
url: baseURL + '/getRandomSongs.view?v=1.6.0&c=' + applicationName + '&f=json&size=' + size,
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -295,7 +267,7 @@ function generateAlbumHTML(rowcolor, childid, parentid, coverart, title, artist,
|
|||
html += '<a class=\"rate\" href=\"\" title=\"Add To Favorites\"></a>';
|
||||
}
|
||||
html += '</td>';
|
||||
html += '<td class=\"albumart\"><img src=\"' + baseURL + '/getCoverArt.view?v=1.6.0&c=subweb&f=json&size=50&id=' + coverart + '\" /></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=\"album\">' + title + '</td>';
|
||||
html += '<td class=\"artist\">' + artist + '</td>';
|
||||
html += '</tr>';
|
||||
|
@ -321,7 +293,7 @@ function generateSongHTML(rowcolor, childid, parentid, track, title, artist, alb
|
|||
html += '<td class=\"track\">' + track + '</td>';
|
||||
html += '<td class=\"title\">' + title + '</td>';
|
||||
html += '<td class=\"artist\">' + artist + '</td>';
|
||||
html += '<td class=\"album\">' + album + '<img src=\"' + baseURL + '/getCoverArt.view?v=1.6.0&c=subweb&f=json&size=25&id=' + coverart + '\" /></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=\"time\">' + m + ':' + s + '</td>';
|
||||
html += '</tr>';
|
||||
return html;
|
||||
|
@ -342,7 +314,7 @@ function refreshRowColor() {
|
|||
var scrobbled = false;
|
||||
function playSong(el, songid, albumid) {
|
||||
$.ajax({
|
||||
url: baseURL + '/getMusicDirectory.view?v=1.6.0&c=subweb&f=json&id=' + albumid,
|
||||
url: baseURL + '/getMusicDirectory.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + albumid,
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -365,10 +337,9 @@ function playSong(el, songid, albumid) {
|
|||
$('#songdetails_song').attr('parentid', albumid);
|
||||
$('#songdetails_song').attr('childid', songid);
|
||||
$('#songdetails_artist').html(artist + ' - ' + album);
|
||||
//$('#songdetails_artist').html('<a href=\"#\" onclick=\"javascript:getAlbums(\'' + artistid + '\', \'\', \'\', \'#AlbumRows\'); return false;\">« Back to ' + artist + '</a>');
|
||||
$('#coverartimage').attr('href', baseURL + '/getCoverArt.view?v=1.6.0&c=subweb&f=json&id=' + songid);
|
||||
$('#coverartimage img').attr('src', baseURL + '/getCoverArt.view?v=1.6.0&c=subweb&f=json&size=56&id=' + songid);
|
||||
audio.load(baseURL + '/stream.view?v=1.6.0&c=subweb&f=json&id=' + songid);
|
||||
$('#coverartimage').attr('href', baseURL + '/getCoverArt.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + songid);
|
||||
$('#coverartimage img').attr('src', baseURL + '/getCoverArt.view?v=1.6.0&c=' + applicationName + '&f=json&size=56&id=' + songid);
|
||||
audio.load(baseURL + '/stream.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + songid);
|
||||
audio.play();
|
||||
$('table.songlist tr.song').removeClass('playing');
|
||||
$(el).addClass('playing');
|
||||
|
@ -382,7 +353,7 @@ function playSong(el, songid, albumid) {
|
|||
function scrobbleSong(submission) {
|
||||
var songid = $('#songdetails_song').attr('childid');
|
||||
$.ajax({
|
||||
url: baseURL + '/scrobble.view?v=1.6.0&c=subweb&f=json&id=' + songid + "&submission=" + submission,
|
||||
url: baseURL + '/scrobble.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + songid + "&submission=" + submission,
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -397,7 +368,7 @@ function scrobbleSong(submission) {
|
|||
}
|
||||
function rateSong(songid, rating) {
|
||||
$.ajax({
|
||||
url: baseURL + '/setRating.view?v=1.6.0&c=subweb&f=json&id=' + songid + "&rating=" + rating,
|
||||
url: baseURL + '/setRating.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + songid + "&rating=" + rating,
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -452,7 +423,7 @@ function autoPlay() {
|
|||
}
|
||||
function search(type, query) {
|
||||
$.ajax({
|
||||
url: baseURL + '/search2.view?v=1.6.0&c=subweb&f=json&query=' + query,
|
||||
url: baseURL + '/search2.view?v=1.6.0&c=' + applicationName + '&f=json&query=' + query,
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -493,7 +464,7 @@ function search(type, query) {
|
|||
var starttime;
|
||||
function loadChatMessages() {
|
||||
$.ajax({
|
||||
url: baseURL + '/getChatMessages.view?v=1.6.0&c=subweb&f=json',
|
||||
url: baseURL + '/getChatMessages.view?v=1.6.0&c=' + applicationName + '&f=json',
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -520,10 +491,10 @@ function loadChatMessages() {
|
|||
}
|
||||
var updater;
|
||||
function updateChatMessages() {
|
||||
updater = $.periodic({ period: 2000, decay: 1.5, max_period: 1800000 }, function () {
|
||||
updater = $.periodic({ period: 1000, decay: 1.5, max_period: 1800000 }, function () {
|
||||
$.ajax({
|
||||
periodic: this,
|
||||
url: baseURL + '/getChatMessages.view?v=1.6.0&c=subweb&f=json&since=' + starttime,
|
||||
url: baseURL + '/getChatMessages.view?v=1.6.0&c=' + applicationName + '&f=json&since=' + starttime,
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -554,16 +525,20 @@ function updateChatMessages() {
|
|||
starttime = msg.time;
|
||||
}
|
||||
});
|
||||
$("#ChatMsgs").attr({ scrollTop: $("#ChatMsgs").attr("scrollHeight") });
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
function stopUpdateChatMessages() {
|
||||
updater.cancel();
|
||||
}
|
||||
function addChatMessage(msg) {
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: baseURL + '/addChatMessage.view',
|
||||
data: { v: "1.5.0", c: "subweb", f: "json", message: msg },
|
||||
data: { v: "1.6.0", c: applicationName, f: "json", message: msg },
|
||||
beforeSend: function (req) {
|
||||
req.setRequestHeader('Authorization', auth);
|
||||
},
|
||||
|
@ -577,10 +552,10 @@ function addChatMessage(msg) {
|
|||
var updaterNowPlaying;
|
||||
var updaterNowPlayingData;
|
||||
function updateNowPlaying() {
|
||||
updaterNowPlaying = $.periodic({ period: 2000, decay: 1.5, max_period: 1800000 }, function () {
|
||||
updaterNowPlaying = $.periodic({ period: 4000, decay: 1.5, max_period: 1800000 }, function () {
|
||||
$.ajax({
|
||||
periodic: this,
|
||||
url: baseURL + '/getNowPlaying.view?v=1.6.0&c=subweb&f=json',
|
||||
url: baseURL + '/getNowPlaying.view?v=1.6.0&c=' + applicationName + '&f=json',
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -622,6 +597,9 @@ function updateNowPlaying() {
|
|||
});
|
||||
});
|
||||
}
|
||||
function stopUpdateNowPlaying() {
|
||||
updaterNowPlaying.cancel();
|
||||
}
|
||||
|
||||
function loadPlaylists(refresh) {
|
||||
if (refresh) {
|
||||
|
@ -631,7 +609,7 @@ function loadPlaylists(refresh) {
|
|||
if (content == "") {
|
||||
// Load Playlists
|
||||
$.ajax({
|
||||
url: baseURL + '/getPlaylists.view?v=1.6.0&c=subweb&f=json',
|
||||
url: baseURL + '/getPlaylists.view?v=1.6.0&c=' + applicationName + '&f=json',
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -654,7 +632,7 @@ function loadPlaylists(refresh) {
|
|||
function loadPlaylistsForMenu(menu) {
|
||||
$('#' + menu).empty();
|
||||
$.ajax({
|
||||
url: baseURL + '/getPlaylists.view?v=1.6.0&c=subweb&f=json',
|
||||
url: baseURL + '/getPlaylists.view?v=1.6.0&c=' + applicationName + '&f=json',
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -676,7 +654,7 @@ function newPlaylist() {
|
|||
var reply = prompt("Choose a name for your new playlist.", "");
|
||||
if (reply) {
|
||||
$.ajax({
|
||||
url: baseURL + '/createPlaylist.view?v=1.6.0&c=subweb&f=json&name=' + reply,
|
||||
url: baseURL + '/createPlaylist.view?v=1.6.0&c=' + applicationName + '&f=json&name=' + reply,
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -690,7 +668,7 @@ function newPlaylist() {
|
|||
}
|
||||
function deletePlaylist(id) {
|
||||
$.ajax({
|
||||
url: baseURL + '/deletePlaylist.view?v=1.6.0&c=subweb&f=json&id=' + id,
|
||||
url: baseURL + '/deletePlaylist.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + id,
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -718,7 +696,7 @@ function addToPlaylist(playlistid, from) {
|
|||
// Get songs from playlist
|
||||
var currentsongs = [];
|
||||
$.ajax({
|
||||
url: baseURL + '/getPlaylist.view?v=1.6.0&c=subweb&f=json&id=' + playlistid,
|
||||
url: baseURL + '/getPlaylist.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + playlistid,
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
@ -749,7 +727,7 @@ function addToPlaylist(playlistid, from) {
|
|||
$.ajax({
|
||||
type: 'POST',
|
||||
url: baseURL + '/createPlaylist.view',
|
||||
data: { v: "1.5.0", c: "subweb", f: "json", playlistId: playlistid, songId: currentsongs },
|
||||
data: { v: "1.6.0", c: applicationName, f: "json", playlistId: playlistid, songId: currentsongs },
|
||||
beforeSend: function (req) {
|
||||
req.setRequestHeader('Authorization', auth);
|
||||
},
|
||||
|
@ -768,7 +746,7 @@ function addToPlaylist(playlistid, from) {
|
|||
$.ajax({
|
||||
type: 'POST',
|
||||
url: baseURL + '/createPlaylist.view',
|
||||
data: { v: "1.5.0", c: "subweb", f: "json", name: 'New Playlist', songId: selected },
|
||||
data: { v: "1.6.0", c: applicationName, f: "json", name: 'New Playlist', songId: selected },
|
||||
beforeSend: function (req) {
|
||||
req.setRequestHeader('Authorization', auth);
|
||||
},
|
||||
|
@ -799,7 +777,7 @@ function savePlaylist(playlistid) {
|
|||
$.ajax({
|
||||
type: 'POST',
|
||||
url: baseURL + '/createPlaylist.view',
|
||||
data: { v: "1.5.0", c: "subweb", f: "json", playlistId: playlistid, songId: songs },
|
||||
data: { v: "1.6.0", c: applicationName, f: "json", playlistId: playlistid, songId: songs },
|
||||
beforeSend: function (req) {
|
||||
req.setRequestHeader('Authorization', auth);
|
||||
},
|
||||
|
@ -813,7 +791,7 @@ function savePlaylist(playlistid) {
|
|||
}
|
||||
function getPlaylist(id, action, appendto) {
|
||||
$.ajax({
|
||||
url: baseURL + '/getPlaylist.view?v=1.6.0&c=subweb&f=json&id=' + id,
|
||||
url: baseURL + '/getPlaylist.view?v=1.6.0&c=' + applicationName + '&f=json&id=' + id,
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
beforeSend: function (req) {
|
||||
|
|
|
@ -89,11 +89,13 @@ img
|
|||
}
|
||||
.tabcontent
|
||||
{
|
||||
min-height: 400px;
|
||||
min-width: 700px;
|
||||
}
|
||||
.smsection
|
||||
{
|
||||
width: 200px;
|
||||
min-height: 200px;
|
||||
min-height: 360px;
|
||||
padding: 0 0 40px 0;
|
||||
float: left;
|
||||
overflow-y: auto;
|
||||
|
@ -108,7 +110,7 @@ img
|
|||
{
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
min-height: 200px;
|
||||
min-height: 400px;
|
||||
overflow: auto;
|
||||
background: #fff;
|
||||
border: 1px solid #cbcbcb;
|
||||
|
@ -119,7 +121,7 @@ img
|
|||
height: 100%;
|
||||
width: 100%;
|
||||
min-width: 450px;
|
||||
min-height: 200px;
|
||||
min-height: 400px;
|
||||
overflow: auto;
|
||||
background: #fff;
|
||||
border: 1px solid #cbcbcb;
|
||||
|
@ -129,14 +131,9 @@ img
|
|||
{
|
||||
padding: 5px;
|
||||
}
|
||||
.nosection
|
||||
{
|
||||
height: 100%;
|
||||
margin: 5px 5px 0 5px;
|
||||
}
|
||||
.subsection
|
||||
{
|
||||
margin: 5px 10px;
|
||||
margin: 15px 20px;
|
||||
}
|
||||
.subsection small
|
||||
{
|
||||
|
@ -311,7 +308,7 @@ table.songlist tr.album td.albumart img
|
|||
{
|
||||
margin: 5px 10px 0 10px;
|
||||
padding: 2px;
|
||||
border: 1px solid #F0F0F0;
|
||||
border: 1px solid #DEDEDE;
|
||||
}
|
||||
table.songlist tr.album a.play
|
||||
{
|
||||
|
@ -395,7 +392,7 @@ table.songlist tr.song td.album
|
|||
}
|
||||
table.songlist tr.song td.album img
|
||||
{
|
||||
border: 1px solid #F0F0F0;
|
||||
border: 1px solid #DEDEDE;
|
||||
display: block;
|
||||
float: left;
|
||||
margin: 0 5px;
|
||||
|
@ -458,14 +455,21 @@ table.songlist tr.song a.favorite
|
|||
}
|
||||
table.songlist tr.playing
|
||||
{
|
||||
background: url('../images/play_alt_16x16.png') 6px 10px no-repeat #DEEBFA;
|
||||
background-color: #DEEBFA;
|
||||
}
|
||||
table.songlist tr.playing td:first-child
|
||||
{
|
||||
background: url('../images/play_alt_16x16.png') 6px 10px no-repeat;
|
||||
}
|
||||
table.songlist tr.selected
|
||||
{
|
||||
color: #f2f2f2;
|
||||
background: url('../images/check_8x7.png') 10px 16px no-repeat;
|
||||
background-color: #4B95E5;
|
||||
border-bottom: 1px solid #73ABE7;
|
||||
background-color: #4B95E5;
|
||||
}
|
||||
table.songlist tr.selected td:first-child
|
||||
{
|
||||
background: url('../images/check_8x7.png') 10px 16px no-repeat;
|
||||
}
|
||||
/* tablesorter style */
|
||||
table.tablesorter {
|
||||
|
@ -507,12 +511,17 @@ table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSo
|
|||
background-color: #8dbdd8;
|
||||
}
|
||||
|
||||
#ArtistContainer
|
||||
{
|
||||
min-height: 360px;
|
||||
}
|
||||
#BottomContainer
|
||||
{
|
||||
border-top: 1px solid #F2F2F2;
|
||||
background: #fff;
|
||||
position: fixed;
|
||||
height: 43px;
|
||||
width: 184px;
|
||||
}
|
||||
#BottomContainer ul
|
||||
{
|
||||
|
@ -571,10 +580,33 @@ background-color: #8dbdd8;
|
|||
width: 220px;
|
||||
text-align: right;
|
||||
}
|
||||
#ChatMsgs
|
||||
#SideBar
|
||||
{
|
||||
display: none;
|
||||
width: 200px;
|
||||
position: fixed;
|
||||
top: 78px;
|
||||
right: 4px;
|
||||
background: none repeat scroll 0 0 #FFFFFF;
|
||||
border: 1px solid #CBCBCB;
|
||||
min-height: 400px;
|
||||
}
|
||||
#SideBar .header
|
||||
{
|
||||
padding: 5px;
|
||||
font-size: 12px;
|
||||
color: #545454;
|
||||
font-variant: small-caps;
|
||||
font-weight: bold;
|
||||
}
|
||||
#ChatMsgs
|
||||
{
|
||||
border-bottom: 1px solid #F2F2F2;
|
||||
padding: 5px;
|
||||
margin: 0 0 2px;
|
||||
text-align: right;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
#ChatMsgs .msg
|
||||
{
|
||||
|
@ -594,6 +626,10 @@ background-color: #8dbdd8;
|
|||
font-size: 9px;
|
||||
color: #CAD0D7;
|
||||
}
|
||||
#Chat .submit
|
||||
{
|
||||
padding: 0 2px;
|
||||
}
|
||||
#submenu_NowPlaying
|
||||
{
|
||||
left: 605px;
|
||||
|
@ -603,10 +639,18 @@ background-color: #8dbdd8;
|
|||
width: 220px;
|
||||
text-align: right;
|
||||
}
|
||||
#NowPlaying
|
||||
{
|
||||
border-bottom: 1px solid #F2F2F2;
|
||||
margin: 2px 0;
|
||||
}
|
||||
#NowPlayingList
|
||||
{
|
||||
height: 150px;
|
||||
padding: 5px;
|
||||
text-align: right;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
#NowPlayingList .msg
|
||||
{
|
||||
|
@ -679,7 +723,7 @@ background-color: #8dbdd8;
|
|||
margin: 2px 0 2px 0;
|
||||
float: left;
|
||||
padding: 2px;
|
||||
border: 1px solid #F0F0F0;
|
||||
border: 1px solid #DEDEDE;
|
||||
}
|
||||
#songdetails
|
||||
{
|
||||
|
@ -710,7 +754,7 @@ ul.preferences
|
|||
{
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
margin: 5px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
ul.preferences li
|
||||
{
|
||||
|
@ -723,6 +767,7 @@ ul.preferences li.title
|
|||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
font-variant: small-caps;
|
||||
padding: 0;
|
||||
}
|
||||
ul.preferences li span
|
||||
{
|
||||
|
@ -800,6 +845,12 @@ input.large
|
|||
width: 180px;
|
||||
margin: 5px;
|
||||
}
|
||||
input.chat
|
||||
{
|
||||
border: 1px solid #ffffff;
|
||||
width: 150px;
|
||||
margin: 5px;
|
||||
}
|
||||
select
|
||||
{
|
||||
font-family: Calibri, Arial, Verdana;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue