mirror of
https://github.com/jellyfin/jellyfin-web.git
synced 2024-11-18 03:18:19 -07:00
moved the directory picker to a separate file
This commit is contained in:
parent
a6ae6b7c2d
commit
95a8a246b9
155
dashboard-ui/scripts/directorybrowser.js
Normal file
155
dashboard-ui/scripts/directorybrowser.js
Normal file
@ -0,0 +1,155 @@
|
||||
(function (window, document, $) {
|
||||
|
||||
function refreshDirectoryBrowser(page, path) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
var promise;
|
||||
|
||||
if (path === "Network") {
|
||||
promise = ApiClient.getNetworkDevices();
|
||||
}
|
||||
else if (path) {
|
||||
promise = ApiClient.getDirectoryContents(path, { includeDirectories: true });
|
||||
} else {
|
||||
promise = ApiClient.getDrives();
|
||||
}
|
||||
|
||||
promise.done(function (folders) {
|
||||
|
||||
$('#txtDirectoryPickerPath', page).val(path || "");
|
||||
|
||||
var html = '';
|
||||
|
||||
if (path) {
|
||||
|
||||
var parentPath = path;
|
||||
|
||||
if (parentPath.endsWith('\\')) {
|
||||
parentPath = parentPath.substring(0, parentPath.length - 1);
|
||||
}
|
||||
|
||||
var lastIndex = parentPath.lastIndexOf('\\');
|
||||
parentPath = lastIndex == -1 ? "" : parentPath.substring(0, lastIndex);
|
||||
|
||||
if (parentPath.endsWith(':')) {
|
||||
parentPath += "\\";
|
||||
}
|
||||
|
||||
if (parentPath == '\\') {
|
||||
parentPath = "Network";
|
||||
}
|
||||
|
||||
html += '<li><a class="lnkDirectory" data-path="' + parentPath + '" href="#">..</a></li>';
|
||||
}
|
||||
|
||||
for (var i = 0, length = folders.length; i < length; i++) {
|
||||
|
||||
var folder = folders[i];
|
||||
|
||||
html += '<li><a class="lnkDirectory" data-path="' + folder.Path + '" href="#">' + folder.Name + '</a></li>';
|
||||
}
|
||||
|
||||
if (!path) {
|
||||
html += '<li><a class="lnkDirectory" data-path="Network" href="#">Network</a></li>';
|
||||
}
|
||||
|
||||
$('#ulDirectoryPickerList', page).html(html).listview('refresh');
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
|
||||
}).fail(function () {
|
||||
|
||||
$('#txtDirectoryPickerPath', page).val("");
|
||||
$('#ulDirectoryPickerList', page).html('').listview('refresh');
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
});
|
||||
}
|
||||
|
||||
window.DirectoryBrowser = function(page) {
|
||||
|
||||
var self = this;
|
||||
|
||||
self.show = function (options) {
|
||||
|
||||
options = options || {};
|
||||
|
||||
options.header = options.header || "Select Media Path";
|
||||
options.instruction = options.instruction || "Any path will do, but for optimal playback of bluray, dvd folders, and games, <b>network paths (UNC)</b> are recommended.";
|
||||
|
||||
var html = '<div data-role="popup" id="popupDirectoryPicker" class="ui-corner-all popup" style="min-width:65%;">';
|
||||
|
||||
html += '<div class="ui-corner-top ui-bar-a" style="text-align: center; padding: 0 20px;">';
|
||||
html += '<h3>' + options.header + '</h3>';
|
||||
html += '</div>';
|
||||
|
||||
html += '<div data-role="content" class="ui-corner-bottom ui-content">';
|
||||
html += '<form>';
|
||||
html += '<p class="directoryPickerHeadline">' + options.instruction + '</p>';
|
||||
|
||||
html += '<div data-role="fieldcontain" style="margin:0;">';
|
||||
html += '<label for="txtDirectoryPickerPath" class="lblDirectoryPickerPath">Current Folder:</label>';
|
||||
html += '<input id="txtDirectoryPickerPath" name="txtDirectoryPickerPath" type="text" required="required" style="font-weight:bold;" />';
|
||||
html += '</div>';
|
||||
|
||||
html += '<div style="height: 320px; overflow-y: auto;">';
|
||||
html += '<ul id="ulDirectoryPickerList" data-role="listview" data-inset="true" data-auto-enhanced="false"></ul>';
|
||||
html += '</div>';
|
||||
|
||||
html += '<p>';
|
||||
html += '<button type="submit" data-theme="b" data-icon="ok">OK</button>';
|
||||
html += '<button type="button" data-icon="delete" onclick="$(this).parents(\'.popup\').popup(\'close\');">Cancel</button>';
|
||||
html += '</p>';
|
||||
html += '</form>';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
|
||||
$(page).append(html);
|
||||
|
||||
var popup = $('#popupDirectoryPicker').popup().trigger('create').on("popupafteropen", function () {
|
||||
|
||||
$('#popupDirectoryPicker input:first', this).focus();
|
||||
|
||||
}).popup("open").on("popupafterclose", function () {
|
||||
|
||||
$('form', this).off("submit");
|
||||
|
||||
$(this).off("click").off("change").off("popupafterclose").remove();
|
||||
|
||||
}).on("click", ".lnkDirectory", function () {
|
||||
|
||||
var path = this.getAttribute('data-path');
|
||||
|
||||
refreshDirectoryBrowser(page, path);
|
||||
|
||||
}).on("change", "#txtDirectoryPickerPath", function () {
|
||||
|
||||
refreshDirectoryBrowser(page, this.value);
|
||||
});
|
||||
|
||||
var txtCurrentPath = $('#txtDirectoryPickerPath', popup);
|
||||
|
||||
if (options.path) {
|
||||
txtCurrentPath.val(options.path);
|
||||
}
|
||||
|
||||
$('form', popup).on('submit', function () {
|
||||
|
||||
if (options.callback) {
|
||||
options.callback($('#txtDirectoryPickerPath', this).val());
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
refreshDirectoryBrowser(page, txtCurrentPath.val());
|
||||
|
||||
};
|
||||
|
||||
self.close = function() {
|
||||
$('#popupDirectoryPicker', page).popup("close");
|
||||
};
|
||||
};
|
||||
|
||||
})(window, document, jQuery);
|
@ -28,14 +28,16 @@
|
||||
|
||||
$('#btnSelectIBNPath', page).on("click.selectDirectory", function () {
|
||||
|
||||
Dashboard.selectDirectory({
|
||||
var picker = new DirectoryBrowser(page);
|
||||
|
||||
picker.show({
|
||||
|
||||
callback: function (path) {
|
||||
|
||||
if (path) {
|
||||
$('#txtItemsByNamePath', page).val(path);
|
||||
}
|
||||
$('#popupDirectoryPicker', page).popup("close");
|
||||
picker.close();
|
||||
},
|
||||
|
||||
header: "Select Items By Name Path",
|
||||
|
@ -3,7 +3,7 @@
|
||||
onPageShow: function () {
|
||||
|
||||
MediaLibraryPage.lastVirtualFolderName = "";
|
||||
|
||||
|
||||
MediaLibraryPage.reloadLibrary(this);
|
||||
},
|
||||
|
||||
@ -30,7 +30,7 @@
|
||||
ApiClient.getVirtualFolders(userId).done(function (result) {
|
||||
MediaLibraryPage.reloadVirtualFolders(page, result);
|
||||
});
|
||||
|
||||
|
||||
$(".editing_default", page).hide();
|
||||
$('#divMediaLibrary', page).show();
|
||||
} else {
|
||||
@ -68,7 +68,7 @@
|
||||
for (var i = 0, length = virtualFolders.length; i < length; i++) {
|
||||
|
||||
var virtualFolder = virtualFolders[i];
|
||||
|
||||
|
||||
var isCollapsed = MediaLibraryPage.lastVirtualFolderName != virtualFolder.Name;
|
||||
|
||||
html += MediaLibraryPage.getVirtualFolderHtml(virtualFolder, isCollapsed, i);
|
||||
@ -123,7 +123,7 @@
|
||||
|
||||
user.Configuration.UseCustomLibrary = !useDefaultLibrary;
|
||||
|
||||
ApiClient.updateUser(user).done(function() {
|
||||
ApiClient.updateUser(user).done(function () {
|
||||
MediaLibraryPage.reloadLibrary(page);
|
||||
});
|
||||
|
||||
@ -138,7 +138,7 @@
|
||||
var userId = getParameterByName("userId");
|
||||
|
||||
MediaLibraryPage.lastVirtualFolderName = name;
|
||||
|
||||
|
||||
ApiClient.addVirtualFolder(name, userId).done(MediaLibraryPage.processOperationResult);
|
||||
|
||||
});
|
||||
@ -164,7 +164,11 @@
|
||||
|
||||
selectDirectory: function (callback) {
|
||||
|
||||
Dashboard.selectDirectory({callback: callback});
|
||||
var picker = new DirectoryBrowser($.mobile.activePage);
|
||||
|
||||
picker.show({ callback: callback });
|
||||
|
||||
MediaLibraryPage.directoryPicker = picker;
|
||||
},
|
||||
|
||||
getTextValue: function (header, label, initialValue, callback) {
|
||||
@ -177,7 +181,7 @@
|
||||
$('label', popup).html(label);
|
||||
$('#txtValue', popup).val(initialValue);
|
||||
|
||||
popup.on("popupafteropen",function() {
|
||||
popup.on("popupafteropen", function () {
|
||||
$('#textEntryForm input:first', this).focus();
|
||||
}).on("popupafterclose", function () {
|
||||
$(this).off("popupafterclose").off("click");
|
||||
@ -200,7 +204,7 @@
|
||||
var virtualFolder = MediaLibraryPage.virtualFolders[folderIndex];
|
||||
|
||||
MediaLibraryPage.lastVirtualFolderName = virtualFolder.Name;
|
||||
|
||||
|
||||
MediaLibraryPage.getTextValue(virtualFolder.Name, "Rename " + virtualFolder.Name, virtualFolder.Name, function (newName) {
|
||||
|
||||
if (virtualFolder.Name != newName) {
|
||||
@ -218,20 +222,20 @@
|
||||
var virtualFolder = MediaLibraryPage.virtualFolders[folderIndex];
|
||||
|
||||
var parent = $(button).parents('.collapsibleVirtualFolder');
|
||||
|
||||
|
||||
var locations = $('.lnkMediaLocation', parent).map(function () {
|
||||
return this.innerHTML;
|
||||
}).get();
|
||||
|
||||
var msg = "Are you sure you wish to remove " + virtualFolder.Name + "?";
|
||||
|
||||
|
||||
if (locations.length) {
|
||||
msg += "<br/><br/>The following media locations will be removed from your library:<br/><br/>";
|
||||
msg += locations.join("<br/>");
|
||||
}
|
||||
|
||||
|
||||
MediaLibraryPage.lastVirtualFolderName = virtualFolder.Name;
|
||||
|
||||
|
||||
Dashboard.confirm(msg, "Remove Media Folder", function (confirmResult) {
|
||||
|
||||
if (confirmResult) {
|
||||
@ -272,7 +276,12 @@
|
||||
var page = $.mobile.activePage;
|
||||
|
||||
$('#popupEnterText', page).popup("close");
|
||||
$('#popupDirectoryPicker', page).popup("close");
|
||||
|
||||
if (MediaLibraryPage.directoryPicker) {
|
||||
MediaLibraryPage.directoryPicker.close();
|
||||
MediaLibraryPage.directoryPicker = null;
|
||||
}
|
||||
|
||||
MediaLibraryPage.reloadLibrary(page);
|
||||
}
|
||||
};
|
||||
|
@ -478,142 +478,6 @@ var Dashboard = {
|
||||
});
|
||||
},
|
||||
|
||||
selectDirectory: function (options) {
|
||||
|
||||
options = options || {};
|
||||
|
||||
options.header = options.header || "Select Media Path";
|
||||
options.instruction = options.instruction || "Any path will do, but for optimal playback of bluray, dvd folders, and games, <b>network paths (UNC)</b> are recommended.";
|
||||
|
||||
var html = '<div data-role="popup" id="popupDirectoryPicker" class="ui-corner-all popup" style="min-width:65%;">';
|
||||
|
||||
html += '<div class="ui-corner-top ui-bar-a" style="text-align: center; padding: 0 20px;">';
|
||||
html += '<h3>' + options.header + '</h3>';
|
||||
html += '</div>';
|
||||
|
||||
html += '<div data-role="content" class="ui-corner-bottom ui-content">';
|
||||
html += '<form>';
|
||||
html += '<p class="directoryPickerHeadline">' + options.instruction + '</p>';
|
||||
|
||||
html += '<div data-role="fieldcontain" style="margin:0;">';
|
||||
html += '<label for="txtDirectoryPickerPath" class="lblDirectoryPickerPath">Current Folder:</label>';
|
||||
html += '<input id="txtDirectoryPickerPath" name="txtDirectoryPickerPath" type="text" onchange="Dashboard.refreshDirectoryBrowser(this.value);" required="required" style="font-weight:bold;" />';
|
||||
html += '</div>';
|
||||
|
||||
html += '<div style="height: 320px; overflow-y: auto;">';
|
||||
html += '<ul id="ulDirectoryPickerList" data-role="listview" data-inset="true" data-auto-enhanced="false"></ul>';
|
||||
html += '</div>';
|
||||
|
||||
html += '<p>';
|
||||
html += '<button type="submit" data-theme="b" data-icon="ok">OK</button>';
|
||||
html += '<button type="button" data-icon="delete" onclick="$(this).parents(\'.popup\').popup(\'close\');">Cancel</button>';
|
||||
html += '</p>';
|
||||
html += '</form>';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
|
||||
$($.mobile.activePage).append(html);
|
||||
|
||||
var popup = $('#popupDirectoryPicker').popup().trigger('create').on("popupafteropen", function () {
|
||||
$('#popupDirectoryPicker input:first', this).focus();
|
||||
}).popup("open").on("popupafterclose", function () {
|
||||
|
||||
$('form', this).off("submit");
|
||||
$(this).off("click").off("popupafterclose").remove();
|
||||
|
||||
}).on("click", ".lnkDirectory", function () {
|
||||
|
||||
var path = this.getAttribute('data-path');
|
||||
|
||||
Dashboard.refreshDirectoryBrowser(path);
|
||||
});
|
||||
|
||||
var txtCurrentPath = $('#txtDirectoryPickerPath', popup);
|
||||
|
||||
if (options.path) {
|
||||
txtCurrentPath.val(options.path);
|
||||
}
|
||||
|
||||
$('form', popup).on('submit', function () {
|
||||
|
||||
if (options.callback) {
|
||||
options.callback($('#txtDirectoryPickerPath', this).val());
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
Dashboard.refreshDirectoryBrowser(txtCurrentPath.val());
|
||||
},
|
||||
|
||||
refreshDirectoryBrowser: function (path) {
|
||||
var page = $.mobile.activePage;
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
var promise;
|
||||
|
||||
if (path === "Network") {
|
||||
promise = ApiClient.getNetworkDevices();
|
||||
}
|
||||
else if (path) {
|
||||
promise = ApiClient.getDirectoryContents(path, { includeDirectories: true });
|
||||
} else {
|
||||
promise = ApiClient.getDrives();
|
||||
}
|
||||
|
||||
promise.done(function (folders) {
|
||||
|
||||
$('#txtDirectoryPickerPath', page).val(path || "");
|
||||
|
||||
var html = '';
|
||||
|
||||
if (path) {
|
||||
|
||||
var parentPath = path;
|
||||
|
||||
if (parentPath.endsWith('\\')) {
|
||||
parentPath = parentPath.substring(0, parentPath.length - 1);
|
||||
}
|
||||
|
||||
var lastIndex = parentPath.lastIndexOf('\\');
|
||||
parentPath = lastIndex == -1 ? "" : parentPath.substring(0, lastIndex);
|
||||
|
||||
if (parentPath.endsWith(':')) {
|
||||
parentPath += "\\";
|
||||
}
|
||||
|
||||
if (parentPath == '\\') {
|
||||
parentPath = "Network";
|
||||
}
|
||||
|
||||
html += '<li><a class="lnkDirectory" data-path="' + parentPath + '" href="#">..</a></li>';
|
||||
}
|
||||
|
||||
for (var i = 0, length = folders.length; i < length; i++) {
|
||||
|
||||
var folder = folders[i];
|
||||
|
||||
html += '<li><a class="lnkDirectory" data-path="' + folder.Path + '" href="#">' + folder.Name + '</a></li>';
|
||||
}
|
||||
|
||||
if (!path) {
|
||||
html += '<li><a class="lnkDirectory" data-path="Network" href="#">Network</a></li>';
|
||||
}
|
||||
|
||||
$('#ulDirectoryPickerList', page).html(html).listview('refresh');
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
|
||||
}).fail(function () {
|
||||
|
||||
$('#txtDirectoryPickerPath', page).val("");
|
||||
$('#ulDirectoryPickerList', page).html('').listview('refresh');
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
});
|
||||
},
|
||||
|
||||
getPluginSecurityInfo: function () {
|
||||
|
||||
if (!Dashboard.getPluginSecurityInfoPromise) {
|
||||
|
Loading…
Reference in New Issue
Block a user