Group content and media types by folder when setting up compositions (#3900)

This commit is contained in:
Kenn Jacobsen
2018-12-19 17:59:31 +01:00
committed by Sebastiaan Janssen
parent 8aa5fe8695
commit 47ccc8f584
3 changed files with 69 additions and 25 deletions

View File

@@ -1,13 +1,28 @@
(function() {
"use strict";
function CompositionsOverlay($scope,$location) {
function CompositionsOverlay($scope,$location,$filter) {
var vm = this;
vm.isSelected = isSelected;
vm.openContentType = openContentType;
// group the content types by their container paths
vm.availableGroups = $filter("orderBy")(
_.map(
_.groupBy($scope.model.availableCompositeContentTypes, function (compositeContentType) {
return compositeContentType.contentType.metaData.containerPath;
}), function(group) {
return {
containerPath: group[0].contentType.metaData.containerPath,
compositeContentTypes: group
};
}
), function (group) {
return group.containerPath.replace(/\//g, " ");
});
function isSelected(alias) {
if($scope.model.contentType.compositeContentTypes.indexOf(alias) !== -1) {
return true;

View File

@@ -32,27 +32,32 @@
<li class="umb-checkbox-list__item" ng-repeat="contentTypeEntity in model.whereCompositionUsed"><a ng-click="vm.openContentType(contentTypeEntity.contentType, model.section)"><i class="{{contentTypeEntity.contentType.icon}}"></i>&nbsp;{{contentTypeEntity.contentType.name}}</a></li>
</ul>
</div>
<ul class="umb-checkbox-list">
<li class="umb-checkbox-list__item"
ng-repeat="compositeContentType in model.availableCompositeContentTypes | filter:searchTerm"
ng-class="{'-disabled': compositeContentType.allowed===false || compositeContentType.inherited, '-selected': vm.isSelected(compositeContentType.contentType.alias)}">
<div ng-if="vm.availableGroups.length > 0">
<ul class="umb-checkbox-list" ng-repeat="group in vm.availableGroups | filter:searchTerm">
<li style="font-weight: bold" ng-show="vm.availableGroups.length > 1">
<i class="icon-folder umb-checkbox-list__item-icon"></i>
{{group.containerPath}}
</li>
<li class="umb-checkbox-list__item"
ng-repeat="compositeContentType in group.compositeContentTypes | orderBy:'contentType.name' | filter:searchTerm"
ng-class="{'-disabled': compositeContentType.allowed===false || compositeContentType.inherited, '-selected': vm.isSelected(compositeContentType.contentType.alias)}">
<div class="umb-checkbox-list__item-checkbox"
ng-class="{ '-selected': model.compositeContentTypes.indexOf(compositeContentType.contentType.alias)+1 }">
<input type="checkbox"
id="umb-overlay-comp-{{compositeContentType.contentType.key}}"
checklist-model="model.compositeContentTypes"
checklist-value="compositeContentType.contentType.alias"
ng-change="model.selectCompositeContentType(compositeContentType.contentType)"
ng-disabled="compositeContentType.allowed===false || compositeContentType.inherited" />
</div>
<div class="umb-checkbox-list__item-checkbox"
ng-class="{ '-selected': model.compositeContentTypes.indexOf(compositeContentType.contentType.alias)+1 }">
<input type="checkbox"
id="umb-overlay-comp-{{compositeContentType.contentType.key}}"
checklist-model="model.compositeContentTypes"
checklist-value="compositeContentType.contentType.alias"
ng-change="model.selectCompositeContentType(compositeContentType.contentType)"
ng-disabled="compositeContentType.allowed===false || compositeContentType.inherited" />
</div>
<label for="umb-overlay-comp-{{compositeContentType.contentType.key}}" class="umb-checkbox-list__item-text" ng-class="{'-faded': compositeContentType.allowed===false}">
<i class="{{ compositeContentType.contentType.icon }} umb-checkbox-list__item-icon"></i>
{{ compositeContentType.contentType.name }}
<span class="umb-checkbox-list__item-caption" ng-if="compositeContentType.inherited">(inherited)</span>
</label>
</li>
</ul>
<label for="umb-overlay-comp-{{compositeContentType.contentType.key}}" class="umb-checkbox-list__item-text" ng-class="{'-faded': compositeContentType.allowed===false}">
<i class="{{ compositeContentType.contentType.icon }} umb-checkbox-list__item-icon"></i>
{{ compositeContentType.contentType.name }}
<span class="umb-checkbox-list__item-caption" ng-if="compositeContentType.inherited">(inherited)</span>
</label>
</li>
</ul>
</div>
</div>