yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implement paging for the three entity types that media can be related to

Browse Source
This commit is contained in:
Warren Buckley
2019-11-15 12:50:44 +00:00
parent 85c2269645
commit 8773d644aa
5 changed files with 234 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
src/Umbraco.Web.UI.Client/src/common/directives/components/media/umbmedianodeinfo.directive.js
View File

@@ -1,16 +1,31 @@
(function () {
'use strict';
function MediaNodeInfoDirective($timeout, $location, eventsService, userService, dateHelper, editorService, mediaHelper, mediaResource, $routeParams) {
function MediaNodeInfoDirective($timeout, $location, eventsService, userService, dateHelper, editorService, mediaHelper, mediaResource, $routeParams, $q) {
function link(scope, element, attrs, ctrl) {
var evts = [];
var referencesLoaded = false;
scope.allowChangeMediaType = false;
scope.loading = true;
scope.changeContentPageNumber = changeContentPageNumber;
scope.contentOptions = {};
scope.contentOptions.pageSize = 1;
scope.hasContentReferences = false;
scope.changeMediaPageNumber = changeMediaPageNumber;
scope.mediaOptions = {};
scope.mediaOptions.pageSize = 1;
scope.hasMediaReferences = false;
scope.changeMemberPageNumber = changeMemberPageNumber;
scope.memberOptions = {};
scope.memberOptions.pageSize = 1;
scope.hasMemberReferences = false;
function onInit() {
userService.getCurrentUser().then(function(user){
@@ -96,17 +111,43 @@
setMediaExtension();
});
/** Loads in the media references one time */
function loadRelations() {
if (!referencesLoaded) {
referencesLoaded = true;
mediaResource.getReferences($routeParams.id)
.then(function (data) {
scope.loading = false;
scope.references = data;
scope.hasReferences = data.content.length > 0 || data.members.length > 0;
});
}
function changeContentPageNumber(pageNumber) {
scope.contentOptions.pageNumber = pageNumber;
loadContentRelations();
}
function changeMediaPageNumber(pageNumber) {
scope.mediaOptions.pageNumber = pageNumber;
loadMediaRelations();
}
function changeMemberPageNumber(pageNumber) {
scope.memberOptions.pageNumber = pageNumber;
loadMemberRelations();
}
function loadContentRelations() {
return mediaResource.getPagedContentReferences($routeParams.id, scope.contentOptions)
.then(function (data) {
scope.contentReferences = data;
scope.hasContentReferences = data.items.length > 0;
});
}
function loadMediaRelations() {
return mediaResource.getPagedMediaReferences($routeParams.id, scope.mediaOptions)
.then(function (data) {
scope.mediaReferences = data;
scope.hasMediaReferences = data.items.length > 0;
});
}
function loadMemberRelations() {
return mediaResource.getPagedMemberReferences($routeParams.id, scope.memberOptions)
.then(function (data) {
scope.memberReferences = data;
scope.hasMemberReferences = data.items.length > 0;
});
}
//ensure to unregister from all events!
@@ -122,7 +163,10 @@
evts.push(eventsService.on("app.tabChange", function (event, args) {
$timeout(function () {
if (args.alias === "umbInfo") {
loadRelations();
$q.all([loadContentRelations(), loadMediaRelations(), loadMemberRelations()]).then(function () {
scope.loading = false;
});
}
});
}));

90
src/Umbraco.Web.UI.Client/src/common/resources/media.resource.js
View File

@@ -554,28 +554,88 @@ function mediaResource($q, $http, umbDataFormatter, umbRequestHelper) {
'Failed to retrieve media items for search: ' + query);
},
/**
* @ngdoc method
* @name umbraco.resources.mediaResource#getReferences
* @methodOf umbraco.resources.mediaResource
*
* @description
* Retrieves references of a given media item.
*
* @param {Int} id id of media node to retrieve references for
* @returns {Promise} resourcePromise object.
*
*/
getReferences: function (id) {
getPagedContentReferences: function (id, options) {
var defaults = {
pageSize: 25,
pageNumber: 1
};
if (options === undefined) {
options = {};
}
//overwrite the defaults if there are any specified
angular.extend(defaults, options);
//now copy back to the options we will use
options = defaults;
return umbRequestHelper.resourcePromise(
$http.get(
umbRequestHelper.getApiUrl(
"mediaApiBaseUrl",
"GetReferences",
{ id: id })),
"GetPagedContentReferences",
{
id: id,
pageNumber: options.pageNumber,
pageSize: options.pageSize
}
)),
"Failed to retrieve usages for media of id " + id);
},
getPagedMemberReferences: function (id, options) {
var defaults = {
pageSize: 25,
pageNumber: 1
};
if (options === undefined) {
options = {};
}
//overwrite the defaults if there are any specified
angular.extend(defaults, options);
//now copy back to the options we will use
options = defaults;
return umbRequestHelper.resourcePromise(
$http.get(
umbRequestHelper.getApiUrl(
"mediaApiBaseUrl",
"GetPagedMemberReferences",
{
id: id,
pageNumber: options.pageNumber,
pageSize: options.pageSize
}
)),
"Failed to retrieve usages for media of id " + id);
},
getPagedMediaReferences: function (id, options) {
var defaults = {
pageSize: 25,
pageNumber: 1
};
if (options === undefined) {
options = {};
}
//overwrite the defaults if there are any specified
angular.extend(defaults, options);
//now copy back to the options we will use
options = defaults;
return umbRequestHelper.resourcePromise(
$http.get(
umbRequestHelper.getApiUrl(
"mediaApiBaseUrl",
"GetPagedMediaReferences",
{
id: id,
pageNumber: options.pageNumber,
pageSize: options.pageSize
}
)),
"Failed to retrieve usages for media of id " + id);
}
};
}

44
src/Umbraco.Web.UI.Client/src/views/components/media/umb-media-node-info.html
View File

@@ -29,7 +29,7 @@
</umb-box>
<!-- Media Tracking (NO Items) -->
<umb-box ng-if="loading === false && hasReferences === false">
<umb-box ng-if="(hasContentReferences === false) && (hasMediaReferences === false) && (hasMemberReferences === false) && loading === false">
<umb-box-header title-key="references_tabName"></umb-box-header>
<umb-box-content>
<umb-empty-state size="small">
@@ -39,10 +39,9 @@
</umb-box>
<!-- Media Tracking (With Items) -->
<div ng-if="loading === false && hasReferences === true">
<div ng-if="loading === false">
<!-- Content -->
<div ng-if="references.content.length > 0">
<div ng-if="contentReferences.items.length > 0">
<h5 class="mt4" style="margin-bottom: 20px;">
<localize key="references_labelUsedByDocuments">Used in Documents</localize>
@@ -58,7 +57,7 @@
</div>
</div>
<div class="umb-table-body">
<div class="umb-table-row" ng-repeat="reference in references.content">
<div class="umb-table-row" ng-repeat="reference in contentReferences.items">
<div class="umb-table-cell"><i class="umb-table-body__icon {{reference.icon}}"></i></div>
<div class="umb-table-cell umb-table__name"><span>{{::reference.name}}</span></div>
<div class="umb-table-cell"><span title="{{::reference.alias}}">{{::reference.alias}}</span></div>
@@ -66,10 +65,19 @@
</div>
</div>
</div>
<!-- Pagination -->
<div class="flex justify-center">
<umb-pagination ng-if="contentReferences.totalPages"
page-number="contentReferences.pageNumber"
total-pages="contentReferences.totalPages"
on-change="changeContentPageNumber(pageNumber)">
</umb-pagination>
</div>
</div>
<!-- Members -->
<div ng-if="references.members.length > 0">
<div ng-if="memberReferences.items.length > 0">
<h5 class="mt4" style="margin-bottom: 20px;">
<localize key="references_labelUsedByMembers">Used in Members</localize>
@@ -85,7 +93,7 @@
</div>
</div>
<div class="umb-table-body">
<div class="umb-table-row" ng-repeat="reference in references.members">
<div class="umb-table-row" ng-repeat="reference in memberReferences.items">
<div class="umb-table-cell"><i class="umb-table-body__icon {{reference.icon}}"></i></div>
<div class="umb-table-cell umb-table__name"><span>{{::reference.name}}</span></div>
<div class="umb-table-cell"><span title="{{::reference.alias}}">{{::reference.alias}}</span></div>
@@ -93,10 +101,19 @@
</div>
</div>
</div>
<!-- Pagination -->
<div class="flex justify-center">
<umb-pagination ng-if="memberReferences.totalPages"
page-number="memberReferences.pageNumber"
total-pages="memberReferences.totalPages"
on-change="changeMemberPageNumber(pageNumber)">
</umb-pagination>
</div>
</div>
<!-- Media -->
<div ng-if="references.media.length > 0">
<div ng-if="mediaReferences.items.length > 0">
<h5 class="mt4" style="margin-bottom: 20px;">
<localize key="references_labelUsedByMedia">Used in Media</localize>
@@ -112,7 +129,7 @@
</div>
</div>
<div class="umb-table-body">
<div class="umb-table-row" ng-repeat="reference in references.media">
<div class="umb-table-row" ng-repeat="reference in mediaReferences.items">
<div class="umb-table-cell"><i class="umb-table-body__icon {{reference.icon}}"></i></div>
<div class="umb-table-cell umb-table__name"><span>{{::reference.name}}</span></div>
<div class="umb-table-cell"><span title="{{::reference.alias}}">{{::reference.alias}}</span></div>
@@ -120,6 +137,15 @@
</div>
</div>
</div>
<!-- Pagination -->
<div class="flex justify-center">
<umb-pagination ng-if="mediaReferences.totalPages"
page-number="mediaReferences.pageNumber"
total-pages="mediaReferences.totalPages"
on-change="changeMediaPageNumber(pageNumber)">
</umb-pagination>
</div>
</div>
</div>

123
src/Umbraco.Web/Editors/MediaController.cs
View File

@@ -945,70 +945,73 @@ namespace Umbraco.Web.Editors
return hasPathAccess;
}
/// <summary>
/// Returns the references (usages) for the media item
/// </summary>
/// <param name="id"></param>
/// <returns></returns>
public MediaReferences GetReferences(int id)
public PagedResult<EntityTypeReferences> GetPagedContentReferences(int id, int pageNumber = 1, int pageSize = 100)
{
var result = new MediaReferences();
var relations = Services.RelationService.GetByChildId(id, Constants.Conventions.RelationTypes.RelatedMediaAlias).ToList();
var relationEntities = Services.RelationService.GetParentEntitiesFromRelations(relations).ToList();
var documents = new List<MediaReferences.EntityTypeReferences>();
var members = new List<MediaReferences.EntityTypeReferences>();
var media = new List<MediaReferences.EntityTypeReferences>();
foreach (var item in relationEntities)
if (pageNumber <= 0 || pageSize <= 0)
{
switch (item)
{
case DocumentEntitySlim doc:
documents.Add(new MediaReferences.EntityTypeReferences {
Id = doc.Id,
Key = doc.Key,
Udi = Udi.Create(Constants.UdiEntityType.Document, doc.Key),
Icon = doc.ContentTypeIcon,
Name = doc.Name,
Alias = doc.ContentTypeAlias
});
break;
case MemberEntitySlim memb:
members.Add(new MediaReferences.EntityTypeReferences
{
Id = memb.Id,
Key = memb.Key,
Udi = Udi.Create(Constants.UdiEntityType.Member, memb.Key),
Icon = memb.ContentTypeIcon,
Name = memb.Name,
Alias = memb.ContentTypeAlias
});
break;
case MediaEntitySlim med:
media.Add(new MediaReferences.EntityTypeReferences
{
Id = med.Id,
Key = med.Key,
Udi = Udi.Create(Constants.UdiEntityType.Media, med.Key),
Icon = med.ContentTypeIcon,
Name = med.Name,
Alias = med.ContentTypeAlias
});
break;
default:
break;
}
throw new NotSupportedException("Both pageNumber and pageSize must be greater than zero");
}
result.Content = documents;
result.Members = members;
result.Media = media;
return result;
var relations = Services.RelationService.GetPagedParentEntitiesByChildId(id, pageNumber - 1, pageSize, out long totalRecords, UmbracoObjectTypes.Document);
return new PagedResult<EntityTypeReferences>(totalRecords, pageNumber, pageSize)
{
Items = relations.Cast<DocumentEntitySlim>().Select(doc => new EntityTypeReferences
{
Id = doc.Id,
Key = doc.Key,
Udi = Udi.Create(Constants.UdiEntityType.Document, doc.Key),
Icon = doc.ContentTypeIcon,
Name = doc.Name,
Alias = doc.ContentTypeAlias
})
};
}
public PagedResult<EntityTypeReferences> GetPagedMemberReferences(int id, int pageNumber = 1, int pageSize = 100)
{
if (pageNumber <= 0 || pageSize <= 0)
{
throw new NotSupportedException("Both pageNumber and pageSize must be greater than zero");
}
var relations = Services.RelationService.GetPagedParentEntitiesByChildId(id, pageNumber - 1, pageSize, out long totalRecords, UmbracoObjectTypes.Member);
return new PagedResult<EntityTypeReferences>(totalRecords, pageNumber, pageSize)
{
Items = relations.Cast<MemberEntitySlim>().Select(memb => new EntityTypeReferences
{
Id = memb.Id,
Key = memb.Key,
Udi = Udi.Create(Constants.UdiEntityType.Member, memb.Key),
Icon = memb.ContentTypeIcon,
Name = memb.Name,
Alias = memb.ContentTypeAlias
})
};
}
public PagedResult<EntityTypeReferences> GetPagedMediaReferences(int id, int pageNumber = 1, int pageSize = 100)
{
if (pageNumber <= 0 || pageSize <= 0)
{
throw new NotSupportedException("Both pageNumber and pageSize must be greater than zero");
}
var relations = Services.RelationService.GetPagedParentEntitiesByChildId(id, pageNumber - 1, pageSize, out long totalRecords, UmbracoObjectTypes.Media);
return new PagedResult<EntityTypeReferences>(totalRecords, pageNumber, pageSize)
{
Items = relations.Cast<MediaEntitySlim>().Select(med => new EntityTypeReferences
{
Id = med.Id,
Key = med.Key,
Udi = Udi.Create(Constants.UdiEntityType.Media, med.Key),
Icon = med.ContentTypeIcon,
Name = med.Name,
Alias = med.ContentTypeAlias
})
};
}
}
}

21
src/Umbraco.Web/Models/ContentEditing/MediaReferences.cs
View File

@@ -1,24 +1,9 @@
using System.Collections.Generic;
using System.Linq;
using System.Runtime.Serialization;
using System.Runtime.Serialization;
namespace Umbraco.Web.Models.ContentEditing
{
[DataContract(Name = "mediaReferences", Namespace = "")]
public class MediaReferences
[DataContract(Name = "entityType", Namespace = "")]
public class EntityTypeReferences : EntityBasic
{
[DataMember(Name = "content")]
public IEnumerable<EntityTypeReferences> Content { get; set; } = Enumerable.Empty<EntityTypeReferences>();
[DataMember(Name = "members")]
public IEnumerable<EntityTypeReferences> Members { get; set; } = Enumerable.Empty<EntityTypeReferences>();
[DataMember(Name = "media")]
public IEnumerable<EntityTypeReferences> Media { get; set; } = Enumerable.Empty<EntityTypeReferences>();
[DataContract(Name = "entityType", Namespace = "")]
public class EntityTypeReferences : EntityBasic
{
}
}
}