238 lines
12 KiB
HTML
Executable File
238 lines
12 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="stylesheet" href="css/jquery.mobile-1.3.0-rc.1.css" />
|
|
<script src="js/jquery-1.8.3.js"></script>
|
|
<script type='application/javascript' src='js/fastclick.js'></script>
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
|
|
<script type="text/javascript">
|
|
$(document).bind("mobileinit", function() {
|
|
$.extend($.mobile, {
|
|
ajaxEnabled : false,
|
|
hashListeningEnabled : false,
|
|
// linkBindingEnabled: false
|
|
// buttonMarkup.hoverDelay: 100,
|
|
// buttonMarkup.corners: false
|
|
});
|
|
});
|
|
window.addEventListener('load', function() {
|
|
new FastClick(document.body);
|
|
}, false);
|
|
</script>
|
|
<script src="js/jquery.mobile-1.3.0-rc.1.js"></script>
|
|
<meta http-equiv="imagetoolbar" content="no" />
|
|
<meta content="true" name="MSSmartTagsPreventParsing" />
|
|
<link rel="apple-touch-icon" href="/mopidy/favicon.png" />
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta charset="utf-8">
|
|
<meta name="description" content="">
|
|
<meta name="author" content="Wouter van Wijk">
|
|
<meta name="copyright" content="(c) 2012-2013 Wouter van Wijk" />
|
|
<link href="css/ws.css" rel="stylesheet">
|
|
<script type="text/javascript" src="/mopidy/mopidy.js"></script>
|
|
|
|
<link rel="stylesheet" href="css/add2home.css">
|
|
</head>
|
|
|
|
<body>
|
|
<div data-role="page" data-theme="c" id="page">
|
|
|
|
<div id="coverpopup" 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>
|
|
<h3 id="coverpopupalbumname">aaa</h3>
|
|
<h4 id="coverpopupartist">bbb</h4>
|
|
<img id="coverpopupimage" src="" />
|
|
</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="" />
|
|
</div>
|
|
|
|
<div id="controlsmodal" 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 class="">
|
|
<a href="#" onclick="doRandom(); return false"><img src="images/icons/loop_alt2_16x14.png" alt="" id="randombt" /></a>
|
|
<a href="#" onclick="doRepeat(); return false"><img src="images/icons/reload_12x14.png" id="repeatbt" alt="" /></a>
|
|
<div>
|
|
<a href="#" onclick="doMute(); return false;"><img id="mutebt" src="images/icons/volume_16x12.png" alt="" /></a>
|
|
<label for="volumeslider" class="ui-hidden-accessible">Volume</label>
|
|
<input id="volumeslider" name="volumeslider" data-mini="true" type="range" min="0" value="0" max="100" onchange="doVolume(this.value);" />
|
|
</div>
|
|
</p>
|
|
<h3 id="modalname"></h3>
|
|
<h4 id="modalartist"></h4>
|
|
<h4 id="modalalbum"></h4>
|
|
<img id="controlspopupimage" src="" />
|
|
<!-- <div id="slidercontainer2">
|
|
<p>
|
|
<span id="songelapsed2" class="pull-left"> 0:00 </span>
|
|
<span id="songlength2" class="pull-right"> 0:00 </span>
|
|
<label for="trackslider2" class="ui-hidden-accessible">Position</label>
|
|
<input id="trackslider2" name="trackslider2" data-mini="true" type="range" onmousedown="pauseTimer();" onchange="doSeekPos(this.value);" class="nobreak" />
|
|
</p>
|
|
</div>
|
|
-->
|
|
</div>
|
|
|
|
<div data-role="popup" data-transition="none" data-theme="c" id="popupTracks">
|
|
<div data-role="collapsible-set">
|
|
<ul data-role="listview" data-icon="false" id="popupTracksLv">
|
|
<!-- <li data-role="divider">
|
|
Track
|
|
</li> -->
|
|
<li>
|
|
<a href="#" onclick="return playTrack();">Play Track <span id="popupTrackName"></span></a>
|
|
</li>
|
|
<!-- <li>
|
|
<a href="#">Add tracks to bottom of queue</a>
|
|
</li>
|
|
-->
|
|
<li>
|
|
<a href="#" onclick="showAlbumPopup()">Show Album <span id="popupAlbumName"></span></a>
|
|
</li>
|
|
<div data-role="collapsible" data-icon="false" data-inset="false" id="popupArtistsDiv">
|
|
<h2>Artists</h2>
|
|
<ul data-icon="false" data-inset="false" data-role="listview" id="popupArtistsLv"></ul>
|
|
</div>
|
|
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div data-role="header" id="header" data-position="fixed" class="ui-grid-b header-breakpoint">
|
|
|
|
<div id="controldiv" class="ui-block-a">
|
|
<span id="btback"><a href="#" onclick="return backbt();"> <img id="backimg"src="images/icons/arrow_left_alt1_24x24.png" /></a></span>
|
|
<span id="btprev"><a href="#" onclick="doPrevious(); return false"><img id="previmg" src="images/icons/first_16x16.png" alt="Previous Track" /></a></span>
|
|
<span id="btplay"><a href="#" onclick="doPlay(); return false"><img src="images/icons/pause_32x32.png" alt="Play" id="playimg" /></a></span>
|
|
<span id="btnext"><a href="#" onclick="doNext(); return false"><img id="nextimg" src="images/icons/last_16x16.png" alt="Next Track" /></a></span>
|
|
<span id="btcontrols"><a href="#controlsmodal" data-rel="popup"><img src="images/icons/cog_24x24.png" id="controlsimg" alt="More controls" class="breakafter" /></a></span>
|
|
</div>
|
|
|
|
<div id="songinfo" class=" ui-block-b">
|
|
<a href="#controlsmodal" data-rel="popup">
|
|
<img id="infocover" width="36" height="36"></img>
|
|
<div id="infoname"></div>
|
|
<div id="infoartist"></div>
|
|
</a>
|
|
</div>
|
|
|
|
<div id="slidercontainer" class="ui-block-c">
|
|
<span id="songelapsed" class="pull-left"> 0:00 </span>
|
|
<span id="songlength" class="pull-right"> 0:00 </span>
|
|
<label for="trackslider" class="ui-hidden-accessible">Position</label>
|
|
<input id="trackslider" name="trackslider" data-mini="true" type="range" onchange="doSeekPos(this.value);" />
|
|
</div>
|
|
|
|
</div><!-- /header -->
|
|
|
|
<div data-role="content" id="playlistspane" class="pane ui-grid-a pl-breakpoint">
|
|
<div class="ui-block-a">
|
|
<ul id="playlistslist" data-icon="false" data-inset="true" data-role="listview" data-filter="true"></ul>
|
|
</div>
|
|
<div class="ui-block-b" id="playlisttablediv">
|
|
<ul data-role="listview" data-icon="false" id="playlisttable" data-inset="true" data-filter="true"></ul>
|
|
<img src="images/loader.gif" id="playlistloader" class= "loader" />
|
|
</div>
|
|
|
|
</div><!--/playlistspane-->
|
|
|
|
<div data-role="content" class="pane" id="currentpane">
|
|
<h4>Play Queue</h4>
|
|
<ul data-role="listview" data-icon="false" data-inset="true" id="currenttable"></ul>
|
|
<img src="images/loader.gif" id="currentloader" class= "loader" />
|
|
</div>
|
|
|
|
<div data-role="content" class="pane" id="albumspane">
|
|
<a href="#coverpopup" data-rel="popup"><img height="90" src="" id="albumviewcover" /></a>
|
|
<h3 id="h_albumname"></h3>
|
|
<h5 id="h_albumartist"></h5>
|
|
<ul data-role="listview" data-icon="false" data-inset="true" id="albumstable"></ul>
|
|
<img src="images/loader.gif" id="albumsloader" class= "loader" />
|
|
</div>
|
|
|
|
<div data-role="content" class="pane" id="artistspane">
|
|
<!-- <h4>Artist</h4> -->
|
|
<a href="#artistpopup" data-rel="popup"><img height="90" src="" id="artistviewimage" /></a>
|
|
<h3 id="h_artistname"></h3>
|
|
|
|
<!-- <ul data-role="listview" data-icon="false" id="artistslist" data-inset="true"></ul> -->
|
|
|
|
<div id="artiststable"></div>
|
|
<img src="images/loader.gif" id="artistsloader" class="loader" />
|
|
</div>
|
|
|
|
<div data-role="content" class="pane" id="searchpane">
|
|
<div class="">
|
|
<input id="searchinput" class="span2" onkeypress="return searchPressed(event.keyCode);" id="appendedInputButton" type="text">
|
|
<button class="btn" type="button" onclick="return initSearch(event.value);" >
|
|
Search!
|
|
</button>
|
|
</div>
|
|
|
|
<img src="images/loader.gif" id="allresultloader" class= "loader" />
|
|
|
|
<div id="searchresults">
|
|
<div class="ui-grid-a srch-breakpoint">
|
|
<div class="ui-block-a" id="searchartists">
|
|
<h4>Artists</h4>
|
|
<ul class="" data-icon="false" data-role="listview" data-inset="true" id="artistresulttable"></ul>
|
|
</div>
|
|
<div class="ui-block-b" id="searchalbums">
|
|
<h4>Albums</h4>
|
|
<ul class="" data-icon="false" data-role="listview" data-inset="true" id="albumresulttable"></ul>
|
|
</div>
|
|
</div>
|
|
<!-- grid a -->
|
|
|
|
<div class="" style="text-align: center" id="expandsearch">
|
|
<a href="#" onclick="toggleSearch(); return false;"><img src="images/icons/arrow_down_16x16.png"></a>
|
|
</div>
|
|
<div class="" id="searchtracks">
|
|
<h4>Tracks</h4>
|
|
<ul id="trackresulttable" data-icon="false" data-inset="true" data-role="listview"></ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- search div -->
|
|
|
|
<div data-role="footer" data-position="fixed">
|
|
<div data-role="navbar" data-iconpos="left">
|
|
<ul>
|
|
<li id="navplaylists">
|
|
<a href="#playlists" onclick="switchContent('playlists' ); return false;"><img src="images/icons/list_nested_24x21.png" /> Playlists </a>
|
|
</li>
|
|
<li id="navcurrent">
|
|
<a href="#current" onclick="switchContent('current' ); return false;"><img src="images/icons/list_24x21.png" /> Queue </a>
|
|
</li>
|
|
<li id="navsearch">
|
|
<a href="#search" onclick="switchContent('search' ); return false;" ><img src="images/icons/magnifying_glass_24x24.png" /> Search </a>
|
|
</li>
|
|
</ul>
|
|
</div><!-- /navbar -->
|
|
</div><!-- /footer -->
|
|
</div>
|
|
<!-- content -->
|
|
</div><!-- /page one -->
|
|
|
|
<script src="js/jquery.truncate.min.js"></script>
|
|
<script type="text/javascript" src="js/add2home.js" charset="utf-8"></script>
|
|
<script src="js/controls.js"></script>
|
|
<script src="js/library.js"></script>
|
|
<script src="js/functionsvars.js"></script>
|
|
<script src="js/process_ws.js"></script>
|
|
|
|
<!-- use lastfm -->
|
|
<script type="text/javascript" src="js/lastfm.api.md5.js"></script>
|
|
<script type="text/javascript" src="js/lastfm.api.js"></script>
|
|
<script type="text/javascript" src="js/lastfm.api.cache.js"></script>
|
|
|
|
<script src="js/lastfm.js"></script>
|
|
|
|
<script src="js/gui.js"></script>
|
|
</body>
|
|
</html>
|