Enhancement to allow multi-select for the content picker

This commit is contained in:
Erik Scofield
2015-09-23 00:11:43 -05:00
parent bb41f1f559
commit 59d95f11ee
7 changed files with 99 additions and 28 deletions

View File

@@ -72,6 +72,7 @@
<ItemGroup>
<Compile Include="ViewModels\NavigationPartViewModel.cs" />
<Content Include="Scripts\ContentPicker.js" />
<Content Include="Scripts\RecentContentTab.js" />
<Content Include="Styles\content-picker-admin.css" />
<Content Include="Styles\ContentPicker.css" />
<Content Include="Styles\Images\move.gif" />

View File

@@ -5,6 +5,7 @@ namespace Orchard.ContentPicker {
public void BuildManifests(ResourceManifestBuilder builder) {
var manifest = builder.Add();
manifest.DefineScript("ContentPicker").SetUrl("ContentPicker.js", "ContentPicker.js").SetDependencies("jQuery");
manifest.DefineScript("RecentContentTab").SetUrl("RecentContentTab.js", "RecentContentTab.js").SetDependencies("jQuery");
}
}
}

View File

@@ -80,14 +80,26 @@
addButton.click(function() {
addButton.trigger("orchard-admin-contentpicker-open", {
callback: function(data) {
var tmpl = template.replace( /\{contentItemId\}/g , data.id)
.replace( /\{edit-link\}/g , data.editLink)
.replace( /\{status-text}/g , data.published? "" : " - " + notPublishedText);
var content = $(tmpl);
$(self).find('table.content-picker tbody').append(content);
if (Array.isArray && Array.isArray(data)) {
data.forEach(function (d) {
var tmpl = template.replace(/\{contentItemId\}/g, d.id)
.replace(/\{edit-link\}/g, d.editLink)
.replace(/\{status-text}/g, d.published ? "" : " - " + notPublishedText);
var content = $(tmpl);
$(self).find('table.content-picker tbody').append(content);
});
refreshIds();
$(self).find('.content-picker-message').show();
} else {
var tmpl = template.replace(/\{contentItemId\}/g, data.id)
.replace(/\{edit-link\}/g, data.editLink)
.replace(/\{status-text}/g, data.published ? "" : " - " + notPublishedText);
var content = $(tmpl);
$(self).find('table.content-picker tbody').append(content);
refreshIds();
$(self).find('.content-picker-message').show();
refreshIds();
$(self).find('.content-picker-message').show();
}
},
baseUrl: baseUrl,
part: partName,

View File

@@ -0,0 +1,29 @@
jQuery(function ($) {
Initialize = function () {
$('.button.addSelected').on('click', function () {
var selectedItems = $('.content-picker-itemCheck:checked');
var itemsToAdd = new Array();
$.each(selectedItems, function (index, item) {
var related = $(item).siblings('.content-picker-item').children('.related');
var data = {
id: related.data("id"),
displayText: related.data("display-text"),
editLink: related.data("edit-link"),
editUrl: related.data("edit-url"),
adminUrl: related.data("admin-url"),
displayLink: related.data("display-link"),
published: related.data("published")
};
return itemsToAdd.push(data);
});
window.opener.jQuery[query("callback")](itemsToAdd);
window.close();
});
};
$(document).ready(function () {
return Initialize();
});
});

View File

@@ -19,4 +19,25 @@ body {
padding: 18px;
background: white;
border: 1px solid #E4E5E6;
}
.content-picker-item
{
margin-left: 20px;
}
.content-picker-itemCheck
{
position:absolute;
}
.addSelected
{
margin-bottom: 10px;
}
.page-size-options > div:first-child
{
display:inline-block;
}

View File

@@ -3,27 +3,30 @@
ContentItem contentItem = Model.ContentItem;
}
<div class="summary" itemscope="itemscope" itemid="@contentItem.Id" itemtype="http://orchardproject.net/data/ContentItem">
<div class="properties">
@*<input type="checkbox" value="@contentItem.Id" name="itemIds"/>*@
<h3>@Html.ItemDisplayText(contentItem)</h3> - <div class="contentType">@contentItem.TypeDefinition.DisplayName</div>
@if (Model.Header != null) {
<div class="header">@Display(Model.Header)</div>
}
@if (Model.Meta != null) {
<div class="metadata">@Display(Model.Meta)</div>
<input type="checkbox" class="content-picker-itemCheck" />
<div class="content-picker-item">
<div class="properties">
@*<input type="checkbox" value="@contentItem.Id" name="itemIds"/>*@
<h3>@Html.ItemDisplayText(contentItem)</h3> - <div class="contentType">@contentItem.TypeDefinition.DisplayName</div>
@if (Model.Header != null) {
<div class="header">@Display(Model.Header)</div>
}
@if (Model.Meta != null) {
<div class="metadata">@Display(Model.Meta)</div>
}
</div>
<div class="related"
data-display-text="@Html.ItemDisplayText(contentItem)"
data-id="@contentItem.Id"
data-edit-link="@Html.Encode(Html.ItemEditLink(contentItem))"
data-edit-url="@Html.Encode(Url.ItemEditUrl(contentItem))"
data-admin-url="@Html.Encode(Url.ItemAdminUrl(contentItem))"
data-display-link="@Html.Encode(Html.ItemDisplayLink(contentItem))"
data-published="@contentItem.VersionRecord.Published.ToString().ToLower()" >
@Html.Link(T("Select").Text, "#", new { @class = "button select"})
</div>
@if (Model.Content != null) {
<div class="primary">@Display(Model.Content)</div>
}
</div>
<div class="related"
data-display-text="@Html.ItemDisplayText(contentItem)"
data-id="@contentItem.Id"
data-edit-link="@Html.Encode(Html.ItemEditLink(contentItem))"
data-edit-url="@Html.Encode(Url.ItemEditUrl(contentItem))"
data-admin-url="@Html.Encode(Url.ItemAdminUrl(contentItem))"
data-display-link="@Html.Encode(Html.ItemDisplayLink(contentItem))"
data-published="@contentItem.VersionRecord.Published.ToString().ToLower()" >
@Html.Link(T("Select").Text, "#", new { @class = "button select"})
</div>
@if (Model.Content != null) {
<div class="primary">@Display(Model.Content)</div>
}
</div>

View File

@@ -1,5 +1,7 @@
@using Orchard.Core.Contents.ViewModels;
@{
Script.Include("RecentContentTab.js");
var typeDisplayName = Model.TypeDisplayName;
var pageTitle = T("Recent Content");
@@ -8,6 +10,7 @@
}
Layout.Title = pageTitle;
}
<div class="manage">
@@ -33,6 +36,7 @@
<fieldset class="contentItems bulk-items">
@Display(Model.ContentItems)
</fieldset>
@Html.Link(T("Add Selected").Text, "#", new { @class = "button addSelected"})
@Display(Model.Pager)
}