mirror of
https://github.com/SuperBFG7/ympd
synced 2024-12-26 11:00:27 +00:00
Replaced bootstrap.bundle.min.js and jquery-3.3.1.min.js with bootstrap-native-v4.min.js
This commit is contained in:
jcorporation
parent
691b90a2c9
commit
a9d4c0b5e9
@ -41,8 +41,7 @@ install(FILES mympd.1 DESTINATION ${CMAKE_INSTALL_PREFIX}/share/man/man1)
|
||||
install(FILES htdocs/index.html DESTINATION share/${PROJECT_NAME}/htdocs/)
|
||||
install(FILES htdocs/player.html DESTINATION share/${PROJECT_NAME}/htdocs/)
|
||||
install(FILES htdocs/js/player.min.js DESTINATION share/${PROJECT_NAME}/htdocs/js/)
|
||||
install(FILES htdocs/js/bootstrap.bundle.min.js DESTINATION share/${PROJECT_NAME}/htdocs/js/)
|
||||
install(FILES htdocs/js/jquery-3.3.1.min.js DESTINATION share/${PROJECT_NAME}/htdocs/js/)
|
||||
install(FILES htdocs/js/bootstrap-native-v4.min.js DESTINATION share/${PROJECT_NAME}/htdocs/js/)
|
||||
install(FILES htdocs/js/mpd.min.js DESTINATION share/${PROJECT_NAME}/htdocs/js/)
|
||||
install(FILES htdocs/css/bootstrap.min.css DESTINATION share/${PROJECT_NAME}/htdocs/css/)
|
||||
install(FILES htdocs/css/mpd.min.css DESTINATION share/${PROJECT_NAME}/htdocs/css/)
|
||||
|
||||
@ -13,7 +13,7 @@ UI Components
|
||||
-------------
|
||||
- Bootstrap 4: https://getbootstrap.com/
|
||||
- Material Design Icons: https://material.io/tools/icons/?style=baseline
|
||||
- jQuery: https://jquery.com/
|
||||
- Bootstrap Native: http://thednp.github.io/bootstrap.native/
|
||||
|
||||
Backend
|
||||
-------
|
||||
|
||||
@ -25,11 +25,11 @@
|
||||
<input id="inputSearch" type="text" class="form-control" placeholder="Search">
|
||||
</form>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a id="nav-addstream" class="dropdown-item text-light bg-dark" href="#" data-toggle="modal" data-target="#addstream">Add Stream</a>
|
||||
<a id="nav-addstream" class="dropdown-item text-light bg-dark" href="#" data-toggle="modal" data-target="#modalAddstream">Add Stream</a>
|
||||
<a id="nav-updatedb" class="dropdown-item text-light bg-dark" href="#" data-href="{'cmd':'updateDB','options':[]}">Update Database</a>
|
||||
<a id="nav-localplayer" class="dropdown-item text-light bg-dark" href="#" data-href="{'cmd':'openLocalPlayer','options':[]}" data-toggle="dropdown">Local Player</a>
|
||||
<a id="nav-settings" class="dropdown-item text-light bg-dark" href="#" data-toggle="modal" data-target="#settings">Settings</a>
|
||||
<a id="nav-about" class="dropdown-item text-light bg-dark" href="#" data-toggle="modal" data-target="#about">About</a>
|
||||
<a id="nav-localplayer" class="dropdown-item text-light bg-dark" href="#" data-href="{'cmd':'openLocalPlayer','options':[]}">Local Player</a>
|
||||
<a id="nav-settings" class="dropdown-item text-light bg-dark" href="#" data-toggle="modal" data-target="#modalSettings">Settings</a>
|
||||
<a id="nav-about" class="dropdown-item text-light bg-dark" href="#" data-toggle="modal" data-target="#modalAbout">About</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-toolbar col-auto pl-0 pr-0" role="toolbar">
|
||||
@ -93,11 +93,11 @@
|
||||
|
||||
<div class="card hide" id="cardQueue">
|
||||
<div class="card-header">
|
||||
<a href="#" data-toggle="collapse" data-target="#queue-buttons" class="text-dark">Queue</a>
|
||||
<a href="#" data-target="#queue-buttons" class="text-dark">Queue</a>
|
||||
<span id="panel-heading-queue" class="text pull-right"></span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="btn-toolbar collapse show card-toolbar" id="queue-buttons" role="toolbar">
|
||||
<div class="btn-toolbar card-toolbar" id="queue-buttons" role="toolbar">
|
||||
<div id="queue-actions" class="btn-group mr-2">
|
||||
<button type="button" class="btn btn-secondary" data-href="{'cmd': 'sendAPI', 'options': [{'cmd':'MPD_API_SEND_SHUFFLE'}]}" title="Shuffle queue">
|
||||
<span class="material-icons">shuffle</span>
|
||||
@ -105,7 +105,7 @@
|
||||
<button type="button" class="btn btn-secondary" data-href="{'cmd': 'sendAPI', 'options': [{'cmd':'MPD_API_RM_ALL'}]}" title="Clear queue">
|
||||
<span class="material-icons">clear_all</span>
|
||||
</button>
|
||||
<button type="button" class="btn btn-secondary" data-toggle="modal" data-target="#savequeue" title="Save queue">
|
||||
<button type="button" class="btn btn-secondary" data-toggle="modal" data-target="#modalSavequeue" title="Save queue">
|
||||
<span class="material-icons">save</span>
|
||||
</button>
|
||||
</div>
|
||||
@ -195,7 +195,7 @@
|
||||
</div>
|
||||
|
||||
<div class="card-body hide" id="cardBrowsePlaylists">
|
||||
<div class="btn-toolbar collapse show card-toolbar" id="BrowsePlaylistsButtons" role="toolbar">
|
||||
<div class="btn-toolbar card-toolbar" id="BrowsePlaylistsButtons" role="toolbar">
|
||||
<div class="btn-group mr-2">
|
||||
<button id="BrowsePlaylistsFilter" class="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown">Filter</button>
|
||||
<div class="dropdown-menu bg-dark px-2" id="BrowsePlaylistsFilterLetters">
|
||||
@ -250,7 +250,7 @@
|
||||
|
||||
<div class="card-body hide" id="cardBrowseDatabase">
|
||||
|
||||
<div class="btn-toolbar collapse show card-toolbar" id="BrowseDatabaseButtons" role="toolbar">
|
||||
<div class="btn-toolbar card-toolbar" id="BrowseDatabaseButtons" role="toolbar">
|
||||
<div class="btn-group mr-2">
|
||||
<button data-href="{'cmd': 'appGoto', 'options': ['Browse','Database','Artist']}" id="btnBrowseDatabaseArtist" type="button" class="btn btn-secondary hide">« Artists</button>
|
||||
</div>
|
||||
@ -309,7 +309,7 @@
|
||||
</div>
|
||||
|
||||
<div class="card-body hide" id="cardBrowseFilesystem">
|
||||
<div class="btn-toolbar collapse show card-toolbar" id="BrowseFilesystemButtons" role="toolbar">
|
||||
<div class="btn-toolbar card-toolbar" id="BrowseFilesystemButtons" role="toolbar">
|
||||
<div class="btn-group mr-2 pull-right">
|
||||
<button data-href="{'cmd': 'addAllFromBrowse', 'options': []}" id="BrowseFilesystemAddAllSongs" class="btn btn-secondary">Add all</button>
|
||||
</div>
|
||||
@ -378,7 +378,7 @@
|
||||
<span id="panel-heading-search" class="text pull-right"></span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="btn-toolbar collapse show card-toolbar" id="SearchButtons" role="toolbar">
|
||||
<div class="btn-toolbar card-toolbar" id="SearchButtons" role="toolbar">
|
||||
<form id="search2" role="search">
|
||||
<div class="input-group mr-2">
|
||||
<input type="text" class="form-control" placeholder="Search" id="searchstr2"/>
|
||||
@ -478,7 +478,7 @@
|
||||
</div>
|
||||
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="settings" tabindex="-1" role="dialog" aria-labelledby="settingsLabel" aria-hidden="true">
|
||||
<div class="modal fade" id="modalSettings" tabindex="-1" role="dialog" aria-labelledby="settingsLabel" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
@ -572,7 +572,7 @@
|
||||
</div><!-- /.modal -->
|
||||
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="about" tabindex="-1" role="dialog" aria-labelledby="settingsLabel" aria-hidden="true">
|
||||
<div class="modal fade" id="modalAbout" tabindex="-1" role="dialog" aria-labelledby="settingsLabel" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
@ -615,7 +615,7 @@
|
||||
</div><!-- /.modal -->
|
||||
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="addstream" tabindex="-1" role="dialog" aria-labelledby="addstreamLabel" aria-hidden="true">
|
||||
<div class="modal fade" id="modalAddstream" tabindex="-1" role="dialog" aria-labelledby="addstreamLabel" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
@ -625,7 +625,7 @@
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form>
|
||||
<form id="addstreamFrm">
|
||||
<div class="row">
|
||||
<div class="form-group col-md-12">
|
||||
<label class="control-label" for="streamurl">Stream URL</label>
|
||||
@ -642,7 +642,7 @@
|
||||
</div><!-- /.modal-dialog -->
|
||||
</div><!-- /.modal -->
|
||||
|
||||
<div class="modal fade" id="savequeue" tabindex="-1" role="dialog" aria-labelledby="savequeueLabel" aria-hidden="true">
|
||||
<div class="modal fade" id="modalSavequeue" tabindex="-1" role="dialog" aria-labelledby="savequeueLabel" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
@ -668,8 +668,7 @@
|
||||
</div><!-- /.modal-content -->
|
||||
</div><!-- /.modal-dialog -->
|
||||
</div><!-- /.modal -->
|
||||
<script src="js/jquery-3.3.1.min.js"></script>
|
||||
<script src="js/bootstrap.bundle.min.js"></script>
|
||||
<script src="js/bootstrap-native-v4.min.js"></script>
|
||||
<script src="js/mpd.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
2
htdocs/js/bootstrap-native-v4.min.js
vendored
Normal file
2
htdocs/js/bootstrap-native-v4.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
6
htdocs/js/bootstrap.bundle.min.js
vendored
6
htdocs/js/bootstrap.bundle.min.js
vendored
File diff suppressed because one or more lines are too long
2
htdocs/js/jquery-3.3.1.min.js
vendored
2
htdocs/js/jquery-3.3.1.min.js
vendored
File diff suppressed because one or more lines are too long
@ -67,6 +67,12 @@ domCache.progressBar = document.getElementById('progressBar');
|
||||
domCache.volumeBar = document.getElementById('volumeBar');
|
||||
domCache.outputs = document.getElementById('outputs');
|
||||
|
||||
var modalConnectionError = new Modal(document.getElementById('modalConnectionError'));
|
||||
var modalSettings = new Modal(document.getElementById('modalSettings'));
|
||||
var modalAddstream = new Modal(document.getElementById('modalAddstream'));
|
||||
var modalSavequeue = new Modal(document.getElementById('modalSavequeue'));
|
||||
var mainMenu = new Dropdown(document.getElementById('mainMenu'));
|
||||
|
||||
function appPrepare() {
|
||||
if (app.current.app != app.last.app || app.current.tab != app.last.tab || app.current.view != app.last.view) {
|
||||
//Hide all cards + nav
|
||||
@ -261,11 +267,11 @@ function appInit() {
|
||||
}
|
||||
}, false);
|
||||
|
||||
$('#about').on('shown.bs.modal', function () {
|
||||
document.getElementById('modalAbout').addEventListener('shown.bs.modal', function () {
|
||||
sendAPI({"cmd": "MPD_API_GET_STATS"}, parseStats);
|
||||
})
|
||||
|
||||
$('#settings').on('shown.bs.modal', function () {
|
||||
document.getElementById('modalSettings').addEventListener('shown.bs.modal', function () {
|
||||
getSettings();
|
||||
document.getElementById('settingsFrm').classList.remove('was-validated');
|
||||
document.getElementById('inputCrossfade').classList.remove('is-invalid');
|
||||
@ -273,20 +279,24 @@ function appInit() {
|
||||
document.getElementById('inputMixrampdelay').classList.remove('is-invalid');
|
||||
})
|
||||
|
||||
$('#addstream').on('shown.bs.modal', function () {
|
||||
document.getElementById('modalAddstream').addEventListener('shown.bs.modal', function () {
|
||||
document.getElementById('streamurl').focus();
|
||||
})
|
||||
|
||||
$('#addstream form').on('submit', function (e) {
|
||||
document.getElementById('addstreamFrm').addEventListener('submit', function () {
|
||||
addStream();
|
||||
});
|
||||
|
||||
$('#mainMenu').on('shown.bs.dropdown', function () {
|
||||
document.getElementById('mainMenu').addEventListener('shown.bs.dropdown', function () {
|
||||
var si = document.getElementById('inputSearch');
|
||||
si.value = '';
|
||||
si.focus();
|
||||
});
|
||||
|
||||
|
||||
document.getElementById('inputSearch').addEventListener('click', function(event) {
|
||||
event.stopPropagation();
|
||||
});
|
||||
|
||||
addFilterLetter('BrowseFilesystemFilterLetters');
|
||||
addFilterLetter('BrowseDatabaseFilterLetters');
|
||||
addFilterLetter('BrowsePlaylistsFilterLetters');
|
||||
@ -397,11 +407,13 @@ function appInit() {
|
||||
|
||||
document.getElementById('inputSearch').addEventListener('keypress', function (event) {
|
||||
if ( event.which == 13 )
|
||||
$('#mainMenu > a').dropdown('toggle');
|
||||
mainMenu.toggle();
|
||||
}, false);
|
||||
|
||||
document.getElementById('search').addEventListener('submit', function () {
|
||||
appGoto('Search', undefined, undefined, app.current.page + '/Any Tag/' + document.getElementById('inputSearch').value);
|
||||
var searchStr = document.getElementById('inputSearch').value;
|
||||
appGoto('Search', undefined, undefined, app.current.page + '/Any Tag/' + searchStr);
|
||||
document.getElementById('searchstr2').value = searchStr;
|
||||
return false;
|
||||
}, false);
|
||||
|
||||
@ -446,7 +458,7 @@ function webSocketConnect() {
|
||||
socket.onopen = function() {
|
||||
console.log("connected");
|
||||
showNotification('Connected to myMPD','','','success');
|
||||
$('#modalConnectionError').modal('hide');
|
||||
modalConnectionError.hide();
|
||||
appRoute();
|
||||
}
|
||||
|
||||
@ -482,7 +494,7 @@ function webSocketConnect() {
|
||||
|
||||
socket.onclose = function(){
|
||||
console.log('disconnected');
|
||||
$('#modalConnectionError').modal('show');
|
||||
modalConnectionError.show();
|
||||
setTimeout(function() {
|
||||
console.log('reconnect');
|
||||
webSocketConnect();
|
||||
@ -1045,7 +1057,7 @@ function appendQueue(type, uri, name) {
|
||||
}
|
||||
|
||||
function showMenu(el) {
|
||||
var type = el.parentNode.parentNode.getAttribute('data-type');
|
||||
/* var type = el.parentNode.parentNode.getAttribute('data-type');
|
||||
var uri = el.parentNode.parentNode.getAttribute('data-uri');
|
||||
if ((app.current.app == 'Browse' && app.current.tab == 'Filesystem') || app.current.app == 'Search' ||
|
||||
(app.current.app == 'Browse' && app.current.tab == 'Database' && app.current.view == 'Album')) {
|
||||
@ -1077,6 +1089,7 @@ function showMenu(el) {
|
||||
});
|
||||
}
|
||||
$(el).popover('show');
|
||||
*/
|
||||
}
|
||||
|
||||
function sendAPI(request, callback) {
|
||||
@ -1122,12 +1135,13 @@ function clickNext() {
|
||||
|
||||
function delQueueSong(tr,event) {
|
||||
event.stopPropagation();
|
||||
if ( $('#btntrashmodeup').hasClass('active') )
|
||||
/* if ( $('#btntrashmodeup').hasClass('active') )
|
||||
sendAPI({"cmd": "MPD_API_RM_RANGE", "data": {"start":0, "end": (tr.index() + 1)}});
|
||||
else if ( $('#btntrashmodesingle').hasClass('active') )
|
||||
sendAPI({"cmd": "MPD_API_RM_TRACK", "data": { "track": tr.attr('trackid')}});
|
||||
else if ( $('#btntrashmodedown').hasClass('active') )
|
||||
sendAPI({"cmd": "MPD_API_RM_RANGE", "data": {"start": tr.index(), "end":-1}});
|
||||
*/
|
||||
}
|
||||
|
||||
function delPlaylist(tr) {
|
||||
@ -1182,7 +1196,7 @@ function confirmSettings() {
|
||||
"notificationWeb": (document.getElementById('btnnotifyWeb').classList.contains('active') ? 1 : 0),
|
||||
"notificationPage": (document.getElementById('btnnotifyPage').classList.contains('active') ? 1 : 0)
|
||||
}}, getSettings);
|
||||
$('#settings').modal('hide');
|
||||
modalSettings.hide();
|
||||
} else {
|
||||
document.getElementById('settingsFrm').classList.add('was-validated');
|
||||
}
|
||||
@ -1226,7 +1240,7 @@ function addStream() {
|
||||
if (streamUrl.value != '')
|
||||
sendAPI({"cmd": "MPD_API_ADD_TRACK","data": {"uri": streamUrl.value}});
|
||||
streamUrl.value = '';
|
||||
$('#addstream').modal('hide');
|
||||
modalAddstream.hide();
|
||||
}
|
||||
|
||||
function saveQueue() {
|
||||
@ -1234,7 +1248,7 @@ function saveQueue() {
|
||||
if (plName.value != '')
|
||||
sendAPI({"cmd":"MPD_API_SAVE_QUEUE","data":{"plist": plName.value}});
|
||||
plName.value = '';
|
||||
$('#savequeue').modal('hide');
|
||||
modalSavequeue.hide();
|
||||
}
|
||||
|
||||
function showNotification(notificationTitle,notificationText,notificationHtml,notificationType) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user