- Implemented support for shuffle, random and set volume on the UI
- Reduced the websocket ping poll frequency to 1 second
This commit is contained in:
Fabio Manganiello
parent
28bc4c748e
commit
968b71e946
5 changed files with 134 additions and 19 deletions
|
|
@ -123,7 +123,7 @@ class HttpBackend(Backend):
|
|||
try:
|
||||
waiter = await websocket.ping()
|
||||
await asyncio.wait_for(waiter, timeout=5)
|
||||
time.sleep(0.1)
|
||||
time.sleep(1)
|
||||
except (asyncio.TimeoutError, websockets.exceptions.ConnectionClosed) as e:
|
||||
logging.info('Client {} closed connection'.format(websocket.remote_address[0]))
|
||||
self.active_websockets.remove(websocket)
|
||||
|
|
|
|||
|
|
@ -95,3 +95,49 @@ main {
|
|||
color: #666;
|
||||
}
|
||||
|
||||
#track-seeker-container {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
#volume-ctrl-container {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.slider {
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
width: 100%;
|
||||
height: 15px;
|
||||
border-radius: 5px;
|
||||
background: #e4e4e4;
|
||||
outline: none;
|
||||
opacity: 0.7;
|
||||
-webkit-transition: .2s;
|
||||
transition: opacity .2s;
|
||||
}
|
||||
|
||||
.slider:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.slider::-webkit-slider-thumb {
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 50%;
|
||||
background: #4CAF50;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.slider[disabled]::-webkit-slider-thumb {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.slider::-moz-range-thumb {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
background: #4CAF50;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
$(document).ready(function() {
|
||||
var execute = function(request, onSuccess, onComplete) {
|
||||
var execute = function(request, onSuccess, onError, onComplete) {
|
||||
request['target'] = 'localhost';
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
|
|
@ -12,6 +12,11 @@ $(document).ready(function() {
|
|||
onComplete();
|
||||
}
|
||||
},
|
||||
error: function(xhr, status, error) {
|
||||
if (onError) {
|
||||
onError(xhr, status, error);
|
||||
}
|
||||
},
|
||||
success: function(response, status, xhr) {
|
||||
if (onSuccess) {
|
||||
onSuccess(response, status, xhr);
|
||||
|
|
@ -28,6 +33,7 @@ $(document).ready(function() {
|
|||
var updateControls = function(status, track) {
|
||||
var $playbackControls = $('.playback-controls');
|
||||
var $curTrack = $('.track-info');
|
||||
var $volumeCtrl = $('#volume-ctrl');
|
||||
|
||||
if (status) {
|
||||
switch (status.state.toLowerCase()) {
|
||||
|
|
@ -53,6 +59,11 @@ $(document).ready(function() {
|
|||
$curTrack.find('.no-track').hide();
|
||||
break;
|
||||
}
|
||||
|
||||
if ('volume' in status) {
|
||||
var volume = parseInt(status.volume);
|
||||
$volumeCtrl.val(volume);
|
||||
}
|
||||
}
|
||||
|
||||
if (track) {
|
||||
|
|
@ -183,6 +194,8 @@ $(document).ready(function() {
|
|||
var initBindings = function() {
|
||||
window.registerEventListener(onEvent);
|
||||
var $playbackControls = $('.playback-controls').find('button');
|
||||
var $volumeCtrl = $('#volume-ctrl');
|
||||
var prevVolume;
|
||||
|
||||
$playbackControls.on('click', function(evt) {
|
||||
var action = $(this).data('action');
|
||||
|
|
@ -196,11 +209,31 @@ $(document).ready(function() {
|
|||
},
|
||||
|
||||
onSuccess=undefined,
|
||||
onError=undefined,
|
||||
onComplete = function() {
|
||||
$btn.removeAttr('disabled');
|
||||
}
|
||||
);
|
||||
});
|
||||
|
||||
$volumeCtrl.on('mousedown', function(event) {
|
||||
prevVolume = $(this).val();
|
||||
});
|
||||
|
||||
$volumeCtrl.on('mouseup', function(event) {
|
||||
execute(
|
||||
{
|
||||
type: 'request',
|
||||
action: 'music.mpd.setvol',
|
||||
args: { vol: $(this).val() }
|
||||
},
|
||||
|
||||
onSuccess=undefined,
|
||||
onError = function() {
|
||||
$volumeCtrl.val(prevVolume);
|
||||
}
|
||||
);
|
||||
});
|
||||
};
|
||||
|
||||
var init = function() {
|
||||
|
|
|
|||
|
|
@ -6,12 +6,23 @@
|
|||
<span class="track"></span>
|
||||
</div>
|
||||
|
||||
<div class="row playback-controls">
|
||||
<div class="playback-controls">
|
||||
<div class="row">
|
||||
<div class="six columns offset-by-three slider-container" id="track-seeker-container">
|
||||
<input type="range" min="0" id="track-seeker" disabled="disabled" class="slider">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="eight columns offset-by-two">
|
||||
<button data-action="previous">
|
||||
<i class="fa fa-step-backward"></i>
|
||||
</button>
|
||||
|
||||
<button data-action="repeat">
|
||||
<i class="fa fa-repeat"></i>
|
||||
</button>
|
||||
|
||||
<button data-action="play">
|
||||
<i class="fa fa-play"></i>
|
||||
</button>
|
||||
|
|
@ -24,10 +35,23 @@
|
|||
<i class="fa fa-stop"></i>
|
||||
</button>
|
||||
|
||||
<button data-action="random">
|
||||
<i class="fa fa-random"></i>
|
||||
</button>
|
||||
|
||||
<button data-action="next">
|
||||
<i class="fa fa-step-forward"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="six columns offset-by-three slider-container" id="volume-ctrl-container">
|
||||
<i class="fa fa-volume-down"></i>
|
||||
<input type="range" min="0" max="100" id="volume-ctrl" class="slider" style="width:90%">
|
||||
<i class="fa fa-volume-up"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
|
|
|
|||
|
|
@ -64,6 +64,18 @@ class MusicMpdPlugin(MusicPlugin):
|
|||
self.setvol(str(new_volume))
|
||||
return self.status()
|
||||
|
||||
def random(self, value=None):
|
||||
if value is None:
|
||||
value = int(self.status().output['random'])
|
||||
value = 1 if value == 0 else 0
|
||||
self.client.random(value)
|
||||
|
||||
def repeat(self, value=None):
|
||||
if value is None:
|
||||
value = int(self.status().output['repeat'])
|
||||
value = 1 if value == 0 else 0
|
||||
self.client.repeat(value)
|
||||
|
||||
def add(self, resource):
|
||||
return self._exec('add', resource)
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue