mirror of
https://github.com/OrchardCMS/Orchard.git
synced 2026-02-09 09:16:41 +08:00
Media Library: Code styling in media-library.js
This commit is contained in:
@@ -1,15 +1,15 @@
|
|||||||
var enhanceViewModel = function(viewModel) {
|
var enhanceViewModel = function (viewModel) {
|
||||||
// extension point for other modules to alter the view model
|
// extension point for other modules to alter the view model
|
||||||
};
|
};
|
||||||
|
|
||||||
var baseViewModel = function() {
|
var baseViewModel = function () {
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
$(function () {
|
$(function () {
|
||||||
(function (settings) {
|
(function (settings) {
|
||||||
|
|
||||||
function attachFolderTitleDropEvent (elements) {
|
function attachFolderTitleDropEvent(elements) {
|
||||||
elements.droppable({
|
elements.droppable({
|
||||||
accept: function () {
|
accept: function () {
|
||||||
var targetId = $(this).data('term-id');
|
var targetId = $(this).data('term-id');
|
||||||
@@ -105,7 +105,7 @@ $(function () {
|
|||||||
self.selected = ko.observable();
|
self.selected = ko.observable();
|
||||||
self.status = ko.observable('');
|
self.status = ko.observable('');
|
||||||
self.summary = ko.observable('');
|
self.summary = ko.observable('');
|
||||||
self.cssClass = ko.computed(function() {
|
self.cssClass = ko.computed(function () {
|
||||||
var css = '';
|
var css = '';
|
||||||
if (self.selected()) {
|
if (self.selected()) {
|
||||||
css += ' selected';
|
css += ' selected';
|
||||||
@@ -118,12 +118,12 @@ $(function () {
|
|||||||
return css;
|
return css;
|
||||||
});
|
});
|
||||||
|
|
||||||
self.publicationStatus = ko.computed(function() {
|
self.publicationStatus = ko.computed(function () {
|
||||||
return self.data.published ? "" : draftText;
|
return self.data.published ? "" : draftText;
|
||||||
});
|
});
|
||||||
|
|
||||||
// operations
|
// operations
|
||||||
self.setData = function(value) {
|
self.setData = function (value) {
|
||||||
self.data = value;
|
self.data = value;
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -171,7 +171,7 @@ $(function () {
|
|||||||
|
|
||||||
self.getMediaItems = function (count, append) {
|
self.getMediaItems = function (count, append) {
|
||||||
var folderPath = self.displayed() || '';
|
var folderPath = self.displayed() || '';
|
||||||
|
|
||||||
if (self.mediaPendingRequest()) {
|
if (self.mediaPendingRequest()) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
@@ -188,12 +188,12 @@ $(function () {
|
|||||||
|
|
||||||
var url = self.loadMediaItemsUrl(folderPath, self.results().length, count, self.orderMedia(), self.mediaType());
|
var url = self.loadMediaItemsUrl(folderPath, self.results().length, count, self.orderMedia(), self.mediaType());
|
||||||
console.log(url);
|
console.log(url);
|
||||||
|
|
||||||
$.ajax({
|
$.ajax({
|
||||||
type: "GET",
|
type: "GET",
|
||||||
url: url,
|
url: url,
|
||||||
cache: false
|
cache: false
|
||||||
}).done(function(data) {
|
}).done(function (data) {
|
||||||
var mediaItems = data.mediaItems;
|
var mediaItems = data.mediaItems;
|
||||||
var mediaItemsFolderPath = data.folderPath;
|
var mediaItemsFolderPath = data.folderPath;
|
||||||
|
|
||||||
@@ -214,9 +214,9 @@ $(function () {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}).fail(function(data) {
|
}).fail(function (data) {
|
||||||
console.error(data);
|
console.error(data);
|
||||||
}).always(function() {
|
}).always(function () {
|
||||||
self.pendingRequest(false);
|
self.pendingRequest(false);
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
@@ -225,30 +225,30 @@ $(function () {
|
|||||||
self.results().forEach(function (item) {
|
self.results().forEach(function (item) {
|
||||||
viewModel.toggleSelect(item, true);
|
viewModel.toggleSelect(item, true);
|
||||||
});
|
});
|
||||||
}
|
};
|
||||||
|
|
||||||
self.clearSelection = function() {
|
self.clearSelection = function () {
|
||||||
this.focus(null);
|
this.focus(null);
|
||||||
// unselect previous elements
|
// unselect previous elements
|
||||||
self.selection().forEach(function(item) {
|
self.selection().forEach(function (item) {
|
||||||
item.selected(false);
|
item.selected(false);
|
||||||
});
|
});
|
||||||
|
|
||||||
self.selection([]);
|
self.selection([]);
|
||||||
};
|
};
|
||||||
|
|
||||||
self.focus.subscribe(function(oldValue) {
|
self.focus.subscribe(function (oldValue) {
|
||||||
if (oldValue) {
|
if (oldValue) {
|
||||||
oldValue.hasFocus(false);
|
oldValue.hasFocus(false);
|
||||||
}
|
}
|
||||||
}, this, "beforeChange");
|
}, this, "beforeChange");
|
||||||
|
|
||||||
self.afterRenderMediaFolderTemplate = function(elements, model) {
|
self.afterRenderMediaFolderTemplate = function (elements, model) {
|
||||||
var childTitles = $(elements).find(".media-library-folder-title");
|
var childTitles = $(elements).find(".media-library-folder-title");
|
||||||
attachFolderTitleDropEvent(childTitles);
|
attachFolderTitleDropEvent(childTitles);
|
||||||
};
|
};
|
||||||
|
|
||||||
self.focus.subscribe(function(newValue) {
|
self.focus.subscribe(function (newValue) {
|
||||||
if (newValue) {
|
if (newValue) {
|
||||||
newValue.hasFocus(true);
|
newValue.hasFocus(true);
|
||||||
|
|
||||||
@@ -261,21 +261,21 @@ $(function () {
|
|||||||
type: "GET",
|
type: "GET",
|
||||||
url: url,
|
url: url,
|
||||||
cache: false
|
cache: false
|
||||||
}).done(function(data) {
|
}).done(function (data) {
|
||||||
newValue.summary(data);
|
newValue.summary(data);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
self.displayFolder = function(folderPath) {
|
self.displayFolder = function (folderPath) {
|
||||||
self.results([]);
|
self.results([]);
|
||||||
self.displayed(folderPath);
|
self.displayed(folderPath);
|
||||||
|
|
||||||
self.loadMediaItemsUrl = function (f, skip, count, order, mediaType) {
|
self.loadMediaItemsUrl = function (f, skip, count, order, mediaType) {
|
||||||
return settings.mediaItemsActionUrl + '?folderPath=' + encodeURIComponent(f) + '&skip=' + skip + '&count=' + count + '&order=' + order + '&mediaType=' + mediaType;
|
return settings.mediaItemsActionUrl + '?folderPath=' + encodeURIComponent(f) + '&skip=' + skip + '&count=' + count + '&order=' + order + '&mediaType=' + mediaType;
|
||||||
};
|
};
|
||||||
|
|
||||||
self.getMediaItems(pageCount);
|
self.getMediaItems(pageCount);
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -284,22 +284,22 @@ $(function () {
|
|||||||
self.displayFolder(folderPath);
|
self.displayFolder(folderPath);
|
||||||
};
|
};
|
||||||
|
|
||||||
self.selectRecent = function() {
|
self.selectRecent = function () {
|
||||||
History.pushState({ action: 'selectRecent' }, '', '?recent');
|
History.pushState({ action: 'selectRecent' }, '', '?recent');
|
||||||
|
|
||||||
self.loadMediaItemsUrl = function (folderPath, skip, count, order, mediaType) {
|
self.loadMediaItemsUrl = function (folderPath, skip, count, order, mediaType) {
|
||||||
return settings.recentMediaItemsActionUrl + '?skip=' + skip + '&count=' + count + '&order=' + order + '&mediaType=' + mediaType;
|
return settings.recentMediaItemsActionUrl + '?skip=' + skip + '&count=' + count + '&order=' + order + '&mediaType=' + mediaType;
|
||||||
};
|
};
|
||||||
|
|
||||||
self.results([]);
|
self.results([]);
|
||||||
self.displayed(null);
|
self.displayed(null);
|
||||||
self.getMediaItems(pageCount);
|
self.getMediaItems(pageCount);
|
||||||
};
|
};
|
||||||
|
|
||||||
self.toggleSelect = function(searchResult, force) {
|
self.toggleSelect = function (searchResult, force) {
|
||||||
var index = $.inArray(searchResult, self.selection());
|
var index = $.inArray(searchResult, self.selection());
|
||||||
if (index == -1 || force) {
|
if (index == -1 || force) {
|
||||||
self.selection.remove(function(item) { return item.data.id == searchResult.data.id; });
|
self.selection.remove(function (item) { return item.data.id == searchResult.data.id; });
|
||||||
self.selection.push(searchResult);
|
self.selection.push(searchResult);
|
||||||
searchResult.selected(true);
|
searchResult.selected(true);
|
||||||
} else {
|
} else {
|
||||||
@@ -310,7 +310,7 @@ $(function () {
|
|||||||
this.focus(searchResult);
|
this.focus(searchResult);
|
||||||
};
|
};
|
||||||
|
|
||||||
self.select = function(searchResult) {
|
self.select = function (searchResult) {
|
||||||
var index = $.inArray(searchResult, self.selection());
|
var index = $.inArray(searchResult, self.selection());
|
||||||
if (index == -1) {
|
if (index == -1) {
|
||||||
self.clearSelection();
|
self.clearSelection();
|
||||||
@@ -321,14 +321,14 @@ $(function () {
|
|||||||
this.focus(searchResult);
|
this.focus(searchResult);
|
||||||
};
|
};
|
||||||
|
|
||||||
self.scrolled = function(data, event) {
|
self.scrolled = function (data, event) {
|
||||||
var elem = event.target;
|
var elem = event.target;
|
||||||
if (elem.scrollTop > (elem.scrollHeight - elem.offsetHeight - 300)) {
|
if (elem.scrollTop > (elem.scrollHeight - elem.offsetHeight - 300)) {
|
||||||
self.getMediaItems(pageCount, true);
|
self.getMediaItems(pageCount, true);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
self.importMedia = function() {
|
self.importMedia = function () {
|
||||||
var url = settings.importActionUrl + '?folderPath=' + encodeURIComponent(self.displayed());
|
var url = settings.importActionUrl + '?folderPath=' + encodeURIComponent(self.displayed());
|
||||||
window.location = url;
|
window.location = url;
|
||||||
};
|
};
|
||||||
@@ -372,13 +372,13 @@ $(function () {
|
|||||||
|
|
||||||
self.isExpanded = ko.observable(false);
|
self.isExpanded = ko.observable(false);
|
||||||
|
|
||||||
self.isSelected = ko.computed(function() {
|
self.isSelected = ko.computed(function () {
|
||||||
return (self.mediaIndexViewModel.displayed() == self.folderPath());
|
return (self.mediaIndexViewModel.displayed() == self.folderPath());
|
||||||
});
|
});
|
||||||
|
|
||||||
self.fetchChildren = function (deepestChildPath) {
|
self.fetchChildren = function (deepestChildPath) {
|
||||||
self.childFoldersFetchStatus = 1;
|
self.childFoldersFetchStatus = 1;
|
||||||
|
|
||||||
var getChildFolderListUrl = function (f) {
|
var getChildFolderListUrl = function (f) {
|
||||||
return settings.childFolderListingActionUrl + '?folderPath=' + encodeURIComponent(f);
|
return settings.childFolderListingActionUrl + '?folderPath=' + encodeURIComponent(f);
|
||||||
};
|
};
|
||||||
@@ -454,7 +454,7 @@ $(function () {
|
|||||||
});
|
});
|
||||||
|
|
||||||
enhanceViewModel(viewModel);
|
enhanceViewModel(viewModel);
|
||||||
|
|
||||||
ko.applyBindings(viewModel);
|
ko.applyBindings(viewModel);
|
||||||
|
|
||||||
if (settings.hasFolderPath && settings.folderPath != settings.rootFolderPath) {
|
if (settings.hasFolderPath && settings.folderPath != settings.rootFolderPath) {
|
||||||
@@ -482,7 +482,7 @@ $(function () {
|
|||||||
History.pushState({ action: 'selectRecent' }, '', '?recent');
|
History.pushState({ action: 'selectRecent' }, '', '?recent');
|
||||||
}
|
}
|
||||||
|
|
||||||
window.onpopstate = function(event) {
|
window.onpopstate = function (event) {
|
||||||
if (event && event.state && event.state.action == 'displayFolder') {
|
if (event && event.state && event.state.action == 'displayFolder') {
|
||||||
viewModel.displayFolder(event.state.folder);
|
viewModel.displayFolder(event.state.folder);
|
||||||
}
|
}
|
||||||
@@ -492,7 +492,7 @@ $(function () {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
$("#media-library-main-list").on("mousedown", "li", function(e) {
|
$("#media-library-main-list").on("mousedown", "li", function (e) {
|
||||||
// only for left click
|
// only for left click
|
||||||
if (e.which != 1) {
|
if (e.which != 1) {
|
||||||
return;
|
return;
|
||||||
@@ -504,37 +504,37 @@ $(function () {
|
|||||||
} else {
|
} else {
|
||||||
viewModel.select(searchResult);
|
viewModel.select(searchResult);
|
||||||
}
|
}
|
||||||
}).on("contextmenu", "li", function() {
|
}).on("contextmenu", "li", function () {
|
||||||
var searchResult = ko.dataFor(this);
|
var searchResult = ko.dataFor(this);
|
||||||
viewModel.toggleSelect(searchResult);
|
viewModel.toggleSelect(searchResult);
|
||||||
return false;
|
return false;
|
||||||
});
|
});
|
||||||
|
|
||||||
var pickAndClose = function () {
|
var pickAndClose = function () {
|
||||||
if (parent.$.colorbox) {
|
if (parent.$.colorbox) {
|
||||||
var selectedData = [];
|
var selectedData = [];
|
||||||
for (var i = 0; i < viewModel.selection().length; i++) {
|
for (var i = 0; i < viewModel.selection().length; i++) {
|
||||||
var selection = viewModel.selection()[i];
|
var selection = viewModel.selection()[i];
|
||||||
selectedData.push(selection.data);
|
selectedData.push(selection.data);
|
||||||
}
|
}
|
||||||
parent.$.colorbox.selectedData = selectedData;
|
parent.$.colorbox.selectedData = selectedData;
|
||||||
parent.$.colorbox.close();
|
parent.$.colorbox.close();
|
||||||
};
|
};
|
||||||
}
|
};
|
||||||
|
|
||||||
$("#media-library-main-selection-select > .button-select").on('click', function () {
|
$("#media-library-main-selection-select > .button-select").on('click', function () {
|
||||||
pickAndClose();
|
pickAndClose();
|
||||||
});
|
});
|
||||||
|
|
||||||
$("#media-library-toolbar > .button-select-all").on('click', function () {
|
$("#select-all-button").on('click', function () {
|
||||||
viewModel.selectAll();
|
viewModel.selectAll();
|
||||||
});
|
});
|
||||||
|
|
||||||
$("#media-library-main-list").on('dblclick', function () {
|
$("#media-library-main-list").on('dblclick', function () {
|
||||||
pickAndClose();
|
pickAndClose();
|
||||||
});
|
});
|
||||||
|
|
||||||
$("#media-library-main-selection-select > .button-cancel").on('click', function() {
|
$("#media-library-main-selection-select > .button-cancel").on('click', function () {
|
||||||
if (parent.$.colorbox) {
|
if (parent.$.colorbox) {
|
||||||
parent.$.colorbox.selectedData = null;
|
parent.$.colorbox.selectedData = null;
|
||||||
parent.$.colorbox.close();
|
parent.$.colorbox.close();
|
||||||
@@ -542,12 +542,12 @@ $(function () {
|
|||||||
;
|
;
|
||||||
});
|
});
|
||||||
|
|
||||||
$("#media-library-main-list").on("mouseover", ".media-thumbnail", function() {
|
$("#media-library-main-list").on("mouseover", ".media-thumbnail", function () {
|
||||||
if (!$(this).hasClass("ui-draggable")) {
|
if (!$(this).hasClass("ui-draggable")) {
|
||||||
$(this).draggable({
|
$(this).draggable({
|
||||||
revert: 'invalid',
|
revert: 'invalid',
|
||||||
//containment: 'li',
|
//containment: 'li',
|
||||||
helper: function(event) {
|
helper: function (event) {
|
||||||
var clone = $(event.currentTarget).clone().removeAttr('id');
|
var clone = $(event.currentTarget).clone().removeAttr('id');
|
||||||
clone.removeClass('selected');
|
clone.removeClass('selected');
|
||||||
clone.addClass('dragged-selection');
|
clone.addClass('dragged-selection');
|
||||||
@@ -562,7 +562,7 @@ $(function () {
|
|||||||
cursor: 'move',
|
cursor: 'move',
|
||||||
distance: 10,
|
distance: 10,
|
||||||
appendTo: 'body',
|
appendTo: 'body',
|
||||||
create: function() {
|
create: function () {
|
||||||
// position the handler a little left to the center to let the number of selected items to appear
|
// position the handler a little left to the center to let the number of selected items to appear
|
||||||
$(this).draggable("option", "cursorAt", { left: $(this).width() / 2 - 20, top: $(this).height() / 2 });
|
$(this).draggable("option", "cursorAt", { left: $(this).width() / 2 - 20, top: $(this).height() / 2 });
|
||||||
}
|
}
|
||||||
@@ -570,13 +570,13 @@ $(function () {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
$('#delete-selection-button').click(function() {
|
$('#delete-selection-button').click(function () {
|
||||||
if (!confirm(settings.deleteConfirmationMessage)) {
|
if (!confirm(settings.deleteConfirmationMessage)) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
var ids = [];
|
var ids = [];
|
||||||
viewModel.selection().forEach(function(item) { ids.push(item.data.id); });
|
viewModel.selection().forEach(function (item) { ids.push(item.data.id); });
|
||||||
var url = settings.deleteActionUrl;
|
var url = settings.deleteActionUrl;
|
||||||
|
|
||||||
$.ajax({
|
$.ajax({
|
||||||
@@ -588,9 +588,9 @@ $(function () {
|
|||||||
mediaItemIds: ids,
|
mediaItemIds: ids,
|
||||||
__RequestVerificationToken: settings.antiForgeryToken
|
__RequestVerificationToken: settings.antiForgeryToken
|
||||||
}
|
}
|
||||||
}).done(function(result) {
|
}).done(function (result) {
|
||||||
if (result) {
|
if (result) {
|
||||||
viewModel.results.remove(function(item) {
|
viewModel.results.remove(function (item) {
|
||||||
return ids.indexOf(item.data.id) != -1;
|
return ids.indexOf(item.data.id) != -1;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -22,7 +22,7 @@
|
|||||||
<a href="#" data-bind="attr: { href: '@HttpUtility.JavaScriptStringEncode(Url.Action("Create", "Folder", new { area = "Orchard.MediaLibrary"}))?folderPath=' + encodeURIComponent(displayed() ? displayed() : '') }" class="button" id="button-create-folder">@T("Create Folder")</a>
|
<a href="#" data-bind="attr: { href: '@HttpUtility.JavaScriptStringEncode(Url.Action("Create", "Folder", new { area = "Orchard.MediaLibrary"}))?folderPath=' + encodeURIComponent(displayed() ? displayed() : '') }" class="button" id="button-create-folder">@T("Create Folder")</a>
|
||||||
|
|
||||||
@Display(Model.CustomActionsShapes)
|
@Display(Model.CustomActionsShapes)
|
||||||
<button class="button-select-all">@T("Select All")</button>
|
<button class="button" id="select-all-button">@T("Select All")</button>
|
||||||
</div>
|
</div>
|
||||||
<div id="media-library-main">
|
<div id="media-library-main">
|
||||||
<div id="media-library-main-navigation">
|
<div id="media-library-main-navigation">
|
||||||
|
|||||||
Reference in New Issue
Block a user