Filter implementation for music.mpd

This commit is contained in:
Fabio Manganiello 2018-02-09 20:54:02 +01:00
parent 0d2a1e5932
commit e8891f0c12
4 changed files with 74 additions and 7 deletions

View File

@ -23,6 +23,8 @@ class HttpBackend(Backend):
-d '{"type":"request","target":"nodename","action":"tts.say","args": {"phrase":"This is a test"}}' \
http://localhost:8008/execute """
websocket_ping_tries = 3
def __init__(self, port=8008, websocket_port=8009, disable_websocket=False,
token=None, **kwargs):
super().__init__(**kwargs)
@ -117,17 +119,29 @@ class HttpBackend(Backend):
async def register_websocket(websocket, path):
logging.info('New websocket connection from {}'.format(websocket.remote_address[0]))
websocket.remaining_ping_tries = self.websocket_ping_tries
self.active_websockets.add(websocket)
while True:
try:
waiter = await websocket.ping()
await asyncio.wait_for(waiter, timeout=5)
time.sleep(5)
await asyncio.wait_for(waiter, timeout=3)
time.sleep(3)
except (asyncio.TimeoutError, websockets.exceptions.ConnectionClosed) as e:
logging.info('Client {} closed connection'.format(websocket.remote_address[0]))
self.active_websockets.remove(websocket)
break
close = False
if isinstance(e, asyncio.TimeoutError):
websocket.remaining_ping_tries -= 1
if websocket.remaining_ping_tries <= 0:
close = True
else:
close = True
if close:
logging.info('Websocket client {} closed connection'
.format(websocket.remote_address[0]))
self.active_websockets.remove(websocket)
break
loop = asyncio.new_event_loop()
asyncio.set_event_loop(loop)

View File

@ -100,7 +100,7 @@ button[disabled] {
}
#playlist-content, #music-browser {
height: 32.2rem;
height: 27.2rem;
overflow-y: scroll;
}
@ -108,6 +108,20 @@ button[disabled] {
padding-top: 0;
}
#browser-filter {
width: 95%;
margin-bottom: 1.5rem;
}
#playlist-filter-container {
height: 5rem;
}
#playlist-filter {
width: 100%;
margin-bottom: 1.5rem;
}
.music-pane {
height: 40rem;
padding: 15px 15px 0 5px;

View File

@ -242,6 +242,7 @@ $(document).ready(function() {
var $element = $('<div></div>')
.addClass('playlist-track')
.addClass('row').addClass('music-item')
.data('name', (track.artist || '') + ' ' + (track.title || ''))
.data('track-id', parseInt(track.id))
.data('pos', parseInt(track.pos))
.data('file', track.file);
@ -396,12 +397,14 @@ $(document).ready(function() {
var updateBrowser = function(items) {
var $browserContent = $('#music-browser');
var $browserFilter = $('#browser-filter');
var $addButton = $('#browser-controls').find('button[data-action="add"]');
var directories = [];
var playlists = [];
var files = [];
$browserContent.find('.music-item').remove();
$browserFilter.text('');
for (var item of items) {
if ('directory' in item) {
@ -492,6 +495,9 @@ $(document).ready(function() {
window.registerEventListener(onEvent);
var $playbackControls = $('.playback-controls, #playlist-controls').find('button');
var $playlistContent = $('#playlist-content');
var $playlistFilter = $('#playlist-filter');
var $browserContent = $('#music-browser');
var $browserFilter = $('#browser-filter');
var $browserAddBtn = $('#browser-controls').find('button[data-action="add"]');
var $volumeCtrl = $('#volume-ctrl');
var $trackSeeker = $('#track-seeker');
@ -569,7 +575,6 @@ $(document).ready(function() {
});
$browserAddBtn.on('click touch', function(event) {
var $browserContent = $('#music-browser');
var $items = $browserContent.find('.music-item').slice(1, -1);
var $selectedItems = $browserContent.find('.music-item.selected');
@ -587,6 +592,30 @@ $(document).ready(function() {
);
}
});
$browserFilter.on('keyup', function(event) {
var filterText = $(this).val().trim().toLowerCase();
var $browserItems = $browserContent.find('.browser-item');
$browserItems.hide();
var matchedItems = $.grep($browserItems, function(item) {
return $(item).data('name').toLowerCase().indexOf(filterText) >= 0;
});
$(matchedItems).show();
});
$playlistFilter.on('keyup', function(event) {
var filterText = $(this).val().trim().toLowerCase();
var $playlistItems = $playlistContent.find('.playlist-track');
$playlistItems.hide();
var matchedItems = $.grep($playlistItems, function(item) {
return $(item).data('name').toLowerCase().indexOf(filterText) >= 0;
});
$(matchedItems).show();
});
};
var init = function() {

View File

@ -64,6 +64,11 @@
<i class="fa fa-plus"></i>
</button>
</div>
<div id="browser-filter-container">
<input type="text" id="browser-filter" placeholder="Filter">
</div>
<div id="music-browser" class="music-pane"></div>
</div>
</div>
@ -75,6 +80,11 @@
<i class="fa fa-eraser"></i>
</button>
</div>
<div id="playlist-filter-container">
<input type="text" id="playlist-filter" placeholder="Filter">
</div>
<div id="playlist-content"></div>
</div>
</div>