mirror of
https://github.com/SuperBFG7/ympd
synced 2024-12-22 17:10:26 +00:00
Merge branch 'master' into harden
This commit is contained in:
commit
e6e08d6159
@ -43,6 +43,7 @@ file(GLOB RESOURCES
|
|||||||
htdocs/css/*.css
|
htdocs/css/*.css
|
||||||
htdocs/fonts/*
|
htdocs/fonts/*
|
||||||
htdocs/index.html
|
htdocs/index.html
|
||||||
|
htdocs/player.html
|
||||||
)
|
)
|
||||||
|
|
||||||
set(SOURCES
|
set(SOURCES
|
||||||
|
@ -29,6 +29,8 @@ Run flags
|
|||||||
```
|
```
|
||||||
Usage: ./ympd [OPTION]...
|
Usage: ./ympd [OPTION]...
|
||||||
|
|
||||||
|
-D, --digest <htdigest> path to htdigest file for authorization
|
||||||
|
(realm ympd) [no authorization]
|
||||||
-h, --host <host> connect to mpd at host [localhost]
|
-h, --host <host> connect to mpd at host [localhost]
|
||||||
-p, --port <port> connect to mpd at port [6600]
|
-p, --port <port> connect to mpd at port [6600]
|
||||||
-w, --webport [ip:]<port> listen interface/port for webserver [8080]
|
-w, --webport [ip:]<port> listen interface/port for webserver [8080]
|
||||||
@ -52,6 +54,12 @@ To run ympd with SSL support:
|
|||||||
# ./ympd -w "ssl://8081:/path/to/ssl.pem"
|
# ./ympd -w "ssl://8081:/path/to/ssl.pem"
|
||||||
```
|
```
|
||||||
|
|
||||||
|
Dirble support
|
||||||
|
--------------
|
||||||
|
|
||||||
|
1. Get an API-key from http://dirble.com
|
||||||
|
2. Add the key at ```var TOKEN = "";```, in ```mpd.js```.
|
||||||
|
|
||||||
Copyright
|
Copyright
|
||||||
---------
|
---------
|
||||||
|
|
||||||
|
@ -25,6 +25,8 @@ MPD_HOST=localhost
|
|||||||
MPD_PORT=6600
|
MPD_PORT=6600
|
||||||
WEB_PORT=8080
|
WEB_PORT=8080
|
||||||
DIRBLE_API_TOKEN=2e223c9909593b94fc6577361a
|
DIRBLE_API_TOKEN=2e223c9909593b94fc6577361a
|
||||||
|
#DIGEST=--digest /path/to/htdigest
|
||||||
|
#LOCALPORT=8080
|
||||||
|
|
||||||
|
|
||||||
# Exit if the package is not installed
|
# Exit if the package is not installed
|
||||||
@ -36,7 +38,7 @@ DIRBLE_API_TOKEN=2e223c9909593b94fc6577361a
|
|||||||
# Load the VERBOSE setting and other rcS variables
|
# Load the VERBOSE setting and other rcS variables
|
||||||
[ -f /etc/default/rcS ] && . /etc/default/rcS
|
[ -f /etc/default/rcS ] && . /etc/default/rcS
|
||||||
|
|
||||||
DAEMON_OPT="--user $YMPD_USER --mpdpass '$MPD_PASSWORD' --webport $WEB_PORT --host $MPD_HOST --port $MPD_PORT --dirbletoken $DIRBLE_API_TOKEN"
|
DAEMON_OPT="--user $YMPD_USER --mpdpass '$MPD_PASSWORD' --webport $WEB_PORT --host $MPD_HOST --port $MPD_PORT --dirbletoken $DIRBLE_API_TOKEN $DIGEST $LOCALPORT"
|
||||||
|
|
||||||
do_start()
|
do_start()
|
||||||
{
|
{
|
||||||
|
@ -3,3 +3,5 @@ MPD_PORT=6600
|
|||||||
MPD_PASSWORD=
|
MPD_PASSWORD=
|
||||||
WEB_PORT=8080
|
WEB_PORT=8080
|
||||||
DIRBLE_API_TOKEN=2e223c9909593b94fc6577361a
|
DIRBLE_API_TOKEN=2e223c9909593b94fc6577361a
|
||||||
|
#DIGEST=--digest /path/to/htdigest
|
||||||
|
#LOCALPORT=--localport 8080
|
||||||
|
@ -29,8 +29,10 @@ Environment=MPD_PASSWORD=
|
|||||||
Environment=WEB_PORT=8080
|
Environment=WEB_PORT=8080
|
||||||
Environment=YMPD_USER=nobody
|
Environment=YMPD_USER=nobody
|
||||||
Environment=DIRBLE_API_TOKEN=2e223c9909593b94fc6577361a
|
Environment=DIRBLE_API_TOKEN=2e223c9909593b94fc6577361a
|
||||||
|
Environment=DIGEST=
|
||||||
|
Environment=LOCALPORT=
|
||||||
EnvironmentFile=/etc/default/ympd
|
EnvironmentFile=/etc/default/ympd
|
||||||
ExecStart=/usr/bin/ympd --user $USER --mpdpass "$MPD_PASSWORD" --webport $WEB_PORT --host $MPD_HOST --port $MPD_PORT --dirbletoken $DIRBLE_API_TOKEN
|
ExecStart=/usr/bin/ympd --user $USER --webport $WEB_PORT --host $MPD_HOST --port $MPD_PORT --dirbletoken $DIRBLE_API_TOKEN $DIGEST $LOCALPORT
|
||||||
Type=simple
|
Type=simple
|
||||||
|
|
||||||
[Install]
|
[Install]
|
||||||
|
@ -15,12 +15,29 @@ body {
|
|||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
button {
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
#volume-icon {
|
#volume-icon {
|
||||||
float: left;
|
float: left;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
margin-top: 2px;
|
margin-top: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#breadcrump {
|
||||||
|
display: block;
|
||||||
|
|
||||||
|
overflow: auto;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
#breadcrump > li > a{
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
#counter {
|
#counter {
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
margin-top: -6px;
|
margin-top: -6px;
|
||||||
@ -55,13 +72,50 @@ body {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
#salamisandwich td:nth-last-child(2), th:nth-last-child(2) {
|
h1 {
|
||||||
text-align: right;
|
display: block;
|
||||||
|
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
#salamisandwich td:nth-child(2) span {
|
td:nth-child(4), th:nth-child(4) {
|
||||||
font-style:italic;
|
/* This *has* to be placed before
|
||||||
font-size:90%;
|
any t[dh]:nth-last-child(2) for
|
||||||
|
the override to work. */
|
||||||
|
min-width: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
td:nth-last-child(2), th:nth-last-child(2) {
|
||||||
|
text-align: right;
|
||||||
|
width: 4em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#salamisandwich td:nth-child(4) span {
|
||||||
|
font-size: 90%;
|
||||||
|
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
td:nth-child(2), td:nth-child(3) {
|
||||||
|
min-width: 25%;
|
||||||
|
max-width: 10em;
|
||||||
|
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width: 600px) {
|
||||||
|
td:nth-child(2), td:nth-child(3) {
|
||||||
|
min-width: 0;
|
||||||
|
max-width: 0;
|
||||||
|
}
|
||||||
|
td:nth-child(4), th:nth-child(4) {
|
||||||
|
min-width: 10%;
|
||||||
|
white-space: normal;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
tbody {
|
tbody {
|
||||||
@ -99,3 +153,11 @@ button {
|
|||||||
text-align:left;
|
text-align:left;
|
||||||
width:2.8em;
|
width:2.8em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#filter > a.active {
|
||||||
|
font-weight: bold;
|
||||||
|
pointer-events: none;
|
||||||
|
cursor: default;
|
||||||
|
text-decoration: none;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
@ -34,7 +34,7 @@
|
|||||||
|
|
||||||
<ul id="nav_links" class="nav navbar-nav">
|
<ul id="nav_links" class="nav navbar-nav">
|
||||||
<li id="queue"><a href="#/">Queue</a></li>
|
<li id="queue"><a href="#/">Queue</a></li>
|
||||||
<li id="browse"><a href="#/browse/0/">Browse Database</a></li>
|
<li id="browse"><a href="#/browse/0/">Browse</a></li>
|
||||||
<li id="dirble"><a href="#/dirble/">Dirble</a></li>
|
<li id="dirble"><a href="#/dirble/">Dirble</a></li>
|
||||||
<li><a href="#" data-toggle="modal" data-target="#addstream">Add Stream</a></li>
|
<li><a href="#" data-toggle="modal" data-target="#addstream">Add Stream</a></li>
|
||||||
<li><a href="#" data-toggle="modal" data-target="#settings" onclick="getHost();">Settings</a></li>
|
<li><a href="#" data-toggle="modal" data-target="#settings" onclick="getHost();">Settings</a></li>
|
||||||
@ -60,13 +60,25 @@
|
|||||||
<span class="glyphicon glyphicon-heart"></span>
|
<span class="glyphicon glyphicon-heart"></span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
<!--
|
||||||
<div class="btn-group">
|
<div class="btn-group">
|
||||||
<div class="btn btn-toolbar btn-default">
|
<div class="btn btn-toolbar btn-default">
|
||||||
<span id="volume-icon" class="glyphicon glyphicon-volume-up"></span>
|
<span id="volume-icon" class="glyphicon glyphicon-volume-up"></span>
|
||||||
<div id="volumeslider"></div>
|
<div id="volumeslider"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
-->
|
||||||
|
<div class="btn-group" role="group">
|
||||||
|
<audio id="player" preload="none"></audio>
|
||||||
|
<button type="button" class="btn btn-default" onclick="clickLocalPlay()">
|
||||||
|
<span id="localplay-icon" class="glyphicon glyphicon-play"></span>
|
||||||
|
</button>
|
||||||
|
<button type="button" class="btn btn-default" onclick="window.open('/player.html');">
|
||||||
|
<span id="localplay-icon" class="glyphicon glyphicon-new-window"></span>
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<form id="search" class="navbar-form navbar-right" role="search">
|
<form id="search" class="navbar-form navbar-right" role="search">
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<input type="text" class="form-control" placeholder="Search">
|
<input type="text" class="form-control" placeholder="Search">
|
||||||
@ -84,15 +96,16 @@
|
|||||||
|
|
||||||
<div class="panel panel-primary">
|
<div class="panel panel-primary">
|
||||||
<!-- Default panel contents -->
|
<!-- Default panel contents -->
|
||||||
<div class="panel-heading"><b id="panel-heading">Queue</b></div>
|
<div class="panel-heading"><b id="panel-heading">Queue</b>
|
||||||
|
<b id="panel-heading-info" class="text pull-right"></b></div>
|
||||||
<div class="panel-body">
|
<div class="panel-body">
|
||||||
<h1>
|
<h1>
|
||||||
<span id="track-icon" onclick="clickPlay();" class="glyphicon glyphicon-play"></span>
|
<span id="track-icon" onclick="clickPlay();" class="glyphicon glyphicon-play"></span>
|
||||||
<span id="currenttrack"></span>
|
<span id="currenttrack"></span>
|
||||||
</h1>
|
</h1>
|
||||||
<h4>
|
<h4>
|
||||||
<span id="album" class="text"></span>
|
<span id="artist" class="text"></span>
|
||||||
<span id="artist" class="text pull-right"></span>
|
<span id="album" class="text pull-right"></span>
|
||||||
</h4>
|
</h4>
|
||||||
<p id="counter" class="text pull-right"> </p>
|
<p id="counter" class="text pull-right"> </p>
|
||||||
|
|
||||||
@ -114,8 +127,10 @@
|
|||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th>#</th>
|
<th>#</th>
|
||||||
<th colspan="2">Track</th>
|
<th>Artist</th>
|
||||||
<th>Duration</th>
|
<th>Album</th>
|
||||||
|
<th>Title</th>
|
||||||
|
<th>Length</th>
|
||||||
<th></th>
|
<th></th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
@ -261,6 +276,19 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="form-group col-md-12">
|
||||||
|
<label class="control-label" for="mpdstream">MPD Stream URL</label>
|
||||||
|
<input type="text" class="form-control" id="mpdstream" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="form-group col-md-12">
|
||||||
|
<button type="button" class="btn btn-default" onclick="updateDB();">
|
||||||
|
<span class="glyphicon glyphicon-refresh"></span> Update DB
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
|
275
htdocs/js/mpd.js
275
htdocs/js/mpd.js
@ -16,12 +16,14 @@
|
|||||||
Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
|
Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
var TOKEN = "";
|
||||||
|
|
||||||
var socket;
|
var socket;
|
||||||
var last_state;
|
var last_state;
|
||||||
var last_outputs;
|
var last_outputs;
|
||||||
var current_app;
|
var current_app;
|
||||||
var pagination = 0;
|
var pagination = 0;
|
||||||
var browsepath;
|
var browsepath = "";
|
||||||
var lastSongTitle = "";
|
var lastSongTitle = "";
|
||||||
var current_song = new Object();
|
var current_song = new Object();
|
||||||
var MAX_ELEMENTS_PER_PAGE = 512;
|
var MAX_ELEMENTS_PER_PAGE = 512;
|
||||||
@ -29,7 +31,7 @@ var dirble_selected_cat = "";
|
|||||||
var dirble_catid = "";
|
var dirble_catid = "";
|
||||||
var dirble_page = 1;
|
var dirble_page = 1;
|
||||||
var isTouch = Modernizr.touch ? 1 : 0;
|
var isTouch = Modernizr.touch ? 1 : 0;
|
||||||
var filter = undefined;
|
var filter = "";
|
||||||
var dirble_api_token = "";
|
var dirble_api_token = "";
|
||||||
var dirble_stations = false;
|
var dirble_stations = false;
|
||||||
|
|
||||||
@ -45,6 +47,8 @@ var app = $.sammy(function() {
|
|||||||
socket.send('MPD_API_GET_QUEUE,'+pagination);
|
socket.send('MPD_API_GET_QUEUE,'+pagination);
|
||||||
|
|
||||||
$('#panel-heading').text("Queue");
|
$('#panel-heading').text("Queue");
|
||||||
|
$('#panel-heading-info').empty();
|
||||||
|
|
||||||
$('#queue').addClass('active');
|
$('#queue').addClass('active');
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -67,8 +71,8 @@ var app = $.sammy(function() {
|
|||||||
browsepath = this.params['splat'][1];
|
browsepath = this.params['splat'][1];
|
||||||
pagination = parseInt(this.params['splat'][0]);
|
pagination = parseInt(this.params['splat'][0]);
|
||||||
current_app = 'browse';
|
current_app = 'browse';
|
||||||
$('#breadcrump').removeClass('hide').empty().append("<li><a href=\"#/browse/0/\" onclick=\"set_filter()\">root</a></li>");
|
$('#breadcrump').removeClass('hide').empty().append("<li><a uri=\"\" onclick=\"set_filter('')\">root</a></li>");
|
||||||
$('#filter').removeClass('hide');
|
add_filter();
|
||||||
$('#salamisandwich').removeClass('hide').find("tr:gt(0)").remove();
|
$('#salamisandwich').removeClass('hide').find("tr:gt(0)").remove();
|
||||||
$('#dirble_panel').addClass('hide');
|
$('#dirble_panel').addClass('hide');
|
||||||
socket.send('MPD_API_GET_BROWSE,'+pagination+','+(browsepath ? browsepath : "/"));
|
socket.send('MPD_API_GET_BROWSE,'+pagination+','+(browsepath ? browsepath : "/"));
|
||||||
@ -92,7 +96,7 @@ var app = $.sammy(function() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
full_path = full_path + chunk;
|
full_path = full_path + chunk;
|
||||||
$('#breadcrump').append("<li><a href=\"#/browse/0/" + full_path + "\">"+chunk+"</a></li>");
|
$('#breadcrump').append("<li><a uri=\"" + full_path + "\">"+chunk+"</a></li>");
|
||||||
full_path += "/";
|
full_path += "/";
|
||||||
});
|
});
|
||||||
$('#browse').addClass('active');
|
$('#browse').addClass('active');
|
||||||
@ -111,6 +115,9 @@ var app = $.sammy(function() {
|
|||||||
});
|
});
|
||||||
|
|
||||||
this.get(/\#\/dirble\/(\d+)\/(\d+)/, function() {
|
this.get(/\#\/dirble\/(\d+)\/(\d+)/, function() {
|
||||||
|
|
||||||
|
if (TOKEN === "") context.redirect("#/0");
|
||||||
|
|
||||||
prepare();
|
prepare();
|
||||||
current_app = 'dirble';
|
current_app = 'dirble';
|
||||||
$('#breadcrump').removeClass('hide').empty().append("<li><a href=\"#/dirble/\">Categories</a></li><li>"+dirble_selected_cat+"</li>");
|
$('#breadcrump').removeClass('hide').empty().append("<li><a href=\"#/dirble/\">Categories</a></li><li>"+dirble_selected_cat+"</li>");
|
||||||
@ -121,6 +128,8 @@ var app = $.sammy(function() {
|
|||||||
$('#dirble_right').find("tr:gt(0)").remove();
|
$('#dirble_right').find("tr:gt(0)").remove();
|
||||||
|
|
||||||
$('#panel-heading').text("Dirble");
|
$('#panel-heading').text("Dirble");
|
||||||
|
$('#panel-heading-info').empty();
|
||||||
|
|
||||||
$('#dirble').addClass('active');
|
$('#dirble').addClass('active');
|
||||||
|
|
||||||
$('#next').addClass('hide');
|
$('#next').addClass('hide');
|
||||||
@ -137,6 +146,9 @@ var app = $.sammy(function() {
|
|||||||
});
|
});
|
||||||
|
|
||||||
this.get(/\#\/dirble\//, function() {
|
this.get(/\#\/dirble\//, function() {
|
||||||
|
|
||||||
|
if (TOKEN === "") context.redirect("#/0");
|
||||||
|
|
||||||
prepare();
|
prepare();
|
||||||
current_app = 'dirble';
|
current_app = 'dirble';
|
||||||
$('#breadcrump').removeClass('hide').empty().append("<li>Categories</li>");
|
$('#breadcrump').removeClass('hide').empty().append("<li>Categories</li>");
|
||||||
@ -147,6 +159,8 @@ var app = $.sammy(function() {
|
|||||||
$('#dirble_right').find("tr:gt(0)").remove();
|
$('#dirble_right').find("tr:gt(0)").remove();
|
||||||
|
|
||||||
$('#panel-heading').text("Dirble");
|
$('#panel-heading').text("Dirble");
|
||||||
|
$('#panel-heading-info').empty();
|
||||||
|
|
||||||
$('#dirble').addClass('active');
|
$('#dirble').addClass('active');
|
||||||
|
|
||||||
dirble_stations = false;
|
dirble_stations = false;
|
||||||
@ -186,7 +200,66 @@ $(document).ready(function(){
|
|||||||
if ($.cookie("notification") === "true")
|
if ($.cookie("notification") === "true")
|
||||||
$('#btnnotify').addClass("active")
|
$('#btnnotify').addClass("active")
|
||||||
|
|
||||||
add_filter();
|
document.getElementById('player').addEventListener('stalled', function() {
|
||||||
|
if ( !document.getElementById('player').paused ) {
|
||||||
|
this.pause();
|
||||||
|
clickLocalPlay();
|
||||||
|
$('.top-right').notify({
|
||||||
|
message:{text:"music stream stalled - trying to recover..."},
|
||||||
|
type: "danger",
|
||||||
|
fadeOut: { enabled: true, delay: 1000 },
|
||||||
|
}).show();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
document.getElementById('player').addEventListener('pause', function() {
|
||||||
|
this.src='';
|
||||||
|
this.removeAttribute("src");
|
||||||
|
$("#localplay-icon").removeClass("glyphicon-pause").addClass("glyphicon-play");
|
||||||
|
});
|
||||||
|
|
||||||
|
document.getElementById('player').addEventListener('error', function failed(e) {
|
||||||
|
this.pause();
|
||||||
|
switch (e.target.error.code) {
|
||||||
|
case e.target.error.MEDIA_ERR_ABORTED:
|
||||||
|
$('.top-right').notify({
|
||||||
|
message:{text:"Audio playback aborted by user."},
|
||||||
|
type: "info",
|
||||||
|
fadeOut: { enabled: true, delay: 1000 },
|
||||||
|
}).show();
|
||||||
|
break;
|
||||||
|
case e.target.error.MEDIA_ERR_NETWORK:
|
||||||
|
$('.top-right').notify({
|
||||||
|
message:{text:"Network error while playing audio."},
|
||||||
|
type: "danger",
|
||||||
|
fadeOut: { enabled: true, delay: 1000 },
|
||||||
|
}).show();
|
||||||
|
break;
|
||||||
|
case e.target.error.MEDIA_ERR_DECODE:
|
||||||
|
$('.top-right').notify({
|
||||||
|
message:{text:"Audio playback aborted. Did you unplug your headphones?"},
|
||||||
|
type: "danger",
|
||||||
|
fadeOut: { enabled: true, delay: 1000 },
|
||||||
|
}).show();
|
||||||
|
break;
|
||||||
|
case e.target.error.MEDIA_ERR_SRC_NOT_SUPPORTED:
|
||||||
|
$('.top-right').notify({
|
||||||
|
message:{text:"Error while loading audio (server, network or format error)."},
|
||||||
|
type: "danger",
|
||||||
|
fadeOut: { enabled: true, delay: 1000 },
|
||||||
|
}).show();
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
$('.top-right').notify({
|
||||||
|
message:{text:"Unknown error while playing audio."},
|
||||||
|
type: "danger",
|
||||||
|
fadeOut: { enabled: true, delay: 1000 },
|
||||||
|
}).show();
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}, true);
|
||||||
|
|
||||||
|
if (TOKEN === "") $('#dirble').addClass('hide');
|
||||||
});
|
});
|
||||||
|
|
||||||
function webSocketConnect() {
|
function webSocketConnect() {
|
||||||
@ -217,11 +290,24 @@ function webSocketConnect() {
|
|||||||
|
|
||||||
var obj = JSON.parse(msg.data);
|
var obj = JSON.parse(msg.data);
|
||||||
|
|
||||||
|
|
||||||
switch (obj.type) {
|
switch (obj.type) {
|
||||||
case 'queue':
|
case 'queue':
|
||||||
if(current_app !== 'queue')
|
if(current_app !== 'queue')
|
||||||
break;
|
break;
|
||||||
|
|
||||||
|
if (obj.totalTime > 0) {
|
||||||
|
var hours = Math.floor(obj.totalTime / 3600);
|
||||||
|
var minutes = Math.floor(obj.totalTime / 60) - hours * 60;
|
||||||
|
var seconds = obj.totalTime - hours * 3600 - minutes * 60;
|
||||||
|
|
||||||
|
$('#panel-heading-info').text('Total: ' +
|
||||||
|
(hours > 0 ? hours + '\u2009h ' + (minutes < 10 ? '0' : '') : '') +
|
||||||
|
minutes + '\u2009m ' + (seconds < 10 ? '0' : '') + seconds + '\u2009s');
|
||||||
|
} else {
|
||||||
|
$('#panel-heading-info').empty();
|
||||||
|
}
|
||||||
|
|
||||||
$('#salamisandwich > tbody').empty();
|
$('#salamisandwich > tbody').empty();
|
||||||
for (var song in obj.data) {
|
for (var song in obj.data) {
|
||||||
var minutes = Math.floor(obj.data[song].duration / 60);
|
var minutes = Math.floor(obj.data[song].duration / 60);
|
||||||
@ -229,9 +315,10 @@ function webSocketConnect() {
|
|||||||
|
|
||||||
$('#salamisandwich > tbody').append(
|
$('#salamisandwich > tbody').append(
|
||||||
"<tr trackid=\"" + obj.data[song].id + "\"><td>" + (obj.data[song].pos + 1) + "</td>" +
|
"<tr trackid=\"" + obj.data[song].id + "\"><td>" + (obj.data[song].pos + 1) + "</td>" +
|
||||||
"<td>" + obj.data[song].artist + "<br /><span>" + obj.data[song].album + "</span></td>" +
|
"<td>"+ obj.data[song].artist +"</td>" +
|
||||||
"<td>" + obj.data[song].title + "</td>" +
|
"<td>"+ obj.data[song].album +"</td>" +
|
||||||
"<td>" + minutes + ":" + (seconds < 10 ? '0' : '') + seconds +
|
"<td>"+ obj.data[song].title +"</td>" +
|
||||||
|
"<td>"+ minutes + ":" + (seconds < 10 ? '0' : '') + seconds +
|
||||||
"</td><td></td></tr>");
|
"</td><td></td></tr>");
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -313,32 +400,32 @@ function webSocketConnect() {
|
|||||||
switch(obj.data[item].type) {
|
switch(obj.data[item].type) {
|
||||||
case 'directory':
|
case 'directory':
|
||||||
var clazz = 'dir';
|
var clazz = 'dir';
|
||||||
if (filter !== undefined) {
|
if (filter !== "") {
|
||||||
var first = obj.data[item].dir[0];
|
var first = basename(obj.data[item].dir)[0];
|
||||||
if (filter === "#" && isNaN(first)) {
|
if (filter === "num" && isNaN(first)) {
|
||||||
clazz += ' hide';
|
clazz += ' hide';
|
||||||
} else if (filter >= "A" && filter <= "Z" && first.toUpperCase() !== filter) {
|
} else if (filter >= "A" && filter <= "Z" && first.toUpperCase() !== filter) {
|
||||||
clazz += ' hide';
|
clazz += ' hide';
|
||||||
} else if (filter === "||") {
|
} else if (filter === "plist") {
|
||||||
clazz += ' hide';
|
clazz += ' hide';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
$('#salamisandwich > tbody').append(
|
$('#salamisandwich > tbody').append(
|
||||||
"<tr uri=\"" + encodeURI(obj.data[item].dir) + "\" class=\"" + clazz + "\">" +
|
"<tr uri=\"" + encodeURI(obj.data[item].dir) + "\" class=\"" + clazz + "\">" +
|
||||||
"<td><span class=\"glyphicon glyphicon-folder-open\"></span></td>" +
|
"<td><span class=\"glyphicon glyphicon-folder-open\"></span></td>" +
|
||||||
"<td colspan=\"2\"><a>" + basename(obj.data[item].dir) + "</a></td>" +
|
"<td colspan=\"3\"><a>" + basename(obj.data[item].dir) + "</a></td>" +
|
||||||
"<td></td><td></td></tr>"
|
"<td></td><td></td></tr>"
|
||||||
);
|
);
|
||||||
break;
|
break;
|
||||||
case 'playlist':
|
case 'playlist':
|
||||||
var clazz = 'plist';
|
var clazz = 'plist';
|
||||||
if (filter !== "||") {
|
if ( (filter !== "") && (filter !== "plist") ) {
|
||||||
clazz += ' hide';
|
clazz += ' hide';
|
||||||
}
|
}
|
||||||
$('#salamisandwich > tbody').append(
|
$('#salamisandwich > tbody').append(
|
||||||
"<tr uri=\"" + encodeURI(obj.data[item].plist) + "\" class=\"" + clazz + "\">" +
|
"<tr uri=\"" + encodeURI(obj.data[item].plist) + "\" class=\"" + clazz + "\">" +
|
||||||
"<td><span class=\"glyphicon glyphicon-list\"></span></td>" +
|
"<td><span class=\"glyphicon glyphicon-list\"></span></td>" +
|
||||||
"<td colspan=\"2\"><a>" + basename(obj.data[item].plist) + "</a></td>" +
|
"<td colspan=\"3\"><a>" + basename(obj.data[item].plist) + "</a></td>" +
|
||||||
"<td></td><td></td></tr>"
|
"<td></td><td></td></tr>"
|
||||||
);
|
);
|
||||||
break;
|
break;
|
||||||
@ -346,15 +433,19 @@ function webSocketConnect() {
|
|||||||
var minutes = Math.floor(obj.data[item].duration / 60);
|
var minutes = Math.floor(obj.data[item].duration / 60);
|
||||||
var seconds = obj.data[item].duration - minutes * 60;
|
var seconds = obj.data[item].duration - minutes * 60;
|
||||||
|
|
||||||
if (typeof obj.data[item].artist === 'undefined') {
|
if (obj.data[item].artist == null) {
|
||||||
var details = "<td colspan=\"2\">" + obj.data[item].title + "</td>";
|
var artist = "<td colspan=\"2\">";
|
||||||
} else {
|
} else {
|
||||||
var details = "<td>" + obj.data[item].artist + "<br /><span>" + obj.data[item].album + "</span></td><td>" + obj.data[item].title + "</td>";
|
var artist = "<td>" + obj.data[item].artist +
|
||||||
|
"<span>" + obj.data[item].album + "</span></td><td>";
|
||||||
}
|
}
|
||||||
|
|
||||||
$('#salamisandwich > tbody').append(
|
$('#salamisandwich > tbody').append(
|
||||||
"<tr uri=\"" + encodeURI(obj.data[item].uri) + "\" class=\"song\">" +
|
"<tr uri=\"" + encodeURI(obj.data[item].uri) + "\" class=\"song\">" +
|
||||||
"<td><span class=\"glyphicon glyphicon-music\"></span></td>" + details +
|
"<td><span class=\"glyphicon glyphicon-music\"></span></td>" +
|
||||||
|
"<td>" + obj.data[item].artist + "</td>" +
|
||||||
|
"<td>" + obj.data[item].album + "</td>" +
|
||||||
|
"<td>" + obj.data[item].title + "</td>" +
|
||||||
"<td>" + minutes + ":" + (seconds < 10 ? '0' : '') + seconds +
|
"<td>" + minutes + ":" + (seconds < 10 ? '0' : '') + seconds +
|
||||||
"</td><td></td></tr>"
|
"</td><td></td></tr>"
|
||||||
);
|
);
|
||||||
@ -365,7 +456,7 @@ function webSocketConnect() {
|
|||||||
} else {
|
} else {
|
||||||
$('#salamisandwich > tbody').append(
|
$('#salamisandwich > tbody').append(
|
||||||
"<tr><td><span class=\"glyphicon glyphicon-remove\"></span></td>" +
|
"<tr><td><span class=\"glyphicon glyphicon-remove\"></span></td>" +
|
||||||
"<td colspan=\"2\">Too many results, please refine your search!</td>" +
|
"<td colspan=\"3\">Too many results, please refine your search!</td>" +
|
||||||
"<td></td><td></td></tr>"
|
"<td></td><td></td></tr>"
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@ -414,7 +505,9 @@ function webSocketConnect() {
|
|||||||
pagination = 0;
|
pagination = 0;
|
||||||
browsepath = $(this).attr("uri");
|
browsepath = $(this).attr("uri");
|
||||||
$("#browse > a").attr("href", '#/browse/'+pagination+'/'+browsepath);
|
$("#browse > a").attr("href", '#/browse/'+pagination+'/'+browsepath);
|
||||||
|
$('#filter > a').attr("href", '#/browse/'+pagination+'/'+browsepath);
|
||||||
app.setLocation('#/browse/'+pagination+'/'+browsepath);
|
app.setLocation('#/browse/'+pagination+'/'+browsepath);
|
||||||
|
set_filter('');
|
||||||
break;
|
break;
|
||||||
case 'song':
|
case 'song':
|
||||||
socket.send("MPD_API_ADD_TRACK," + decodeURI($(this).attr("uri")));
|
socket.send("MPD_API_ADD_TRACK," + decodeURI($(this).attr("uri")));
|
||||||
@ -436,6 +529,17 @@ function webSocketConnect() {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
$('#breadcrump > li > a').on({
|
||||||
|
click: function() {
|
||||||
|
pagination = 0;
|
||||||
|
browsepath = $(this).attr("uri");
|
||||||
|
$("#browse > a").attr("href", '#/browse/'+pagination+'/'+browsepath);
|
||||||
|
$('#filter > a').attr("href", '#/browse/'+pagination+'/'+browsepath);
|
||||||
|
app.setLocation('#/browse/'+pagination+'/'+browsepath);
|
||||||
|
set_filter('');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
break;
|
break;
|
||||||
case 'state':
|
case 'state':
|
||||||
updatePlayIcon(obj.data.state);
|
updatePlayIcon(obj.data.state);
|
||||||
@ -493,7 +597,7 @@ function webSocketConnect() {
|
|||||||
break;
|
break;
|
||||||
case 'outputnames':
|
case 'outputnames':
|
||||||
$('#btn-outputs-block button').remove();
|
$('#btn-outputs-block button').remove();
|
||||||
if (obj.data.length > 1) {
|
if ( Object.keys(obj.data).length ) {
|
||||||
$.each(obj.data, function(id, name){
|
$.each(obj.data, function(id, name){
|
||||||
var btn = $('<button id="btnoutput'+id+'" class="btn btn-default" onclick="toggleoutput(this, '+id+')"><span class="glyphicon glyphicon-volume-up"></span> '+name+'</button>');
|
var btn = $('<button id="btnoutput'+id+'" class="btn btn-default" onclick="toggleoutput(this, '+id+')"><span class="glyphicon glyphicon-volume-up"></span> '+name+'</button>');
|
||||||
btn.appendTo($('#btn-outputs-block'));
|
btn.appendTo($('#btn-outputs-block'));
|
||||||
@ -528,7 +632,7 @@ function webSocketConnect() {
|
|||||||
socket.send('MPD_API_GET_QUEUE,'+pagination);
|
socket.send('MPD_API_GET_QUEUE,'+pagination);
|
||||||
break;
|
break;
|
||||||
case 'song_change':
|
case 'song_change':
|
||||||
|
updatePageTitle(obj.data);
|
||||||
$('#album').text("");
|
$('#album').text("");
|
||||||
$('#artist').text("");
|
$('#artist').text("");
|
||||||
|
|
||||||
@ -537,14 +641,14 @@ function webSocketConnect() {
|
|||||||
$('#currenttrack').text(" " + obj.data.title);
|
$('#currenttrack').text(" " + obj.data.title);
|
||||||
var notification = "<strong><h4>" + obj.data.title + "</h4></strong>";
|
var notification = "<strong><h4>" + obj.data.title + "</h4></strong>";
|
||||||
|
|
||||||
if(obj.data.album) {
|
|
||||||
$('#album').text(obj.data.album);
|
|
||||||
notification += obj.data.album + "<br />";
|
|
||||||
}
|
|
||||||
if(obj.data.artist) {
|
if(obj.data.artist) {
|
||||||
$('#artist').text(obj.data.artist);
|
$('#artist').text(obj.data.artist);
|
||||||
notification += obj.data.artist + "<br />";
|
notification += obj.data.artist + "<br />";
|
||||||
}
|
}
|
||||||
|
if(obj.data.album) {
|
||||||
|
$('#album').text(obj.data.album);
|
||||||
|
notification += obj.data.album + "<br />";
|
||||||
|
}
|
||||||
|
|
||||||
if ($.cookie("notification") === "true")
|
if ($.cookie("notification") === "true")
|
||||||
songNotify(obj.data.title, obj.data.artist, obj.data.album );
|
songNotify(obj.data.title, obj.data.artist, obj.data.album );
|
||||||
@ -553,10 +657,10 @@ function webSocketConnect() {
|
|||||||
message:{html: notification},
|
message:{html: notification},
|
||||||
type: "info",
|
type: "info",
|
||||||
}).show();
|
}).show();
|
||||||
|
|
||||||
break;
|
break;
|
||||||
case 'mpdhost':
|
case 'mpdhost':
|
||||||
$('#mpdhost').val(obj.data.host);
|
$('#mpdhost').val(obj.data.host);
|
||||||
|
setLocalStream(obj.data.host);
|
||||||
$('#mpdport').val(obj.data.port);
|
$('#mpdport').val(obj.data.port);
|
||||||
if(obj.data.passwort_set)
|
if(obj.data.passwort_set)
|
||||||
$('#mpd_password_set').removeClass('hide');
|
$('#mpd_password_set').removeClass('hide');
|
||||||
@ -658,12 +762,28 @@ var updatePlayIcon = function(state)
|
|||||||
if(state == 1) { // stop
|
if(state == 1) { // stop
|
||||||
$("#play-icon").addClass("glyphicon-play");
|
$("#play-icon").addClass("glyphicon-play");
|
||||||
$('#track-icon').addClass("glyphicon-stop");
|
$('#track-icon').addClass("glyphicon-stop");
|
||||||
} else if(state == 2) { // pause
|
document.getElementById('player').pause();
|
||||||
|
} else if(state == 2) { // play
|
||||||
$("#play-icon").addClass("glyphicon-pause");
|
$("#play-icon").addClass("glyphicon-pause");
|
||||||
$('#track-icon').addClass("glyphicon-play");
|
$('#track-icon').addClass("glyphicon-play");
|
||||||
} else { // play
|
} else { // pause
|
||||||
$("#play-icon").addClass("glyphicon-play");
|
$("#play-icon").addClass("glyphicon-play");
|
||||||
$('#track-icon').addClass("glyphicon-pause");
|
$('#track-icon').addClass("glyphicon-pause");
|
||||||
|
document.getElementById('player').pause();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
var updatePageTitle = function(songInfo) {
|
||||||
|
if(!songInfo || (!songInfo.artist && !songInfo.title)) {
|
||||||
|
document.title = 'ympd';
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if(songInfo.artist) {
|
||||||
|
if(songInfo.title) {
|
||||||
|
document.title = songInfo.artist + ' - ' + songInfo.title;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
document.title = songInfo.title;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -681,6 +801,52 @@ function clickPlay() {
|
|||||||
socket.send('MPD_API_SET_PAUSE');
|
socket.send('MPD_API_SET_PAUSE');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function clickLocalPlay() {
|
||||||
|
var player = document.getElementById('player');
|
||||||
|
$("#localplay-icon").removeClass("glyphicon-play").removeClass("glyphicon-pause");
|
||||||
|
|
||||||
|
|
||||||
|
if ( !$('#track-icon').hasClass('glyphicon-play') ) {
|
||||||
|
clickPlay();
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( player.paused ) {
|
||||||
|
var mpdstream = $.cookie("mpdstream");
|
||||||
|
|
||||||
|
if ( mpdstream ) {
|
||||||
|
player.src = mpdstream;
|
||||||
|
console.log("playing mpd stream: " + player.src);
|
||||||
|
player.load();
|
||||||
|
player.play();
|
||||||
|
$("#localplay-icon").addClass("glyphicon-pause");
|
||||||
|
} else {
|
||||||
|
$("#mpdstream").change(function(){ clickLocalPlay(); $(this).unbind("change"); });
|
||||||
|
$("#localplay-icon").addClass("glyphicon-play");
|
||||||
|
getHost();
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
player.pause();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function setLocalStream(mpdhost) {
|
||||||
|
var mpdstream = $.cookie("mpdstream");
|
||||||
|
|
||||||
|
if ( !mpdstream ) {
|
||||||
|
mpdstream = "http://";
|
||||||
|
if ( mpdhost == "127.0.0.1" )
|
||||||
|
mpdstream += window.location.hostname;
|
||||||
|
else
|
||||||
|
mpdstream += mpdhost;
|
||||||
|
mpdstream += ":8000/";
|
||||||
|
|
||||||
|
$.cookie("mpdstream", mpdstream, { expires: 424242 });
|
||||||
|
}
|
||||||
|
|
||||||
|
$("#mpdstream").val(mpdstream);
|
||||||
|
$("#mpdstream").change();
|
||||||
|
}
|
||||||
|
|
||||||
function trash(tr) {
|
function trash(tr) {
|
||||||
if ( $('#btntrashmodeup').hasClass('active') ) {
|
if ( $('#btntrashmodeup').hasClass('active') ) {
|
||||||
socket.send('MPD_API_RM_RANGE,0,' + (tr.index() + 1));
|
socket.send('MPD_API_RM_RANGE,0,' + (tr.index() + 1));
|
||||||
@ -771,6 +937,7 @@ function getHost() {
|
|||||||
|
|
||||||
$('#mpdhost').keypress(onEnter);
|
$('#mpdhost').keypress(onEnter);
|
||||||
$('#mpdport').keypress(onEnter);
|
$('#mpdport').keypress(onEnter);
|
||||||
|
$('#mpdstream').keypress(onEnter);
|
||||||
$('#mpd_pw').keypress(onEnter);
|
$('#mpd_pw').keypress(onEnter);
|
||||||
$('#mpd_pw_con').keypress(onEnter);
|
$('#mpd_pw_con').keypress(onEnter);
|
||||||
}
|
}
|
||||||
@ -843,6 +1010,7 @@ function confirmSettings() {
|
|||||||
socket.send('MPD_API_SET_MPDPASS,'+$('#mpd_pw').val());
|
socket.send('MPD_API_SET_MPDPASS,'+$('#mpd_pw').val());
|
||||||
}
|
}
|
||||||
socket.send('MPD_API_SET_MPDHOST,'+$('#mpdport').val()+','+$('#mpdhost').val());
|
socket.send('MPD_API_SET_MPDHOST,'+$('#mpdport').val()+','+$('#mpdhost').val());
|
||||||
|
$.cookie("mpdstream", $("#mpdstream").val(), { expires: 424242 });
|
||||||
$('#settings').modal('hide');
|
$('#settings').modal('hide');
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -1060,53 +1228,50 @@ function dirble_load_stations() {
|
|||||||
|
|
||||||
function set_filter (c) {
|
function set_filter (c) {
|
||||||
filter = c;
|
filter = c;
|
||||||
|
$('#filter > a').removeClass('active');
|
||||||
|
$('#f' + c).addClass('active');
|
||||||
|
|
||||||
$.each($('#salamisandwich > tbody > tr.dir'), function(i, line) {
|
if (filter === "") {
|
||||||
var first = $(line).attr('uri')[0];
|
$('#salamisandwich > tbody > tr').removeClass('hide');
|
||||||
|
} else if (filter === "plist") {
|
||||||
if (filter === undefined) {
|
$('#salamisandwich > tbody > tr.dir').addClass('hide');
|
||||||
$(line).removeClass('hide');
|
$('#salamisandwich > tbody > tr.song').addClass('hide');
|
||||||
|
$('#salamisandwich > tbody > tr.plist').removeClass('hide');
|
||||||
|
} else {
|
||||||
|
$.each($('#salamisandwich > tbody > tr'), function(i, line) {
|
||||||
|
var first = basename($(line).attr('uri'))[0];
|
||||||
|
if ( $(line).hasClass('song') ) {
|
||||||
|
first = $(line).children().eq(3).text()[0];
|
||||||
}
|
}
|
||||||
|
|
||||||
else if (filter === "#") {
|
if (filter === "num") {
|
||||||
if (!isNaN(first)) {
|
if (!isNaN(first)) {
|
||||||
$(line).removeClass('hide');
|
$(line).removeClass('hide');
|
||||||
} else {
|
} else {
|
||||||
$(line).addClass('hide');
|
$(line).addClass('hide');
|
||||||
}
|
}
|
||||||
}
|
} else if (filter >= "A" && filter <= "Z") {
|
||||||
|
|
||||||
else if (filter >= "A" && filter <= "Z") {
|
|
||||||
if (first.toUpperCase() === filter) {
|
if (first.toUpperCase() === filter) {
|
||||||
$(line).removeClass('hide');
|
$(line).removeClass('hide');
|
||||||
} else {
|
} else {
|
||||||
$(line).addClass('hide');
|
$(line).addClass('hide');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
else if (filter === "||") {
|
|
||||||
$(line).addClass('hide');
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
|
||||||
$.each($('#salamisandwich > tbody > tr.plist'), function(i, line) {
|
|
||||||
if (filter === undefined) {
|
|
||||||
$(line).removeClass('hide');
|
|
||||||
} else if (filter === "||") {
|
|
||||||
$(line).removeClass('hide');
|
|
||||||
} else {
|
|
||||||
$(line).addClass('hide');
|
|
||||||
}
|
}
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function add_filter () {
|
function add_filter () {
|
||||||
$('#filter').append(' <a onclick="set_filter(\'#\')" href="#/browse/0/">#</a>');
|
$('#filter').empty();
|
||||||
|
$('#filter').append(' <a onclick="set_filter(\'\')" href="#/browse/'+pagination+'/'+browsepath+'">All</a>');
|
||||||
|
$('#filter').append(' <a id="fnum" onclick="set_filter(\'num\')" href="#/browse/'+pagination+'/'+browsepath+'">#</a>');
|
||||||
|
|
||||||
for (i = 65; i <= 90; i++) {
|
for (i = 65; i <= 90; i++) {
|
||||||
var c = String.fromCharCode(i);
|
var c = String.fromCharCode(i);
|
||||||
$('#filter').append(' <a onclick="set_filter(\'' + c + '\')" href="#/browse/0/">' + c + '</a>');
|
$('#filter').append(' <a id="f' + c + '" onclick="set_filter(\'' + c + '\');" href="#/browse/' + pagination + '/' + browsepath + '">' + c + '</a>');
|
||||||
}
|
}
|
||||||
|
|
||||||
$('#filter').append(' <a onclick="set_filter(\'||\')" href="#/browse/0/" class="glyphicon glyphicon-list"></a>');
|
$('#filter').append(' <a id="fplist" onclick="set_filter(\'plist\')" href="#/browse/'+pagination+'/'+browsepath+'" class="glyphicon glyphicon-list"></a>');
|
||||||
|
$('#f' + filter).addClass('active');
|
||||||
|
$('#filter').removeClass('hide');
|
||||||
}
|
}
|
||||||
|
126
htdocs/player.html
Normal file
126
htdocs/player.html
Normal file
@ -0,0 +1,126 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<!-- <meta name="viewport" content="width=device-width, initial-scale=1.0">-->
|
||||||
|
<meta name="viewport" content="width=320">
|
||||||
|
<meta name="description" content="ympd - fast and lightweight MPD webclient">
|
||||||
|
<meta name="author" content="andy@ndyk.de">
|
||||||
|
|
||||||
|
<title>ympd player</title>
|
||||||
|
|
||||||
|
<!-- Bootstrap core CSS -->
|
||||||
|
<link href="css/bootstrap.css" rel="stylesheet">
|
||||||
|
<link href="css/bootstrap-theme.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<!-- Custom styles for this template -->
|
||||||
|
<link href="css/mpd.css" rel="stylesheet">
|
||||||
|
<link href="assets/favicon.ico" rel="shortcut icon" type="image/vnd.microsoft.icon">
|
||||||
|
<script src="js/jquery-1.10.2.min.js"></script>
|
||||||
|
<script src="js/jquery.cookie.js"></script>
|
||||||
|
<script src="js/bootstrap.min.js"></script>
|
||||||
|
<script src="js/bootstrap-notify.js"></script>
|
||||||
|
<script type="text/javascript">
|
||||||
|
function clickLocalPlay() {
|
||||||
|
var player = document.getElementById('player');
|
||||||
|
$("#localplay-icon").removeClass("glyphicon-play").removeClass("glyphicon-pause");
|
||||||
|
|
||||||
|
|
||||||
|
if ( player.paused ) {
|
||||||
|
var mpdstream = $.cookie("mpdstream");
|
||||||
|
player.src = mpdstream;
|
||||||
|
console.log("playing mpd stream: " + player.src);
|
||||||
|
player.load();
|
||||||
|
player.play();
|
||||||
|
$("#localplay-icon").addClass("glyphicon-pause");
|
||||||
|
} else {
|
||||||
|
player.pause();
|
||||||
|
player.src='';
|
||||||
|
player.removeAttribute("src");
|
||||||
|
$("#localplay-icon").addClass("glyphicon-play");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$(document).ready(function(){
|
||||||
|
document.getElementById('player').addEventListener('stalled', function() {
|
||||||
|
if ( !document.getElementById('player').paused ) {
|
||||||
|
this.pause();
|
||||||
|
clickLocalPlay();
|
||||||
|
$('.top-right').notify({
|
||||||
|
message:{text:"music stream stalled - trying to recover..."},
|
||||||
|
type: "danger",
|
||||||
|
fadeOut: { enabled: true, delay: 1000 },
|
||||||
|
}).show();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
document.getElementById('player').addEventListener('pause', function() {
|
||||||
|
this.src='';
|
||||||
|
this.removeAttribute("src");
|
||||||
|
$("#localplay-icon").removeClass("glyphicon-pause").addClass("glyphicon-play");
|
||||||
|
});
|
||||||
|
|
||||||
|
document.getElementById('player').addEventListener('error', function failed(e) {
|
||||||
|
this.pause();
|
||||||
|
switch (e.target.error.code) {
|
||||||
|
case e.target.error.MEDIA_ERR_ABORTED:
|
||||||
|
$('.top-right').notify({
|
||||||
|
message:{text:"Audio playback aborted by user."},
|
||||||
|
type: "info",
|
||||||
|
fadeOut: { enabled: true, delay: 1000 },
|
||||||
|
}).show();
|
||||||
|
break;
|
||||||
|
case e.target.error.MEDIA_ERR_NETWORK:
|
||||||
|
$('.top-right').notify({
|
||||||
|
message:{text:"Network error while playing audio."},
|
||||||
|
type: "danger",
|
||||||
|
fadeOut: { enabled: true, delay: 1000 },
|
||||||
|
}).show();
|
||||||
|
break;
|
||||||
|
case e.target.error.MEDIA_ERR_DECODE:
|
||||||
|
$('.top-right').notify({
|
||||||
|
message:{text:"Audio playback aborted. Did you unplug your headphones?"},
|
||||||
|
type: "danger",
|
||||||
|
fadeOut: { enabled: true, delay: 1000 },
|
||||||
|
}).show();
|
||||||
|
break;
|
||||||
|
case e.target.error.MEDIA_ERR_SRC_NOT_SUPPORTED:
|
||||||
|
$('.top-right').notify({
|
||||||
|
message:{text:"Error while loading audio (server, network or format error)."},
|
||||||
|
type: "danger",
|
||||||
|
fadeOut: { enabled: true, delay: 1000 },
|
||||||
|
}).show();
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
$('.top-right').notify({
|
||||||
|
message:{text:"Unknown error while playing audio."},
|
||||||
|
type: "danger",
|
||||||
|
fadeOut: { enabled: true, delay: 1000 },
|
||||||
|
}).show();
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}, true);
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
|
||||||
|
<div class="container">
|
||||||
|
<a class="navbar-brand" href="/" target="_blank"><span class="glyphicon glyphicon-play-circle"></span> ympd</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="container starter-template">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-10 col-xs-12">
|
||||||
|
<audio id="player" preload="none"></audio>
|
||||||
|
<button type="button" class="btn btn-default btn-lg center-block" onclick="clickLocalPlay()">
|
||||||
|
<span id="localplay-icon" class="glyphicon glyphicon-play"></span>
|
||||||
|
</button>
|
||||||
|
<div class="notifications top-right"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
@ -475,28 +475,40 @@ char* mpd_get_title(struct mpd_song const *song)
|
|||||||
return str;
|
return str;
|
||||||
}
|
}
|
||||||
|
|
||||||
char* mpd_get_artist(struct mpd_song const *song)
|
|
||||||
{
|
|
||||||
char *str;
|
|
||||||
|
|
||||||
str = (char *)mpd_song_get_tag(song, MPD_TAG_ARTIST, 0);
|
|
||||||
if (str == NULL) {
|
|
||||||
return "";
|
|
||||||
} else {
|
|
||||||
return str;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
char* mpd_get_album(struct mpd_song const *song)
|
char* mpd_get_album(struct mpd_song const *song)
|
||||||
{
|
{
|
||||||
char *str;
|
char *str;
|
||||||
|
|
||||||
str = (char *)mpd_song_get_tag(song, MPD_TAG_ALBUM, 0);
|
str = (char *)mpd_song_get_tag(song, MPD_TAG_ALBUM, 0);
|
||||||
if (str == NULL) {
|
if(str == NULL){
|
||||||
return "";
|
str = "-";
|
||||||
} else {
|
|
||||||
return str;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
return str;
|
||||||
|
}
|
||||||
|
|
||||||
|
char* mpd_get_artist(struct mpd_song const *song)
|
||||||
|
{
|
||||||
|
char *str;
|
||||||
|
|
||||||
|
str = (char *)mpd_song_get_tag(song, MPD_TAG_ARTIST, 0);
|
||||||
|
if(str == NULL){
|
||||||
|
str = "-";
|
||||||
|
}
|
||||||
|
|
||||||
|
return str;
|
||||||
|
}
|
||||||
|
|
||||||
|
char* mpd_get_year(struct mpd_song const *song)
|
||||||
|
{
|
||||||
|
char *str;
|
||||||
|
|
||||||
|
str = (char *)mpd_song_get_tag(song, MPD_TAG_DATE, 0);
|
||||||
|
if(str == NULL){
|
||||||
|
str = "-";
|
||||||
|
}
|
||||||
|
|
||||||
|
return str;
|
||||||
}
|
}
|
||||||
|
|
||||||
int mpd_put_state(char *buffer, int *current_song_id, unsigned *queue_version)
|
int mpd_put_state(char *buffer, int *current_song_id, unsigned *queue_version)
|
||||||
@ -600,6 +612,7 @@ int mpd_put_queue(char *buffer, unsigned int offset)
|
|||||||
char *cur = buffer;
|
char *cur = buffer;
|
||||||
const char *end = buffer + MAX_SIZE;
|
const char *end = buffer + MAX_SIZE;
|
||||||
struct mpd_entity *entity;
|
struct mpd_entity *entity;
|
||||||
|
unsigned long totalTime = 0;
|
||||||
|
|
||||||
if (!mpd_send_list_queue_range_meta(mpd.conn, offset, offset+MAX_ELEMENTS_PER_PAGE))
|
if (!mpd_send_list_queue_range_meta(mpd.conn, offset, offset+MAX_ELEMENTS_PER_PAGE))
|
||||||
RETURN_ERROR_AND_RECOVER("mpd_send_list_queue_meta");
|
RETURN_ERROR_AND_RECOVER("mpd_send_list_queue_meta");
|
||||||
@ -608,16 +621,22 @@ int mpd_put_queue(char *buffer, unsigned int offset)
|
|||||||
|
|
||||||
while((entity = mpd_recv_entity(mpd.conn)) != NULL) {
|
while((entity = mpd_recv_entity(mpd.conn)) != NULL) {
|
||||||
const struct mpd_song *song;
|
const struct mpd_song *song;
|
||||||
|
unsigned int drtn;
|
||||||
|
|
||||||
if(mpd_entity_get_type(entity) == MPD_ENTITY_TYPE_SONG) {
|
if(mpd_entity_get_type(entity) == MPD_ENTITY_TYPE_SONG) {
|
||||||
song = mpd_entity_get_song(entity);
|
song = mpd_entity_get_song(entity);
|
||||||
|
drtn = mpd_song_get_duration(song);
|
||||||
|
|
||||||
cur += json_emit_raw_str(cur, end - cur, "{\"id\":");
|
cur += json_emit_raw_str(cur, end - cur, "{\"id\":");
|
||||||
cur += json_emit_int(cur, end - cur, mpd_song_get_id(song));
|
cur += json_emit_int(cur, end - cur, mpd_song_get_id(song));
|
||||||
cur += json_emit_raw_str(cur, end - cur, ",\"pos\":");
|
cur += json_emit_raw_str(cur, end - cur, ",\"pos\":");
|
||||||
cur += json_emit_int(cur, end - cur, mpd_song_get_pos(song));
|
cur += json_emit_int(cur, end - cur, mpd_song_get_pos(song));
|
||||||
cur += json_emit_raw_str(cur, end - cur, ",\"duration\":");
|
cur += json_emit_raw_str(cur, end - cur, ",\"duration\":");
|
||||||
cur += json_emit_int(cur, end - cur, mpd_song_get_duration(song));
|
cur += json_emit_int(cur, end - cur, drtn);
|
||||||
|
cur += json_emit_raw_str(cur, end - cur, ",\"artist\":");
|
||||||
|
cur += json_emit_quoted_str(cur, end - cur, mpd_get_artist(song));
|
||||||
|
cur += json_emit_raw_str(cur, end - cur, ",\"album\":");
|
||||||
|
cur += json_emit_quoted_str(cur, end - cur, mpd_get_album(song));
|
||||||
cur += json_emit_raw_str(cur, end - cur, ",\"title\":");
|
cur += json_emit_raw_str(cur, end - cur, ",\"title\":");
|
||||||
cur += json_emit_quoted_str(cur, end - cur, mpd_get_title(song));
|
cur += json_emit_quoted_str(cur, end - cur, mpd_get_title(song));
|
||||||
cur += json_emit_raw_str(cur, end - cur, ",\"artist\":");
|
cur += json_emit_raw_str(cur, end - cur, ",\"artist\":");
|
||||||
@ -625,6 +644,8 @@ int mpd_put_queue(char *buffer, unsigned int offset)
|
|||||||
cur += json_emit_raw_str(cur, end - cur, ",\"album\":");
|
cur += json_emit_raw_str(cur, end - cur, ",\"album\":");
|
||||||
cur += json_emit_quoted_str(cur, end - cur, mpd_get_album(song));
|
cur += json_emit_quoted_str(cur, end - cur, mpd_get_album(song));
|
||||||
cur += json_emit_raw_str(cur, end - cur, "},");
|
cur += json_emit_raw_str(cur, end - cur, "},");
|
||||||
|
|
||||||
|
totalTime += drtn;
|
||||||
}
|
}
|
||||||
mpd_entity_free(entity);
|
mpd_entity_free(entity);
|
||||||
}
|
}
|
||||||
@ -632,7 +653,9 @@ int mpd_put_queue(char *buffer, unsigned int offset)
|
|||||||
/* remove last ',' */
|
/* remove last ',' */
|
||||||
cur--;
|
cur--;
|
||||||
|
|
||||||
cur += json_emit_raw_str(cur, end - cur, "]}");
|
cur += json_emit_raw_str(cur, end - cur, "],\"totalTime\":");
|
||||||
|
cur += json_emit_int(cur, end - cur, totalTime);
|
||||||
|
cur += json_emit_raw_str(cur, end - cur, "}");
|
||||||
return cur - buffer;
|
return cur - buffer;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -676,6 +699,10 @@ int mpd_put_browse(char *buffer, char *path, unsigned int offset)
|
|||||||
song = mpd_entity_get_song(entity);
|
song = mpd_entity_get_song(entity);
|
||||||
cur += json_emit_raw_str(cur, end - cur, "{\"type\":\"song\",\"uri\":");
|
cur += json_emit_raw_str(cur, end - cur, "{\"type\":\"song\",\"uri\":");
|
||||||
cur += json_emit_quoted_str(cur, end - cur, mpd_song_get_uri(song));
|
cur += json_emit_quoted_str(cur, end - cur, mpd_song_get_uri(song));
|
||||||
|
cur += json_emit_raw_str(cur, end - cur, ",\"album\":");
|
||||||
|
cur += json_emit_quoted_str(cur, end - cur, mpd_get_album(song));
|
||||||
|
cur += json_emit_raw_str(cur, end - cur, ",\"artist\":");
|
||||||
|
cur += json_emit_quoted_str(cur, end - cur, mpd_get_artist(song));
|
||||||
cur += json_emit_raw_str(cur, end - cur, ",\"duration\":");
|
cur += json_emit_raw_str(cur, end - cur, ",\"duration\":");
|
||||||
cur += json_emit_int(cur, end - cur, mpd_song_get_duration(song));
|
cur += json_emit_int(cur, end - cur, mpd_song_get_duration(song));
|
||||||
cur += json_emit_raw_str(cur, end - cur, ",\"title\":");
|
cur += json_emit_raw_str(cur, end - cur, ",\"title\":");
|
||||||
@ -734,6 +761,10 @@ int mpd_search(char *buffer, char *searchstr)
|
|||||||
while((song = mpd_recv_song(mpd.conn)) != NULL) {
|
while((song = mpd_recv_song(mpd.conn)) != NULL) {
|
||||||
cur += json_emit_raw_str(cur, end - cur, "{\"type\":\"song\",\"uri\":");
|
cur += json_emit_raw_str(cur, end - cur, "{\"type\":\"song\",\"uri\":");
|
||||||
cur += json_emit_quoted_str(cur, end - cur, mpd_song_get_uri(song));
|
cur += json_emit_quoted_str(cur, end - cur, mpd_song_get_uri(song));
|
||||||
|
cur += json_emit_raw_str(cur, end - cur, ",\"album\":");
|
||||||
|
cur += json_emit_quoted_str(cur, end - cur, mpd_get_album(song));
|
||||||
|
cur += json_emit_raw_str(cur, end - cur, ",\"artist\":");
|
||||||
|
cur += json_emit_quoted_str(cur, end - cur, mpd_get_artist(song));
|
||||||
cur += json_emit_raw_str(cur, end - cur, ",\"duration\":");
|
cur += json_emit_raw_str(cur, end - cur, ",\"duration\":");
|
||||||
cur += json_emit_int(cur, end - cur, mpd_song_get_duration(song));
|
cur += json_emit_int(cur, end - cur, mpd_song_get_duration(song));
|
||||||
cur += json_emit_raw_str(cur, end - cur, ",\"title\":");
|
cur += json_emit_raw_str(cur, end - cur, ",\"title\":");
|
||||||
|
@ -84,8 +84,10 @@ enum mpd_conn_states {
|
|||||||
|
|
||||||
struct t_mpd {
|
struct t_mpd {
|
||||||
int port;
|
int port;
|
||||||
|
int local_port;
|
||||||
char host[128];
|
char host[128];
|
||||||
char *password;
|
char *password;
|
||||||
|
char *gpass;
|
||||||
|
|
||||||
struct mpd_connection *conn;
|
struct mpd_connection *conn;
|
||||||
enum mpd_conn_states conn_state;
|
enum mpd_conn_states conn_state;
|
||||||
|
30
src/ympd.c
30
src/ympd.c
@ -39,6 +39,9 @@ void bye()
|
|||||||
}
|
}
|
||||||
|
|
||||||
static int server_callback(struct mg_connection *c, enum mg_event ev) {
|
static int server_callback(struct mg_connection *c, enum mg_event ev) {
|
||||||
|
int result = MG_FALSE;
|
||||||
|
FILE *fp = NULL;
|
||||||
|
|
||||||
switch(ev) {
|
switch(ev) {
|
||||||
case MG_CLOSE:
|
case MG_CLOSE:
|
||||||
mpd_close_handler(c);
|
mpd_close_handler(c);
|
||||||
@ -57,7 +60,16 @@ static int server_callback(struct mg_connection *c, enum mg_event ev) {
|
|||||||
return callback_http(c);
|
return callback_http(c);
|
||||||
#endif
|
#endif
|
||||||
case MG_AUTH:
|
case MG_AUTH:
|
||||||
|
// no auth for websockets since mobile safari does not support it
|
||||||
|
if ( (mpd.gpass == NULL) || (c->is_websocket) || ((mpd.local_port > 0) && (c->local_port == mpd.local_port)) )
|
||||||
return MG_TRUE;
|
return MG_TRUE;
|
||||||
|
else {
|
||||||
|
if ( (fp = fopen(mpd.gpass, "r")) != NULL ) {
|
||||||
|
result = mg_authorize_digest(c, fp);
|
||||||
|
fclose(fp);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return result;
|
||||||
default:
|
default:
|
||||||
return MG_FALSE;
|
return MG_FALSE;
|
||||||
}
|
}
|
||||||
@ -77,12 +89,17 @@ int main(int argc, char **argv)
|
|||||||
mg_set_option(server, "document_root", SRC_PATH);
|
mg_set_option(server, "document_root", SRC_PATH);
|
||||||
#endif
|
#endif
|
||||||
|
|
||||||
|
mg_set_option(server, "auth_domain", "ympd");
|
||||||
mpd.port = 6600;
|
mpd.port = 6600;
|
||||||
|
mpd.local_port = 0;
|
||||||
|
mpd.gpass = NULL;
|
||||||
strcpy(mpd.host, "127.0.0.1");
|
strcpy(mpd.host, "127.0.0.1");
|
||||||
|
|
||||||
static struct option long_options[] = {
|
static struct option long_options[] = {
|
||||||
|
{"digest", required_argument, 0, 'D'},
|
||||||
{"host", required_argument, 0, 'h'},
|
{"host", required_argument, 0, 'h'},
|
||||||
{"port", required_argument, 0, 'p'},
|
{"port", required_argument, 0, 'p'},
|
||||||
|
{"localport", required_argument, 0, 'l'},
|
||||||
{"webport", required_argument, 0, 'w'},
|
{"webport", required_argument, 0, 'w'},
|
||||||
{"dirbletoken", required_argument, 0, 'd'},
|
{"dirbletoken", required_argument, 0, 'd'},
|
||||||
{"user", required_argument, 0, 'u'},
|
{"user", required_argument, 0, 'u'},
|
||||||
@ -92,15 +109,21 @@ int main(int argc, char **argv)
|
|||||||
{0, 0, 0, 0 }
|
{0, 0, 0, 0 }
|
||||||
};
|
};
|
||||||
|
|
||||||
while((n = getopt_long(argc, argv, "h:p:w:u:vm:",
|
while((n = getopt_long(argc, argv, "D:h:p:l:w:u:d:v:m",
|
||||||
long_options, &option_index)) != -1) {
|
long_options, &option_index)) != -1) {
|
||||||
switch (n) {
|
switch (n) {
|
||||||
|
case 'D':
|
||||||
|
mpd.gpass = strdup(optarg);
|
||||||
|
break;
|
||||||
case 'h':
|
case 'h':
|
||||||
strncpy(mpd.host, optarg, sizeof(mpd.host));
|
strncpy(mpd.host, optarg, sizeof(mpd.host));
|
||||||
break;
|
break;
|
||||||
case 'p':
|
case 'p':
|
||||||
mpd.port = atoi(optarg);
|
mpd.port = atoi(optarg);
|
||||||
break;
|
break;
|
||||||
|
case 'l':
|
||||||
|
mpd.local_port = atoi(optarg);
|
||||||
|
break;
|
||||||
case 'w':
|
case 'w':
|
||||||
webport = strdup(optarg);
|
webport = strdup(optarg);
|
||||||
break;
|
break;
|
||||||
@ -123,12 +146,15 @@ int main(int argc, char **argv)
|
|||||||
break;
|
break;
|
||||||
default:
|
default:
|
||||||
fprintf(stderr, "Usage: %s [OPTION]...\n\n"
|
fprintf(stderr, "Usage: %s [OPTION]...\n\n"
|
||||||
|
" -D, --digest <htdigest>\tpath to htdigest file for authorization\n"
|
||||||
|
" \t(realm ympd) [no authorization]\n"
|
||||||
" -h, --host <host>\t\tconnect to mpd at host [localhost]\n"
|
" -h, --host <host>\t\tconnect to mpd at host [localhost]\n"
|
||||||
" -p, --port <port>\t\tconnect to mpd at port [6600]\n"
|
" -p, --port <port>\t\tconnect to mpd at port [6600]\n"
|
||||||
|
" -l, --localport <port>\t\tskip authorization for local port\n"
|
||||||
" -w, --webport [ip:]<port>\tlisten interface/port for webserver [8080]\n"
|
" -w, --webport [ip:]<port>\tlisten interface/port for webserver [8080]\n"
|
||||||
" -u, --user <username>\t\tdrop priviliges to user after socket bind\n"
|
" -u, --user <username>\t\tdrop priviliges to user after socket bind\n"
|
||||||
" -d, --dirbletoken <apitoken>\tDirble API token\n"
|
" -d, --dirbletoken <apitoken>\tDirble API token\n"
|
||||||
" -V, --version\t\t\tget version\n"
|
" -v, --version\t\t\tget version\n"
|
||||||
" -m, --mpdpass <password>\tspecifies the password to use when connecting to mpd\n"
|
" -m, --mpdpass <password>\tspecifies the password to use when connecting to mpd\n"
|
||||||
" --help\t\t\t\tthis help\n"
|
" --help\t\t\t\tthis help\n"
|
||||||
, argv[0]);
|
, argv[0]);
|
||||||
|
Loading…
Reference in New Issue
Block a user