andpp/mopidy-musicbox-webclient
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

small enhancements to the gui

Browse Source
This commit is contained in:
Wouter van Wijk 2013-09-09 00:27:59 +02:00
parent 7950bf1d57
commit b1e520c0a6
5 changed files with 36 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
webclient/css/webclient.css
View File

@ -103,7 +103,7 @@
}
#playlistspane, .scroll {
overflow-y: auto;
overflow-x: auto;
overflow-x: hidden;
width: 100%;
heigth: 100%;
}
@ -116,7 +116,7 @@
}
#playlistspane, .scroll {
overflow-y: auto;
overflow-x: auto;
overflow-x: hidden;
width: 100%;
heigth: 100%;
}
@ -131,7 +131,7 @@
#controldiv {
height: 40px;
width: 245px;
width: 240px;
margin-top: -3px;
margin-left: -5px;
display: inline;
@ -166,16 +166,15 @@
#infoname {
overflow: hidden;
font: bold;
color: #ddd;
color: #555;
font-size: 14px;
text-shadow: 1px 1px #555;
/* text-shadow: 1px 1px #fff; */
}
#songinfo {
margin-top: 5px;
height: 40px;
padding: 5px;
background-color: #bbb;
-moz-border-radius-topleft: 2px;
-moz-border-radius-topright: 2px;
-webkit-border-top-left-radius: 2px;
@ -186,9 +185,7 @@
#infoartist {
overflow: hidden;
color: #aaa;
font-size: 11px;
text-shadow: 1px 1px #333;
margin: 2px;
}
@ -197,7 +194,7 @@
}
#infoartist a {
color: #eee;
color: #777;
}
#infocover {
@ -259,8 +256,8 @@
display: none;
}
#currentpane, #searchpane, #albumspane, #artistspane {
display: none;
#currentpane, #searchpane, #albumspane, #artistspane, #radiopane {
display: none;
}
#playlistspane {
@ -296,26 +293,6 @@
list-style-type:none;
}
/*
.table li:first-child {
-moz-border-radius-topleft: 7px;
-moz-border-radius-topright: 7px;
-webkit-border-top-left-radius: 7px;
-webkit-border-top-right-radius: 7px;
border-top-right-radius: 7px;
border-top-left-radius: 7px;
}
.table li:last-child {
-moz-border-radius-bottomleft: 7px;
-moz-border-radius-bottomright: 7px;
-webkit-border-bottom-left-radius: 7px;
-webkit-border-bottom-right-radius: 7px;
border-bottom-left-radius: 7px;
border-bottom-right-radius: 7px;
border-bottom: 1px solid #999;
}
*/
.table li:first-child {
-moz-border-radius-topleft: 2px;
-moz-border-radius-topright: 2px;
@ -406,8 +383,8 @@
font-style: oblique;
}
#controlsmodal, #artistpopup, #coverpopup {
max-width: 500px;
#controlspopup, #artistpopup, #coverpopup {
max-width: 460px;
min-width: 300px;
background: white;
padding: 5px;

12
webclient/index.html
View File

@ -55,16 +55,16 @@
<a href="#" data-rel="back" data-role="button" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
<h3 id="coverpopupalbumname"></h3>
<h4 id="coverpopupartist"></h4>
<img id="coverpopupimage" src="" />
<a href="#" onclick="closePopups();"><img id="coverpopupimage" src="" /></a>
</div>
<div id="artistpopup" data-role="popup" data-theme="c">
<a href="#" data-rel="back" data-role="button" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
<h4 id="artistpopupname">bbb</h4>
<img id="artistpopupimage" src="" />
<a href="#" onclick="closePopups();"><img id="artistpopupimage" src="" /></a>
</div>
<div id="controlsmodal" data-role="popup" data-theme="c">
<div id="controlspopup" data-role="popup" data-theme="c">
<a href="#" data-rel="back" data-role="button" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
<p id="buttons">
<a href="#" onclick="doRandom(); return false"><img src="images/icons/loop_alt2_16x14.png" alt="" id="randombt" /></a>
@ -79,7 +79,7 @@
<h3 id="modalname"></h3>
<h4 id="modalartist"></h4>
<h4 id="modalalbum"></h4>
<img id="controlspopupimage" src="" />
<a href="#" onclick="closePopups();"><img id="controlspopupimage" src="" /></a>
</div>
@ -147,11 +147,11 @@
<a href="#" onclick="doPrevious(); return false"><span id="btprev"><img id="previmg" src="images/icons/first_24x24.png" alt="Previous Track" /></span></a>
<a href="#" onclick="doPlay(); return false"><span id="btplay"><img src="images/icons/pause_32x32.png" alt="Play" id="playimg" /></span></a>
<a href="#" onclick="doNext(); return false"><span id="btnext"><img id="nextimg" src="images/icons/last_24x24.png" alt="Next Track" /></span></a>
<a href="#controlsmodal" data-position-to="window" data-rel="popup"><span id="btcontrols"><img src="images/icons/new_window_24x24.png" id="controlsimg" alt="More controls" class="breakafter" /></span></a>
<a href="#controlspopup" data-position-to="window" data-rel="popup"><span id="btcontrols"><img src="images/icons/new_window_24x24.png" id="controlsimg" alt="More controls" class="breakafter" /></span></a>
</div>
<div id="songinfo" class=" ui-block-b">
<a href="#controlsmodal" data-position-to="window" data-rel="popup">
<a href="#controlspopup" data-position-to="window" data-rel="popup">
<img id="infocover" src="images/icons/cd_32x32.png" width="36" height="36"></img> <div id="infoname"></div> <div id="infoartist"></div> </a>
</div>

3
webclient/js/controls.js vendored
View File

@ -8,7 +8,7 @@ function playTrack(addtoqueue) {
mopidy.tracklist.clear();
}
$('#popupTracks').popup('close');
$('#controlsmodal').popup('close');
$('#controlspopup').popup('close');
toast('Loading...');
playlisturi = $('#popupTracks').data("list");
@ -31,7 +31,6 @@ function playTrack(addtoqueue) {
break;
}
}
console.log(selected, playing, tracks);
//switch popup options
switch (addtoqueue) {

16
webclient/js/functionsvars.js
View File

@ -155,17 +155,24 @@ function resultsToTables(results, target, uri) {
$(target).attr('data', uri);
var length = 0 || results.length;
for ( i = 0; i < length; i++) {
newalbum.push(results[i]);
nexturi = '';
newalbum.push(results[i]);
nexturi = '';
if (i < length - 1) {
nexturi = results[i + 1].album.uri;
}
if (results[i].album.uri != nexturi) {
if (!results[i].album) {
if (results[i].uri) {
var name = results[i].name || results[i].uri;
html += '<li class="albumli"><a href="#"><h1>' + name + ' [Stream]</h1></a></li>';
newalbum = [];
nexturi = '';
}
} else {
if (results[i].album.uri != nexturi) {
tableid = 'art' + i;
//render differently if only one track in the album
if ( newalbum.length == 1 ) {
if (i != 0) { html += '<li class="smalldivider"> &nbsp;</li>'; }
// html += '<li id="' + targetmin + '-' + newalbum[0].uri + '"><a href="#" onclick="return ' + popupMenu + '(event, \'' + uri + '\',\'' + newalbum[0].uri + '\');">';
html += '<li id="' + targetmin + '-' + newalbum[0].uri + '"><a href="#" onclick="return popupTracks(event, \'' + uri + '\',\'' + newalbum[0].uri + '\');">';
html += '<h1>' + newalbum[0].name + "</h1>";
html += '<p>';
@ -208,6 +215,7 @@ function resultsToTables(results, target, uri) {
// customTracklists[results[i].album.uri] = newalbum;
newalbum = [];
}
}
}
}
tableid = "#" + tableid;

10
webclient/js/gui.js
View File

@ -38,7 +38,7 @@ function resizeMb() {
center : true,
multiline : false
});
$("#infoartist").html('<a href="#controlsmodal" data-rel="popup">' + $("#infoartist").html() + '</a>');
$("#infoartist").html('<a href="#controlspopup" data-rel="popup">' + $("#infoartist").html() + '</a>');
//initialize iScroll if MobileWebkit and large window
if (isMobileWebkit) {
@ -187,8 +187,12 @@ function setSongInfo(data) {
/***************
* display popups
*/
function coverPopup() {
function closePopups() {
$('#popupTracks').popup('close');
$('#artistpopup').popup('close');
$('#coverpopup').popup('close');
$('#popupQueue').popup('close');
$('#controlspopup').popup('close');
}
function popupTracks(e, listuri, trackuri) {