mirror of
https://github.com/OrchardCMS/Orchard.git
synced 2025-10-15 19:54:57 +08:00
Merge branch '1.x' of https://git01.codeplex.com/orchard into feature/audittrail
This commit is contained in:
Sipke Schoorstra
@@ -76,6 +76,7 @@
|
||||
</ItemGroup>
|
||||
<ItemGroup>
|
||||
<Content Include="Scripts\knockout-2.3.0.js" />
|
||||
<Content Include="Scripts\media-library-picker.js" />
|
||||
<Content Include="Scripts\media-library.js" />
|
||||
<Content Include="Scripts\modal-window.js" />
|
||||
<Content Include="Scripts\history.js" />
|
||||
@@ -346,6 +347,9 @@
|
||||
<ItemGroup>
|
||||
<Content Include="Views\Admin\ChildFolders.cshtml" />
|
||||
</ItemGroup>
|
||||
<ItemGroup>
|
||||
<Content Include="Views\MediaLibraryPicker.cshtml" />
|
||||
</ItemGroup>
|
||||
<PropertyGroup>
|
||||
<VisualStudioVersion Condition="'$(VisualStudioVersion)' == ''">10.0</VisualStudioVersion>
|
||||
<VSToolsPath Condition="'$(VSToolsPath)' == ''">$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)</VSToolsPath>
|
||||
|
||||
@@ -0,0 +1,119 @@
|
||||
(function($) {
|
||||
|
||||
$(".media-library-picker-field").each(function() {
|
||||
var element = $(this);
|
||||
var multiple = element.data("multiple");
|
||||
var removeText = element.data("remove-text");
|
||||
var removePrompt = element.data("remove-prompt");
|
||||
var editText = element.data("edit-text");
|
||||
var dirtyText = element.data("dirty-text");
|
||||
var pipe = element.data("pipe");
|
||||
var returnUrl = element.data("return-url");
|
||||
var addUrl = element.data("add-url");
|
||||
var promptOnNavigate = element.data("prompt-on-navigate");
|
||||
var showSaveWarning = element.data("show-save-warning");
|
||||
var addButton = element.find(".button.add");
|
||||
var template =
|
||||
'<li><div data-id="{contentItemId}" class="media-library-picker-item"><div class="thumbnail">{thumbnail}<div class="overlay"><h3>{title}</h3></div></div></div><a href="#" data-id="{contentItemId}" class="media-library-picker-remove">' + removeText + '</a>' + pipe + '<a href="{editLink}?ReturnUrl=' + returnUrl + '">' + editText + '</a></li>';
|
||||
|
||||
var refreshIds = function() {
|
||||
var id = element.find('.selected-ids');
|
||||
id.val('');
|
||||
element.find(".media-library-picker-item").each(function() {
|
||||
id.val(id.val() + "," + $(this).attr("data-id"));
|
||||
});
|
||||
|
||||
var itemsCount = element.find(".media-library-picker-item").length;
|
||||
|
||||
if(!multiple && itemsCount > 0) {
|
||||
addButton.hide();
|
||||
}
|
||||
else {
|
||||
addButton.show();
|
||||
}
|
||||
};
|
||||
|
||||
var showSaveMsg = function () {
|
||||
if (!showSaveWarning)
|
||||
return;
|
||||
|
||||
element.find('.media-library-picker-message').show();
|
||||
window.mediaLibraryDirty = true;
|
||||
};
|
||||
|
||||
window.mediaLibraryDirty = false;
|
||||
|
||||
if (promptOnNavigate) {
|
||||
if (!window.mediaLibraryNavigateAway) {
|
||||
$(window).on("beforeunload", window.mediaLibraryNavigateAway = function() {
|
||||
if (window.mediaLibraryDirty) {
|
||||
return dirtyText;
|
||||
}
|
||||
});
|
||||
element.closest("form").on("submit", function() {
|
||||
window.mediaLibraryDirty = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
refreshIds();
|
||||
|
||||
addButton.click(function () {
|
||||
var url = addUrl;
|
||||
$.colorbox({
|
||||
href: url,
|
||||
iframe: true,
|
||||
reposition: true,
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
onLoad: function() { // hide the scrollbars from the main window
|
||||
$('html, body').css('overflow', 'hidden');
|
||||
$('#cboxClose').remove();
|
||||
},
|
||||
onClosed: function() {
|
||||
$('html, body').css('overflow', '');
|
||||
var selectedData = $.colorbox.selectedData;
|
||||
if (selectedData == null) // Dialog cancelled, do nothing
|
||||
return;
|
||||
|
||||
var selectionLength = multiple ? selectedData.length : Math.min(selectedData.length, 1);
|
||||
|
||||
for (var i = 0; i < selectionLength ; i++) {
|
||||
var tmpl = template
|
||||
.replace(/\{contentItemId\}/g, selectedData[i].id)
|
||||
.replace(/\{thumbnail\}/g, selectedData[i].thumbnail)
|
||||
.replace(/\{title\}/g, selectedData[i].title)
|
||||
.replace(/\{editLink\}/g, selectedData[i].editLink);
|
||||
var content = $(tmpl);
|
||||
element.find('.media-library-picker.items ul').append(content);
|
||||
}
|
||||
|
||||
refreshIds();
|
||||
|
||||
if (selectedData.length) {
|
||||
showSaveMsg();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
element.on("click",'.media-library-picker-remove', function(e) {
|
||||
e.preventDefault();
|
||||
if (!confirm(removePrompt)) return false;
|
||||
$(this).closest('li').remove();
|
||||
refreshIds();
|
||||
showSaveMsg();
|
||||
return false;
|
||||
});
|
||||
|
||||
element.find(".media-library-picker.items ul").sortable({
|
||||
handle: '.thumbnail',
|
||||
stop: function() {
|
||||
refreshIds();
|
||||
showSaveMsg();
|
||||
}
|
||||
}).disableSelection();
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
@@ -1,51 +1,51 @@
|
||||
var enhanceViewModel = function(viewModel) {
|
||||
// extension point for other modules to alter the view model
|
||||
};
|
||||
|
||||
var baseViewModel = function() {
|
||||
|
||||
};
|
||||
|
||||
$(function () {
|
||||
(function (settings) {
|
||||
|
||||
var enhanceViewModel = function(viewModel) {
|
||||
// extension point for other modules to alter the view model
|
||||
};
|
||||
|
||||
var baseViewModel = function() {
|
||||
|
||||
};
|
||||
|
||||
$(function () {
|
||||
(function (settings) {
|
||||
|
||||
function attachFolderTitleDropEvent (elements) {
|
||||
elements.droppable({
|
||||
accept: function () {
|
||||
var targetId = $(this).data('term-id');
|
||||
var targetId = $(this).data('term-id');
|
||||
return targetId != viewModel.displayed();
|
||||
},
|
||||
},
|
||||
over: function (event, ui) {
|
||||
$(ui.helper).addClass('over');
|
||||
$(ui.helper).addClass('over');
|
||||
$(this).addClass('dropping');
|
||||
},
|
||||
},
|
||||
out: function (event, ui) {
|
||||
$(ui.helper).removeClass('over');
|
||||
$(ui.helper).removeClass('over');
|
||||
$(this).removeClass('dropping');
|
||||
},
|
||||
tolerance: "pointer",
|
||||
},
|
||||
tolerance: "pointer",
|
||||
drop: function () {
|
||||
$(this).removeClass('dropping');
|
||||
var folderPath = $(this).data('media-path');
|
||||
|
||||
$(this).removeClass('dropping');
|
||||
var folderPath = $(this).data('media-path');
|
||||
|
||||
if (folderPath == viewModel.displayed()) {
|
||||
return;
|
||||
}
|
||||
|
||||
var ids = [];
|
||||
viewModel.selection().forEach(function (item) { ids.push(item.data.id); });
|
||||
var url = settings.moveActionUrl;
|
||||
|
||||
console.log(folderPath);
|
||||
|
||||
}
|
||||
|
||||
var ids = [];
|
||||
viewModel.selection().forEach(function (item) { ids.push(item.data.id); });
|
||||
var url = settings.moveActionUrl;
|
||||
|
||||
console.log(folderPath);
|
||||
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: url,
|
||||
dataType: "json",
|
||||
traditional: true,
|
||||
type: "POST",
|
||||
url: url,
|
||||
dataType: "json",
|
||||
traditional: true,
|
||||
data: {
|
||||
folderPath: folderPath,
|
||||
mediaItemIds: ids,
|
||||
folderPath: folderPath,
|
||||
mediaItemIds: ids,
|
||||
__RequestVerificationToken: settings.antiForgeryToken
|
||||
},
|
||||
}).done(function (result) {
|
||||
@@ -54,90 +54,90 @@ $(function () {
|
||||
viewModel.results.remove(function (item) {
|
||||
return ids.indexOf(item.data.id) != -1;
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
viewModel.clearSelection();
|
||||
} else {
|
||||
alert(errorMessage);
|
||||
alert(errorMessage);
|
||||
console.log('failed to move media items: ' + result.toString());
|
||||
}
|
||||
}).fail(function (result) {
|
||||
alert(errorMessage);
|
||||
alert(errorMessage);
|
||||
console.log('failed to move media items: ' + result.toString());
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
var listWidth = $('#media-library-main-list').width();
|
||||
var listHeight = $('#media-library-main-list').height();
|
||||
var itemSize = $('.thumbnail').first().width();
|
||||
var draftText = $("#media-library").data("draft-text");
|
||||
|
||||
var itemsPerRow = Math.floor(listWidth / itemSize);
|
||||
var itemsPerColumn = Math.ceil(listHeight / itemSize);
|
||||
|
||||
var pageCount = itemsPerRow * itemsPerColumn;
|
||||
|
||||
function mediaPartViewModel(data) {
|
||||
var self = this;
|
||||
|
||||
// values
|
||||
self.data = data;
|
||||
|
||||
//id,
|
||||
//contentType,
|
||||
//contentTypeClass,
|
||||
//title,
|
||||
//alternateText,
|
||||
//caption,
|
||||
//resource,
|
||||
//mimeType,
|
||||
//mimeTypeClass,
|
||||
//thumbnail,
|
||||
//editLink,
|
||||
|
||||
self.hasFocus = ko.observable();
|
||||
self.selected = ko.observable();
|
||||
self.status = ko.observable('');
|
||||
self.summary = ko.observable('');
|
||||
self.cssClass = ko.computed(function() {
|
||||
var css = '';
|
||||
if (self.selected()) {
|
||||
css += ' selected';
|
||||
}
|
||||
|
||||
if (self.hasFocus()) {
|
||||
css += ' has-focus';
|
||||
}
|
||||
|
||||
return css;
|
||||
});
|
||||
|
||||
self.publicationStatus = ko.computed(function() {
|
||||
return self.data.published ? "" : draftText;
|
||||
});
|
||||
|
||||
// operations
|
||||
self.setData = function(value) {
|
||||
self.data = value;
|
||||
};
|
||||
}
|
||||
|
||||
function mediaIndexViewModel() {
|
||||
var self = this;
|
||||
|
||||
// placeholder function called to retrieve content when scrolling
|
||||
self.loadMediaItemsUrl = function (folderPath, skip, count, order, mediaType) {
|
||||
};
|
||||
|
||||
// values
|
||||
self.selection = ko.observableArray([]);
|
||||
self.focus = ko.observable();
|
||||
self.results = ko.observableArray();
|
||||
self.displayed = ko.observable();
|
||||
self.mediaItemsCount = 0;
|
||||
self.orderMedia = ko.observableArray(['created']);
|
||||
};
|
||||
|
||||
var listWidth = $('#media-library-main-list').width();
|
||||
var listHeight = $('#media-library-main-list').height();
|
||||
var itemSize = $('.thumbnail').first().width();
|
||||
var draftText = $("#media-library").data("draft-text");
|
||||
|
||||
var itemsPerRow = Math.floor(listWidth / itemSize);
|
||||
var itemsPerColumn = Math.ceil(listHeight / itemSize);
|
||||
|
||||
var pageCount = itemsPerRow * itemsPerColumn;
|
||||
|
||||
function mediaPartViewModel(data) {
|
||||
var self = this;
|
||||
|
||||
// values
|
||||
self.data = data;
|
||||
|
||||
//id,
|
||||
//contentType,
|
||||
//contentTypeClass,
|
||||
//title,
|
||||
//alternateText,
|
||||
//caption,
|
||||
//resource,
|
||||
//mimeType,
|
||||
//mimeTypeClass,
|
||||
//thumbnail,
|
||||
//editLink,
|
||||
|
||||
self.hasFocus = ko.observable();
|
||||
self.selected = ko.observable();
|
||||
self.status = ko.observable('');
|
||||
self.summary = ko.observable('');
|
||||
self.cssClass = ko.computed(function() {
|
||||
var css = '';
|
||||
if (self.selected()) {
|
||||
css += ' selected';
|
||||
}
|
||||
|
||||
if (self.hasFocus()) {
|
||||
css += ' has-focus';
|
||||
}
|
||||
|
||||
return css;
|
||||
});
|
||||
|
||||
self.publicationStatus = ko.computed(function() {
|
||||
return self.data.published ? "" : draftText;
|
||||
});
|
||||
|
||||
// operations
|
||||
self.setData = function(value) {
|
||||
self.data = value;
|
||||
};
|
||||
}
|
||||
|
||||
function mediaIndexViewModel() {
|
||||
var self = this;
|
||||
|
||||
// placeholder function called to retrieve content when scrolling
|
||||
self.loadMediaItemsUrl = function (folderPath, skip, count, order, mediaType) {
|
||||
};
|
||||
|
||||
// values
|
||||
self.selection = ko.observableArray([]);
|
||||
self.focus = ko.observable();
|
||||
self.results = ko.observableArray();
|
||||
self.displayed = ko.observable();
|
||||
self.mediaItemsCount = 0;
|
||||
self.orderMedia = ko.observableArray(['created']);
|
||||
self.mediaType = ko.observableArray([]);
|
||||
|
||||
self.mediaFolders = ko.observableArray([]);
|
||||
@@ -164,73 +164,73 @@ $(function () {
|
||||
self.mediaPendingRequest(value);
|
||||
}
|
||||
});
|
||||
|
||||
self.getMediaItems = function (count, append) {
|
||||
var folderPath = self.displayed() || '';
|
||||
|
||||
if (self.mediaPendingRequest()) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (append) {
|
||||
if (self.results().length > 0 && self.results().length >= self.mediaItemsCount) {
|
||||
return;
|
||||
}
|
||||
} else {
|
||||
self.results([]);
|
||||
}
|
||||
|
||||
self.pendingRequest(true);
|
||||
|
||||
var url = self.loadMediaItemsUrl(folderPath, self.results().length, count, self.orderMedia(), self.mediaType());
|
||||
console.log(url);
|
||||
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: url,
|
||||
cache: false
|
||||
}).done(function(data) {
|
||||
|
||||
self.getMediaItems = function (count, append) {
|
||||
var folderPath = self.displayed() || '';
|
||||
|
||||
if (self.mediaPendingRequest()) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (append) {
|
||||
if (self.results().length > 0 && self.results().length >= self.mediaItemsCount) {
|
||||
return;
|
||||
}
|
||||
} else {
|
||||
self.results([]);
|
||||
}
|
||||
|
||||
self.pendingRequest(true);
|
||||
|
||||
var url = self.loadMediaItemsUrl(folderPath, self.results().length, count, self.orderMedia(), self.mediaType());
|
||||
console.log(url);
|
||||
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: url,
|
||||
cache: false
|
||||
}).done(function(data) {
|
||||
var mediaItems = data.mediaItems;
|
||||
var mediaItemsFolderPath = data.folderPath;
|
||||
|
||||
|
||||
if (mediaItemsFolderPath !== self.displayed()) {
|
||||
return;
|
||||
}
|
||||
|
||||
self.mediaItemsCount = data.mediaItemsCount;
|
||||
for (var i = 0; i < mediaItems.length; i++) {
|
||||
var item = new mediaPartViewModel(mediaItems[i]);
|
||||
self.results.push(item);
|
||||
|
||||
// pre-select result which are already part of the selection
|
||||
var selection = self.selection();
|
||||
for (var j = 0; j < selection.length; j++) {
|
||||
if (selection[j].data.id == item.data.id) {
|
||||
viewModel.toggleSelect(item, true);
|
||||
}
|
||||
}
|
||||
}
|
||||
}).fail(function(data) {
|
||||
console.error(data);
|
||||
}).always(function() {
|
||||
self.pendingRequest(false);
|
||||
});
|
||||
};
|
||||
|
||||
self.clearSelection = function() {
|
||||
this.focus(null);
|
||||
// unselect previous elements
|
||||
self.selection().forEach(function(item) {
|
||||
item.selected(false);
|
||||
});
|
||||
|
||||
self.selection([]);
|
||||
};
|
||||
|
||||
self.focus.subscribe(function(oldValue) {
|
||||
if (oldValue) {
|
||||
oldValue.hasFocus(false);
|
||||
}
|
||||
}
|
||||
|
||||
self.mediaItemsCount = data.mediaItemsCount;
|
||||
for (var i = 0; i < mediaItems.length; i++) {
|
||||
var item = new mediaPartViewModel(mediaItems[i]);
|
||||
self.results.push(item);
|
||||
|
||||
// pre-select result which are already part of the selection
|
||||
var selection = self.selection();
|
||||
for (var j = 0; j < selection.length; j++) {
|
||||
if (selection[j].data.id == item.data.id) {
|
||||
viewModel.toggleSelect(item, true);
|
||||
}
|
||||
}
|
||||
}
|
||||
}).fail(function(data) {
|
||||
console.error(data);
|
||||
}).always(function() {
|
||||
self.pendingRequest(false);
|
||||
});
|
||||
};
|
||||
|
||||
self.clearSelection = function() {
|
||||
this.focus(null);
|
||||
// unselect previous elements
|
||||
self.selection().forEach(function(item) {
|
||||
item.selected(false);
|
||||
});
|
||||
|
||||
self.selection([]);
|
||||
};
|
||||
|
||||
self.focus.subscribe(function(oldValue) {
|
||||
if (oldValue) {
|
||||
oldValue.hasFocus(false);
|
||||
}
|
||||
}, this, "beforeChange");
|
||||
|
||||
self.afterRenderMediaFolderTemplate = function(elements, model) {
|
||||
@@ -238,104 +238,104 @@ $(function () {
|
||||
attachFolderTitleDropEvent(childTitles);
|
||||
};
|
||||
|
||||
self.focus.subscribe(function(newValue) {
|
||||
if (newValue) {
|
||||
newValue.hasFocus(true);
|
||||
|
||||
// load summary admin if not alreay done
|
||||
if (newValue.summary() == '') {
|
||||
var id = newValue.data.id;
|
||||
var url = settings.mediaItemActionUrl + '/' + id;
|
||||
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: url,
|
||||
cache: false
|
||||
}).done(function(data) {
|
||||
newValue.summary(data);
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
self.displayFolder = function(folderPath) {
|
||||
self.results([]);
|
||||
self.displayed(folderPath);
|
||||
|
||||
self.loadMediaItemsUrl = function (f, skip, count, order, mediaType) {
|
||||
return settings.mediaItemsActionUrl + '?folderPath=' + encodeURIComponent(f) + '&skip=' + skip + '&count=' + count + '&order=' + order + '&mediaType=' + mediaType;
|
||||
};
|
||||
|
||||
self.focus.subscribe(function(newValue) {
|
||||
if (newValue) {
|
||||
newValue.hasFocus(true);
|
||||
|
||||
// load summary admin if not alreay done
|
||||
if (newValue.summary() == '') {
|
||||
var id = newValue.data.id;
|
||||
var url = settings.mediaItemActionUrl + '/' + id;
|
||||
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: url,
|
||||
cache: false
|
||||
}).done(function(data) {
|
||||
newValue.summary(data);
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
self.displayFolder = function(folderPath) {
|
||||
self.results([]);
|
||||
self.displayed(folderPath);
|
||||
|
||||
self.loadMediaItemsUrl = function (f, skip, count, order, mediaType) {
|
||||
return settings.mediaItemsActionUrl + '?folderPath=' + encodeURIComponent(f) + '&skip=' + skip + '&count=' + count + '&order=' + order + '&mediaType=' + mediaType;
|
||||
};
|
||||
|
||||
self.getMediaItems(pageCount);
|
||||
};
|
||||
|
||||
self.selectFolder = function (folderPath) {
|
||||
History.pushState({ action: 'displayFolder', folderPath: folderPath }, '', '?folderPath=' + folderPath);
|
||||
self.displayFolder(folderPath);
|
||||
};
|
||||
|
||||
self.selectRecent = function() {
|
||||
History.pushState({ action: 'selectRecent' }, '', '?recent');
|
||||
|
||||
self.loadMediaItemsUrl = function (folderPath, skip, count, order, mediaType) {
|
||||
return settings.recentMediaItemsActionUrl + '?skip=' + skip + '&count=' + count + '&order=' + order + '&mediaType=' + mediaType;
|
||||
};
|
||||
|
||||
self.results([]);
|
||||
self.displayed(null);
|
||||
self.getMediaItems(pageCount);
|
||||
};
|
||||
|
||||
self.toggleSelect = function(searchResult, force) {
|
||||
var index = $.inArray(searchResult, self.selection());
|
||||
if (index == -1 || force) {
|
||||
self.selection.remove(function(item) { return item.data.id == searchResult.data.id; });
|
||||
self.selection.push(searchResult);
|
||||
searchResult.selected(true);
|
||||
} else {
|
||||
self.selection.remove(searchResult);
|
||||
searchResult.selected(false);
|
||||
}
|
||||
|
||||
this.focus(searchResult);
|
||||
};
|
||||
|
||||
self.select = function(searchResult) {
|
||||
var index = $.inArray(searchResult, self.selection());
|
||||
if (index == -1) {
|
||||
self.clearSelection();
|
||||
self.selection([searchResult]);
|
||||
searchResult.selected(true);
|
||||
}
|
||||
|
||||
this.focus(searchResult);
|
||||
};
|
||||
|
||||
self.scrolled = function(data, event) {
|
||||
var elem = event.target;
|
||||
if (elem.scrollTop > (elem.scrollHeight - elem.offsetHeight - 300)) {
|
||||
self.getMediaItems(pageCount, true);
|
||||
}
|
||||
};
|
||||
|
||||
self.importMedia = function() {
|
||||
var url = settings.importActionUrl + '?folderPath=' + encodeURIComponent(self.displayed());
|
||||
window.location = url;
|
||||
};
|
||||
|
||||
var selectFolderOrRecent = function () {
|
||||
if (self.displayed()) {
|
||||
self.selectFolder(self.displayed());
|
||||
} else {
|
||||
self.selectRecent();
|
||||
}
|
||||
};
|
||||
self.orderMedia.subscribe(selectFolderOrRecent);
|
||||
};
|
||||
|
||||
self.selectFolder = function (folderPath) {
|
||||
History.pushState({ action: 'displayFolder', folderPath: folderPath }, '', '?folderPath=' + folderPath);
|
||||
self.displayFolder(folderPath);
|
||||
};
|
||||
|
||||
self.selectRecent = function() {
|
||||
History.pushState({ action: 'selectRecent' }, '', '?recent');
|
||||
|
||||
self.loadMediaItemsUrl = function (folderPath, skip, count, order, mediaType) {
|
||||
return settings.recentMediaItemsActionUrl + '?skip=' + skip + '&count=' + count + '&order=' + order + '&mediaType=' + mediaType;
|
||||
};
|
||||
|
||||
self.results([]);
|
||||
self.displayed(null);
|
||||
self.getMediaItems(pageCount);
|
||||
};
|
||||
|
||||
self.toggleSelect = function(searchResult, force) {
|
||||
var index = $.inArray(searchResult, self.selection());
|
||||
if (index == -1 || force) {
|
||||
self.selection.remove(function(item) { return item.data.id == searchResult.data.id; });
|
||||
self.selection.push(searchResult);
|
||||
searchResult.selected(true);
|
||||
} else {
|
||||
self.selection.remove(searchResult);
|
||||
searchResult.selected(false);
|
||||
}
|
||||
|
||||
this.focus(searchResult);
|
||||
};
|
||||
|
||||
self.select = function(searchResult) {
|
||||
var index = $.inArray(searchResult, self.selection());
|
||||
if (index == -1) {
|
||||
self.clearSelection();
|
||||
self.selection([searchResult]);
|
||||
searchResult.selected(true);
|
||||
}
|
||||
|
||||
this.focus(searchResult);
|
||||
};
|
||||
|
||||
self.scrolled = function(data, event) {
|
||||
var elem = event.target;
|
||||
if (elem.scrollTop > (elem.scrollHeight - elem.offsetHeight - 300)) {
|
||||
self.getMediaItems(pageCount, true);
|
||||
}
|
||||
};
|
||||
|
||||
self.importMedia = function() {
|
||||
var url = settings.importActionUrl + '?folderPath=' + encodeURIComponent(self.displayed());
|
||||
window.location = url;
|
||||
};
|
||||
|
||||
var selectFolderOrRecent = function () {
|
||||
if (self.displayed()) {
|
||||
self.selectFolder(self.displayed());
|
||||
} else {
|
||||
self.selectRecent();
|
||||
}
|
||||
};
|
||||
self.orderMedia.subscribe(selectFolderOrRecent);
|
||||
self.mediaType.subscribe(selectFolderOrRecent);
|
||||
}
|
||||
|
||||
var viewModel = new mediaIndexViewModel();
|
||||
|
||||
}
|
||||
|
||||
var viewModel = new mediaIndexViewModel();
|
||||
|
||||
function mediaFolderViewModel(data) {
|
||||
var self = this;
|
||||
|
||||
@@ -420,20 +420,20 @@ $(function () {
|
||||
var childTitles = $(elements).find(".media-library-folder-title");
|
||||
attachFolderTitleDropEvent(childTitles);
|
||||
};
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
$.map(settings.childFolders, function (childFolder, index) {
|
||||
viewModel.mediaFolders.push(new mediaFolderViewModel(childFolder));
|
||||
});
|
||||
|
||||
enhanceViewModel(viewModel);
|
||||
|
||||
ko.applyBindings(viewModel);
|
||||
|
||||
if (settings.hasFolderPath) {
|
||||
viewModel.displayFolder(settings.folderPath);
|
||||
|
||||
//fetch displayed folder structure
|
||||
});
|
||||
|
||||
enhanceViewModel(viewModel);
|
||||
|
||||
ko.applyBindings(viewModel);
|
||||
|
||||
if (settings.hasFolderPath) {
|
||||
viewModel.displayFolder(settings.folderPath);
|
||||
|
||||
//fetch displayed folder structure
|
||||
(function (displayedFolder) {
|
||||
var folders = viewModel.mediaFolders();
|
||||
for (var x = 0; x < folders.length; x++) {
|
||||
@@ -444,125 +444,125 @@ $(function () {
|
||||
break;
|
||||
}
|
||||
}
|
||||
})(settings.folderPath);
|
||||
|
||||
History.pushState({
|
||||
action: 'displayFolder',
|
||||
folderPath: settings.folderPath
|
||||
}, '', '?folderPath=' + settings.folderPath);
|
||||
} else {
|
||||
viewModel.selectRecent();
|
||||
History.pushState({ action: 'selectRecent' }, '', '?recent');
|
||||
}
|
||||
|
||||
window.onpopstate = function(event) {
|
||||
if (event && event.state && event.state.action == 'displayFolder') {
|
||||
viewModel.displayFolder(event.state.folder);
|
||||
}
|
||||
|
||||
if (event && event.state && event.state.action == 'selectRecent') {
|
||||
viewModel.selectRecent();
|
||||
}
|
||||
};
|
||||
|
||||
$("#media-library-main-list").on("mousedown", "li", function(e) {
|
||||
// only for left click
|
||||
if (e.which != 1) {
|
||||
return;
|
||||
})(settings.folderPath);
|
||||
|
||||
History.pushState({
|
||||
action: 'displayFolder',
|
||||
folderPath: settings.folderPath
|
||||
}, '', '?folderPath=' + settings.folderPath);
|
||||
} else {
|
||||
viewModel.selectRecent();
|
||||
History.pushState({ action: 'selectRecent' }, '', '?recent');
|
||||
}
|
||||
|
||||
window.onpopstate = function(event) {
|
||||
if (event && event.state && event.state.action == 'displayFolder') {
|
||||
viewModel.displayFolder(event.state.folder);
|
||||
}
|
||||
|
||||
var searchResult = ko.dataFor(this);
|
||||
if (e.ctrlKey) {
|
||||
viewModel.toggleSelect(searchResult);
|
||||
} else {
|
||||
viewModel.select(searchResult);
|
||||
}
|
||||
}).on("contextmenu", "li", function() {
|
||||
var searchResult = ko.dataFor(this);
|
||||
viewModel.toggleSelect(searchResult);
|
||||
return false;
|
||||
});
|
||||
|
||||
$("#media-library-main-selection-select > .button-select").on('click', function() {
|
||||
if (parent.$.colorbox) {
|
||||
var selectedData = [];
|
||||
for (var i = 0; i < viewModel.selection().length; i++) {
|
||||
var selection = viewModel.selection()[i];
|
||||
selectedData.push(selection.data);
|
||||
}
|
||||
parent.$.colorbox.selectedData = selectedData;
|
||||
parent.$.colorbox.close();
|
||||
}
|
||||
;
|
||||
});
|
||||
|
||||
$("#media-library-main-selection-select > .button-cancel").on('click', function() {
|
||||
if (parent.$.colorbox) {
|
||||
parent.$.colorbox.selectedData = null;
|
||||
parent.$.colorbox.close();
|
||||
}
|
||||
;
|
||||
|
||||
if (event && event.state && event.state.action == 'selectRecent') {
|
||||
viewModel.selectRecent();
|
||||
}
|
||||
};
|
||||
|
||||
$("#media-library-main-list").on("mousedown", "li", function(e) {
|
||||
// only for left click
|
||||
if (e.which != 1) {
|
||||
return;
|
||||
}
|
||||
|
||||
var searchResult = ko.dataFor(this);
|
||||
if (e.ctrlKey) {
|
||||
viewModel.toggleSelect(searchResult);
|
||||
} else {
|
||||
viewModel.select(searchResult);
|
||||
}
|
||||
}).on("contextmenu", "li", function() {
|
||||
var searchResult = ko.dataFor(this);
|
||||
viewModel.toggleSelect(searchResult);
|
||||
return false;
|
||||
});
|
||||
|
||||
$("#media-library-main-list").on("mouseover", ".media-thumbnail", function() {
|
||||
if (!$(this).hasClass("ui-draggable")) {
|
||||
$(this).draggable({
|
||||
revert: 'invalid',
|
||||
//containment: 'li',
|
||||
helper: function(event) {
|
||||
var clone = $(event.currentTarget).clone().removeAttr('id');
|
||||
clone.removeClass('selected');
|
||||
clone.addClass('dragged-selection');
|
||||
|
||||
if (viewModel.selection().length > 1) {
|
||||
clone.append($('<div class="draggable-selection"><p>' + viewModel.selection().length + '</p></div>'));
|
||||
}
|
||||
|
||||
return clone;
|
||||
|
||||
},
|
||||
cursor: 'move',
|
||||
distance: 10,
|
||||
appendTo: 'body',
|
||||
create: function() {
|
||||
// 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 });
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$('#delete-selection-button').click(function() {
|
||||
if (!confirm(settings.deleteConfirmationMessage)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var ids = [];
|
||||
viewModel.selection().forEach(function(item) { ids.push(item.data.id); });
|
||||
var url = settings.deleteActionUrl;
|
||||
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: url,
|
||||
dataType: "json",
|
||||
traditional: true,
|
||||
data: {
|
||||
mediaItemIds: ids,
|
||||
__RequestVerificationToken: settings.antiForgeryToken
|
||||
}
|
||||
}).done(function(result) {
|
||||
if (result) {
|
||||
viewModel.results.remove(function(item) {
|
||||
return ids.indexOf(item.data.id) != -1;
|
||||
});
|
||||
|
||||
viewModel.clearSelection();
|
||||
} else {
|
||||
console.log('failed to delete media items');
|
||||
}
|
||||
return false;
|
||||
});
|
||||
return false;
|
||||
});
|
||||
})(window.mediaLibrarySettings);
|
||||
})
|
||||
$("#media-library-main-selection-select > .button-select").on('click', function() {
|
||||
if (parent.$.colorbox) {
|
||||
var selectedData = [];
|
||||
for (var i = 0; i < viewModel.selection().length; i++) {
|
||||
var selection = viewModel.selection()[i];
|
||||
selectedData.push(selection.data);
|
||||
}
|
||||
parent.$.colorbox.selectedData = selectedData;
|
||||
parent.$.colorbox.close();
|
||||
}
|
||||
;
|
||||
});
|
||||
|
||||
$("#media-library-main-selection-select > .button-cancel").on('click', function() {
|
||||
if (parent.$.colorbox) {
|
||||
parent.$.colorbox.selectedData = null;
|
||||
parent.$.colorbox.close();
|
||||
}
|
||||
;
|
||||
});
|
||||
|
||||
$("#media-library-main-list").on("mouseover", ".media-thumbnail", function() {
|
||||
if (!$(this).hasClass("ui-draggable")) {
|
||||
$(this).draggable({
|
||||
revert: 'invalid',
|
||||
//containment: 'li',
|
||||
helper: function(event) {
|
||||
var clone = $(event.currentTarget).clone().removeAttr('id');
|
||||
clone.removeClass('selected');
|
||||
clone.addClass('dragged-selection');
|
||||
|
||||
if (viewModel.selection().length > 1) {
|
||||
clone.append($('<div class="draggable-selection"><p>' + viewModel.selection().length + '</p></div>'));
|
||||
}
|
||||
|
||||
return clone;
|
||||
|
||||
},
|
||||
cursor: 'move',
|
||||
distance: 10,
|
||||
appendTo: 'body',
|
||||
create: function() {
|
||||
// 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 });
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$('#delete-selection-button').click(function() {
|
||||
if (!confirm(settings.deleteConfirmationMessage)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var ids = [];
|
||||
viewModel.selection().forEach(function(item) { ids.push(item.data.id); });
|
||||
var url = settings.deleteActionUrl;
|
||||
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: url,
|
||||
dataType: "json",
|
||||
traditional: true,
|
||||
data: {
|
||||
mediaItemIds: ids,
|
||||
__RequestVerificationToken: settings.antiForgeryToken
|
||||
}
|
||||
}).done(function(result) {
|
||||
if (result) {
|
||||
viewModel.results.remove(function(item) {
|
||||
return ids.indexOf(item.data.id) != -1;
|
||||
});
|
||||
|
||||
viewModel.clearSelection();
|
||||
} else {
|
||||
console.log('failed to delete media items');
|
||||
}
|
||||
return false;
|
||||
});
|
||||
return false;
|
||||
});
|
||||
})(window.mediaLibrarySettings);
|
||||
})
|
||||
|
||||
@@ -1,160 +1,14 @@
|
||||
@model Orchard.MediaLibrary.ViewModels.MediaLibraryPickerFieldViewModel
|
||||
@using Orchard.ContentManagement
|
||||
@using Orchard.Utility.Extensions;
|
||||
@using Orchard.MediaLibrary.Settings;
|
||||
|
||||
@{
|
||||
Script.Require("jQueryUI_Sortable").AtFoot();
|
||||
Style.Include("media-library-picker-admin.css");
|
||||
|
||||
Script.Require("jQueryColorBox").AtFoot();
|
||||
Style.Require("jQueryColorBox");
|
||||
|
||||
var settings = Model.Field.PartFieldDefinition.Settings.GetModel<MediaLibraryPickerFieldSettings>();
|
||||
var contentManager = WorkContext.Resolve<IContentManager>();
|
||||
var fieldIdForSelectedIds = Html.FieldIdFor(m => m.SelectedIds);
|
||||
var fieldIdForIds = Html.FieldIdFor(m => m.Field.Ids);
|
||||
}
|
||||
|
||||
<fieldset>
|
||||
<label @if(settings.Required) { <text>class="required"</text> }>@Model.Field.DisplayName</label>
|
||||
<div id="save-message-@fieldIdForIds" class="message message-Warning media-library-picker-message">@T("You need to save your changes.")</div>
|
||||
<div id="media-library-picker-@fieldIdForIds" class="items media-library-picker" summary="@Model.Field.DisplayName">
|
||||
<ul>
|
||||
@foreach (var contentItem in Model.ContentItems) {
|
||||
var editRouteValues = contentManager.GetItemMetadata(contentItem).EditorRouteValues;
|
||||
var editUrl = Url.Action(
|
||||
Convert.ToString(editRouteValues["action"]),
|
||||
editRouteValues.Merge(new RouteValueDictionary { { "ReturnUrl", Request.RawUrl } }));
|
||||
<li>
|
||||
<div data-id="@contentItem.Id" data-fieldid="@fieldIdForIds" class="media-library-picker-item">
|
||||
<div class="thumbnail">
|
||||
@Display(contentManager.BuildDisplay(contentItem, "Thumbnail"))
|
||||
<div class="overlay">
|
||||
<h3>@Html.ItemDisplayText(contentItem)</h3>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<a href="#" data-id="@contentItem.Id" class="media-library-picker-remove">@T("Remove")</a>@T(" | ")
|
||||
<a href="@editUrl">@T("Edit")</a>
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span id="btn-@fieldIdForIds" class="button">@T("Add")</span>
|
||||
</div>
|
||||
|
||||
@Html.HiddenFor(m => m.SelectedIds)
|
||||
<span class="hint">@settings.Hint</span>
|
||||
</fieldset>
|
||||
|
||||
@using (Script.Foot()) {
|
||||
<script type="text/javascript">
|
||||
//<![CDATA[
|
||||
|
||||
(function($) {
|
||||
|
||||
var multiple = @(settings.Multiple ? "true" : "false");
|
||||
var addButton = $('#btn-@fieldIdForIds');
|
||||
var @(fieldIdForIds)_Template =
|
||||
'<li><div data-id="{contentItemId}" data-fieldid="@fieldIdForIds" class="media-library-picker-item"><div class="thumbnail">{thumbnail}<div class="overlay"><h3>{title}</h3></div></div></div><a href="#" data-id="{contentItemId}" class="media-library-picker-remove">@T("Remove")</a>@T(" | ")<a href="{editLink}?ReturnUrl=@Request.RawUrl">@T("Edit")</a></li>';
|
||||
|
||||
var refreshIds = function() {
|
||||
var id = $('#@fieldIdForSelectedIds');
|
||||
id.val('');
|
||||
$("div[data-fieldid = @fieldIdForIds]").each(function() {
|
||||
id.val(id.val() + "," + $(this).attr("data-id"));
|
||||
});
|
||||
|
||||
var itemsCount = $("div[data-fieldid = @fieldIdForIds]").length;
|
||||
|
||||
if(!multiple && itemsCount > 0) {
|
||||
addButton.hide();
|
||||
}
|
||||
else {
|
||||
addButton.show();
|
||||
}
|
||||
};
|
||||
|
||||
window.mediaLibraryDirty = false;
|
||||
var showSaveMsg = function() {
|
||||
$('#save-message-@fieldIdForIds').show();
|
||||
window.mediaLibraryDirty = true;
|
||||
};
|
||||
if (!window.mediaLibraryNavigateAway) {
|
||||
$(window).on("beforeunload", window.mediaLibraryNavigateAway = function() {
|
||||
if (window.mediaLibraryDirty) {
|
||||
return "@HttpUtility.JavaScriptStringEncode(T("You have unsaved changes. Please only accept to leave if you don't mind losing those changes.").Text)";
|
||||
}
|
||||
});
|
||||
$("#@(fieldIdForSelectedIds)").closest("form").on("submit", function() {
|
||||
window.mediaLibraryDirty = false;
|
||||
});
|
||||
}
|
||||
|
||||
refreshIds();
|
||||
|
||||
addButton.click(function() {
|
||||
var url = '@HttpUtility.JavaScriptStringEncode(Url.Action("Index", "Admin", new {area = "Orchard.MediaLibrary", dialog = true}))';
|
||||
$.colorbox({
|
||||
href: url,
|
||||
iframe: true,
|
||||
reposition: true,
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
onLoad: function() { // hide the scrollbars from the main window
|
||||
$('html, body').css('overflow', 'hidden');
|
||||
$('#cboxClose').remove();
|
||||
},
|
||||
onClosed: function() {
|
||||
$('html, body').css('overflow', '');
|
||||
var selectedData = $.colorbox.selectedData;
|
||||
if (selectedData == null) // Dialog cancelled, do nothing
|
||||
return;
|
||||
|
||||
var selectionLength = multiple ? selectedData.length : Math.min(selectedData.length, 1);
|
||||
|
||||
for (var i = 0; i < selectionLength ; i++) {
|
||||
var template = @(fieldIdForIds)_Template
|
||||
.replace(/\{contentItemId\}/g, selectedData[i].id)
|
||||
.replace(/\{thumbnail\}/g, selectedData[i].thumbnail)
|
||||
.replace(/\{title\}/g, selectedData[i].title)
|
||||
.replace(/\{editLink\}/g, selectedData[i].editLink);
|
||||
var content = $(template);
|
||||
$('#media-library-picker-@fieldIdForIds ul').append(content);
|
||||
}
|
||||
|
||||
refreshIds();
|
||||
|
||||
if (selectedData.length) {
|
||||
showSaveMsg();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
$(document).on("click",'#media-library-picker-@fieldIdForIds .media-library-picker-remove', function(e) {
|
||||
e.preventDefault();
|
||||
if (!confirm("@HttpUtility.JavaScriptStringEncode(T("Do you really want to remove that media?").Text)")) return false;
|
||||
$(this).closest('li').remove();
|
||||
refreshIds();
|
||||
showSaveMsg();
|
||||
return false;
|
||||
});
|
||||
|
||||
$("#media-library-picker-@fieldIdForIds ul").sortable({
|
||||
handle: '.thumbnail',
|
||||
stop: function() {
|
||||
refreshIds();
|
||||
showSaveMsg();
|
||||
}
|
||||
}).disableSelection();
|
||||
|
||||
})(jQuery);
|
||||
//]]>
|
||||
</script>
|
||||
}
|
||||
@Display.MediaLibraryPicker(
|
||||
FieldName: Html.FieldNameFor(m => m.SelectedIds),
|
||||
DisplayName: Model.Field.DisplayName,
|
||||
Multiple: settings.Multiple,
|
||||
Required: settings.Required,
|
||||
Hint: settings.Hint,
|
||||
ContentItems: Model.ContentItems,
|
||||
PromptOnNavigate: true,
|
||||
ShowSaveWarning: true)
|
||||
@@ -0,0 +1,63 @@
|
||||
@using Orchard.ContentManagement
|
||||
@using Orchard.Utility.Extensions;
|
||||
|
||||
@{
|
||||
Style.Include("media-library-picker-admin.css");
|
||||
Style.Require("jQueryColorBox");
|
||||
Script.Require("jQueryUI_Sortable").AtFoot();
|
||||
Script.Require("jQueryColorBox").AtFoot();
|
||||
Script.Include("media-library-picker.js").AtFoot();
|
||||
|
||||
var fieldName = (string) Model.FieldName;
|
||||
var displayName = (string) Model.DisplayName;
|
||||
var multiple = (bool)(Model.Multiple ?? false);
|
||||
var required = (bool)(Model.Required ?? false);
|
||||
var hint = (string) Model.Hint;
|
||||
var promptOnNavigate = (bool) (Model.PromptOnNavigate ?? true);
|
||||
var showSaveWarning = (bool)(Model.ShowSaveWarning);
|
||||
var contentItems = (IEnumerable<ContentItem>)Model.ContentItems ?? Enumerable.Empty<ContentItem>();
|
||||
var contentManager = WorkContext.Resolve<IContentManager>();
|
||||
}
|
||||
|
||||
<fieldset class="media-library-picker-field"
|
||||
data-multiple="@multiple.ToString().ToLower()"
|
||||
data-remove-text="@T("Remove")"
|
||||
data-remove-prompt="@T("Do you really want to remove that media?")"
|
||||
data-edit-text="@T("Edit")"
|
||||
data-dirty-text="@T("You have unsaved changes. Please only accept to leave if you don't mind losing those changes.")"
|
||||
data-pipe="@T(" | ")"
|
||||
data-add-url="@HttpUtility.JavaScriptStringEncode(Url.Action("Index", "Admin", new { area = "Orchard.MediaLibrary", dialog = true }))"
|
||||
data-return-url="@HttpUtility.JavaScriptStringEncode(Request.RawUrl)"
|
||||
data-prompt-on-navigate="@promptOnNavigate.ToString().ToLower()"
|
||||
data-show-save-warning="@showSaveWarning.ToString().ToLower()">
|
||||
<label @if (required) { <text> class="required" </text> }>@displayName</label>
|
||||
<div class="message message-Warning media-library-picker-message">@T("You need to save your changes.")</div>
|
||||
<div class="items media-library-picker" summary="@displayName">
|
||||
<ul>
|
||||
@foreach (var contentItem in contentItems) {
|
||||
var editRouteValues = contentManager.GetItemMetadata(contentItem).EditorRouteValues;
|
||||
var editUrl = Url.Action(
|
||||
Convert.ToString(editRouteValues["action"]),
|
||||
editRouteValues.Merge(new RouteValueDictionary { { "ReturnUrl", Request.RawUrl } }));
|
||||
<li>
|
||||
<div data-id="@contentItem.Id" class="media-library-picker-item">
|
||||
<div class="thumbnail">
|
||||
@Display(BuildDisplay(contentItem, "Thumbnail"))
|
||||
<div class="overlay">
|
||||
<h3>@Html.ItemDisplayText(contentItem)</h3>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<a href="#" data-id="@contentItem.Id" class="media-library-picker-remove">@T("Remove")</a>@T(" | ")
|
||||
<a href="@editUrl">@T("Edit")</a>
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<span class="button add">@T("Add")</span>
|
||||
</div>
|
||||
<input type="hidden" name="@fieldName" value="@String.Join(",", contentItems.Select(x => x.Id))" class="selected-ids" />
|
||||
<span class="hint">@hint</span>
|
||||
</fieldset>
|
||||
Reference in New Issue
Block a user