Warren Buckley
@@ -245,51 +245,21 @@
|
||||
scope.openCompositionsDialog = function() {
|
||||
|
||||
scope.compositionsDialogModel = {
|
||||
title: "Compositions",
|
||||
contentType: scope.model,
|
||||
compositeContentTypes: scope.model.compositeContentTypes,
|
||||
view: "views/common/overlays/contenttypeeditor/compositions/compositions.html",
|
||||
confirmSubmit: {
|
||||
title: "Warning",
|
||||
description: "Removing a composition will delete all the associated property data. Once you save the document type there's no way back, are you sure?",
|
||||
checkboxLabel: "I know what I'm doing",
|
||||
enable: true
|
||||
},
|
||||
submit: function(model, oldModel, confirmed) {
|
||||
view: "views/common/infiniteeditors/compositions/compositions.html",
|
||||
size: "small",
|
||||
submit: function() {
|
||||
|
||||
// make sure that all tabs has an init property
|
||||
if (scope.model.groups.length !== 0) {
|
||||
angular.forEach(scope.model.groups, function(group) {
|
||||
addInitProperty(group);
|
||||
});
|
||||
}
|
||||
|
||||
var compositionRemoved = false;
|
||||
|
||||
// check if any compositions has been removed
|
||||
for(var i = 0; oldModel.compositeContentTypes.length > i; i++) {
|
||||
|
||||
var oldComposition = oldModel.compositeContentTypes[i];
|
||||
|
||||
if(_.contains(model.compositeContentTypes, oldComposition) === false) {
|
||||
compositionRemoved = true;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// show overlay confirm box if compositions has been removed.
|
||||
if(compositionRemoved && confirmed === false) {
|
||||
|
||||
scope.compositionsDialogModel.confirmSubmit.show = true;
|
||||
|
||||
// submit overlay if no compositions has been removed
|
||||
// or the action has been confirmed
|
||||
} else {
|
||||
|
||||
// make sure that all tabs has an init property
|
||||
if (scope.model.groups.length !== 0) {
|
||||
angular.forEach(scope.model.groups, function(group) {
|
||||
addInitProperty(group);
|
||||
});
|
||||
}
|
||||
|
||||
// remove overlay
|
||||
scope.compositionsDialogModel.show = false;
|
||||
scope.compositionsDialogModel = null;
|
||||
}
|
||||
// remove overlay
|
||||
editorService.close();
|
||||
|
||||
},
|
||||
close: function(oldModel) {
|
||||
@@ -299,8 +269,7 @@
|
||||
scope.model.compositeContentTypes = oldModel.contentType.compositeContentTypes;
|
||||
|
||||
// remove overlay
|
||||
scope.compositionsDialogModel.show = false;
|
||||
scope.compositionsDialogModel = null;
|
||||
editorService.close();
|
||||
|
||||
},
|
||||
selectCompositeContentType: function (selectedContentType) {
|
||||
@@ -348,39 +317,40 @@
|
||||
|
||||
}
|
||||
};
|
||||
//select which resource methods to use, eg document Type or Media Type versions
|
||||
var availableContentTypeResource = scope.contentType === "documentType" ? contentTypeResource.getAvailableCompositeContentTypes : mediaTypeResource.getAvailableCompositeContentTypes;
|
||||
var whereUsedContentTypeResource = scope.contentType === "documentType" ? contentTypeResource.getWhereCompositionIsUsedInContentTypes : mediaTypeResource.getWhereCompositionIsUsedInContentTypes;
|
||||
var countContentTypeResource = scope.contentType === "documentType" ? contentTypeResource.getCount : mediaTypeResource.getCount;
|
||||
|
||||
//get the currently assigned property type aliases - ensure we pass these to the server side filer
|
||||
var propAliasesExisting = _.filter(_.flatten(_.map(scope.model.groups, function(g) {
|
||||
return _.map(g.properties, function(p) {
|
||||
return p.alias;
|
||||
});
|
||||
})), function(f) {
|
||||
return f !== null && f !== undefined;
|
||||
});
|
||||
$q.all([
|
||||
//get available composite types
|
||||
availableContentTypeResource(scope.model.id, [], propAliasesExisting).then(function (result) {
|
||||
setupAvailableContentTypesModel(result);
|
||||
}),
|
||||
//get where used document types
|
||||
whereUsedContentTypeResource(scope.model.id).then(function (whereUsed) {
|
||||
//pass to the dialog model the content type eg documentType or mediaType
|
||||
scope.compositionsDialogModel.section = scope.contentType;
|
||||
//pass the list of 'where used' document types
|
||||
scope.compositionsDialogModel.whereCompositionUsed = whereUsed;
|
||||
}),
|
||||
//get content type count
|
||||
countContentTypeResource().then(function(result) {
|
||||
scope.compositionsDialogModel.totalContentTypes = parseInt(result, 10);
|
||||
})
|
||||
]).then(function() {
|
||||
//resolves when both other promises are done, now show it
|
||||
scope.compositionsDialogModel.show = true;
|
||||
});
|
||||
//select which resource methods to use, eg document Type or Media Type versions
|
||||
var availableContentTypeResource = scope.contentType === "documentType" ? contentTypeResource.getAvailableCompositeContentTypes : mediaTypeResource.getAvailableCompositeContentTypes;
|
||||
var whereUsedContentTypeResource = scope.contentType === "documentType" ? contentTypeResource.getWhereCompositionIsUsedInContentTypes : mediaTypeResource.getWhereCompositionIsUsedInContentTypes;
|
||||
var countContentTypeResource = scope.contentType === "documentType" ? contentTypeResource.getCount : mediaTypeResource.getCount;
|
||||
|
||||
//get the currently assigned property type aliases - ensure we pass these to the server side filer
|
||||
var propAliasesExisting = _.filter(_.flatten(_.map(scope.model.groups, function(g) {
|
||||
return _.map(g.properties, function(p) {
|
||||
return p.alias;
|
||||
});
|
||||
})), function(f) {
|
||||
return f !== null && f !== undefined;
|
||||
});
|
||||
$q.all([
|
||||
//get available composite types
|
||||
availableContentTypeResource(scope.model.id, [], propAliasesExisting).then(function (result) {
|
||||
setupAvailableContentTypesModel(result);
|
||||
}),
|
||||
//get where used document types
|
||||
whereUsedContentTypeResource(scope.model.id).then(function (whereUsed) {
|
||||
//pass to the dialog model the content type eg documentType or mediaType
|
||||
scope.compositionsDialogModel.section = scope.contentType;
|
||||
//pass the list of 'where used' document types
|
||||
scope.compositionsDialogModel.whereCompositionUsed = whereUsed;
|
||||
}),
|
||||
//get content type count
|
||||
countContentTypeResource().then(function(result) {
|
||||
scope.compositionsDialogModel.totalContentTypes = parseInt(result, 10);
|
||||
})
|
||||
]).then(function() {
|
||||
//resolves when both other promises are done, now show it
|
||||
editorService.open(scope.compositionsDialogModel);
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
|
||||
@@ -266,3 +266,14 @@ a.umb-variant-switcher__toggle {
|
||||
margin-right: auto;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
/* Confirm */
|
||||
.umb-editor-confirm {
|
||||
background-color: @white;
|
||||
padding: 20px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
z-index: 10;
|
||||
box-shadow: 0 -3px 12px 0px rgba(0,0,0,0.16);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,70 @@
|
||||
(function() {
|
||||
"use strict";
|
||||
|
||||
function CompositionsController($scope,$location) {
|
||||
|
||||
var vm = this;
|
||||
var oldModel = null;
|
||||
|
||||
vm.showConfirmSubmit = false;
|
||||
|
||||
vm.isSelected = isSelected;
|
||||
vm.openContentType = openContentType;
|
||||
vm.submit = submit;
|
||||
vm.close = close;
|
||||
|
||||
function onInit() {
|
||||
|
||||
/* make a copy of the init model so it is possible to roll
|
||||
back the changes on cancel */
|
||||
oldModel = angular.copy($scope.model);
|
||||
|
||||
if(!$scope.model.title) {
|
||||
$scope.model.title = "Compositions";
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function isSelected(alias) {
|
||||
if($scope.model.contentType.compositeContentTypes.indexOf(alias) !== -1) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
function openContentType(contentType, section) {
|
||||
var url = (section === "documentType" ? "/settings/documenttypes/edit/" : "/settings/mediaTypes/edit/") + contentType.id;
|
||||
$location.path(url);
|
||||
}
|
||||
|
||||
function submit() {
|
||||
if ($scope.model && $scope.model.submit) {
|
||||
|
||||
// check if any compositions has been removed
|
||||
vm.compositionRemoved = false;
|
||||
for(var i = 0; oldModel.compositeContentTypes.length > i; i++) {
|
||||
var oldComposition = oldModel.compositeContentTypes[i];
|
||||
if(_.contains($scope.model.compositeContentTypes, oldComposition) === false) {
|
||||
vm.compositionRemoved = true;
|
||||
}
|
||||
}
|
||||
|
||||
/* submit the form if there havne't been removed any composition
|
||||
or the confirm checkbox has been checked */
|
||||
if(!vm.compositionRemoved || vm.allowSubmit) {
|
||||
$scope.model.submit($scope.model);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function close() {
|
||||
if ($scope.model && $scope.model.close) {
|
||||
$scope.model.close(oldModel);
|
||||
}
|
||||
}
|
||||
|
||||
onInit();
|
||||
}
|
||||
|
||||
angular.module("umbraco").controller("Umbraco.Editors.CompositionsController", CompositionsController);
|
||||
|
||||
})();
|
||||
@@ -0,0 +1,123 @@
|
||||
<div ng-controller="Umbraco.Editors.CompositionsController as vm">
|
||||
|
||||
<umb-editor-view>
|
||||
|
||||
<form novalidate name="compositionsForm" val-form-manager>
|
||||
|
||||
<umb-editor-header
|
||||
name="model.title"
|
||||
name-locked="true"
|
||||
hide-alias="true"
|
||||
hide-icon="true"
|
||||
hide-description="true">
|
||||
</umb-editor-header>
|
||||
|
||||
<umb-editor-container>
|
||||
<umb-box>
|
||||
<umb-box-content>
|
||||
|
||||
<div class="umb-control-group">
|
||||
<div class="form-search">
|
||||
<i class="icon-search"></i>
|
||||
<input
|
||||
type="text"
|
||||
style="width: 100%"
|
||||
ng-model="searchTerm"
|
||||
class="umb-search-field search-query input-block-level"
|
||||
localize="placeholder"
|
||||
placeholder="@placeholders_filter"
|
||||
umb-auto-focus
|
||||
no-dirty-check />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="umb-control-group">
|
||||
<localize key="contentTypeEditor_compositionsDescription"></localize>
|
||||
</div>
|
||||
|
||||
<umb-empty-state
|
||||
ng-if="model.availableCompositeContentTypes.length === 0 && model.totalContentTypes <= 1"
|
||||
position="center">
|
||||
<localize key="contentTypeEditor_noAvailableCompositions"></localize>
|
||||
</umb-empty-state>
|
||||
|
||||
<umb-empty-state
|
||||
ng-if="model.availableCompositeContentTypes.length === 0 && model.totalContentTypes > 1">
|
||||
<localize key="contentTypeEditor_compositionInUse"></localize>
|
||||
</umb-empty-state>
|
||||
|
||||
<div ng-if="model.availableCompositeContentTypes.length === 0 && model.totalContentTypes > 1 && model.whereCompositionUsed.length > 0">
|
||||
<h5><localize key="contentTypeEditor_compositionUsageHeading"></localize></h5>
|
||||
<p><localize key="contentTypeEditor_compositionUsageSpecification"></localize></p>
|
||||
<ul class="umb-checkbox-list">
|
||||
<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>
|
||||
{{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 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>
|
||||
|
||||
</umb-box-content>
|
||||
</umb-box>
|
||||
|
||||
<div ng-if="vm.compositionRemoved" class="umb-editor-confirm">
|
||||
<h5 class="red"><i class="icon-alert"></i>Warning</h5>
|
||||
<p>Removing a composition will delete all the associated property data. Once you save the document type there's no way back, are you sure?</p>
|
||||
<label class="checkbox no-indent">
|
||||
<input type="checkbox" ng-model="vm.allowSubmit" />
|
||||
<strong>I know what I'm doing</strong>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
</umb-editor-container>
|
||||
|
||||
<umb-editor-footer>
|
||||
<umb-editor-footer-content-right>
|
||||
<umb-button
|
||||
type="button"
|
||||
button-style="link"
|
||||
label-key="general_close"
|
||||
action="vm.close()">
|
||||
</umb-button>
|
||||
<umb-button
|
||||
type="button"
|
||||
button-style="success"
|
||||
label-key="general_submit"
|
||||
state="vm.saveButtonState"
|
||||
action="vm.submit(model)">
|
||||
</umb-button>
|
||||
</umb-editor-footer-content-right>
|
||||
</umb-editor-footer>
|
||||
|
||||
</form>
|
||||
|
||||
</umb-editor-view>
|
||||
|
||||
</div>
|
||||
@@ -1,25 +0,0 @@
|
||||
(function() {
|
||||
"use strict";
|
||||
|
||||
function CompositionsOverlay($scope,$location) {
|
||||
|
||||
var vm = this;
|
||||
|
||||
vm.isSelected = isSelected;
|
||||
vm.openContentType = openContentType;
|
||||
|
||||
function isSelected(alias) {
|
||||
if($scope.model.contentType.compositeContentTypes.indexOf(alias) !== -1) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
function openContentType(contentType, section) {
|
||||
|
||||
var url = (section === "documentType" ? "/settings/documenttypes/edit/" : "/settings/mediaTypes/edit/") + contentType.id;
|
||||
$location.path(url);
|
||||
}
|
||||
}
|
||||
|
||||
angular.module("umbraco").controller("Umbraco.Overlays.CompositionsOverlay", CompositionsOverlay);
|
||||
|
||||
})();
|
||||
@@ -1,58 +0,0 @@
|
||||
<div ng-controller="Umbraco.Overlays.CompositionsOverlay as vm">
|
||||
|
||||
<div class="umb-control-group">
|
||||
<div class="form-search">
|
||||
<i class="icon-search"></i>
|
||||
<input type="text"
|
||||
style="width: 100%"
|
||||
ng-model="searchTerm"
|
||||
class="umb-search-field search-query input-block-level"
|
||||
localize="placeholder"
|
||||
placeholder="@placeholders_filter"
|
||||
umb-auto-focus
|
||||
no-dirty-check />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="umb-control-group">
|
||||
<localize key="contentTypeEditor_compositionsDescription"></localize>
|
||||
</div>
|
||||
|
||||
<umb-empty-state ng-if="model.availableCompositeContentTypes.length === 0 && model.totalContentTypes <= 1"
|
||||
position="center">
|
||||
<localize key="contentTypeEditor_noAvailableCompositions"></localize>
|
||||
</umb-empty-state>
|
||||
<umb-empty-state ng-if="model.availableCompositeContentTypes.length === 0 && model.totalContentTypes > 1">
|
||||
<localize key="contentTypeEditor_compositionInUse"></localize>
|
||||
</umb-empty-state>
|
||||
<div ng-if="model.availableCompositeContentTypes.length === 0 && model.totalContentTypes > 1 && model.whereCompositionUsed.length > 0">
|
||||
<h5><localize key="contentTypeEditor_compositionUsageHeading"></localize></h5>
|
||||
<p><localize key="contentTypeEditor_compositionUsageSpecification"></localize></p>
|
||||
<ul class="umb-checkbox-list">
|
||||
<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> {{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 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>
|
||||
</div>
|
||||
@@ -299,12 +299,4 @@
|
||||
|
||||
</ul>
|
||||
|
||||
<umb-overlay
|
||||
data-element="overlay-compositions"
|
||||
ng-if="compositionsDialogModel.show"
|
||||
model="compositionsDialogModel"
|
||||
position="right"
|
||||
view="compositionsDialogModel.view">
|
||||
</umb-overlay>
|
||||
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user