mirrors/ympd
1
0
Fork 0
mirror of https://github.com/SuperBFG7/ympd synced 2025-10-31 05:43:01 +00:00
Code Issues Releases Wiki Activity

Fix: improve keyboard navigation of main menu

Browse Source
This commit is contained in:
jcorporation
2018-11-07 23:52:28 +00:00
parent db8b0a1d24
commit a70ab4e48c
3 changed files with 31 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
dist/htdocs/js/bootstrap-native-v4.js vendored
View File

@@ -826,9 +826,17 @@
menuItems = (function(){
var set = menu[children], newSet = [];
for ( var i=0; i<set[length]; i++ ){
set[i][children][length] && (set[i][children][0].tagName === 'A' && newSet[push](set[i][children][0]));
//set[i][children][length] && (set[i][children][0].tagName === 'A' && newSet[push](set[i][children][0]));
//start patch: push all child elements, not only first
if (set[i][children][length]){
for ( var j=0; j<set[i][children][length]; j++ ){
set[i][children][j].tagName === 'A' && newSet[push](set[i][children][j]);
}
}
//end patch
set[i].tagName === 'A' && newSet[push](set[i]);
}
console.log(newSet);
return newSet;
})(),
@@ -874,9 +882,17 @@
isMenuItem = activeItem[parentNode] === menu || activeItem[parentNode][parentNode] === menu;
if ( isMenuItem || isSameElement ) { // navigate up | down
/* idx = isSameElement ? 0
: key === 38 ? (idx>1?idx-1:0)
: key === 40 ? (idx<menuItems[length]-1?idx+1:idx) : idx;
*/
//start patch: skip hidden elements
do {
idx = isSameElement ? 0
: key === 38 ? (idx>1?idx-1:0)
: key === 40 ? (idx<menuItems[length]-1?idx+1:idx) : idx;
} while ( !menuItems[idx].offsetHeight )
//end patch
menuItems[idx] && setFocus(menuItems[idx]);
}
if ( (menuItems[length] && isMenuItem // menu has items

4
htdocs/index.html
View File

@@ -19,10 +19,10 @@
<header>
<nav class="navbar navbar-expand navbar-dark fixed-top bg-dark">
<div class="dropdown col-auto mr-auto pl-0">
<a class="dropdown-toggle navbar-brand" data-toggle="dropdown" href="#" id="mainMenu">
<a class="dropdown-toggle navbar-brand" href="#" id="mainMenu">
<span class="material-icons header-logo">play_circle_outline</span>myMPD
</a>
<div class="dropdown-menu bg-dark">
<div class="dropdown-menu bg-dark" id="mainMenuDropdown">
<a class="dropdown-item text-light bg-dark" href="#" data-href='{"cmd": "showAddToPlaylist", "options": ["stream"]}'>Add Stream</a>
<a id="navDBupdate" class="dropdown-item text-light bg-dark" data-toggle="collapse" href="#menu-dbupdate"><span class="material-icons material-icons-left">keyboard_arrow_right</span>Update</a>
<div class="collapse" id="menu-dbupdate">

15
htdocs/js/mympd.js
View File

@@ -94,7 +94,7 @@ var modalUpdateDB = new Modal(document.getElementById('modalUpdateDB'));
var modalSaveSmartPlaylist = new Modal(document.getElementById('modalSaveSmartPlaylist'));
var modalDeletePlaylist = new Modal(document.getElementById('modalDeletePlaylist'));
var dropdownMainMenu = new Dropdown(document.getElementById('mainMenu'));
var dropdownMainMenu;// = new Dropdown(document.getElementById('mainMenu'));
var dropdownVolumeMenu = new Dropdown(document.getElementById('volumeMenu'));
var collapseDBupdate = new Collapse(document.getElementById('navDBupdate'));
@@ -329,7 +329,7 @@ function appInit() {
icon.innerText = 'keyboard_arrow_right';
}, false);
document.addEventListener('keyup', function(event) {
/* document.addEventListener('keyup', function(event) {
if (event.which != 13)
return;
if (event.target.nodeName == 'A') {
@@ -338,7 +338,7 @@ function appInit() {
event.target.click();
}
}, false);
*/
document.getElementById('volumeMenu').parentNode.addEventListener('show.bs.dropdown', function () {
sendAPI({"cmd": "MPD_API_PLAYER_OUTPUT_LIST"}, parseOutputs);
});
@@ -643,12 +643,14 @@ function appInit() {
cmd = keymap.key[event.which];
if (cmd && typeof window[cmd.cmd] === 'function') {
event.preventDefault();
event.stopPropagation();
if (cmd.cmd == 'sendAPI')
sendAPI(... cmd.options);
else
window[cmd.cmd](... cmd.options);
}
event.preventDefault();
}, false);
if ('serviceWorker' in navigator && document.URL.substring(0, 5) == 'https') {
@@ -1137,18 +1139,21 @@ function parseSettings(obj) {
app.apps.Browse.tabs.Database.views[settings.tags[i]] = { "state": "0/-/", "scrollPos": 0 };
if (settings.featSyscmds) {
var mainMenuDropdown = document.getElementById('mainMenuDropdown');
var syscmdsList = '';
var syscmdsListLen = settings.syscmds.length;
if (syscmdsListLen > 0) {
syscmdsList = '<div class="dropdown-divider"></div>';
for (var i = 0; i < syscmdsListLen; i++)
for (var i = 0; i < syscmdsListLen; i++) {
syscmdsList += '<a class="dropdown-item text-light bg-dark" href="#" data-href=\'{"cmd": "execSyscmd", "options": ["' +
settings.syscmds[i] + '"]}\'>' + settings.syscmds[i] + '</a>';
}
}
document.getElementById('syscmds').innerHTML = syscmdsList;
}
else
document.getElementById('syscmds').innerHTML = '';
dropdownMainMenu = new Dropdown(document.getElementById('mainMenu'));
setCols('Queue');
setCols('Search');