mirror of
https://github.com/SuperBFG7/ympd
synced 2024-06-25 22:23:16 +00:00
Moved sidebar to new queue toolbar
Moved output buttons to drop down menu in main toolbar Add playinfo to html title
This commit is contained in:
jcorporation
parent
987fb4b2ec
commit
51e6f541e4
|
|
@ -60,6 +60,16 @@
|
|||
<span class="glyphicon glyphicon-heart"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">
|
||||
<span class="glyphicon glyphicon-volume-up"></span>
|
||||
<span class="caret"></span>
|
||||
</button>
|
||||
<div id="btn-outputs-block" class="dropdown-menu" role="menu" style="padding-left:1em;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<div class="btn btn-toolbar btn-default">
|
||||
|
|
@ -91,13 +101,58 @@
|
|||
<div class="container starter-template">
|
||||
<div class="row">
|
||||
|
||||
<div class="col-md-10 col-xs-12">
|
||||
<div class="notifications top-right"></div>
|
||||
|
||||
<div class="panel panel-primary">
|
||||
<!-- Default panel contents -->
|
||||
<div class="panel-heading"><b id="panel-heading">Queue</b>
|
||||
<b id="panel-heading-info" class="text pull-right"></b></div>
|
||||
<div class="panel" id="queue-buttons">
|
||||
<div class="btn-group" data-toggle="buttons">
|
||||
<button id="btnrandom" type="button" class="btn btn-default" title="Random">
|
||||
<span class="glyphicon glyphicon-random"></span>
|
||||
</button>
|
||||
<button id="btnconsume" type="button" class="btn btn-default" title="Consume">
|
||||
<span class="glyphicon glyphicon-fire"></span>
|
||||
</button>
|
||||
<button id="btnsingle" type="button" class="btn btn-default" title="Single">
|
||||
<span class="glyphicon glyphicon-star"></span>
|
||||
</button>
|
||||
<button id="btncrossfade" type="button" class="btn btn-default" title="Crossfade">
|
||||
<span class="glyphicon glyphicon-link"></span>
|
||||
</button>
|
||||
<button id="btnrepeat" type="button" class="btn btn-default" title="Repeat">
|
||||
<span class="glyphicon glyphicon-repeat"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
<div id="trashmode" class="btn-group" data-toggle="radio">
|
||||
<button id="btntrashmodeup" type="button" class="btn btn-default">
|
||||
<span class="glyphicon glyphicon-chevron-up"></span><span class="glyphicon glyphicon-trash"></span>
|
||||
</button>
|
||||
<button id="btntrashmodesingle" type="button" class="btn btn-default active">
|
||||
<span class="glyphicon glyphicon-star-empty"></span>
|
||||
<span class="glyphicon glyphicon-trash"></span>
|
||||
</button>
|
||||
<button id="btntrashmodedown" type="button" class="btn btn-default">
|
||||
<span class="glyphicon glyphicon-chevron-down"></span>
|
||||
<span class="glyphicon glyphicon-trash"></span>
|
||||
</button>
|
||||
</div>
|
||||
-->
|
||||
<div id="btn-responsive-block" class="btn-group">
|
||||
<button type="button" class="btn btn-default" onclick="socket.send('MPD_API_RM_ALL');" title="Clear queue">
|
||||
<span class="glyphicon glyphicon-trash"></span>
|
||||
</button>
|
||||
<a href="#" data-toggle="modal" data-target="#savequeue" class="btn btn-default" title="Save queue">
|
||||
<span class="glyphicon glyphicon-save"></span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div id="album-cover"></div>
|
||||
<h1>
|
||||
|
|
@ -166,56 +221,6 @@
|
|||
<li id="prev" class="page-btn hide"><a href="">Previous</a></li>
|
||||
<li id="next" class="page-btn"><a href="">Next</a></li>
|
||||
</ul>
|
||||
</div><!-- /.col-md-10 -->
|
||||
|
||||
<div class="col-md-2 col-xs-12">
|
||||
<div class="btn-toolbar">
|
||||
<div class="btn-group-vertical btn-block btn-group-lg" data-toggle="buttons">
|
||||
<button id="btnrandom" type="button" class="btn btn-default">
|
||||
<span class="glyphicon glyphicon-random"></span> Random
|
||||
</button>
|
||||
<button id="btnconsume" type="button" class="btn btn-default">
|
||||
<span class="glyphicon glyphicon-fire"></span> Consume
|
||||
</button>
|
||||
<button id="btnsingle" type="button" class="btn btn-default">
|
||||
<span class="glyphicon glyphicon-star"></span> Single
|
||||
</button>
|
||||
<button id="btncrossfade" type="button" class="btn btn-default">
|
||||
<span class="glyphicon glyphicon-link"></span> Crossfade
|
||||
</button>
|
||||
<button id="btnrepeat" type="button" class="btn btn-default">
|
||||
<span class="glyphicon glyphicon-repeat"></span> Repeat
|
||||
</button>
|
||||
</div>
|
||||
<div id="btn-outputs-block" class="btn-group-vertical btn-block btn-group-lg">
|
||||
</div>
|
||||
|
||||
<div id="trashmode" class="btn-group-vertical btn-block btn-group-lg" data-toggle="radio">
|
||||
<button id="btntrashmodeup" type="button" class="btn btn-default">
|
||||
<span class="glyphicon glyphicon-chevron-up"></span>
|
||||
<span class="glyphicon glyphicon-trash"></span> <span>Up</span>
|
||||
</button>
|
||||
<button id="btntrashmodesingle" type="button" class="btn btn-default active">
|
||||
<span class="glyphicon glyphicon-star-empty"></span>
|
||||
<span class="glyphicon glyphicon-trash"></span> <span>Single</span>
|
||||
</button>
|
||||
<button id="btntrashmodedown" type="button" class="btn btn-default">
|
||||
<span class="glyphicon glyphicon-chevron-down"></span>
|
||||
<span class="glyphicon glyphicon-trash"></span> <span>Down</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div id="btn-responsive-block" class="btn-group-vertical btn-block btn-group-lg">
|
||||
<button type="button" class="btn btn-default" onclick="socket.send('MPD_API_RM_ALL');">
|
||||
<span class="glyphicon glyphicon-trash"></span> Clear Queue
|
||||
</button>
|
||||
<a href="#" data-toggle="modal" data-target="#savequeue" class="btn btn-default">
|
||||
<span class="glyphicon glyphicon-save"></span> Save Queue
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div><!-- /.col-md-2 -->
|
||||
</div><!-- /.row -->
|
||||
</div><!-- /.container -->
|
||||
|
||||
|
|
|
|||
|
|
@ -48,6 +48,7 @@ var app = $.sammy(function() {
|
|||
|
||||
$('#panel-heading').text("Queue");
|
||||
$('#panel-heading-info').empty();
|
||||
$('#queue-buttons').css('display','block');
|
||||
|
||||
$('#queue').addClass('active');
|
||||
}
|
||||
|
|
@ -88,6 +89,7 @@ var app = $.sammy(function() {
|
|||
|
||||
$('#panel-heading').text("Browse database: "+browsepath);
|
||||
$('#panel-heading-info').empty();
|
||||
$('#queue-buttons').css('display','none');
|
||||
var path_array = browsepath.split('/');
|
||||
var full_path = "";
|
||||
$.each(path_array, function(index, chunk) {
|
||||
|
|
@ -634,15 +636,19 @@ function webSocketConnect() {
|
|||
|
||||
$('#currenttrack').text(" " + obj.data.title);
|
||||
var notification = "<strong><h4>" + obj.data.title + "</h4></strong>";
|
||||
var htmlTitle='ympd: ';
|
||||
|
||||
if(obj.data.artist) {
|
||||
$('#artist').text(obj.data.artist);
|
||||
notification += obj.data.artist + "<br />";
|
||||
htmlTitle += obj.data.artist + ' - ' + obj.data.title;
|
||||
}
|
||||
if(obj.data.album) {
|
||||
$('#album').text(obj.data.album);
|
||||
notification += obj.data.album + "<br />";
|
||||
}
|
||||
|
||||
document.title=htmlTitle;
|
||||
|
||||
if ($.cookie("notification") === "true")
|
||||
songNotify(obj.data.title, obj.data.artist, obj.data.album );
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user