2013-11-04 17:18:38 +00:00
<!DOCTYPE html>
< html lang = "en" >
< head >
2018-07-09 22:51:02 +00:00
< title > myMPD< / title >
2013-11-04 17:18:38 +00:00
< meta charset = "utf-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
2018-05-14 23:13:43 +00:00
< meta name = "description" content = "myMPD - fast and lightweight MPD webclient" >
< meta name = "author" content = "mail@jcgames.de" >
2018-07-09 22:51:02 +00:00
< meta name = "apple-mobile-web-app-capable" content = "yes" >
< meta name = "apple-mobile-web-app-status-bar-style" content = "black" >
< meta name = "theme-color" content = "#343a40" >
2018-08-21 22:02:22 +00:00
< link href = "/css/bootstrap.min.css" rel = "stylesheet" >
2018-09-20 22:04:35 +00:00
< link href = "/css/mympd.min.css" rel = "stylesheet" >
2018-08-21 22:02:22 +00:00
< link href = "/assets/favicon.ico" rel = "shortcut icon" type = "image/vnd.microsoft.icon" >
< link rel = "manifest" href = "/mympd.webmanifest" >
< link rel = "apple-touch-icon" href = "/assets/appicon-167.png" >
2013-11-05 13:59:12 +00:00
< / head >
< body >
2019-01-14 23:06:07 +00:00
< header class = "hide" >
2018-05-16 23:19:03 +00:00
< nav class = "navbar navbar-expand navbar-dark fixed-top bg-dark" >
2018-11-06 23:59:44 +00:00
< div class = "dropdown col-auto mr-auto pl-0" >
2018-11-07 23:52:28 +00:00
< a class = "dropdown-toggle navbar-brand" href = "#" id = "mainMenu" >
2018-05-23 22:32:01 +00:00
< span class = "material-icons header-logo" > play_circle_outline< / span > myMPD
< / a >
2018-11-07 23:52:28 +00:00
< div class = "dropdown-menu bg-dark" id = "mainMenuDropdown" >
2018-09-12 22:03:24 +00:00
< a class = "dropdown-item text-light bg-dark" href = "#" data-href = '{"cmd": "showAddToPlaylist", "options": ["stream"]}' > Add Stream< / a >
2018-09-24 20:55:53 +00:00
< 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 >
2018-09-23 21:48:12 +00:00
< div class = "collapse" id = "menu-dbupdate" >
2018-09-24 20:55:53 +00:00
< a class = "dropdown-item text-light bg-dark" href = "#" data-href = '{"cmd": "updateDB", "options": []}' > Update Database< / a >
< a class = "dropdown-item text-light bg-dark" href = "#" data-href = '{"cmd": "rescanDB", "options": []}' > Rescan Database< / a >
2018-10-25 20:03:33 +00:00
< a class = "dropdown-item text-light bg-dark featSmartpls" href = "#" data-href = '{"cmd": "updateSmartPlaylists", "options": []}' > Update Smart Playlists< / a >
2018-09-23 21:48:12 +00:00
< / div >
2018-10-29 18:17:04 +00:00
< a class = "dropdown-item text-light bg-dark featLocalplayer" href = "#" data-href = '{"cmd": "openLocalPlayer", "options": []}' > Local Player< / a >
2018-08-21 22:02:22 +00:00
< a class = "dropdown-item text-light bg-dark" href = "#" data-toggle = "modal" data-target = "#modalSettings" > Settings< / a >
< a class = "dropdown-item text-light bg-dark" href = "#" data-toggle = "modal" data-target = "#modalAbout" > About< / a >
2018-08-01 21:54:53 +00:00
< a id = "nav-add2homescreen" class = "dropdown-item text-light bg-dark hide" href = "#" > Add2HomeScreen< / a >
2018-10-29 19:41:04 +00:00
< div id = "syscmds" class = "featSyscmds" > < / div >
2018-05-16 23:19:03 +00:00
< / div >
< / div >
2018-08-22 12:06:22 +00:00
< div class = "btn-toolbar col-auto pl-0 pr-0" >
< div class = "btn-group mr-2" id = "playControlBtns" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "clickPrev", "options": []}' id = "btnPrev" type = "button" class = "btn btn-secondary pl-2 pr-2 material-icons" >
2018-06-28 22:51:24 +00:00
skip_previous
2013-11-05 13:59:12 +00:00
< / button >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "clickStop", "options": []}' id = "btnStop" type = "button" class = "btn btn-secondary pl-2 pr-2 material-icons" >
2018-06-28 22:51:24 +00:00
stop
2018-06-10 16:54:57 +00:00
< / button >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "clickPlay", "options": []}' id = "btnPlay" type = "button" class = "btnPlay btn btn-secondary pl-2 pr-2 material-icons" >
2018-06-28 22:51:24 +00:00
pause
2013-11-05 13:59:12 +00:00
< / button >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "clickNext", "options": []}' id = "btnNext" type = "button" class = "btn btn-secondary pl-2 pr-2 material-icons" >
2018-06-28 22:51:24 +00:00
skip_next
2013-11-04 17:18:38 +00:00
< / button >
< / div >
2018-11-06 23:59:44 +00:00
< div class = "btn-group dropdown" >
< button id = "volumeMenu" class = "btn btn-secondary dropdown-toggle pl-2 pr-2 material-icons" type = "button" data-toggle = "dropdown" >
2018-06-28 22:51:24 +00:00
volume_up
2018-05-21 23:36:05 +00:00
< / button >
< div class = "dropdown-menu dropdown-menu-right bg-dark" >
2018-06-07 16:33:32 +00:00
< h2 class = "dropdown-header text-light" > Volume: < span id = "volumePrct" > < / span > < / h2 >
2018-05-31 23:05:49 +00:00
< form class = "px-4 py-0 pb-3" id = "volumeControl" >
2018-08-22 12:06:22 +00:00
< div class = "btn-group" >
2018-09-24 21:45:35 +00:00
< button id = "btnChVolumeDown" data-href = '{"cmd": "chVolume", "options": [-5]}' class = "btn btn-secondary" > − < / button >
2018-05-28 18:48:43 +00:00
< div class = "btn btn-secondary" >
2018-06-28 22:51:24 +00:00
< input type = "range" min = "0" max = "100" step = "1" class = "form-control-range" id = "volumeBar" >
2018-05-28 18:48:43 +00:00
< / div >
2018-09-24 21:45:35 +00:00
< button id = "btnChVolumeUp" data-href = '{"cmd": "chVolume", "options": [5]}' class = "btn btn-secondary" > +< / button >
2018-05-21 23:36:05 +00:00
< / div >
< / form >
< div class = "dropdown-divider" > < / div >
2018-06-28 22:51:24 +00:00
< form id = "outputs" class = "px-4 py-3" > < / form >
2013-11-07 09:09:40 +00:00
< / div >
2013-11-05 13:59:12 +00:00
< / div >
2018-06-28 22:51:24 +00:00
< / div >
2018-05-16 23:19:03 +00:00
< / nav >
< / header >
2019-01-14 23:06:07 +00:00
< main class = "container hide" >
2018-05-27 20:21:18 +00:00
< noscript >
2018-08-22 12:06:22 +00:00
< div class = "alert alert-danger" > JavaScript is disabled!< / div >
2018-05-27 20:21:18 +00:00
< / noscript >
2018-08-21 22:02:22 +00:00
2018-05-22 23:07:34 +00:00
< div class = "card" id = "cardPlayback" >
2018-08-22 12:06:22 +00:00
< div class = "card-header" > Playback
2018-11-05 21:49:57 +00:00
< div class = "btn-group mr-0 featTags pull-right" >
< button id = "PlaybackColsBtn" class = "btn btn-sm btn-light dropdown-toggle material-icons material-icons-small" type = "button" data-toggle = "dropdown" > settings< / button >
< div class = "dropdown-menu dropdown-menu-right bg-dark px-2" id = "PlaybackColsDropdown" > < form > < / form >
2018-11-05 19:57:06 +00:00
< button data-href = '{"cmd": "saveColsPlayback", "options": ["Playback"]}' class = "btn btn-success btn-block btn-sm mt-2" > Apply< / button >
< / div >
< / div >
2018-10-25 20:03:33 +00:00
< div class = "btn-group btn-group-sm featStickers pull-right" >
2018-09-12 22:03:24 +00:00
< button title = "Dislike song" id = "btnVoteDown" data-href = '{"cmd": "voteSong", "options": [0]}' class = "btn btn-sm btn-light material-icons" > thumb_down< / button >
< button title = "Like song" id = "btnVoteUp" data-href = '{"cmd": "voteSong", "options": [2]}' class = "btn btn-sm btn-light material-icons" > thumb_up< / button >
2018-08-22 12:06:22 +00:00
< / div >
< / div >
2018-12-24 15:37:45 +00:00
< div class = "card-body cardBodyPlayback" >
2018-10-29 19:41:04 +00:00
< div class = "album-cover featCoverimage" id = "currentCover" > < / div >
2018-08-21 22:02:22 +00:00
< div class = "album-desc" >
2018-11-12 17:34:28 +00:00
< h2 id = "currentTitle" data-href = '{"cmd": "clickTitle", "options": []}' > < / h2 >
2018-11-04 23:26:59 +00:00
< div class = "featTags" id = "cardPlaybackTags" > < / div >
2018-08-17 09:53:03 +00:00
< / div >
2018-05-22 23:07:34 +00:00
< / div >
2018-11-14 23:35:39 +00:00
< div class = "card-footer cardFooterPlayback" >
2018-08-21 22:02:22 +00:00
< div class = "d-flex align-items-center" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "clickPlay", "options": []}' class = "mr-1 ml-1 btn btn-light material-icons btnPlay progressBarPlay" > pause< / button >
2018-11-22 23:44:55 +00:00
< input type = "range" min = "0" max = "1000" step = "1" class = "mr-1 ml-1 form-control-range flex-grow-1" id = "progressBar" >
2018-08-21 22:02:22 +00:00
< div class = "btn ml-1 mr-1" id = "counter" > < / div >
< / div >
< / div >
2018-05-22 23:07:34 +00:00
< / div >
< div class = "card hide" id = "cardQueue" >
2018-11-14 23:14:47 +00:00
< div class = "card-header" id = "cardHeaderQueue" >
< ul class = "nav nav-tabs card-header-tabs" >
< li class = "nav-item" >
< a data-href = '{"cmd": "appGoto", "options": ["Queue", "Current"]}' class = "nav-link text-dark" href = "#" id = "cardQueueNavCurrent" > Queue< / a >
< / li >
< li class = "nav-item" >
< a data-href = '{"cmd": "appGoto", "options": ["Queue", "LastPlayed"]}' class = "nav-link text-dark" href = "#" id = "cardQueueNavLastPlayed" > Last Played< / a >
< / li >
< / ul >
2018-05-16 23:19:03 +00:00
< / div >
2018-11-14 23:14:47 +00:00
< div class = "card-body hide" id = "cardQueueCurrent" >
< div class = "btn-toolbar card-toolbar" id = "QueueCurrentButtonsTop" >
2018-10-25 20:03:33 +00:00
< div class = "btn-group mr-2 featPlaylists" >
2018-08-21 22:02:22 +00:00
< button type = "button" class = "btn btn-secondary material-icons" data-toggle = "modal" data-target = "#modalSaveQueue" title = "Save queue" >
save
2018-05-24 19:36:40 +00:00
< / button >
2018-05-07 21:25:17 +00:00
< / div >
2018-08-05 22:02:29 +00:00
< div class = "btn-group mr-2" >
2018-10-22 20:03:45 +00:00
< button type = "button" class = "btn btn-secondary material-icons" data-href = '{"cmd": "sendAPI", "options": [{"cmd": "MPD_API_QUEUE_SHUFFLE"}]}' title = "Shuffle queue" >
2018-08-21 22:02:22 +00:00
shuffle
2018-08-05 22:02:29 +00:00
< / button >
< / div >
< div class = "input-group mr-2" >
< div class = "input-group-prepend" >
2018-09-12 22:03:24 +00:00
< button type = "button" class = "btn btn-secondary material-icons" data-href = '{"cmd": "sendAPI", "options": [{"cmd": "MPD_API_QUEUE_CLEAR"}]}' title = "Clear queue" > clear_all< / button >
2018-08-05 22:02:29 +00:00
< button id = "clearQueueBtn" class = "btn btn-secondary dropdown-toggle dropdown-toggle-split rounded-right" type = "button" data-toggle = "dropdown" > < / button >
2018-11-27 19:45:35 +00:00
< div class = "dropdown-menu bg-dark px-2" id = "clearQueueDropdown" >
2018-09-12 22:03:24 +00:00
< button type = "button" class = "btn btn-secondary btn-sm btn-block" data-href = '{"cmd": "sendAPI", "options": [{"cmd": "MPD_API_QUEUE_CLEAR"}]}' > Clear queue< / button >
< button type = "button" class = "btn btn-secondary btn-sm btn-block" data-href = '{"cmd": "sendAPI", "options": [{"cmd": "MPD_API_QUEUE_CROP"}]}' > Crop queue< / button >
2018-08-05 22:02:29 +00:00
< / div >
< / div >
< / div >
2018-11-27 13:05:51 +00:00
< form id = "searchqueue" class = "flex-grow-1" >
2018-05-27 12:37:50 +00:00
< div class = "input-group mr-2" >
2018-11-27 19:45:35 +00:00
< div class = "input-group-prepend" >
2018-11-28 14:41:13 +00:00
< button title = "Select tag to search" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" >
2018-05-31 23:05:49 +00:00
< span class = "material-icons" > search< / span >
2018-10-29 18:17:04 +00:00
< span id = "searchqueuetagsdesc" > Any Tag< / span >
2018-05-31 23:05:49 +00:00
< / button >
2018-11-27 19:45:35 +00:00
< div class = "dropdown-menu bg-dark px-2" id = "searchqueuetags" >
2018-05-27 12:37:50 +00:00
< / div >
< / div >
2018-11-27 19:45:35 +00:00
< input type = "text" class = "form-control" placeholder = "Search Queue" id = "searchqueuestr" / >
2018-05-27 12:37:50 +00:00
< / div >
2018-05-24 22:21:19 +00:00
< / form >
2018-11-14 23:14:47 +00:00
< div id = "QueueCurrentPaginationTop" class = "btn-group mr-2 hide" >
< button data-href = '{"cmd": "gotoPage", "options": ["prev"]}' id = "QueueCurrentPaginationTopPrev" title = "Previous Page" type = "button" class = "btn btn-secondary" > « < / button >
2018-05-27 20:21:18 +00:00
< div class = "input-group-append" >
2018-11-14 23:14:47 +00:00
< button id = "QueueCurrentPaginationTopPage" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > 1 / 1< / button >
< div class = "dropdown-menu bg-dark px-2 pages" id = "QueueCurrentPaginationTopPages" >
2018-05-27 20:21:18 +00:00
< / div >
< / div >
2018-11-14 23:14:47 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["next"]}' id = "QueueCurrentPaginationTopNext" title = "Next Page" type = "button" class = "btn btn-secondary input-group-append" > » < / button >
2018-05-27 20:21:18 +00:00
< / div >
2018-11-27 13:05:51 +00:00
< div class = "btn-group featTags" >
2018-11-14 23:14:47 +00:00
< button id = "QueueCurrentColsBtn" class = "btn btn-secondary dropdown-toggle material-icons" type = "button" data-toggle = "dropdown" > settings< / button >
2018-11-27 13:05:51 +00:00
< div class = "dropdown-menu bg-dark px-2 dropdown-menu-right" id = "QueueCurrentColsDropdown" > < form > < / form >
2018-11-14 23:14:47 +00:00
< button data-href = '{"cmd": "saveCols", "options": ["QueueCurrent"]}' class = "btn btn-success btn-block btn-sm mt-2" > Apply< / button >
2018-10-22 20:03:45 +00:00
< / div >
< / div >
2018-05-16 23:19:03 +00:00
< / div >
2018-05-24 22:21:19 +00:00
2018-05-27 15:30:36 +00:00
< div class = "table-responsive-md" >
2018-11-14 23:14:47 +00:00
< table id = "QueueCurrentList" class = "table table-hover table-sm" data-version = "" >
2018-05-27 15:30:36 +00:00
< thead >
< tr >
< th > #< / th >
< th > Title< / th >
< th > Artist< / th >
< th > Album< / th >
< th > Duration< / th >
< th > < / th >
< / tr >
< / thead >
2018-07-09 17:28:28 +00:00
< tbody class = "clickable" >
2018-05-27 15:30:36 +00:00
< / tbody >
< / table >
< / div >
2018-11-14 23:14:47 +00:00
< div class = "btn-toolbar hide" id = "QueueCurrentButtonsBottom" >
2018-05-27 20:21:18 +00:00
< div class = "btn-group mr-2" >
2018-09-12 22:03:24 +00:00
< button type = "button" class = "btn btn-secondary material-icons" data-href = '{"cmd": "scrollTo", "options: [0]}' title = "To top" >
2018-08-21 22:02:22 +00:00
keyboard_arrow_up
2018-05-27 20:21:18 +00:00
< / button >
< / div >
2018-11-14 23:14:47 +00:00
< div id = "QueueCurrentPaginationBottom" class = "btn-group mr-2 dropup" >
< button data-href = '{"cmd": "gotoPage", "options": ["prev"]}' id = "QueueCurrentPaginationBottomPrev" title = "Previous Page" type = "button" class = "btn btn-secondary" > « < / button >
2018-05-27 20:21:18 +00:00
< div class = "input-group-append" >
2018-11-14 23:14:47 +00:00
< button id = "QueueCurrentPaginationBottomPage" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > 1 / 1< / button >
< div class = "dropdown-menu bg-dark px-2 pages" id = "QueueCurrentPaginationBottomPages" >
2018-05-27 20:21:18 +00:00
< / div >
< / div >
2018-11-14 23:14:47 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["next"]}' id = "QueueCurrentPaginationBottomNext" title = "Next Page" type = "button" class = "btn btn-secondary input-group-append" > » < / button >
2018-05-27 20:21:18 +00:00
< / div >
< / div >
2018-05-22 23:07:34 +00:00
< / div >
2018-11-14 23:14:47 +00:00
< div class = "card-body hide" id = "cardQueueLastPlayed" >
2018-11-12 23:48:29 +00:00
< div class = "btn-toolbar card-toolbar" >
2018-11-14 23:14:47 +00:00
< div id = "QueueLastPlayedPaginationTop" class = "btn-group mr-2 hide" >
< button data-href = '{"cmd": "gotoPage", "options": ["prev"]}' id = "QueueLastPlayedPaginationTopPrev" title = "Previous Page" type = "button" class = "btn btn-secondary" > « < / button >
2018-11-12 23:48:29 +00:00
< div class = "input-group-append" >
2018-11-14 23:14:47 +00:00
< button id = "QueueLastPlayedPaginationTopPage" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > 1 / 1< / button >
< div class = "dropdown-menu bg-dark px-2 pages" id = "QueueLastPlayedPaginationTopPages" >
2018-11-12 23:48:29 +00:00
< / div >
< / div >
2018-11-14 23:14:47 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["next"]}' id = "QueueLastPlayedPaginationTopNext" title = "Next Page" type = "button" class = "btn btn-secondary input-group-append" > » < / button >
2018-11-12 23:48:29 +00:00
< / div >
< div class = "btn-group mr-2 featTags" >
2018-11-14 23:14:47 +00:00
< button id = "QueueLastPlayedColsBtn" class = "btn btn-secondary dropdown-toggle material-icons" type = "button" data-toggle = "dropdown" > settings< / button >
< div class = "dropdown-menu bg-dark px-2" id = "QueueLastPlayedColsDropdown" > < form > < / form >
< button data-href = '{"cmd": "saveCols", "options": ["QueueLastPlayed"]}' class = "btn btn-success btn-block btn-sm mt-2" > Apply< / button >
2018-11-12 23:48:29 +00:00
< / div >
< / div >
< / div >
< div class = "table-responsive-md" >
2018-11-14 23:14:47 +00:00
< table id = "QueueLastPlayedList" class = "table table-hover table-sm" >
2018-11-12 23:48:29 +00:00
< thead >
< tr >
< th > #< / th >
< th > Title< / th >
< th > Artist< / th >
< th > Album< / th >
< th > Duration< / th >
< th > < / th >
< / tr >
< / thead >
< tbody class = "clickable" >
< / tbody >
< / table >
< / div >
2018-11-14 23:14:47 +00:00
< div class = "btn-toolbar hide" id = "QueueLastPlayedButtonsBottom" >
2018-11-12 23:48:29 +00:00
< div class = "btn-group mr-2" >
< button type = "button" class = "btn btn-secondary material-icons" data-href = '{"cmd": "scrollTo", "options: [0]}' title = "To top" >
keyboard_arrow_up
< / button >
< / div >
2018-11-14 23:14:47 +00:00
< div id = "QueueLastPlayedPaginationBottom" class = "btn-group mr-2 dropup" >
< button data-href = '{"cmd": "gotoPage", "options": ["prev"]}' id = "QueueLastPlayedPaginationBottomPrev" title = "Previous Page" type = "button" class = "btn btn-secondary" > « < / button >
2018-11-12 23:48:29 +00:00
< div class = "input-group-append" >
2018-11-14 23:14:47 +00:00
< button id = "QueueLastPlayedPaginationBottomPage" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > 1 / 1< / button >
< div class = "dropdown-menu bg-dark px-2 pages" id = "QueueLastPlayedPaginationBottomPages" >
2018-11-12 23:48:29 +00:00
< / div >
< / div >
2018-11-14 23:14:47 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["next"]}' id = "QueueLastPlayedPaginationBottomNext" title = "Next Page" type = "button" class = "btn btn-secondary input-group-append" > » < / button >
2018-11-12 23:48:29 +00:00
< / div >
< / div >
< / div >
2018-11-14 23:35:39 +00:00
< div class = "card-footer" id = "cardFooterQueue" >
< / div >
2018-11-12 23:48:29 +00:00
< / div >
2018-05-22 23:07:34 +00:00
< div class = "card hide" id = "cardBrowse" >
2018-11-14 23:14:47 +00:00
< div class = "card-header" id = "cardHeaderBrowse" >
2018-05-28 22:05:56 +00:00
< ul class = "nav nav-tabs card-header-tabs" >
2018-10-25 20:03:33 +00:00
< li class = "nav-item featTags" >
2018-09-12 22:03:24 +00:00
< a data-href = '{"cmd": "appGoto", "options": ["Browse", "Database"]}' class = "nav-link text-dark" href = "#" id = "cardBrowseNavDatabase" > Database< / a >
2018-06-07 22:35:41 +00:00
< / li >
2018-10-25 20:03:33 +00:00
< li class = "nav-item featPlaylists" >
2018-09-12 22:03:24 +00:00
< a data-href = '{"cmd": "appGoto", "options": ["Browse", "Playlists"]}' class = "nav-link text-dark" href = "#" id = "cardBrowseNavPlaylists" > Playlists< / a >
2018-05-28 22:05:56 +00:00
< / li >
< li class = "nav-item" >
2018-09-12 22:03:24 +00:00
< a data-href = '{"cmd": "appGoto", "options": ["Browse", "Filesystem"]}' class = "nav-link text-dark" href = "#" id = "cardBrowseNavFilesystem" > Filesystem< / a >
2018-05-28 22:05:56 +00:00
< / li >
< / ul >
< / div >
2018-06-03 08:52:38 +00:00
2018-05-28 22:05:56 +00:00
< div class = "card-body hide" id = "cardBrowsePlaylists" >
2018-08-22 12:06:22 +00:00
< div class = "btn-toolbar card-toolbar" id = "BrowsePlaylistsButtons" >
2018-07-22 19:00:26 +00:00
< div class = "btn-group mr-2 hide" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "appGoto", "options": ["Browse", "Playlists", "All"]}' id = "btnBrowsePlaylistsAll" type = "button" class = "btn btn-secondary" > « Playlists< / button >
2018-07-22 19:00:26 +00:00
< / div >
< div class = "btn-group mr-2 hide" >
2018-09-12 22:03:24 +00:00
< button id = "btnPlaylistClear" type = "button" class = "btn btn-secondary material-icons" data-href = '{"cmd": "playlistClear", "options": []}' title = "Clear playlist" >
2018-08-21 22:02:22 +00:00
clear_all
2018-07-22 19:00:26 +00:00
< / button >
< / div >
2018-06-04 18:31:05 +00:00
< div class = "btn-group mr-2" >
2018-06-10 21:15:33 +00:00
< button id = "BrowsePlaylistsFilter" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > Filter< / button >
2018-07-09 18:44:42 +00:00
< div class = "dropdown-menu bg-dark px-2 letters" id = "BrowsePlaylistsFilterLetters" >
2018-06-04 18:31:05 +00:00
< / div >
< / div >
2018-07-31 20:46:53 +00:00
< div id = "BrowsePlaylistsPaginationTop" class = "btn-group mr-2 hide" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["prev"]}' id = "BrowsePlaylistsPaginationTopPrev" title = "Previous Page" type = "button" class = "btn btn-secondary" > « < / button >
2018-05-28 22:05:56 +00:00
< div class = "input-group-append" >
2018-07-02 19:40:27 +00:00
< button id = "BrowsePlaylistsPaginationTopPage" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > 1 / 1< / button >
2018-06-28 22:51:24 +00:00
< div class = "dropdown-menu bg-dark px-2 pages" id = "BrowsePlaylistsPaginationTopPages" >
2018-05-28 22:05:56 +00:00
< / div >
< / div >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["next"]}' id = "BrowsePlaylistsPaginationTopNext" title = "Next Page" type = "button" class = "btn btn-secondary input-group-append" > » < / button >
2018-05-28 22:05:56 +00:00
< / div >
2018-10-25 21:49:02 +00:00
< div class = "btn-group mr-2 hide featTags" >
2018-10-22 22:20:57 +00:00
< button id = "BrowsePlaylistsDetailColsBtn" class = "btn btn-secondary dropdown-toggle material-icons" type = "button" data-toggle = "dropdown" > settings< / button >
< div class = "dropdown-menu bg-dark px-2" id = "BrowsePlaylistsDetailColsDropdown" > < form > < / form >
< button data-href = '{"cmd": "saveCols", "options": ["BrowsePlaylistsDetail"]}' class = "btn btn-success btn-block btn-sm mt-2" > Apply< / button >
< / div >
< / div >
2018-05-28 22:05:56 +00:00
< / div >
< div class = "table-responsive-md" >
2018-07-22 19:00:26 +00:00
< table id = "BrowsePlaylistsAllList" class = "table table-hover table-sm" >
2018-05-28 22:05:56 +00:00
< thead >
< tr >
< th > < / th >
< th > Playlist< / th >
< th > Last modified< / th >
< th > < / th >
< / tr >
< / thead >
2018-07-09 17:28:28 +00:00
< tbody class = "clickable" >
2018-05-28 22:05:56 +00:00
< / tbody >
< / table >
2018-07-22 19:00:26 +00:00
< table id = "BrowsePlaylistsDetailList" class = "table table-hover table-sm hide" >
< caption > Playlist List< / caption >
< thead >
< tr >
< th > #< / th >
< th > Title< / th >
< th > Artist< / th >
< th > Album< / th >
< th > Duration< / th >
< th > < / th >
< / tr >
< / thead >
< tbody class = "clickable" >
< / tbody >
< / table >
2018-05-28 22:05:56 +00:00
< / div >
2018-08-22 12:06:22 +00:00
< div class = "btn-toolbar hide" id = "BrowsePlaylistsButtonsBottom" >
2018-05-28 22:05:56 +00:00
< div class = "btn-group mr-2" >
2018-09-12 22:03:24 +00:00
< button type = "button" class = "btn btn-secondary material-icons" data-href = '{"cmd": "scrollTo", "options": [0]}' title = "To top" >
2018-08-21 22:02:22 +00:00
keyboard_arrow_up
2018-05-28 22:05:56 +00:00
< / button >
< / div >
2018-06-10 21:15:33 +00:00
< div id = "BrowsePlaylistsPaginationBottom" class = "btn-group mr-2 dropup" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["prev"]}' id = "BrowsePlaylistsPaginationBottomPrev" title = "Previous Page" type = "button" class = "btn btn-secondary" > « < / button >
2018-05-28 22:05:56 +00:00
< div class = "input-group-append" >
2018-07-02 19:40:27 +00:00
< button id = "BrowsePlaylistsPaginationBottomPage" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > 1 / 1< / button >
2018-06-28 22:51:24 +00:00
< div class = "dropdown-menu bg-dark px-2 pages" id = "BrowsePlaylistsPaginationBottomPages" >
2018-05-28 22:05:56 +00:00
< / div >
< / div >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["next"]}' id = "BrowsePlaylistsPaginationBottomNext" title = "Next Page" type = "button" class = "btn btn-secondary input-group-append" > » < / button >
2018-05-28 22:05:56 +00:00
< / div >
< / div >
< / div >
2018-05-31 23:05:49 +00:00
2018-05-28 22:05:56 +00:00
< div class = "card-body hide" id = "cardBrowseDatabase" >
2018-08-22 12:06:22 +00:00
< div class = "btn-toolbar card-toolbar" id = "BrowseDatabaseButtons" >
2018-09-10 20:32:15 +00:00
< div class = "btn-group mr-2" >
< button id = "btnBrowseDatabaseByTag" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > AlbumArtist< / button >
< div class = "dropdown-menu bg-dark px-2" id = "BrowseDatabaseByTagDropdown" >
< / div >
< / div >
2018-07-22 19:00:26 +00:00
< div class = "btn-group mr-2 hide" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoTagList", "options": []}' id = "btnBrowseDatabaseTag" type = "button" class = "btn btn-secondary" > « Artists< / button >
2018-06-04 18:31:05 +00:00
< / div >
< div class = "btn-group mr-2" >
2018-06-10 21:15:33 +00:00
< button id = "BrowseDatabaseFilter" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > Filter< / button >
2018-07-09 18:44:42 +00:00
< div class = "dropdown-menu bg-dark px-2 letters" id = "BrowseDatabaseFilterLetters" >
2018-06-04 18:31:05 +00:00
< / div >
2018-06-03 16:36:06 +00:00
< / div >
2018-09-10 20:51:53 +00:00
< div class = "input-group mr-2 hide" >
< div class = "input-group-prepend" >
2018-11-27 15:37:17 +00:00
< button data-href = '{"cmd": "addAllFromBrowseDatabase", "options": []}' id = "BrowseDatabaseAddAllSongs" class = "btn btn-secondary material-icons" > library_add< / button >
2018-09-10 20:51:53 +00:00
< button id = "BrowseDatabaseAddAllSongsBtn" class = "btn btn-secondary dropdown-toggle dropdown-toggle-split rounded-right" type = "button" data-toggle = "dropdown" > < / button >
2018-11-28 16:54:46 +00:00
< div class = "dropdown-menu bg-dark px-2" id = "BrowseDatabaseAddAllSongsDropdown" >
2018-09-10 20:51:53 +00:00
< button type = "button" class = "btn btn-secondary btn-sm btn-block" > Add all to queue< / button >
2018-10-25 20:03:33 +00:00
< button type = "button" class = "btn btn-secondary btn-sm btn-block featPlaylists" > Add all to playlist< / button >
2018-09-10 20:51:53 +00:00
< / div >
< / div >
< / div >
2018-11-04 18:34:46 +00:00
< div class = "btn-group mr-2 featTags hide" >
< button id = "BrowseDatabaseColsBtn" class = "btn btn-secondary dropdown-toggle material-icons" type = "button" data-toggle = "dropdown" > settings< / button >
< div class = "dropdown-menu bg-dark px-2" id = "BrowseDatabaseColsDropdown" > < form > < / form >
< button data-href = '{"cmd": "saveCols", "options": ["BrowseDatabase", ".tblAlbumTitles"]}' class = "btn btn-success btn-block btn-sm mt-2" > Apply< / button >
< / div >
< / div >
2018-09-10 20:51:53 +00:00
2018-07-31 20:46:53 +00:00
< div id = "BrowseDatabasePaginationTop" class = "btn-group mr-2 hide" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["prev"]}' id = "BrowseDatabasePaginationTopPrev" title = "Previous Page" type = "button" class = "btn btn-secondary" > « < / button >
2018-06-03 16:36:06 +00:00
< div class = "input-group-append" >
2018-07-02 19:40:27 +00:00
< button id = "BrowseDatabasePaginationTopPage" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > 1 / 1< / button >
2018-06-28 22:51:24 +00:00
< div class = "dropdown-menu bg-dark px-2 pages" id = "BrowseDatabasePaginationTopPages" >
2018-06-03 16:36:06 +00:00
< / div >
< / div >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["next"]}' id = "BrowseDatabasePaginationTopNext" title = "Next Page" type = "button" class = "btn btn-secondary input-group-append" > » < / button >
2018-06-03 16:36:06 +00:00
< / div >
< / div >
< div class = "table-responsive-md" >
2018-09-10 20:32:15 +00:00
< table id = "BrowseDatabaseTagList" class = "table table-hover table-sm" >
2018-06-03 16:36:06 +00:00
< thead >
< tr >
< th > < / th >
2018-10-15 16:15:09 +00:00
< th id = "BrowseDatabaseTagListCaption" > < / th >
2018-06-03 16:36:06 +00:00
< / tr >
< / thead >
2018-07-09 17:28:28 +00:00
< tbody class = "clickable" >
2018-06-03 16:36:06 +00:00
< / tbody >
< / table >
< / div >
2018-09-11 18:59:22 +00:00
< div id = "BrowseDatabaseAlbumList" class = "row hide" >
2018-10-15 16:15:09 +00:00
< div id = "BrowseDatabaseAlbumListCaption" > < / div >
2018-09-11 18:59:22 +00:00
< / div >
2018-06-03 16:36:06 +00:00
2018-08-22 12:06:22 +00:00
< div class = "btn-toolbar hide" id = "BrowseDatabaseButtonsBottom" >
2018-06-03 16:36:06 +00:00
< div class = "btn-group mr-2" >
2018-09-12 22:03:24 +00:00
< button type = "button" class = "btn btn-secondary material-icons" data-href = '{"cmd": "scrollTo", "options": [0]}' title = "To top" >
2018-08-21 22:02:22 +00:00
keyboard_arrow_up
2018-06-03 16:36:06 +00:00
< / button >
< / div >
2018-06-10 21:15:33 +00:00
< div id = "BrowseDatabasePaginationBottom" class = "btn-group mr-2 dropup" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["prev"]}' id = "BrowseDatabasePaginationBottomPrev" title = "Previous Page" type = "button" class = "btn btn-secondary" > « < / button >
2018-06-03 16:36:06 +00:00
< div class = "input-group-append" >
2018-07-02 19:40:27 +00:00
< button id = "BrowseDatabasePaginationBottomPage" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > 1 / 1< / button >
2018-06-28 22:51:24 +00:00
< div class = "dropdown-menu bg-dark px-2 pages" id = "BrowseDatabasePaginationBottomPages" >
2018-06-03 16:36:06 +00:00
< / div >
< / div >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["next"]}' id = "BrowseDatabasePaginationBottomNext" title = "Next Page" type = "button" class = "btn btn-secondary input-group-append" > » < / button >
2018-06-03 16:36:06 +00:00
< / div >
2018-05-31 23:05:49 +00:00
< / div >
2018-06-03 16:36:06 +00:00
2018-05-28 22:05:56 +00:00
< / div >
2018-05-31 23:05:49 +00:00
2018-05-28 22:05:56 +00:00
< div class = "card-body hide" id = "cardBrowseFilesystem" >
2018-08-22 12:06:22 +00:00
< div class = "btn-toolbar card-toolbar" id = "BrowseFilesystemButtons" >
2018-05-29 20:12:11 +00:00
< div class = "btn-group mr-2" >
2018-06-10 21:15:33 +00:00
< button id = "BrowseFilesystemFilter" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > Filter< / button >
2018-07-09 18:44:42 +00:00
< div class = "dropdown-menu bg-dark px-2 letters" id = "BrowseFilesystemFilterLetters" >
2018-05-29 20:12:11 +00:00
< / div >
2018-07-31 20:46:53 +00:00
< / div >
< div class = "input-group mr-2" >
< div class = "input-group-prepend" >
2018-11-27 15:37:17 +00:00
< button data-href = '{"cmd": "addAllFromBrowseFilesystem", "options": []}' id = "BrowseFilesystemAddAllSongs" class = "btn btn-secondary material-icons" > library_add< / button >
2018-07-31 20:46:53 +00:00
< button id = "BrowseFilesystemAddAllSongsBtn" class = "btn btn-secondary dropdown-toggle dropdown-toggle-split rounded-right" type = "button" data-toggle = "dropdown" > < / button >
2018-11-27 19:45:35 +00:00
< div class = "dropdown-menu bg-dark px-2" id = "BrowseFilesystemAddAllSongsDropdown" >
2018-09-10 20:32:15 +00:00
< button type = "button" class = "btn btn-secondary btn-sm btn-block" > Add all to queue< / button >
2018-10-25 20:03:33 +00:00
< button type = "button" class = "btn btn-secondary btn-sm btn-block featPlaylists" > Add all to playlist< / button >
2018-07-31 20:46:53 +00:00
< / div >
< / div >
2018-05-29 20:12:11 +00:00
< / div >
2018-07-31 20:46:53 +00:00
< div id = "BrowseFilesystemPaginationTop" class = "btn-group mr-2 hide" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["prev"]}' id = "BrowseFilesystemPaginationTopPrev" title = "Previous Page" type = "button" class = "btn btn-secondary" > « < / button >
2018-05-29 20:12:11 +00:00
< div class = "input-group-append" >
2018-07-02 19:40:27 +00:00
< button id = "BrowseFilesystemPaginationTopPage" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > 1 / 1< / button >
2018-06-28 22:51:24 +00:00
< div class = "dropdown-menu bg-dark px-2 pages" id = "BrowseFilesystemPaginationTopPages" >
2018-05-29 20:12:11 +00:00
< / div >
< / div >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["next"]}' id = "BrowseFilesystemPaginationTopNext" title = "Next Page" type = "button" class = "btn btn-secondary input-group-append" > » < / button >
2018-05-29 20:12:11 +00:00
< / div >
2018-10-25 21:49:02 +00:00
< div class = "btn-group mr-2 featTags" >
2018-10-22 22:20:57 +00:00
< button id = "BrowseFilesystemColsBtn" class = "btn btn-secondary dropdown-toggle material-icons" type = "button" data-toggle = "dropdown" > settings< / button >
< div class = "dropdown-menu bg-dark px-2" id = "BrowseFilesystemColsDropdown" > < form > < / form >
< button data-href = '{"cmd": "saveCols", "options": ["BrowseFilesystem"]}' class = "btn btn-success btn-block btn-sm mt-2" > Apply< / button >
< / div >
< / div >
2018-05-16 23:19:03 +00:00
< / div >
2015-08-17 21:01:47 +00:00
2018-06-10 21:15:33 +00:00
< ol id = "BrowseBreadcrumb" class = "breadcrumb" >
< / ol >
2018-05-27 15:30:36 +00:00
< div class = "table-responsive-md" >
2018-06-10 21:15:33 +00:00
< table id = "BrowseFilesystemList" class = "table table-hover table-sm" >
2018-05-27 15:30:36 +00:00
< thead >
< tr >
< th > < / th >
< th > Title< / th >
< th > Artist< / th >
< th > Album< / th >
< th > Duration< / th >
< th > < / th >
< / tr >
< / thead >
2018-07-09 17:28:28 +00:00
< tbody class = "clickable" >
2018-05-27 15:30:36 +00:00
< / tbody >
< / table >
< / div >
2018-08-22 12:06:22 +00:00
< div class = "btn-toolbar hide" id = "BrowseFilesystemButtonsBottom" >
2018-05-29 20:12:11 +00:00
< div class = "btn-group mr-2" >
2018-09-12 22:03:24 +00:00
< button type = "button" class = "btn btn-secondary material-icons" data-href = '{"cmd": "scrollTo", "options": [0]}' title = "To top" >
2018-08-21 22:02:22 +00:00
keyboard_arrow_up
2018-05-29 20:12:11 +00:00
< / button >
< / div >
2018-06-10 21:15:33 +00:00
< div id = "BrowseFilesystemPaginationBottom" class = "btn-group mr-2 dropup" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["prev"]}' id = "BrowseFilesystemPaginationBottomPrev" title = "Previous Page" type = "button" class = "btn btn-secondary" > « < / button >
2018-05-29 20:12:11 +00:00
< div class = "input-group-append" >
2018-07-02 19:40:27 +00:00
< button id = "BrowseFilesystemPaginationBottomPage" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > 1 / 1< / button >
2018-06-28 22:51:24 +00:00
< div class = "dropdown-menu bg-dark px-2 pages" id = "BrowseFilesystemPaginationBottomPages" >
2018-05-29 20:12:11 +00:00
< / div >
< / div >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["next"]}' id = "BrowseFilesystemPaginationBottomNext" title = "Next Page" type = "button" class = "btn btn-secondary input-group-append" > » < / button >
2018-05-29 20:12:11 +00:00
< / div >
< / div >
2018-05-16 23:19:03 +00:00
< / div >
2018-11-14 23:35:39 +00:00
< div class = "card-footer" id = "cardFooterBrowse" >
< / div >
2018-05-22 23:07:34 +00:00
< / div >
2018-05-16 23:19:03 +00:00
2018-05-22 23:07:34 +00:00
< div class = "card hide" id = "cardSearch" >
2018-08-21 22:02:22 +00:00
< div class = "card-header" >
Search
2018-05-29 20:12:11 +00:00
< span id = "panel-heading-search" class = "text pull-right" > < / span >
< / div >
2018-05-22 23:07:34 +00:00
< div class = "card-body" >
2018-08-22 12:06:22 +00:00
< div class = "btn-toolbar card-toolbar" id = "SearchButtons" >
2018-11-27 13:05:51 +00:00
< form id = "search" class = "flex-grow-1" >
2018-05-29 20:12:11 +00:00
< div class = "input-group mr-2" >
2018-11-27 13:05:51 +00:00
< div class = "input-group-prepend" >
2018-11-28 14:41:13 +00:00
< button title = "Select tag to search" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" >
2018-05-31 23:05:49 +00:00
< span class = "material-icons" > search< / span >
2018-07-15 23:56:58 +00:00
< span id = "searchtagsdesc" > Any Tag< / span >
2018-05-31 23:05:49 +00:00
< / button >
2018-11-27 13:05:51 +00:00
< div class = "dropdown-menu bg-dark px-2" id = "searchtags" >
2018-05-29 20:12:11 +00:00
< / div >
< / div >
2018-11-27 13:05:51 +00:00
< div class = "input-group-prepend featAdvsearch" >
< select class = "form-control" id = "searchMatch" >
< option value = "contains" > contains< / option >
< option value = "==" > ==< / option >
< option value = "=~" > =~< / option >
< option value = "!=" > !=< / option >
< option value = "!~" > !~< / option >
< / select >
< / div >
< input type = "text" class = "form-control" placeholder = "Search" id = "searchstr" / >
2018-05-29 20:12:11 +00:00
< / div >
< / form >
2018-07-31 20:46:53 +00:00
< div class = "input-group mr-2" >
< div class = "input-group-prepend" >
2018-11-27 15:37:17 +00:00
< button id = "searchAddAllSongs" class = "btn btn-secondary material-icons" data-href = '{"cmd": "addAllFromSearchPlist", "options": ["queue"]}' > library_add< / button >
2018-07-31 22:01:10 +00:00
< button id = "searchAddAllSongsBtn" class = "btn btn-secondary dropdown-toggle dropdown-toggle-split rounded-right" type = "button" data-toggle = "dropdown" > < / button >
2018-07-31 20:46:53 +00:00
< div class = "dropdown-menu bg-dark dropdown-menu-right px-2" id = "searchAddAllSongsDropdown" >
2018-09-10 20:51:53 +00:00
< button type = "button" class = "btn btn-secondary btn-sm btn-block" > Add all to queue< / button >
2018-10-25 20:03:33 +00:00
< button type = "button" class = "btn btn-secondary btn-sm btn-block featPlaylists" > Add all to playlist< / button >
< button type = "button" class = "btn btn-secondary btn-sm btn-block featSmartpls" > Save as smart playlist< / button >
2018-07-31 20:46:53 +00:00
< / div >
< / div >
< / div >
< div id = "SearchPaginationTop" class = "btn-group mr-2 hide" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["prev"]}' id = "SearchPaginationTopPrev" title = "Previous Page" type = "button" class = "btn btn-secondary" > « < / button >
2018-05-29 20:12:11 +00:00
< div class = "input-group-append" >
2018-07-02 19:40:27 +00:00
< button id = "SearchPaginationTopPage" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > 1 / 1< / button >
2018-06-28 22:51:24 +00:00
< div class = "dropdown-menu bg-dark px-2 pages" id = "SearchPaginationTopPages" >
2018-05-29 20:12:11 +00:00
< / div >
< / div >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["next"]}' id = "SearchPaginationTopNext" title = "Next Page" type = "button" class = "btn btn-secondary input-group-append" > » < / button >
2018-05-29 20:12:11 +00:00
< / div >
2018-11-27 13:05:51 +00:00
< div class = "btn-group featTags" >
2018-10-22 22:20:57 +00:00
< button id = "SearchColsBtn" class = "btn btn-secondary dropdown-toggle material-icons" type = "button" data-toggle = "dropdown" > settings< / button >
2018-11-27 13:05:51 +00:00
< div class = "dropdown-menu bg-dark px-2 dropdown-menu-right" id = "SearchColsDropdown" > < form > < / form >
2018-10-22 22:20:57 +00:00
< button data-href = '{"cmd": "saveCols", "options": ["Search"]}' class = "btn btn-success btn-block btn-sm mt-2" > Apply< / button >
< / div >
< / div >
2018-05-29 20:12:11 +00:00
< / div >
2019-01-28 21:59:48 +00:00
< ol class = "featAdvsearch breadcrumb" id = "searchCrumb" > < / ol >
2018-11-27 13:05:51 +00:00
2018-05-27 15:30:36 +00:00
< div class = "table-responsive-md" >
2019-01-18 21:57:49 +00:00
< table id = "SearchList" class = "table table-hover table-sm" >
2018-05-27 15:30:36 +00:00
< thead >
< tr >
< th > < / th >
< th > Title< / th >
< th > Artist< / th >
< th > Album< / th >
< th > Duration< / th >
< th > < / th >
< / tr >
< / thead >
2018-07-09 17:28:28 +00:00
< tbody class = "clickable" >
2018-05-27 15:30:36 +00:00
< / tbody >
< / table >
< / div >
2018-08-22 12:06:22 +00:00
< div class = "btn-toolbar hide" id = "SearchButtonsBottom" >
2018-05-29 20:12:11 +00:00
< div class = "btn-group mr-2" >
2018-09-12 22:03:24 +00:00
< button type = "button" class = "btn btn-secondary material-icons" data-href = '{"cmd": "scrollTo", "options": [0]}' title = "To top" >
2018-08-21 22:02:22 +00:00
keyboard_arrow_up
2018-05-29 20:12:11 +00:00
< / button >
< / div >
2018-06-10 21:15:33 +00:00
< div id = "SearchPaginationBottom" class = "btn-group mr-2 dropup" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["prev"]}' id = "SearchPaginationBottomPrev" title = "Previous Page" type = "button" class = "btn btn-secondary" > « < / button >
2018-05-29 20:12:11 +00:00
< div class = "input-group-append" >
2018-07-02 19:40:27 +00:00
< button id = "SearchPaginationBottomPage" class = "btn btn-secondary dropdown-toggle" type = "button" data-toggle = "dropdown" > 1 / 1< / button >
2018-06-28 22:51:24 +00:00
< div class = "dropdown-menu bg-dark px-2 pages" id = "SearchPaginationBottomPages" >
2018-05-29 20:12:11 +00:00
< / div >
< / div >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "gotoPage", "options": ["next"]}' id = "SearchPaginationBottomNext" title = "Next Page" type = "button" class = "btn btn-secondary input-group-append" > » < / button >
2018-05-29 20:12:11 +00:00
< / div >
< / div >
2018-05-22 23:07:34 +00:00
< / div >
2018-11-14 23:35:39 +00:00
< div class = "card-footer" id = "cardFooterSearch" >
< / div >
2018-05-22 23:07:34 +00:00
< / div >
2018-06-07 16:33:32 +00:00
< / main >
2019-01-14 23:06:07 +00:00
< footer class = "footer hide" >
2018-05-16 23:19:03 +00:00
< nav class = "navbar navbar-expand navbar-dark fixed-bottom bg-dark" >
< div class = "d-flex flex-fill navbar-nav" id = "navbar-bottom" >
2018-09-12 22:03:24 +00:00
< div id = "navPlayback" class = "nav-item flex-fill text-center" > < a data-href = '{"cmd": "appGoto", "options": ["Playback"]}' class = "nav-link" href = "#" > Playback< / a > < / div >
2018-11-11 22:22:48 +00:00
< div id = "navQueue" class = "nav-item flex-fill text-center" > < a data-href = '{"cmd": "appGoto", "options": ["Queue"]}' class = "nav-link" href = "#" > Queue < span id = "badgeQueueItems" class = "badge badge-secondary" > < / span > < / a > < / div >
2018-09-12 22:03:24 +00:00
< div class = "nav-item flex-fill text-center" id = "navBrowse" > < a data-href = '{"cmd": "appGoto", "options": ["Browse"]}' class = "nav-link" href = "#" > Browse< / a > < / div >
< div class = "nav-item flex-fill text-center" id = "navSearch" > < a data-href = '{"cmd": "appGoto", "options": ["Search"]}' class = "nav-link" href = "#" > Search< / a > < / div >
2018-05-16 23:19:03 +00:00
< / div >
< / nav >
< / footer >
2018-07-01 22:49:47 +00:00
2018-07-22 19:00:26 +00:00
<!-- Modals -->
2019-01-14 23:13:57 +00:00
< div class = "modal" id = "modalAppInit" tabindex = "-1" >
2019-01-14 23:06:07 +00:00
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header bg-success text-light" >
< h5 class = "modal-title" > < span class = "material-icons title-icon" > play_circle_outline< / span > Initializing myMPD< / h5 >
< / div >
< div class = "modal-body" >
< p > Please wait, myMPD is initializing...< / p >
< p > < span id = "appInitSettings" class = "material-icons unvisible" > check< / span > Fetch settings< / p >
< p > < span id = "appInitWebsocket" class = "material-icons unvisible" > check< / span > Connect to websocket< / p >
< p > < span id = "appInitApply" class = "material-icons unvisible" > check< / span > Applying settings< / p >
< / div >
< / div >
< / div >
< / div >
2018-08-22 12:06:22 +00:00
< div class = "modal fade" id = "modalConnectionError" tabindex = "-1" >
< div class = "modal-dialog" >
2018-05-27 13:10:34 +00:00
< div class = "modal-content" >
2018-07-09 19:20:09 +00:00
< div class = "modal-header bg-danger text-light" >
2018-07-09 18:44:42 +00:00
< h5 class = "modal-title" > < span class = "material-icons title-icon" > error< / span > Connection Error< / h5 >
2018-05-27 13:10:34 +00:00
< / div >
< div class = "modal-body" >
2018-09-29 23:03:00 +00:00
< p > Connection to myMPD failed. Trying to reconnect to < span id = "wsUrl" > < / span > < / p >
2018-05-27 13:10:34 +00:00
< / div >
< / div >
< / div >
< / div >
2018-08-24 10:11:27 +00:00
< div class = "modal fade" id = "modalUpdateDB" tabindex = "-1" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
< h5 class = "modal-title" > < span class = "material-icons title-icon" > update< / span > Updating MPD database< / h5 >
< button type = "button" class = "close" data-dismiss = "modal" > × < / button >
< / div >
< div class = "modal-body" >
< p > Dependent on the size of your music collection this can take a while.< / p >
< div class = "progress" >
2018-08-27 16:56:40 +00:00
< div id = "updateDBprogress" class = "progress-bar bg-success" role = "progressbar" > < / div >
2018-08-24 10:11:27 +00:00
< / div >
< br / >
< p id = "updateDBfinished" > < / p >
< / div >
< div class = "modal-footer hide" id = "updateDBfooter" >
< button type = "button" class = "btn btn-secondary" data-dismiss = "modal" > Close< / button >
< / div >
< / div >
< / div >
< / div >
2018-08-22 12:06:22 +00:00
< div class = "modal fade" id = "modalAddToPlaylist" tabindex = "-1" >
< div class = "modal-dialog" >
2018-07-22 19:00:26 +00:00
< div class = "modal-content" >
< div class = "modal-header" >
2018-08-01 21:54:53 +00:00
< h5 class = "modal-title" > < span class = "material-icons title-icon" > playlist_add< / span > < span id = "addToPlaylistLabel" > Add to playlist< / span > < / h5 >
2018-08-24 10:11:27 +00:00
< button type = "button" class = "close" data-dismiss = "modal" > × < / button >
2018-07-22 19:00:26 +00:00
< / div >
< div class = "modal-body" >
2018-08-01 21:54:53 +00:00
< form id = "addStreamFrm" class = "needs-validation hide" novalidate >
< div class = "row" >
< div class = "form-group col-md-12" >
< label class = "control-label" for = "streamUrl" > Stream URL< / label >
< input type = "text" class = "form-control" id = "streamUrl" placeholder = "http://uri.to/stream.mp3" / >
< div class = "invalid-feedback" > Invalid uri< / div >
< / div >
< / div >
2018-10-25 20:03:33 +00:00
< div class = "row featPlaylists" >
2018-08-01 21:54:53 +00:00
< div class = "form-group col-md-12" >
2018-09-12 22:03:24 +00:00
< button id = "toggleAddToPlaylistBtn" class = "btn btn-secondary" data-href = '{"cmd": "toggleAddToPlaylistFrm", "options":[]}' > Add to playlist< / button >
2018-08-01 21:54:53 +00:00
< / div >
< / div >
< / form >
< form class = "needs-validation hide" id = "addToPlaylistFrm" novalidate >
2018-07-22 19:00:26 +00:00
< input type = "hidden" id = "addToPlaylistUri" / >
2018-07-31 20:46:53 +00:00
< div class = "form-group" >
< label for = "addToPlaylistPlaylist" > Playlist< / label >
< select id = "addToPlaylistPlaylist" class = "form-control custom-select" > < / select >
< div class = "invalid-feedback" > Please choose playlist.< / div >
< / div >
< div class = "form-group hide" id = "addToPlaylistNewPlaylistDiv" >
< label for = "addToPlaylistNewPlaylist" > Create Playlist< / label >
< input id = "addToPlaylistNewPlaylist" class = "form-control" / >
< div class = "invalid-feedback" > Invalid filename.< / div >
2018-07-22 19:00:26 +00:00
< / div >
< / form >
< / div >
2018-08-01 21:54:53 +00:00
< div class = "modal-footer" id = "addToPlaylistFooter" >
2018-07-22 19:00:26 +00:00
< button type = "button" class = "btn btn-secondary" data-dismiss = "modal" > Cancel< / button >
2018-09-12 22:03:24 +00:00
< button type = "button" class = "btn btn-success" data-href = '{"cmd": "addToPlaylist", "options": []}' > Add< / button >
2018-08-01 21:54:53 +00:00
< / div >
< div class = "modal-footer hide" id = "addStreamFooter" >
< button type = "button" class = "btn btn-secondary" data-dismiss = "modal" > Cancel< / button >
2018-09-12 22:03:24 +00:00
< button type = "button" class = "btn btn-success" data-href = '{"cmd": "addStream", "options": []}' > Add< / button >
2018-08-24 10:11:27 +00:00
< / div >
2018-07-22 19:00:26 +00:00
< / div >
2018-08-01 22:03:19 +00:00
< / div >
2018-07-22 19:00:26 +00:00
< / div >
2018-08-22 12:06:22 +00:00
< div class = "modal fade" id = "modalRenamePlaylist" tabindex = "-1" >
< div class = "modal-dialog" >
2018-07-22 19:00:26 +00:00
< div class = "modal-content" >
< div class = "modal-header" >
< h5 class = "modal-title" > < span class = "material-icons title-icon" > playlist_add< / span > Rename playlist< / h5 >
2018-08-24 10:11:27 +00:00
< button type = "button" class = "close" data-dismiss = "modal" > × < / button >
2018-07-22 19:00:26 +00:00
< / div >
< div class = "modal-body" >
< form class = "needs-validation" id = "renamePlaylistFrm" novalidate >
< div class = "form-group" >
2018-07-25 22:25:27 +00:00
< label for = "renamePlaylistFrom" > From< / label >
2018-07-22 19:00:26 +00:00
< input type = "text" class = "form-control" id = "renamePlaylistFrom" readonly >
< / div >
< div class = "form-group" >
< label for = "renamePlaylistTo" > To< / label >
2018-07-31 20:46:53 +00:00
< input type = "text" class = "form-control" id = "renamePlaylistTo" / >
2018-07-22 19:00:26 +00:00
< div class = "invalid-feedback" > Invalid filename.< / div >
< / div >
< / form >
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-secondary" data-dismiss = "modal" > Cancel< / button >
2018-09-12 22:03:24 +00:00
< button type = "button" class = "btn btn-success" data-href = '{"cmd": "renamePlaylist", "options": []}' > Save< / button >
2018-07-22 19:00:26 +00:00
< / div >
< / div >
< / div >
< / div >
2018-10-14 21:08:10 +00:00
< div class = "modal fade" id = "modalDeletePlaylist" tabindex = "-1" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
< h5 class = "modal-title" > < span class = "material-icons title-icon" > delete< / span > Delete playlist< / h5 >
< button type = "button" class = "close" data-dismiss = "modal" > × < / button >
< / div >
< div class = "modal-body" >
< form id = "deletePlaylistFrm" >
< div class = "form-group" >
< label for = "deletePlaylist" > Playlist< / label >
< input type = "text" class = "form-control" id = "deletePlaylist" readonly >
< / div >
< / form >
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-secondary" data-dismiss = "modal" > Cancel< / button >
< button type = "button" class = "btn btn-success" data-href = '{"cmd": "delPlaylist", "options": []}' > Delete< / button >
< / div >
< / div >
< / div >
< / div >
2018-09-29 18:41:58 +00:00
< div class = "modal fade" id = "modalSaveSmartPlaylist" tabindex = "-1" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
2018-11-26 16:17:46 +00:00
< h5 class = "modal-title" > < span class = "material-icons title-icon" > queue_music< / span > Save smart playlist< / h5 >
2018-09-29 18:41:58 +00:00
< button type = "button" class = "close" data-dismiss = "modal" > × < / button >
< / div >
< div class = "modal-body" >
< form class = "needs-validation" id = "saveSmartPlaylistFrm" novalidate >
2018-10-01 17:07:38 +00:00
< div class = "row" >
< div class = "form-group col-md-6" >
< label for = "saveSmartPlaylistName" > Name< / label >
< input type = "text" class = "form-control" id = "saveSmartPlaylistName" / >
< div class = "invalid-feedback" > Invalid filename.< / div >
< / div >
< div class = "form-group col-md-6" >
< label for = "saveSmartPlaylistType" > Type< / label >
< input type = "text" class = "form-control" id = "saveSmartPlaylistType" readonly / >
< div class = "invalid-feedback" > Invalid type.< / div >
< / div >
2018-09-29 18:41:58 +00:00
< / div >
2018-10-01 17:07:38 +00:00
< hr / >
< div class = "row" id = "saveSmartPlaylistSearch" class = "hide" >
< div class = "form-group col-md-6" >
< label for = "selectSaveSmartPlaylistTag" > Tag< / label >
< select id = "selectSaveSmartPlaylistTag" class = "form-control custom-select" > < / select >
< / div >
< div class = "form-group col-md-6" >
< label for = "inputSaveSmartPlaylistSearchstr" > Search< / label >
< input type = "text" class = "form-control" id = "inputSaveSmartPlaylistSearchstr" / >
< / div >
< / div >
< div class = "row" id = "saveSmartPlaylistSticker" class = "hide" >
< div class = "form-group col-md-6" >
< label for = "selectSaveSmartPlaylistSticker" > Sticker< / label >
< select id = "selectSaveSmartPlaylistSticker" class = "form-control custom-select" >
< option value = "like" > Like< / option >
< option value = "playCount" > playCount< / option >
< / select >
< / div >
< div class = "form-group col-md-6" >
< label for = "inputSaveSmartPlaylistStickerMaxentries" > Max. entries< / label >
< input type = "text" class = "form-control" id = "inputSaveSmartPlaylistStickerMaxentries" / >
< div class = "invalid-feedback" > Must be a number.< / div >
< / div >
< / div >
< div class = "row" id = "saveSmartPlaylistNewest" class = "hide" >
< div class = "form-group col-md-6" >
< label for = "inputSaveSmartPlaylistNewestTimerange" > Timerange (days)< / label >
< input type = "text" class = "form-control" id = "inputSaveSmartPlaylistNewestTimerange" / >
< div class = "invalid-feedback" > Must be a number.< / div >
< / div >
< / div >
2018-09-29 18:41:58 +00:00
< / form >
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-secondary" data-dismiss = "modal" > Cancel< / button >
< button type = "button" class = "btn btn-success" data-href = '{"cmd": "saveSmartPlaylist", "options": []}' > Save< / button >
< / div >
< / div >
< / div >
< / div >
2018-07-22 19:00:26 +00:00
2018-08-22 12:06:22 +00:00
< div class = "modal fade" id = "modalSettings" tabindex = "-1" >
2013-11-09 02:02:49 +00:00
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
2018-07-09 18:44:42 +00:00
< h5 class = "modal-title" id = "settingsLabel" > < span class = "material-icons title-icon" > settings< / span > Settings< / h5 >
2018-08-24 10:11:27 +00:00
< button type = "button" class = "close" data-dismiss = "modal" > × < / button >
2013-11-09 02:02:49 +00:00
< / div >
< div class = "modal-body" >
2018-06-24 17:57:47 +00:00
< form class = "needs-validation" id = "settingsFrm" novalidate >
2018-09-20 16:59:29 +00:00
< h4 > MPD< / h4 >
2018-02-03 13:51:48 +00:00
< div class = "row" >
2018-07-02 23:18:29 +00:00
< div class = "form-group col-md-6" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd":"toggleBtn", "options":["btnRandom"]}' id = "btnRandom" type = "button" class = "btn btn-secondary btn-block" title = "Random" >
2018-05-28 18:48:43 +00:00
Random
2018-05-13 23:06:12 +00:00
< / button >
< / div >
< div class = "form-group col-md-6" data-toggle = "buttons" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "toggleBtn", "options": ["btnConsume"]}' id = "btnConsume" type = "button" class = "btn btn-secondary btn-block" title = "Consume" >
2018-05-28 18:48:43 +00:00
Consume
2018-05-13 23:06:12 +00:00
< / button >
< / div >
< / div >
< div class = "row" >
< div class = "form-group col-md-6" data-toggle = "buttons" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "toggleBtn", "options": ["btnSingle"]}' id = "btnSingle" type = "button" class = "btn btn-secondary btn-block" title = "Single" >
2018-05-28 18:48:43 +00:00
Single
2018-05-13 23:06:12 +00:00
< / button >
< / div >
< div class = "form-group col-md-6" data-toggle = "buttons" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "toggleBtn", "options": ["btnRepeat"]}' id = "btnRepeat" type = "button" class = "btn btn-secondary btn-block" title = "Repeat" >
2018-05-28 18:48:43 +00:00
Repeat
2018-02-03 13:51:48 +00:00
< / button >
< / div >
2018-05-13 23:06:12 +00:00
< / div >
< div class = "row" >
2018-05-28 18:48:43 +00:00
< div class = "form-group input-group col-md-6 border-secondary" >
< div class = "input-group-prepend" >
< div class = "input-group-text bg-secondary text-light border-secondary" > Crossfade< / div >
< / div >
< input id = "inputCrossfade" type = "text" class = "form-control border-secondary" value = "" >
2018-06-24 17:57:47 +00:00
< div class = "invalid-feedback" > Must be a number.< / div >
2018-05-22 23:07:34 +00:00
< / div >
2018-05-31 20:23:57 +00:00
< div class = "form-group input-group col-md-6 border-secondary" >
< div class = "input-group-prepend" >
< div class = "input-group-text bg-secondary text-light border-secondary" > Replaygain< / div >
< / div >
2018-06-24 17:57:47 +00:00
< select id = "selectReplaygain" class = "form-control custom-select border-secondary" >
2018-05-31 20:23:57 +00:00
< option value = "off" > Off< / option >
< option value = "track" > Track< / option >
< option value = "album" > Album< / option >
< / select >
2018-07-22 19:00:26 +00:00
< / div >
2018-05-22 23:07:34 +00:00
< / div >
2018-08-21 19:28:13 +00:00
< div class = "row mixramp" >
2018-05-28 18:48:43 +00:00
< div class = "form-group input-group col-md-6 border-secondary" >
< div class = "input-group-prepend" >
< div class = "input-group-text bg-secondary text-light border-secondary" > Mixramp DB< / div >
< / div >
< input id = "inputMixrampdb" type = "text" class = "form-control border-secondary" value = "" >
2018-06-24 17:57:47 +00:00
< div class = "invalid-feedback" > Must be a number.< / div >
2018-05-28 18:48:43 +00:00
< / div >
< div class = "form-group input-group col-md-6 border-secondary" >
< div class = "input-group-prepend" >
< div class = "input-group-text bg-secondary text-light border-secondary" > Mixramp Delay< / div >
< / div >
< input id = "inputMixrampdelay" type = "text" class = "form-control border-secondary" value = "" >
2018-06-24 17:57:47 +00:00
< div class = "invalid-feedback" > Must be a number.< / div >
2018-05-28 18:48:43 +00:00
< / div >
< / div >
2019-01-19 00:20:05 +00:00
< div class = "row" >
< div class = "form-group col-md-6" data-toggle = "buttons" >
< button data-href = '{"cmd": "toggleBtn", "options": ["btnAutoPlay"]}' id = "btnAutoPlay" type = "button" class = "btn btn-secondary btn-block" title = "Start playing after first song is added to the queue" >
AutoPlay
< / button >
< / div >
< / div >
2018-09-20 16:59:29 +00:00
< hr / >
< h4 > Jukebox< / h4 >
2018-09-17 22:25:05 +00:00
< div class = "row" >
2018-09-30 01:03:33 +00:00
< div class = "form-group input-group col-md-6 border-secondary" >
< div class = "input-group-prepend" >
< div class = "input-group-text bg-secondary text-light border-secondary" > Mode< / div >
< / div >
< select id = "selectJukeboxMode" class = "form-control custom-select border-secondary" >
< option value = "0" > Off< / option >
< option value = "1" > Track< / option >
< option value = "2" > Album< / option >
< / select >
2018-09-17 22:25:05 +00:00
< / div >
2018-09-20 16:59:29 +00:00
< div class = "form-group input-group col-md-6 border-secondary" >
2018-09-30 01:03:33 +00:00
< select id = "selectJukeboxPlaylist" class = "form-control custom-select border-secondary" >
2018-09-20 16:59:29 +00:00
< / select >
< / div >
2018-09-17 22:25:05 +00:00
< / div >
2018-09-30 01:03:33 +00:00
< div class = "row" >
< div class = "form-group input-group col-md-6 border-secondary" >
< div class = "input-group-prepend" >
< div class = "input-group-text bg-secondary text-light border-secondary" > Min. queue length< / div >
< / div >
< input id = "inputJukeboxQueueLength" type = "text" class = "form-control border-secondary" value = "1" >
< div class = "invalid-feedback" > Must be a number and > 0< / div >
< / div >
< / div >
2018-05-22 23:07:34 +00:00
< hr / >
2018-09-20 16:59:29 +00:00
< h4 > Notifications< / h4 >
2018-05-22 23:07:34 +00:00
< div class = "row" >
< div class = "form-group col-md-6" data-toggle = "buttons" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "toggleBtn", "options": ["btnnotifyPage"]}' type = "button" class = "btn btn-secondary btn-block" id = "btnnotifyPage" >
2018-05-28 18:48:43 +00:00
Page Notifications
2018-05-22 23:07:34 +00:00
< / button >
< / div >
2018-02-03 13:51:48 +00:00
< div class = "form-group col-md-6" data-toggle = "buttons" >
2018-09-12 22:03:24 +00:00
< button data-href = '{"cmd": "toggleBtn", "options": ["btnnotifyWeb"]}' type = "button" class = "btn btn-secondary btn-block" id = "btnnotifyWeb" >
2018-05-28 18:48:43 +00:00
Web Notifications
2018-02-03 13:51:48 +00:00
< / button >
2018-05-22 23:07:34 +00:00
< / div >
2018-05-13 23:06:12 +00:00
< / div >
2018-06-24 17:57:47 +00:00
< / form >
2014-02-04 16:58:10 +00:00
< / div >
2018-05-28 18:48:43 +00:00
< div class = "modal-footer" >
< button type = "button" class = "btn btn-secondary" data-dismiss = "modal" > Cancel< / button >
2018-09-12 22:03:24 +00:00
< button type = "button" class = "btn btn-success" data-href = '{"cmd": "confirmSettings", "options": []}' > Save< / button >
2018-05-28 18:48:43 +00:00
< / div >
2018-08-01 22:03:19 +00:00
< / div >
< / div >
< / div >
2018-05-24 18:05:09 +00:00
2018-08-22 12:06:22 +00:00
< div class = "modal fade" id = "modalAbout" tabindex = "-1" >
2018-05-24 18:05:09 +00:00
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
2018-07-09 18:44:42 +00:00
< h5 class = "modal-title" id = "aboutLabel" > < span class = "material-icons title-icon" > play_circle_outline< / span > About< / h5 >
2018-08-24 10:11:27 +00:00
< button type = "button" class = "close" data-dismiss = "modal" > × < / button >
2018-05-24 18:05:09 +00:00
< / div >
< div class = "modal-body" >
2018-10-11 19:53:08 +00:00
< h4 > < a class = "text-success" rel = "noreferrer" href = "https://github.com/jcorporation/ympd" > myMPD< / a > – < small > a standalone and mobile friendly web mpdclient< / small > < / h4 >
2018-05-31 23:05:49 +00:00
< p > myMPD is a lightweight MPD web client that runs without a dedicated webserver or interpreter. It's tuned for minimal resource usage and requires only very litte dependencies. myMPD is a fork of < a class = "text-success" href = "http://www.ympd.org" > ympd< / a > .< / p >
2018-05-24 18:05:09 +00:00
< ul >
2018-05-29 21:05:34 +00:00
< li > Version: < span id = "mympdVersion" > < / span > < / li >
2018-07-16 17:51:59 +00:00
< li > Homepage: < a class = "text-success" target = "_blank" rel = "noreferrer" href = "https://github.com/jcorporation/mympd" > https://github.com/jcorporation/mympd< / a > < / li >
2018-06-03 05:06:45 +00:00
< li > Autor: Jürgen Mang < < a class = "text-success" href = "mailto:mail@jcgames.de" > mail@jcgames.de< / a > > < / li >
2018-05-24 18:05:09 +00:00
< / ul >
2018-05-27 21:34:39 +00:00
< table class = "table table-sm" >
< tbody >
2018-07-15 21:59:03 +00:00
< tr > < td colspan = "2" class = "pt-3" > < h5 > Database Statistics< / h5 > < / td > < / tr >
2018-05-27 21:34:39 +00:00
< tr > < th > Artists< / th > < td id = "mpdstats_artists" > < / td > < / tr >
< tr > < th > Albums< / th > < td id = "mpdstats_albums" > < / td > < / tr >
< tr > < th > Songs< / th > < td id = "mpdstats_songs" > < / td > < / tr >
2018-08-21 22:56:17 +00:00
< tr > < th > DB Play Time< / th > < td id = "mpdstats_dbPlaytime" > < / td > < / tr >
< tr > < th > DB Updated< / th > < td id = "mpdstats_dbUpdated" > < / td > < / tr >
2018-07-15 21:59:03 +00:00
< tr > < td colspan = "2" class = "pt-3" > < h5 > Play Statistics< / h5 > < / td > < / tr >
2018-05-27 21:34:39 +00:00
< tr > < th > Uptime< / th > < td id = "mpdstats_uptime" > < / td > < / tr >
< tr > < th > Play Time< / th > < td id = "mpdstats_playtime" > < / td > < / tr >
2018-07-15 21:59:03 +00:00
< tr > < td colspan = "2" class = "pt-3" > < h5 > MPD< / h5 > < / td > < / tr >
< tr > < th > Protocol Version< / th > < td id = "mpdVersion" > < / td > < / tr >
2018-11-22 22:15:25 +00:00
< tr > < th > Libmpdclient Version< / th > < td id = "libmpdclientVersion" > < / td > < / tr >
2018-05-27 21:34:39 +00:00
< / tbody >
< / table >
2018-05-24 18:05:09 +00:00
< / div >
2018-08-01 22:03:19 +00:00
< / div >
< / div >
< / div >
2014-02-04 16:58:10 +00:00
2018-08-22 12:06:22 +00:00
< div class = "modal fade" id = "modalSaveQueue" tabindex = "-1" >
2015-09-02 17:24:52 +00:00
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
2018-07-22 19:16:31 +00:00
< h5 class = "modal-title" > < span class = "material-icons title-icon" > save< / span > Save Queue< / h5 >
2018-08-24 10:11:27 +00:00
< button type = "button" class = "close" data-dismiss = "modal" > × < / button >
2015-09-02 17:24:52 +00:00
< / div >
< div class = "modal-body" >
2018-07-22 19:16:31 +00:00
< form class = "needs-validation" id = "saveQueueFrm" novalidate >
2015-09-02 17:24:52 +00:00
< div class = "row" >
< div class = "form-group col-md-9" >
2018-07-22 19:16:31 +00:00
< label class = "control-label" for = "saveQueueName" > Playlist Name< / label >
< input type = "text" class = "form-control" id = "saveQueueName" / >
< div class = "invalid-feedback" > Invalid filename< / div >
2015-09-02 17:24:52 +00:00
< / div >
< / div >
< / form >
< / div >
< div class = "modal-footer" >
2018-05-14 23:13:43 +00:00
< button type = "button" class = "btn btn-secondary" data-dismiss = "modal" > Cancel< / button >
2018-09-12 22:03:24 +00:00
< button type = "button" class = "btn btn-success" data-href = '{"cmd": "saveQueue", "options": []}' > Save Queue< / button >
2015-09-02 17:24:52 +00:00
< / div >
2018-08-01 22:03:19 +00:00
< / div >
< / div >
< / div >
2018-07-09 17:28:28 +00:00
2018-08-22 12:06:22 +00:00
< div class = "modal fade" id = "modalSongDetails" tabindex = "-1" >
2018-07-09 17:28:28 +00:00
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
2018-07-16 17:51:59 +00:00
< h5 class = "modal-title" > < span class = "material-icons title-icon" > music_note< / span > Song Details< / h5 >
2018-08-24 10:11:27 +00:00
< button type = "button" class = "close" data-dismiss = "modal" > × < / button >
2018-07-09 17:28:28 +00:00
< / div >
< div class = "modal-body" >
2018-10-29 19:41:04 +00:00
< div class = "album-cover featCoverimage" > < / div >
2018-07-09 17:28:28 +00:00
< h1 > < / h1 >
2018-09-03 20:01:50 +00:00
< div class = "table-responsive-md" >
< table class = "table table-sm" >
< tbody >
< / tbody >
< / table >
< / div >
2018-07-09 17:28:28 +00:00
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-secondary" data-dismiss = "modal" > Close< / button >
< / div >
2018-08-01 22:03:19 +00:00
< / div >
< / div >
< / div >
2018-11-08 22:42:45 +00:00
< div class = "modal fade" id = "modalHelp" tabindex = "-1" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
< h5 class = "modal-title" > < span class = "material-icons title-icon" > keyboard< / span > Keyboard Shortcuts< / h5 >
< button type = "button" class = "close" data-dismiss = "modal" > × < / button >
< / div >
< div class = "modal-body" >
< div class = "table-responsive-md" >
< table class = "table table-sm" >
< thead >
< tr > < th > Key< / th > < th > Action< / th > < / tr >
< / thead >
< tbody id = "tbodyShortcuts" >
< / tbody >
< / table >
< / div >
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-secondary" data-dismiss = "modal" > Close< / button >
< / div >
< / div >
< / div >
< / div >
2018-11-05 23:13:22 +00:00
< script src = "/js/keymap.min.js" > < / script >
2018-08-21 22:02:22 +00:00
< script src = "/js/bootstrap-native-v4.min.js" > < / script >
2018-09-20 22:04:35 +00:00
< script src = "/js/mympd.min.js" > < / script >
2018-06-07 16:33:32 +00:00
< / body >
2013-11-05 13:59:12 +00:00
< / html >
