Merge branch 'dev-v7-contenttypeeditor' of https://github.com/umbraco/Umbraco-CMS into dev-v7-contenttypeeditor
This commit is contained in:
Shannon
@@ -4,22 +4,20 @@ angular.module("umbraco.directives")
|
||||
restrict: 'E',
|
||||
replace: true,
|
||||
templateUrl: 'views/components/editor/umb-editor-sub-views.html',
|
||||
scope: {
|
||||
subViews: "=",
|
||||
model: "="
|
||||
},
|
||||
link: function (scope, element, attrs, ctrl) {
|
||||
|
||||
scope.tools = [];
|
||||
scope.activeView = {};
|
||||
|
||||
// set toolbar from selected navigation item
|
||||
function setToolBar(items) {
|
||||
|
||||
scope.tools = [];
|
||||
function setActiveView(items) {
|
||||
|
||||
for (var index = 0; index < items.length; index++) {
|
||||
var item = items[index];
|
||||
|
||||
if(item.active && item.tools) {
|
||||
scope.tools = item.tools;
|
||||
}
|
||||
var item = items[index];
|
||||
|
||||
if(item.active && item.view) {
|
||||
scope.activeView = item;
|
||||
@@ -28,10 +26,9 @@ angular.module("umbraco.directives")
|
||||
}
|
||||
|
||||
// watch for navigation changes
|
||||
scope.$watch('page.navigation', function(newValue, oldValue) {
|
||||
scope.$watch('subViews', function(newValue, oldValue) {
|
||||
if (newValue) {
|
||||
|
||||
setToolBar(newValue);
|
||||
setActiveView(newValue);
|
||||
}
|
||||
},true);
|
||||
|
||||
|
||||
@@ -0,0 +1,11 @@
|
||||
angular.module("umbraco.directives")
|
||||
.directive('umbEditorToolbar', function () {
|
||||
return {
|
||||
restrict: 'E',
|
||||
replace: true,
|
||||
templateUrl: 'views/components/editor/umb-editor-toolbar.html',
|
||||
scope: {
|
||||
tools: "="
|
||||
}
|
||||
};
|
||||
});
|
||||
@@ -92,6 +92,7 @@
|
||||
@import "components/umb-sub-views.less";
|
||||
@import "components/umb-editor-navigation.less";
|
||||
@import "components/umb-editor-sub-views.less";
|
||||
@import "components/umb-editor-toolbar.less";
|
||||
|
||||
@import "components/umb-file-dropzone.less";
|
||||
|
||||
|
||||
@@ -20,18 +20,4 @@
|
||||
|
||||
.sub-view-column-section {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
/* ---------- TOOLS ---------- */
|
||||
|
||||
.umb-editor-sub-views-tools {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-bottom: 20px;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
.umb-editor-sub-views-tool {
|
||||
margin-left: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
.umb-editor-toolbar {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-bottom: 20px;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
.umb-editor-toolbar-tool {
|
||||
margin-left: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
@@ -1,13 +1,5 @@
|
||||
<div class="umb-editor-sub-views">
|
||||
|
||||
<div class="umb-editor-sub-views-tools">
|
||||
<div class="umb-editor-sub-views-tool" ng-repeat="tool in tools" ng-click="tool.action(tool)">
|
||||
<i class="icon-{{tool.icon}}"></i> {{ tool.name }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-if="activeView.view && activeView.active" ng-include="activeView.view"></div>
|
||||
<div ng-if="!activeView.view && activeView.active" ng-transclude></div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
@@ -0,0 +1,5 @@
|
||||
<div class="umb-editor-toolbar">
|
||||
<div class="umb-editor-toolbar-tool" ng-repeat="tool in tools" ng-click="tool.action(tool)">
|
||||
<i class="icon-{{tool.icon}}"></i> {{ tool.name }}
|
||||
</div>
|
||||
</div>
|
||||
@@ -6,169 +6,163 @@
|
||||
* @description
|
||||
* The controller for the content type editor
|
||||
*/
|
||||
function DocumentTypeEditController($scope, $rootScope, $routeParams, $log, contentTypeResource, entityResource, dataTypeResource, editorState, contentEditingHelper, formHelper, navigationService, iconHelper, contentTypeHelper, dataTypeHelper) {
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
$scope.page = {actions: [], menu: [], subViews: [] };
|
||||
$scope.currentNode = null; //the editors affiliated node
|
||||
function DocumentTypeEditController($routeParams, contentTypeResource, dataTypeResource, editorState, contentEditingHelper, formHelper, navigationService, iconHelper, contentTypeHelper) {
|
||||
|
||||
$scope.page.navigation = [
|
||||
{
|
||||
"name": "Design",
|
||||
"icon": "document-dashed-line",
|
||||
"view": "views/documentType/views/design/design.html",
|
||||
"active": true,
|
||||
"tools": [
|
||||
var vm = this;
|
||||
|
||||
vm.save = save;
|
||||
|
||||
vm.currentNode = null;
|
||||
vm.contentType = {};
|
||||
vm.page = {};
|
||||
vm.page.navigation = [
|
||||
{
|
||||
"name": "Compositions",
|
||||
"icon": "merge",
|
||||
"action": function() {
|
||||
$scope.page.openCompositionsDialog();
|
||||
}
|
||||
"name": "Design",
|
||||
"icon": "document-dashed-line",
|
||||
"view": "views/documentType/views/design/design.html",
|
||||
"active": true
|
||||
},
|
||||
{
|
||||
"name": "Reorder",
|
||||
"icon": "navigation",
|
||||
"action": function() {
|
||||
$scope.page.toggleSortingMode();
|
||||
}
|
||||
"name": "List view",
|
||||
"icon": "list",
|
||||
"view": "views/documentType/views/listview/listview.html"
|
||||
},
|
||||
{
|
||||
"name": "Permissions",
|
||||
"icon": "keychain",
|
||||
"view": "views/documentType/views/permissions/permissions.html"
|
||||
},
|
||||
{
|
||||
"name": "Templates",
|
||||
"icon": "layout",
|
||||
"view": "views/documentType/views/templates/templates.html"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "List view",
|
||||
"icon": "list",
|
||||
"view": "views/documentType/views/listview/listview.html"
|
||||
},
|
||||
{
|
||||
"name": "Permissions",
|
||||
"icon": "keychain",
|
||||
"view": "views/documentType/views/permissions/permissions.html"
|
||||
},
|
||||
{
|
||||
"name": "Templates",
|
||||
"icon": "layout",
|
||||
"view": "views/documentType/views/templates/templates.html"
|
||||
}
|
||||
];
|
||||
|
||||
if ($routeParams.create) {
|
||||
//we are creating so get an empty data type item
|
||||
contentTypeResource.getScaffold($routeParams.id)
|
||||
.then(function(dt) {
|
||||
init(dt);
|
||||
});
|
||||
}
|
||||
else {
|
||||
contentTypeResource.getById($routeParams.id).then(function(dt){
|
||||
init(dt);
|
||||
|
||||
syncTreeNode($scope.contentType, dt.path, true);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/* ---------- SAVE ---------- */
|
||||
|
||||
$scope.save = function() {
|
||||
|
||||
//perform any pre-save logic here
|
||||
|
||||
contentTypeResource.save($scope.contentType).then(function(dt){
|
||||
|
||||
formHelper.resetForm({ scope: $scope, notifications: dt.notifications });
|
||||
contentEditingHelper.handleSuccessfulSave({
|
||||
scope: $scope,
|
||||
savedContent: dt,
|
||||
rebindCallback: function() {
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
//post save logic here -the saved doctype returns as a new object
|
||||
init(dt);
|
||||
|
||||
syncTreeNode($scope.contentType, dt.path);
|
||||
});
|
||||
};
|
||||
];
|
||||
|
||||
|
||||
function init(contentType){
|
||||
|
||||
$scope.contentType = contentType;
|
||||
|
||||
// set all tab to inactive
|
||||
if( $scope.contentType.groups.length !== 0 ) {
|
||||
angular.forEach($scope.contentType.groups, function(group){
|
||||
// set state
|
||||
group.tabState = "inActive";
|
||||
|
||||
// push init/placeholder property
|
||||
contentTypeHelper.addInitProperty(group);
|
||||
|
||||
angular.forEach(group.properties, function(property){
|
||||
|
||||
// get data type detaisl for each property
|
||||
getDataTypeDetails(property);
|
||||
|
||||
if ($routeParams.create) {
|
||||
//we are creating so get an empty data type item
|
||||
contentTypeResource.getScaffold($routeParams.id)
|
||||
.then(function(dt) {
|
||||
init(dt);
|
||||
});
|
||||
}
|
||||
else {
|
||||
contentTypeResource.getById($routeParams.id).then(function(dt){
|
||||
init(dt);
|
||||
|
||||
|
||||
syncTreeNode(vm.contentType, dt.path, true);
|
||||
});
|
||||
}
|
||||
|
||||
// convert legacy icons
|
||||
convertLegacyIcons();
|
||||
|
||||
//set a shared state
|
||||
editorState.set($scope.contentType);
|
||||
/* ---------- SAVE ---------- */
|
||||
|
||||
// add init tab
|
||||
contentTypeHelper.addInitTab($scope.contentType);
|
||||
function save() {
|
||||
|
||||
}
|
||||
//perform any pre-save logic here
|
||||
|
||||
function convertLegacyIcons() {
|
||||
contentTypeResource.save(vm.contentType).then(function(dt){
|
||||
|
||||
// convert icons for composite content types
|
||||
iconHelper.formatContentTypeIcons($scope.contentType.availableCompositeContentTypes);
|
||||
formHelper.resetForm({ scope: vm, notifications: dt.notifications });
|
||||
contentEditingHelper.handleSuccessfulSave({
|
||||
scope: vm,
|
||||
savedContent: dt,
|
||||
rebindCallback: function() {
|
||||
|
||||
// make array to store contentType icon
|
||||
var contentTypeArray = [];
|
||||
|
||||
// push icon to array
|
||||
contentTypeArray.push({"icon":$scope.contentType.icon});
|
||||
|
||||
// run through icon method
|
||||
iconHelper.formatContentTypeIcons(contentTypeArray);
|
||||
|
||||
// set icon back on contentType
|
||||
$scope.contentType.icon = contentTypeArray[0].icon;
|
||||
|
||||
}
|
||||
|
||||
function getDataTypeDetails(property) {
|
||||
|
||||
if( property.propertyState !== 'init' ) {
|
||||
|
||||
dataTypeResource.getById(property.dataTypeId)
|
||||
.then(function(dataType) {
|
||||
property.dataTypeIcon = dataType.icon;
|
||||
property.dataTypeName = dataType.name;
|
||||
}
|
||||
});
|
||||
|
||||
//post save logic here -the saved doctype returns as a new object
|
||||
init(dt);
|
||||
|
||||
syncTreeNode(vm.contentType, dt.path);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function init(contentType){
|
||||
|
||||
vm.contentType = contentType;
|
||||
|
||||
// set all tab to inactive
|
||||
if( vm.contentType.groups.length !== 0 ) {
|
||||
angular.forEach(vm.contentType.groups, function(group){
|
||||
// set state
|
||||
group.tabState = "inActive";
|
||||
|
||||
// push init/placeholder property
|
||||
contentTypeHelper.addInitProperty(group);
|
||||
|
||||
angular.forEach(group.properties, function(property){
|
||||
|
||||
// get data type detaisl for each property
|
||||
getDataTypeDetails(property);
|
||||
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
// convert legacy icons
|
||||
convertLegacyIcons();
|
||||
|
||||
//set a shared state
|
||||
editorState.set(vm.contentType);
|
||||
|
||||
// add init tab
|
||||
contentTypeHelper.addInitTab(vm.contentType);
|
||||
|
||||
}
|
||||
|
||||
function convertLegacyIcons() {
|
||||
|
||||
// convert icons for composite content types
|
||||
iconHelper.formatContentTypeIcons(vm.contentType.availableCompositeContentTypes);
|
||||
|
||||
// make array to store contentType icon
|
||||
var contentTypeArray = [];
|
||||
|
||||
// push icon to array
|
||||
contentTypeArray.push({"icon":vm.contentType.icon});
|
||||
|
||||
// run through icon method
|
||||
iconHelper.formatContentTypeIcons(contentTypeArray);
|
||||
|
||||
// set icon back on contentType
|
||||
vm.contentType.icon = contentTypeArray[0].icon;
|
||||
|
||||
}
|
||||
|
||||
function getDataTypeDetails(property) {
|
||||
|
||||
if( property.propertyState !== 'init' ) {
|
||||
|
||||
dataTypeResource.getById(property.dataTypeId)
|
||||
.then(function(dataType) {
|
||||
property.dataTypeIcon = dataType.icon;
|
||||
property.dataTypeName = dataType.name;
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/** Syncs the content type to it's tree node - this occurs on first load and after saving */
|
||||
function syncTreeNode(dt, path, initialLoad) {
|
||||
/** Syncs the content type to it's tree node - this occurs on first load and after saving */
|
||||
function syncTreeNode(dt, path, initialLoad) {
|
||||
|
||||
navigationService.syncTree({ tree: "documenttype", path: path.split(","), forceReload: initialLoad !== true }).then(function (syncArgs) {
|
||||
$scope.currentNode = syncArgs.node;
|
||||
});
|
||||
navigationService.syncTree({ tree: "documenttype", path: path.split(","), forceReload: initialLoad !== true }).then(function (syncArgs) {
|
||||
vm.currentNode = syncArgs.node;
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
angular.module("umbraco").controller("Umbraco.Editors.DocumentType.EditController", DocumentTypeEditController);
|
||||
|
||||
angular.module("umbraco").controller("Umbraco.Editors.DocumentType.EditController", DocumentTypeEditController);
|
||||
})();
|
||||
|
||||
@@ -1,23 +1,24 @@
|
||||
<div ng-controller="Umbraco.Editors.DocumentType.EditController">
|
||||
<div ng-controller="Umbraco.Editors.DocumentType.EditController as vm">
|
||||
<form novalidate name="contentTypeForm"
|
||||
ng-submit="save()"
|
||||
ng-submit="vm.save()"
|
||||
val-form-manager>
|
||||
|
||||
<umb-editor-view>
|
||||
|
||||
<umb-editor-header
|
||||
name="contentType.name"
|
||||
alias="contentType.alias"
|
||||
description="contentType.description"
|
||||
navigation="page.navigation"
|
||||
icon="contentType.icon">
|
||||
name="vm.contentType.name"
|
||||
alias="vm.contentType.alias"
|
||||
description="vm.contentType.description"
|
||||
navigation="vm.page.navigation"
|
||||
icon="vm.contentType.icon">
|
||||
</umb-editor-header>
|
||||
|
||||
<umb-editor-container class="editors-document-type-container">
|
||||
|
||||
<div class="editors-document-type-canvas">
|
||||
|
||||
<umb-editor-sub-views></umb-editor-sub-views>
|
||||
<umb-editor-sub-views sub-views="vm.page.navigation" model="vm.contentType"></umb-editor-sub-views>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
@@ -6,277 +6,303 @@
|
||||
* @description
|
||||
* The controller for the content type editor list view section
|
||||
*/
|
||||
function DesignController($scope, contentTypeResource, dataTypeResource, contentTypeHelper, dataTypeHelper) {
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
$scope.sortingMode = false;
|
||||
function DesignController($scope, contentTypeResource, dataTypeResource, contentTypeHelper, dataTypeHelper) {
|
||||
|
||||
/* ---------- TOOLBAR ---------- */
|
||||
var vm = this;
|
||||
|
||||
$scope.page.toggleSortingMode = function() {
|
||||
$scope.sortingMode = !$scope.sortingMode;
|
||||
};
|
||||
vm.addTab = addTab;
|
||||
vm.removeTab = removeTab;
|
||||
vm.activateTab = activateTab;
|
||||
vm.updateTabTitle = updateTabTitle;
|
||||
vm.toggleGroupSize = toggleGroupSize;
|
||||
vm.editPropertyTypeSettings = editPropertyTypeSettings;
|
||||
vm.choosePropertyType = choosePropertyType;
|
||||
vm.configDataType = configDataType;
|
||||
vm.deleteProperty = deleteProperty;
|
||||
|
||||
$scope.page.openCompositionsDialog = function() {
|
||||
$scope.dialogModel = {};
|
||||
$scope.dialogModel.title = "Compositions";
|
||||
$scope.dialogModel.availableCompositeContentTypes = $scope.contentType.availableCompositeContentTypes;
|
||||
$scope.dialogModel.compositeContentTypes = $scope.contentType.compositeContentTypes;
|
||||
$scope.dialogModel.view = "views/documentType/dialogs/compositions/compositions.html";
|
||||
$scope.showDialog = true;
|
||||
|
||||
$scope.dialogModel.close = function(){
|
||||
$scope.showDialog = false;
|
||||
$scope.dialogModel = null;
|
||||
};
|
||||
|
||||
$scope.dialogModel.selectCompositeContentType = function(compositeContentType) {
|
||||
|
||||
if( $scope.contentType.compositeContentTypes.indexOf(compositeContentType.alias) === -1 ) {
|
||||
|
||||
//merge composition with content type
|
||||
contentTypeHelper.mergeCompositeContentType($scope.contentType, compositeContentType);
|
||||
|
||||
} else {
|
||||
|
||||
// split composition from content type
|
||||
contentTypeHelper.splitCompositeContentType($scope.contentType, compositeContentType);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/* ---------- TABS ---------- */
|
||||
|
||||
$scope.addTab = function(tab){
|
||||
|
||||
$scope.activateTab(tab);
|
||||
|
||||
// push new init tab to the scope
|
||||
contentTypeHelper.addInitTab($scope.contentType);
|
||||
|
||||
};
|
||||
|
||||
$scope.removeTab = function(tabIndex) {
|
||||
$scope.contentType.groups.splice(tabIndex, 1);
|
||||
};
|
||||
|
||||
$scope.activateTab = function(tab) {
|
||||
|
||||
// set all other tabs that are inactive to active
|
||||
angular.forEach($scope.contentType.groups, function(group){
|
||||
// skip init tab
|
||||
if(group.tabState !== "init") {
|
||||
group.tabState = "inActive";
|
||||
}
|
||||
});
|
||||
|
||||
tab.tabState = "active";
|
||||
|
||||
};
|
||||
|
||||
$scope.updateTabTitle = function(tab) {
|
||||
if(tab.properties.length === 0) {
|
||||
contentTypeHelper.addInitProperty(tab);
|
||||
}
|
||||
};
|
||||
|
||||
/* ---------- PROPERTIES ---------- */
|
||||
|
||||
$scope.toggleGroupSize = function(group){
|
||||
if(group.columns !== 12){
|
||||
group.columns = 12;
|
||||
}else{
|
||||
group.columns = 6;
|
||||
}
|
||||
};
|
||||
|
||||
$scope.editPropertyTypeSettings = function(property) {
|
||||
|
||||
if(!property.inherited) {
|
||||
|
||||
$scope.dialogModel = {};
|
||||
$scope.dialogModel.title = "Edit property type settings";
|
||||
$scope.dialogModel.property = property;
|
||||
$scope.dialogModel.view = "views/documentType/dialogs/editPropertySettings/editPropertySettings.html";
|
||||
$scope.showDialog = true;
|
||||
|
||||
// set indicator on property to tell the dialog is open - is used to set focus on the element
|
||||
property.dialogIsOpen = true;
|
||||
|
||||
// set property to active
|
||||
property.propertyState = "active";
|
||||
|
||||
$scope.dialogModel.changePropertyEditor = function(property) {
|
||||
$scope.choosePropertyType(property);
|
||||
};
|
||||
|
||||
$scope.dialogModel.editDataType = function(property) {
|
||||
$scope.configDataType(property);
|
||||
};
|
||||
|
||||
$scope.dialogModel.submit = function(model){
|
||||
|
||||
property.dialogIsOpen = false;
|
||||
|
||||
$scope.showDialog = false;
|
||||
$scope.dialogModel = null;
|
||||
|
||||
// push new init property to scope
|
||||
contentTypeHelper.addInitPropertyOnActiveTab($scope.contentType);
|
||||
|
||||
};
|
||||
|
||||
$scope.dialogModel.close = function(model){
|
||||
$scope.showDialog = false;
|
||||
$scope.dialogModel = null;
|
||||
|
||||
// push new init property to scope
|
||||
contentTypeHelper.addInitPropertyOnActiveTab($scope.contentType);
|
||||
};
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
$scope.choosePropertyType = function(property) {
|
||||
|
||||
$scope.dialogModel = {};
|
||||
$scope.dialogModel.title = "Choose property type";
|
||||
$scope.dialogModel.view = "views/documentType/dialogs/property.html";
|
||||
$scope.showDialog = true;
|
||||
|
||||
property.dialogIsOpen = true;
|
||||
|
||||
$scope.dialogModel.selectDataType = function(selectedDataType) {
|
||||
|
||||
contentTypeResource.getPropertyTypeScaffold(selectedDataType.id).then(function(propertyType){
|
||||
|
||||
property.config = propertyType.config;
|
||||
property.editor = propertyType.editor;
|
||||
property.view = propertyType.view;
|
||||
property.dataTypeId = selectedDataType.id;
|
||||
property.dataTypeIcon = selectedDataType.icon;
|
||||
property.dataTypeName = selectedDataType.name;
|
||||
|
||||
property.propertyState = "active";
|
||||
|
||||
console.log(property);
|
||||
|
||||
// open data type configuration
|
||||
$scope.editPropertyTypeSettings(property);
|
||||
|
||||
// push new init tab to scope
|
||||
contentTypeHelper.addInitTab($scope.contentType);
|
||||
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
$scope.dialogModel.close = function(model){
|
||||
$scope.editPropertyTypeSettings(property);
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
$scope.configDataType = function(property) {
|
||||
|
||||
$scope.dialogModel = {};
|
||||
$scope.dialogModel.title = "Edit data type";
|
||||
$scope.dialogModel.dataType = {};
|
||||
$scope.dialogModel.property = property;
|
||||
$scope.dialogModel.view = "views/documentType/dialogs/editDataType/editDataType.html";
|
||||
$scope.dialogModel.multiActions = [
|
||||
vm.sortingMode = false;
|
||||
vm.toolbar = [
|
||||
{
|
||||
label: "Save",
|
||||
action: function(dataType) {
|
||||
saveDataType(dataType, false);
|
||||
"name": "Compositions",
|
||||
"icon": "merge",
|
||||
"action": function() {
|
||||
openCompositionsDialog();
|
||||
}
|
||||
},
|
||||
{
|
||||
label: "Save as new",
|
||||
action: function(dataType) {
|
||||
saveDataType(dataType, true);
|
||||
"name": "Reorder",
|
||||
"icon": "navigation",
|
||||
"action": function() {
|
||||
toggleSortingMode();
|
||||
}
|
||||
}
|
||||
];
|
||||
$scope.showDialog = true;
|
||||
vm.sortableOptionsTab = {
|
||||
distance: 10,
|
||||
tolerance: "pointer",
|
||||
opacity: 0.7,
|
||||
scroll: true,
|
||||
cursor: "move",
|
||||
placeholder: "ui-sortable-tabs-placeholder",
|
||||
zIndex: 6000,
|
||||
handle: ".edt-tab-handle",
|
||||
items: ".edt-tab-sortable",
|
||||
start: function (e, ui) {
|
||||
ui.placeholder.height(ui.item.height());
|
||||
},
|
||||
stop: function(e, ui){
|
||||
|
||||
function saveDataType(dataType, isNew) {
|
||||
}
|
||||
};
|
||||
vm.sortableOptionsEditor = {
|
||||
distance: 10,
|
||||
tolerance: "pointer",
|
||||
connectWith: ".edt-property-list",
|
||||
opacity: 0.7,
|
||||
scroll: true,
|
||||
cursor: "move",
|
||||
placeholder: "ui-sortable-properties-placeholder",
|
||||
zIndex: 6000,
|
||||
handle: ".edt-property-handle",
|
||||
items: ".edt-property-sortable",
|
||||
start: function (e, ui) {
|
||||
ui.placeholder.height(ui.item.height());
|
||||
},
|
||||
stop: function(e, ui){
|
||||
|
||||
var preValues = dataTypeHelper.createPreValueProps(dataType.preValues);
|
||||
}
|
||||
};
|
||||
|
||||
dataTypeResource.save(dataType, preValues, isNew).then(function(dataType) {
|
||||
/* ---------- TOOLBAR ---------- */
|
||||
|
||||
contentTypeResource.getPropertyTypeScaffold(dataType.id).then(function(propertyType){
|
||||
function toggleSortingMode() {
|
||||
vm.sortingMode = !vm.sortingMode;
|
||||
}
|
||||
|
||||
function openCompositionsDialog() {
|
||||
vm.dialogModel = {};
|
||||
vm.dialogModel.title = "Compositions";
|
||||
vm.dialogModel.availableCompositeContentTypes = $scope.model.availableCompositeContentTypes;
|
||||
vm.dialogModel.compositeContentTypes = $scope.model.compositeContentTypes;
|
||||
vm.dialogModel.view = "views/documentType/dialogs/compositions/compositions.html";
|
||||
vm.showDialog = true;
|
||||
|
||||
vm.dialogModel.close = function(){
|
||||
vm.showDialog = false;
|
||||
vm.dialogModel = null;
|
||||
};
|
||||
|
||||
vm.dialogModel.selectCompositeContentType = function(compositeContentType) {
|
||||
|
||||
if( $scope.model.compositeContentTypes.indexOf(compositeContentType.alias) === -1 ) {
|
||||
|
||||
//merge composition with content type
|
||||
contentTypeHelper.mergeCompositeContentType($scope.model, compositeContentType);
|
||||
|
||||
} else {
|
||||
|
||||
// split composition from content type
|
||||
contentTypeHelper.splitCompositeContentType($scope.model, compositeContentType);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/* ---------- TABS ---------- */
|
||||
|
||||
function addTab(tab){
|
||||
|
||||
vm.activateTab(tab);
|
||||
|
||||
// push new init tab to the scope
|
||||
contentTypeHelper.addInitTab($scope.model);
|
||||
|
||||
}
|
||||
|
||||
function removeTab(tabIndex) {
|
||||
$scope.model.groups.splice(tabIndex, 1);
|
||||
}
|
||||
|
||||
function activateTab(tab) {
|
||||
|
||||
// set all other tabs that are inactive to active
|
||||
angular.forEach($scope.model.groups, function(group){
|
||||
// skip init tab
|
||||
if(group.tabState !== "init") {
|
||||
group.tabState = "inActive";
|
||||
}
|
||||
});
|
||||
|
||||
tab.tabState = "active";
|
||||
|
||||
}
|
||||
|
||||
function updateTabTitle(tab) {
|
||||
if(tab.properties.length === 0) {
|
||||
contentTypeHelper.addInitProperty(tab);
|
||||
}
|
||||
}
|
||||
|
||||
/* ---------- PROPERTIES ---------- */
|
||||
|
||||
function toggleGroupSize(group){
|
||||
if(group.columns !== 12){
|
||||
group.columns = 12;
|
||||
}else{
|
||||
group.columns = 6;
|
||||
}
|
||||
}
|
||||
|
||||
function editPropertyTypeSettings(property) {
|
||||
|
||||
if(!property.inherited) {
|
||||
|
||||
vm.dialogModel = {};
|
||||
vm.dialogModel.title = "Edit property type settings";
|
||||
vm.dialogModel.property = property;
|
||||
vm.dialogModel.view = "views/documentType/dialogs/editPropertySettings/editPropertySettings.html";
|
||||
vm.showDialog = true;
|
||||
|
||||
// set indicator on property to tell the dialog is open - is used to set focus on the element
|
||||
property.dialogIsOpen = true;
|
||||
|
||||
// set property to active
|
||||
property.propertyState = "active";
|
||||
|
||||
vm.dialogModel.changePropertyEditor = function(property) {
|
||||
choosePropertyType(property);
|
||||
};
|
||||
|
||||
vm.dialogModel.editDataType = function(property) {
|
||||
configDataType(property);
|
||||
};
|
||||
|
||||
vm.dialogModel.submit = function(model){
|
||||
|
||||
property.dialogIsOpen = false;
|
||||
|
||||
vm.showDialog = false;
|
||||
vm.dialogModel = null;
|
||||
|
||||
// push new init property to scope
|
||||
contentTypeHelper.addInitPropertyOnActiveTab($scope.model);
|
||||
|
||||
};
|
||||
|
||||
vm.dialogModel.close = function(model){
|
||||
vm.showDialog = false;
|
||||
vm.dialogModel = null;
|
||||
|
||||
// push new init property to scope
|
||||
contentTypeHelper.addInitPropertyOnActiveTab($scope.model);
|
||||
};
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
function choosePropertyType(property) {
|
||||
|
||||
vm.dialogModel = {};
|
||||
vm.dialogModel.title = "Choose property type";
|
||||
vm.dialogModel.view = "views/documentType/dialogs/property.html";
|
||||
vm.showDialog = true;
|
||||
|
||||
property.dialogIsOpen = true;
|
||||
|
||||
vm.dialogModel.selectDataType = function(selectedDataType) {
|
||||
|
||||
contentTypeResource.getPropertyTypeScaffold(selectedDataType.id).then(function(propertyType){
|
||||
|
||||
property.config = propertyType.config;
|
||||
property.editor = propertyType.editor;
|
||||
property.view = propertyType.view;
|
||||
property.dataTypeId = dataType.id;
|
||||
property.dataTypeIcon = dataType.icon;
|
||||
property.dataTypeName = dataType.name;
|
||||
property.dataTypeId = selectedDataType.id;
|
||||
property.dataTypeIcon = selectedDataType.icon;
|
||||
property.dataTypeName = selectedDataType.name;
|
||||
|
||||
// open settings dialog
|
||||
$scope.editPropertyTypeSettings(property);
|
||||
property.propertyState = "active";
|
||||
|
||||
console.log(property);
|
||||
|
||||
// open data type configuration
|
||||
editPropertyTypeSettings(property);
|
||||
|
||||
// push new init tab to scope
|
||||
contentTypeHelper.addInitTab($scope.model);
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
};
|
||||
|
||||
vm.dialogModel.close = function(model){
|
||||
editPropertyTypeSettings(property);
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
$scope.dialogModel.close = function(model){
|
||||
$scope.editPropertyTypeSettings(property);
|
||||
};
|
||||
function configDataType(property) {
|
||||
|
||||
};
|
||||
vm.dialogModel = {};
|
||||
vm.dialogModel.title = "Edit data type";
|
||||
vm.dialogModel.dataType = {};
|
||||
vm.dialogModel.property = property;
|
||||
vm.dialogModel.view = "views/documentType/dialogs/editDataType/editDataType.html";
|
||||
vm.dialogModel.multiActions = [
|
||||
{
|
||||
label: "Save",
|
||||
action: function(dataType) {
|
||||
saveDataType(dataType, false);
|
||||
}
|
||||
},
|
||||
{
|
||||
label: "Save as new",
|
||||
action: function(dataType) {
|
||||
saveDataType(dataType, true);
|
||||
}
|
||||
}
|
||||
];
|
||||
vm.showDialog = true;
|
||||
|
||||
$scope.deleteProperty = function(tab, propertyIndex) {
|
||||
tab.properties.splice(propertyIndex, 1);
|
||||
};
|
||||
function saveDataType(dataType, isNew) {
|
||||
|
||||
var preValues = dataTypeHelper.createPreValueProps(dataType.preValues);
|
||||
|
||||
/* ---------- SORTING OPTIONS ---------- */
|
||||
dataTypeResource.save(dataType, preValues, isNew).then(function(dataType) {
|
||||
|
||||
$scope.sortableOptionsTab = {
|
||||
distance: 10,
|
||||
tolerance: "pointer",
|
||||
opacity: 0.7,
|
||||
scroll: true,
|
||||
cursor: "move",
|
||||
placeholder: "ui-sortable-tabs-placeholder",
|
||||
zIndex: 6000,
|
||||
handle: ".edt-tab-handle",
|
||||
items: ".edt-tab-sortable",
|
||||
start: function (e, ui) {
|
||||
ui.placeholder.height(ui.item.height());
|
||||
},
|
||||
stop: function(e, ui){
|
||||
contentTypeResource.getPropertyTypeScaffold(dataType.id).then(function(propertyType){
|
||||
|
||||
property.config = propertyType.config;
|
||||
property.editor = propertyType.editor;
|
||||
property.view = propertyType.view;
|
||||
property.dataTypeId = dataType.id;
|
||||
property.dataTypeIcon = dataType.icon;
|
||||
property.dataTypeName = dataType.name;
|
||||
|
||||
// open settings dialog
|
||||
editPropertyTypeSettings(property);
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
vm.dialogModel.close = function(model){
|
||||
editPropertyTypeSettings(property);
|
||||
};
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
$scope.sortableOptionsEditor = {
|
||||
distance: 10,
|
||||
tolerance: "pointer",
|
||||
connectWith: ".edt-property-list",
|
||||
opacity: 0.7,
|
||||
scroll: true,
|
||||
cursor: "move",
|
||||
placeholder: "ui-sortable-properties-placeholder",
|
||||
zIndex: 6000,
|
||||
handle: ".edt-property-handle",
|
||||
items: ".edt-property-sortable",
|
||||
start: function (e, ui) {
|
||||
ui.placeholder.height(ui.item.height());
|
||||
},
|
||||
stop: function(e, ui){
|
||||
|
||||
function deleteProperty(tab, propertyIndex) {
|
||||
tab.properties.splice(propertyIndex, 1);
|
||||
}
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
angular.module("umbraco").controller("Umbraco.Editors.DocumentType.DesignController", DesignController);
|
||||
angular.module("umbraco").controller("Umbraco.Editors.DocumentType.DesignController", DesignController);
|
||||
})();
|
||||
|
||||
@@ -1,10 +1,13 @@
|
||||
<div ng-controller="Umbraco.Editors.DocumentType.DesignController" ng-class="{'is-in-sorting-mode': sortingMode}">
|
||||
<ul ui-sortable="sortableOptionsTab" ng-model="contentType.groups" class="content-type-groups-list no-style-list">
|
||||
<div ng-controller="Umbraco.Editors.DocumentType.DesignController as vm" ng-class="{'is-in-sorting-mode': vm.sortingMode}">
|
||||
|
||||
<li ng-repeat="tab in contentType.groups" ng-class="{'edt-tab-sortable': sortingMode && !tab.inherited}">
|
||||
<umb-editor-toolbar tools="vm.toolbar"></umb-editor-toolbar>
|
||||
|
||||
<ul ui-sortable="sortableOptionsTab" ng-model="model.groups" class="content-type-groups-list no-style-list">
|
||||
|
||||
<li ng-repeat="tab in model.groups" ng-class="{'edt-tab-sortable': vm.sortingMode && !tab.inherited}">
|
||||
|
||||
<!-- TAB INIT STATE -->
|
||||
<div class="edt-tab umb-card edt-tab-placeholder" ng-click="addTab(tab)" ng-show="tab.tabState=='init' && !sortingMode" ng-class="{'tab-state-init animated fadeIn': tab.tabState=='init'}">
|
||||
<div class="edt-tab umb-card edt-tab-placeholder" ng-click="vm.addTab(tab)" ng-show="tab.tabState=='init' && !vm.sortingMode" ng-class="{'tab-state-init animated fadeIn': tab.tabState=='init'}">
|
||||
|
||||
<div class="tab-title-wrapper">
|
||||
<div class="tab-title">
|
||||
@@ -13,24 +16,24 @@
|
||||
</div>
|
||||
|
||||
<div class="edt-tab-center-text">
|
||||
<span ng-if="contentType.groups.length === 1">Add new tab</span>
|
||||
<span ng-if="contentType.groups.length > 1">Add another tab</span>
|
||||
<span ng-if="model.groups.length === 1">Add new tab</span>
|
||||
<span ng-if="model.groups.length > 1">Add another tab</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- TAB ACTIVE OR INACTIVE STATE -->
|
||||
<div class="edt-tab umb-card" ng-class="{'tab-state-active':tab.tabState=='active', 'tab-state-inactive': tab.tabState=='inActive', 'tab-is-inherited': tab.inherited, 'edt-tab-handle': sortingMode && !tab.inherited}" ng-click="activateTab(tab)" ng-if="tab.tabState !== 'init'">
|
||||
<div class="edt-tab umb-card" ng-class="{'tab-state-active':tab.tabState=='active', 'tab-state-inactive': tab.tabState=='inActive', 'tab-is-inherited': tab.inherited, 'edt-tab-handle': vm.sortingMode && !tab.inherited}" ng-click="vm.activateTab(tab)" ng-if="tab.tabState !== 'init'">
|
||||
|
||||
<div class="tab-remove" ng-if="!sortingMode && tab.properties.length <= 1">
|
||||
<i class="icon icon-trash" ng-click="removeTab($index)"></i>
|
||||
<div class="tab-remove" ng-if="!vm.sortingMode && tab.properties.length <= 1">
|
||||
<i class="icon icon-trash" ng-click="vm.removeTab($index)"></i>
|
||||
</div>
|
||||
|
||||
<div class="tab-title-wrapper">
|
||||
|
||||
<div class="tab-title">
|
||||
<i class="icon icon-navigation" ng-if="sortingMode && !tab.inherited"></i>
|
||||
<input class="tab-title-input" type="text" placeholder="Enter name..." ng-model="tab.name" ng-class="{'tab-title-placeholder': tab.name == ''}" ng-change="updateTabTitle(tab)" umb-blur="updateTabTitle(tab)" ng-disabled="tab.inherited" umb-auto-focus umb-auto-resize />
|
||||
<i class="icon icon-navigation" ng-if="vm.sortingMode && !tab.inherited"></i>
|
||||
<input class="tab-title-input" type="text" placeholder="Enter name..." ng-model="tab.name" ng-class="{'tab-title-placeholder': tab.name == ''}" ng-change="vm.updateTabTitle(tab)" umb-blur="vm.updateTabTitle(tab)" ng-disabled="tab.inherited" umb-auto-focus umb-auto-resize />
|
||||
</div>
|
||||
|
||||
<div class="edt-tab-inherited-from" ng-if="tab.inherited">
|
||||
@@ -46,10 +49,10 @@
|
||||
<div class="edt-property-group">
|
||||
<ul class="edt-property-list no-style-list" ui-sortable="sortableOptionsEditor"
|
||||
ng-model="tab.properties" class="no-style-list">
|
||||
<li ng-class="{'edt-property-sortable': sortingMode && !property.inherited}" ng-repeat="property in tab.properties">
|
||||
<li ng-class="{'edt-property-sortable': vm.sortingMode && !property.inherited}" ng-repeat="property in tab.properties">
|
||||
|
||||
<!-- Init property / Property placeholder / add new property -->
|
||||
<div class="edt-property" ng-show="property.propertyState=='init'" ng-class="{'property-state-init animated fadeIn': property.propertyState=='init'}" ng-click="editPropertyTypeSettings(property)">
|
||||
<div class="edt-property" ng-show="property.propertyState=='init'" ng-class="{'property-state-init animated fadeIn': property.propertyState=='init'}" ng-click="vm.editPropertyTypeSettings(property)">
|
||||
|
||||
<div class="edt-property-meta">
|
||||
<div class="placeholder-input-small"></div>
|
||||
@@ -69,14 +72,14 @@
|
||||
|
||||
</div>
|
||||
|
||||
<div class="edt-property" ng-show="property.propertyState!=='init'" ng-class="{'active': property.dialogIsOpen, 'property-state-active animated fadeIn': property.propertyState=='active', 'property-is-inherited': property.inherited, 'edt-property-handle': sortingMode && !property.inherited}">
|
||||
<div class="edt-property" ng-show="property.propertyState!=='init'" ng-class="{'active': property.dialogIsOpen, 'property-state-active animated fadeIn': property.propertyState=='active', 'property-is-inherited': property.inherited, 'edt-property-handle': vm.sortingMode && !property.inherited}">
|
||||
|
||||
<!-- property meta text -->
|
||||
<div class="edt-property-meta">
|
||||
|
||||
<div class="edt-property-inherited-from" ng-if="property.inherited"><i class="icon icon-merge"></i> Inherited from {{property.contentTypeName}}</div>
|
||||
|
||||
<div ng-if="!sortingMode">
|
||||
<div ng-if="!vm.sortingMode">
|
||||
|
||||
<div class="edt-property-meta-alias">{{ property.alias }}</div>
|
||||
|
||||
@@ -90,7 +93,7 @@
|
||||
|
||||
</div>
|
||||
|
||||
<div ng-if="sortingMode">
|
||||
<div ng-if="vm.sortingMode">
|
||||
<i class="icon icon-navigation"></i>
|
||||
<span class="property-name">{{ property.label }}</span>
|
||||
<span class="item-alias">({{ property.alias }})</span>
|
||||
@@ -99,7 +102,7 @@
|
||||
</div>
|
||||
|
||||
|
||||
<div tabindex="-1" class="edt-property-preview" ng-click="editPropertyTypeSettings(property)">
|
||||
<div tabindex="-1" class="edt-property-preview" ng-click="vm.editPropertyTypeSettings(property)">
|
||||
|
||||
<span class="edt-property-preview-overlay"></span>
|
||||
|
||||
@@ -118,12 +121,12 @@
|
||||
<div ng-if="!property.inherited">
|
||||
|
||||
<!-- delete property -->
|
||||
<a href="" class="property-action property-action-delete" ng-click="deleteProperty(tab, $index)">
|
||||
<a href="" class="property-action property-action-delete" ng-click="vm.deleteProperty(tab, $index)">
|
||||
<i class="icon icon-trash"></i>
|
||||
</a>
|
||||
|
||||
<!-- settings for property -->
|
||||
<a href="" class="property-action property-action-edit" ng-click="editPropertyTypeSettings(property)">
|
||||
<a href="" class="property-action property-action-edit" ng-click="vm.editPropertyTypeSettings(property)">
|
||||
<i class="icon icon-settings"></i>
|
||||
</a>
|
||||
|
||||
@@ -149,11 +152,11 @@
|
||||
<!-- overlay for change property editor -->
|
||||
<umb-overlay
|
||||
ng-style="{'width': '500px'}"
|
||||
ng-if="showDialog"
|
||||
model="dialogModel"
|
||||
ng-if="vm.showDialog"
|
||||
model="vm.dialogModel"
|
||||
animation="slide-in-right"
|
||||
position="right"
|
||||
view="dialogModel.view">
|
||||
view="vm.dialogModel.view">
|
||||
</umb-overlay>
|
||||
|
||||
</div>
|
||||
@@ -6,150 +6,162 @@
|
||||
* @description
|
||||
* The controller for the content type editor list view section
|
||||
*/
|
||||
function ListViewController($scope, contentTypeResource, dataTypeResource, dataTypeHelper) {
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
/* ---------- SCOPE VARIABLES ---------- */
|
||||
function ListViewController($scope, contentTypeResource, dataTypeResource, dataTypeHelper) {
|
||||
|
||||
$scope.listView = {};
|
||||
$scope.listView.dataType = {};
|
||||
$scope.listView.editDataTypeSettings = false;
|
||||
$scope.listView.customListViewCreated = false;
|
||||
/* ---------- SCOPE VARIABLES ---------- */
|
||||
|
||||
var vm = this;
|
||||
|
||||
vm.toggleListView = toggleListView;
|
||||
vm.toggleEditListViewDataTypeSettings = toggleEditListViewDataTypeSettings;
|
||||
vm.saveListViewDataType = saveListViewDataType;
|
||||
vm.createCustomListViewDataType = createCustomListViewDataType;
|
||||
vm.removeCustomListDataType = removeCustomListDataType;
|
||||
|
||||
vm.dataType = {};
|
||||
vm.editDataTypeSettings = false;
|
||||
vm.customListViewCreated = false;
|
||||
|
||||
|
||||
/* ---------- INIT ---------- */
|
||||
/* ---------- INIT ---------- */
|
||||
|
||||
init();
|
||||
init();
|
||||
|
||||
function init() {
|
||||
function init() {
|
||||
|
||||
if($scope.contentType.isContainer) {
|
||||
if($scope.model.isContainer) {
|
||||
|
||||
contentTypeResource.getAssignedListViewDataType($scope.contentType.id)
|
||||
.then(function(dataType) {
|
||||
contentTypeResource.getAssignedListViewDataType($scope.model.id)
|
||||
.then(function(dataType) {
|
||||
|
||||
$scope.listView.dataType = dataType;
|
||||
vm.dataType = dataType;
|
||||
|
||||
$scope.listView.customListViewCreated = checkForCustomListView();
|
||||
vm.customListViewCreated = checkForCustomListView();
|
||||
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/* ----------- LIST VIEW --------- */
|
||||
|
||||
function toggleListView() {
|
||||
|
||||
if($scope.model.isContainer) {
|
||||
|
||||
// add list view data type
|
||||
contentTypeResource.getAssignedListViewDataType($scope.model.id)
|
||||
.then(function(dataType) {
|
||||
|
||||
vm.dataType = dataType;
|
||||
|
||||
vm.customListViewCreated = checkForCustomListView();
|
||||
|
||||
});
|
||||
|
||||
} else {
|
||||
|
||||
vm.dataType = {};
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* ----------- LIST VIEW SETTINGS --------- */
|
||||
|
||||
function toggleEditListViewDataTypeSettings() {
|
||||
|
||||
if(!vm.editDataTypeSettings) {
|
||||
|
||||
// get dataType
|
||||
dataTypeResource.getById(vm.dataType.id)
|
||||
.then(function(dataType) {
|
||||
|
||||
// store data type
|
||||
vm.dataType = dataType;
|
||||
|
||||
// show edit panel
|
||||
vm.editDataTypeSettings = true;
|
||||
|
||||
});
|
||||
|
||||
} else {
|
||||
|
||||
// hide edit panel
|
||||
vm.editDataTypeSettings = false;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function saveListViewDataType() {
|
||||
|
||||
var preValues = dataTypeHelper.createPreValueProps(vm.dataType.preValues);
|
||||
|
||||
dataTypeResource.save(vm.dataType, preValues, false).then(function(dataType) {
|
||||
|
||||
// store data type
|
||||
vm.dataType = dataType;
|
||||
|
||||
// hide settings panel
|
||||
vm.editDataTypeSettings = false;
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* ---------- CUSTOM LIST VIEW ---------- */
|
||||
|
||||
function createCustomListViewDataType() {
|
||||
|
||||
dataTypeResource.createCustomListView($scope.model.alias).then(function(dataType) {
|
||||
|
||||
// store data type
|
||||
vm.dataType = dataType;
|
||||
|
||||
// change state to custom list view
|
||||
vm.customListViewCreated = true;
|
||||
|
||||
// show settings panel
|
||||
vm.editDataTypeSettings = true;
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function removeCustomListDataType() {
|
||||
|
||||
// delete custom list view data type
|
||||
dataTypeResource.deleteById(vm.dataType.id).then(function(dataType) {
|
||||
|
||||
// get default data type
|
||||
contentTypeResource.getAssignedListViewDataType($scope.model.id)
|
||||
.then(function(dataType) {
|
||||
|
||||
// store data type
|
||||
vm.dataType = dataType;
|
||||
|
||||
// change state to default list view
|
||||
vm.customListViewCreated = false;
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
|
||||
function checkForCustomListView() {
|
||||
return vm.dataType.name === "List View - " + $scope.model.alias;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
/* ----------- LIST VIEW --------- */
|
||||
angular.module("umbraco").controller("Umbraco.Editors.DocumentType.ListViewController", ListViewController);
|
||||
|
||||
$scope.toggleListView = function() {
|
||||
|
||||
if($scope.contentType.isContainer) {
|
||||
|
||||
// add list view data type
|
||||
contentTypeResource.getAssignedListViewDataType($scope.contentType.id)
|
||||
.then(function(dataType) {
|
||||
|
||||
$scope.listView.dataType = dataType;
|
||||
|
||||
$scope.listView.customListViewCreated = checkForCustomListView();
|
||||
|
||||
});
|
||||
|
||||
} else {
|
||||
|
||||
$scope.listView.dataType = {};
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
|
||||
/* ----------- LIST VIEW SETTINGS --------- */
|
||||
|
||||
$scope.toggleEditListViewDataTypeSettings = function() {
|
||||
|
||||
if(!$scope.listView.editDataTypeSettings) {
|
||||
|
||||
// get dataType
|
||||
dataTypeResource.getById($scope.listView.dataType.id)
|
||||
.then(function(dataType) {
|
||||
|
||||
// store data type
|
||||
$scope.listView.dataType = dataType;
|
||||
|
||||
// show edit panel
|
||||
$scope.listView.editDataTypeSettings = true;
|
||||
|
||||
});
|
||||
|
||||
} else {
|
||||
|
||||
// hide edit panel
|
||||
$scope.listView.editDataTypeSettings = false;
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
$scope.saveListViewDataType = function() {
|
||||
|
||||
var preValues = dataTypeHelper.createPreValueProps($scope.listView.dataType.preValues);
|
||||
|
||||
dataTypeResource.save($scope.listView.dataType, preValues, false).then(function(dataType) {
|
||||
|
||||
// store data type
|
||||
$scope.listView.dataType = dataType;
|
||||
|
||||
// hide settings panel
|
||||
$scope.listView.editDataTypeSettings = false;
|
||||
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
|
||||
/* ---------- CUSTOM LIST VIEW ---------- */
|
||||
|
||||
$scope.createCustomListViewDataType = function() {
|
||||
|
||||
dataTypeResource.createCustomListView($scope.contentType.alias).then(function(dataType) {
|
||||
|
||||
// store data type
|
||||
$scope.listView.dataType = dataType;
|
||||
|
||||
// change state to custom list view
|
||||
$scope.listView.customListViewCreated = true;
|
||||
|
||||
// show settings panel
|
||||
$scope.listView.editDataTypeSettings = true;
|
||||
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
$scope.removeCustomListDataType = function() {
|
||||
|
||||
// delete custom list view data type
|
||||
dataTypeResource.deleteById($scope.listView.dataType.id).then(function(dataType) {
|
||||
|
||||
// get default data type
|
||||
contentTypeResource.getAssignedListViewDataType($scope.contentType.id)
|
||||
.then(function(dataType) {
|
||||
|
||||
// store data type
|
||||
$scope.listView.dataType = dataType;
|
||||
|
||||
// change state to default list view
|
||||
$scope.listView.customListViewCreated = false;
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
|
||||
function checkForCustomListView() {
|
||||
return $scope.listView.dataType.name === "List View - " + $scope.contentType.alias;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
angular.module("umbraco").controller("Umbraco.Editors.DocumentType.ListViewController", ListViewController);
|
||||
})();
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
<div class="sub-view-columns" ng-controller="Umbraco.Editors.DocumentType.ListViewController">
|
||||
<div class="sub-view-columns" ng-controller="Umbraco.Editors.DocumentType.ListViewController as vm">
|
||||
|
||||
<div class="sub-view-column-left">
|
||||
<h5>Enable list view</h5>
|
||||
@@ -8,38 +8,38 @@
|
||||
|
||||
<div class="sub-view-column-section">
|
||||
<label class="checkbox no-indent">
|
||||
<input type="checkbox" ng-model="contentType.isContainer" ng-click="toggleListView()" /> Yes - enable list view
|
||||
<input type="checkbox" ng-model="model.isContainer" ng-click="vm.toggleListView()" /> Yes - enable list view
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="sub-view-column-section">
|
||||
|
||||
<!-- list view enabled -->
|
||||
<div class="list-view-container" ng-if="contentType.isContainer" ng-class="{'list-view-settings-open': listView.editDataTypeSettings}">
|
||||
<div class="list-view-container" ng-if="model.isContainer" ng-class="{'list-view-settings-open': vm.editDataTypeSettings}">
|
||||
|
||||
<div class="list-view-container-content">
|
||||
<i class="icon icon-list"></i>
|
||||
<div>
|
||||
<div>
|
||||
<div class="list-view-name">{{ listView.dataType.name }} <em ng-if="!listView.customListViewCreated">(default)</em></div>
|
||||
<a href="" ng-click="toggleEditListViewDataTypeSettings()"><i class="icon icon-settings"></i></a>
|
||||
<div class="list-view-name">{{ vm.dataType.name }} <em ng-if="!vm.customListViewCreated">(default)</em></div>
|
||||
<a href="" ng-click="vm.toggleEditListViewDataTypeSettings()"><i class="icon icon-settings"></i></a>
|
||||
</div>
|
||||
<a href="" class="list-view-create-new" ng-if="!listView.customListViewCreated" ng-click="createCustomListViewDataType()">Create custom list view</a>
|
||||
<a href="" class="list-view-remove-new" ng-if="listView.customListViewCreated" ng-click="removeCustomListDataType()">Remove custom list view</a>
|
||||
<a href="" class="list-view-create-new" ng-if="!vm.customListViewCreated" ng-click="vm.createCustomListViewDataType()">Create custom list view</a>
|
||||
<a href="" class="list-view-remove-new" ng-if="vm.customListViewCreated" ng-click="vm.removeCustomListDataType()">Remove custom list view</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- list view settings -->
|
||||
<div class="list-view-settings form-horizontal" ng-if="listView.editDataTypeSettings" ng-class="{'list-view-settings-open': listView.editDataTypeSettings}">
|
||||
<div class="list-view-settings form-horizontal" ng-if="vm.editDataTypeSettings" ng-class="{'list-view-settings-open': vm.editDataTypeSettings}">
|
||||
|
||||
<umb-property property="preValue" ng-repeat="preValue in listView.dataType.preValues">
|
||||
<umb-property property="preValue" ng-repeat="preValue in vm.dataType.preValues">
|
||||
<umb-editor model="preValue" is-pre-value="true"></umb-editor>
|
||||
</umb-property>
|
||||
|
||||
<button type="button" class="btn" ng-click="toggleEditListViewDataTypeSettings()">Close</button>
|
||||
<button type="button" class="btn btn-success" ng-click="saveListViewDataType()">Save list view</button>
|
||||
<button type="button" class="btn" ng-click="vm.toggleEditListViewDataTypeSettings()">Close</button>
|
||||
<button type="button" class="btn btn-success" ng-click="vm.saveListViewDataType()">Save list view</button>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
@@ -6,71 +6,80 @@
|
||||
* @description
|
||||
* The controller for the content type editor property dialog
|
||||
*/
|
||||
function PermissionsController($scope, contentTypeResource, $log, iconHelper) {
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
/* ----------- SCOPE VARIABLES ----------- */
|
||||
function PermissionsController($scope, contentTypeResource, $log, iconHelper) {
|
||||
|
||||
$scope.contentTypes = [];
|
||||
/* ----------- SCOPE VARIABLES ----------- */
|
||||
|
||||
/* ---------- INIT ---------- */
|
||||
var vm = this;
|
||||
|
||||
init();
|
||||
vm.removeAllowedChildNode = removeAllowedChildNode;
|
||||
vm.addItemOverlay = addItemOverlay;
|
||||
|
||||
function init() {
|
||||
vm.contentTypes = [];
|
||||
|
||||
contentTypeResource.getAll().then(function(contentTypes){
|
||||
$scope.contentTypes = contentTypes;
|
||||
});
|
||||
/* ---------- INIT ---------- */
|
||||
|
||||
init();
|
||||
|
||||
function init() {
|
||||
|
||||
contentTypeResource.getAll().then(function(contentTypes){
|
||||
vm.contentTypes = contentTypes;
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function removeAllowedChildNode(selectedContentType) {
|
||||
|
||||
// splice from array
|
||||
var selectedContentTypeIndex = $scope.model.allowedContentTypes.indexOf(selectedContentType);
|
||||
$scope.model.allowedContentTypes.splice(selectedContentTypeIndex, 1);
|
||||
|
||||
}
|
||||
|
||||
function addItemOverlay($event) {
|
||||
|
||||
vm.showDialog = false;
|
||||
vm.dialogModel = {};
|
||||
vm.dialogModel.title = "Choose content type";
|
||||
vm.dialogModel.contentTypes = vm.contentTypes;
|
||||
vm.dialogModel.allowedContentTypes = $scope.model.allowedContentTypes;
|
||||
vm.dialogModel.event = $event;
|
||||
vm.dialogModel.view = "views/documentType/dialogs/contenttypes/contenttypes.html";
|
||||
vm.showDialog = true;
|
||||
|
||||
vm.dialogModel.chooseContentType = function(selectedContentType) {
|
||||
|
||||
// format content type to match service
|
||||
var reformatedContentType = {
|
||||
"name": selectedContentType.name,
|
||||
"id": {
|
||||
"m_boxed": {
|
||||
"m_value": selectedContentType.id
|
||||
}
|
||||
},
|
||||
"icon": selectedContentType.icon,
|
||||
"key": selectedContentType.key,
|
||||
"alias": selectedContentType.alias
|
||||
};
|
||||
|
||||
// push to content type model
|
||||
$scope.model.allowedContentTypes.push(reformatedContentType);
|
||||
|
||||
vm.showDialog = false;
|
||||
vm.dialogModel = null;
|
||||
};
|
||||
|
||||
vm.dialogModel.close = function(){
|
||||
vm.showDialog = false;
|
||||
vm.dialogModel = null;
|
||||
};
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
$scope.removeAllowedChildNode = function(selectedContentType) {
|
||||
|
||||
// splice from array
|
||||
var selectedContentTypeIndex = $scope.contentType.allowedContentTypes.indexOf(selectedContentType);
|
||||
$scope.contentType.allowedContentTypes.splice(selectedContentTypeIndex, 1);
|
||||
|
||||
};
|
||||
|
||||
$scope.addItemOverlay = function ($event) {
|
||||
|
||||
$scope.showDialog = false;
|
||||
$scope.dialogModel = {};
|
||||
$scope.dialogModel.title = "Choose content type";
|
||||
$scope.dialogModel.contentTypes = $scope.contentTypes;
|
||||
$scope.dialogModel.allowedContentTypes = $scope.contentType.allowedContentTypes;
|
||||
$scope.dialogModel.event = $event;
|
||||
$scope.dialogModel.view = "views/documentType/dialogs/contenttypes/contenttypes.html";
|
||||
$scope.showDialog = true;
|
||||
|
||||
$scope.dialogModel.chooseContentType = function(selectedContentType) {
|
||||
|
||||
// format content type to match service
|
||||
var reformatedContentType = {
|
||||
"name": selectedContentType.name,
|
||||
"id": {
|
||||
"m_boxed": {
|
||||
"m_value": selectedContentType.id
|
||||
}
|
||||
},
|
||||
"icon": selectedContentType.icon,
|
||||
"key": selectedContentType.key,
|
||||
"alias": selectedContentType.alias
|
||||
};
|
||||
|
||||
// push to content type model
|
||||
$scope.contentType.allowedContentTypes.push(reformatedContentType);
|
||||
|
||||
$scope.showDialog = false;
|
||||
$scope.dialogModel = null;
|
||||
};
|
||||
|
||||
$scope.dialogModel.close = function(){
|
||||
$scope.showDialog = false;
|
||||
$scope.dialogModel = null;
|
||||
};
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
angular.module("umbraco").controller("Umbraco.Editors.DocumentType.PermissionsController", PermissionsController);
|
||||
angular.module("umbraco").controller("Umbraco.Editors.DocumentType.PermissionsController", PermissionsController);
|
||||
})();
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
<div ng-controller="Umbraco.Editors.DocumentType.PermissionsController">
|
||||
<div ng-controller="Umbraco.Editors.DocumentType.PermissionsController as vm">
|
||||
|
||||
<div class="sub-view-columns">
|
||||
|
||||
<div class="sub-view-column-left">
|
||||
@@ -7,7 +8,7 @@
|
||||
</div>
|
||||
<div class="sub-view-column-right">
|
||||
<label class="checkbox no-indent">
|
||||
<input type="checkbox" ng-model="contentType.allowAsRoot" /> Yes - allow content of this type in the root
|
||||
<input type="checkbox" ng-model="model.allowAsRoot" /> Yes - allow content of this type in the root
|
||||
</label>
|
||||
</div>
|
||||
|
||||
@@ -28,9 +29,9 @@
|
||||
<div class="node node-parent">
|
||||
<div class="node-description">
|
||||
<div class="node-icon-wrapper">
|
||||
<i class="icon {{ contentType.icon }}"></i>
|
||||
<i class="icon {{ model.icon }}"></i>
|
||||
</div>
|
||||
<span class="node-name">{{ contentType.name }}</span>
|
||||
<span class="node-name">{{ model.name }}</span>
|
||||
<small>(Current)</small>
|
||||
</div>
|
||||
</div>
|
||||
@@ -38,7 +39,7 @@
|
||||
<div class="child-notes-wrapper">
|
||||
|
||||
<!-- ADDED NODES -->
|
||||
<div class="node node-child" ng-repeat="allowedType in contentType.allowedContentTypes">
|
||||
<div class="node node-child" ng-repeat="allowedType in model.allowedContentTypes">
|
||||
<div class="node-description">
|
||||
<div class="node-icon-wrapper">
|
||||
<i class="icon {{ allowedType.icon }}"></i>
|
||||
@@ -46,17 +47,17 @@
|
||||
<span class="node-name"> {{ allowedType.name }}</span>
|
||||
</div>
|
||||
<div class="node-actions">
|
||||
<i class="icon icon-trash" ng-click="removeAllowedChildNode(allowedType)"></i>
|
||||
<i class="icon icon-trash" ng-click="vm.removeAllowedChildNode(allowedType)"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- NODE PLACEHOLDER -->
|
||||
<div class="node node-placeholder" ng-if="(contentTypes | compareArrays:contentType.allowedContentTypes:'alias').length > 0" ng-click="addItemOverlay($event)">
|
||||
<div class="node node-placeholder" ng-if="(vm.contentTypes | compareArrays:model.allowedContentTypes:'alias').length > 0" ng-click="vm.addItemOverlay($event)">
|
||||
<div class="node-placeholder-text">Allow child node</div>
|
||||
</div>
|
||||
|
||||
<!-- ALL NODES ADDED -->
|
||||
<div class="text-center" ng-if="(contentTypes | compareArrays:contentType.allowedContentTypes:'alias').length === 0">
|
||||
<div class="text-center" ng-if="(vm.contentTypes | compareArrays:model.allowedContentTypes:'alias').length === 0">
|
||||
<small>All content types are added as child nodes</small>
|
||||
</div>
|
||||
|
||||
@@ -67,14 +68,13 @@
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<umb-overlay
|
||||
ng-style=""
|
||||
ng-if="showDialog"
|
||||
model="dialogModel"
|
||||
ng-if="vm.showDialog"
|
||||
model="vm.dialogModel"
|
||||
animation="slide-in-right"
|
||||
position="target"
|
||||
view="dialogModel.view">
|
||||
view="vm.dialogModel.view">
|
||||
</umb-overlay>
|
||||
|
||||
</div>
|
||||
@@ -6,81 +6,91 @@
|
||||
* @description
|
||||
* The controller for the content type editor templates sub view
|
||||
*/
|
||||
function TemplatesController($scope, entityResource) {
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
/* ----------- SCOPE VARIABLES ----------- */
|
||||
function TemplatesController($scope, entityResource) {
|
||||
|
||||
$scope.templates = {};
|
||||
$scope.templates.availableTemplates = [];
|
||||
/* ----------- SCOPE VARIABLES ----------- */
|
||||
|
||||
var vm = this;
|
||||
|
||||
vm.removeTemplate = removeTemplate;
|
||||
vm.removeDefaultTemplate = removeDefaultTemplate;
|
||||
vm.openTemplatesPicker = openTemplatesPicker;
|
||||
vm.setAsDefaultTemplate = setAsDefaultTemplate;
|
||||
|
||||
vm.availableTemplates =[];
|
||||
|
||||
|
||||
/* ---------- INIT ---------- */
|
||||
/* ---------- INIT ---------- */
|
||||
|
||||
init();
|
||||
init();
|
||||
|
||||
function init() {
|
||||
function init() {
|
||||
|
||||
entityResource.getAll("Template").then(function(templates){
|
||||
$scope.templates.availableTemplates = templates;
|
||||
});
|
||||
entityResource.getAll("Template").then(function(templates){
|
||||
vm.availableTemplates = templates;
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function removeTemplate(selectedTemplate) {
|
||||
|
||||
// splice from array
|
||||
var selectedTemplateIndex = $scope.model.allowedTemplates.indexOf(selectedTemplate);
|
||||
$scope.model.allowedTemplates.splice(selectedTemplateIndex, 1);
|
||||
|
||||
}
|
||||
|
||||
function removeDefaultTemplate() {
|
||||
|
||||
// remove default template from array - it will be the last template so we can clear the array
|
||||
$scope.model.allowedTemplates = [];
|
||||
|
||||
// remove as default template
|
||||
$scope.model.defaultTemplate = null;
|
||||
|
||||
}
|
||||
|
||||
function openTemplatesPicker($event, setAsDefaultTemplateBool){
|
||||
vm.showDialog = false;
|
||||
vm.dialogModel = {};
|
||||
vm.dialogModel.title = "Choose template";
|
||||
vm.dialogModel.availableTemplates = vm.availableTemplates;
|
||||
vm.dialogModel.allowedTemplates = $scope.model.allowedTemplates;
|
||||
vm.dialogModel.event = $event;
|
||||
vm.dialogModel.view = "views/documentType/dialogs/templates/templates.html";
|
||||
vm.showDialog = true;
|
||||
|
||||
vm.dialogModel.chooseTemplate = function(selectedTemplate) {
|
||||
|
||||
// push template as allowed template
|
||||
$scope.model.allowedTemplates.push(selectedTemplate);
|
||||
|
||||
// if true set template as default template
|
||||
if(setAsDefaultTemplateBool) {
|
||||
setAsDefaultTemplate(selectedTemplate);
|
||||
}
|
||||
|
||||
// hide dialog
|
||||
vm.showDialog = false;
|
||||
vm.dialogModel = null;
|
||||
};
|
||||
|
||||
vm.dialogModel.close = function(){
|
||||
vm.showDialog = false;
|
||||
vm.dialogModel = null;
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
function setAsDefaultTemplate(template) {
|
||||
$scope.model.defaultTemplate = {};
|
||||
$scope.model.defaultTemplate = template;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
$scope.removeTemplate = function(selectedTemplate) {
|
||||
|
||||
// splice from array
|
||||
var selectedTemplateIndex = $scope.contentType.allowedTemplates.indexOf(selectedTemplate);
|
||||
$scope.contentType.allowedTemplates.splice(selectedTemplateIndex, 1);
|
||||
|
||||
};
|
||||
|
||||
$scope.removeDefaultTemplate = function() {
|
||||
|
||||
// remove default template from array - it will be the last template so we can clear the array
|
||||
$scope.contentType.allowedTemplates = [];
|
||||
|
||||
// remove as default template
|
||||
$scope.contentType.defaultTemplate = null;
|
||||
|
||||
};
|
||||
|
||||
$scope.openTemplatesPicker = function($event, setAsDefaultTemplate){
|
||||
$scope.showDialog = false;
|
||||
$scope.dialogModel = {};
|
||||
$scope.dialogModel.title = "Choose template";
|
||||
$scope.dialogModel.availableTemplates = $scope.templates.availableTemplates;
|
||||
$scope.dialogModel.allowedTemplates = $scope.contentType.allowedTemplates;
|
||||
$scope.dialogModel.event = $event;
|
||||
$scope.dialogModel.view = "views/documentType/dialogs/templates/templates.html";
|
||||
$scope.showDialog = true;
|
||||
|
||||
$scope.dialogModel.chooseTemplate = function(selectedTemplate) {
|
||||
|
||||
// push template as allowed template
|
||||
$scope.contentType.allowedTemplates.push(selectedTemplate);
|
||||
|
||||
// if true set template as default template
|
||||
if(setAsDefaultTemplate) {
|
||||
$scope.setAsDefaultTemplate(selectedTemplate);
|
||||
}
|
||||
|
||||
// hide dialog
|
||||
$scope.showDialog = false;
|
||||
$scope.dialogModel = null;
|
||||
};
|
||||
|
||||
$scope.dialogModel.close = function(){
|
||||
$scope.showDialog = false;
|
||||
$scope.dialogModel = null;
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
$scope.setAsDefaultTemplate = function(template) {
|
||||
$scope.contentType.defaultTemplate = {};
|
||||
$scope.contentType.defaultTemplate = template;
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
angular.module("umbraco").controller("Umbraco.Editors.DocumentType.TemplatesController", TemplatesController);
|
||||
angular.module("umbraco").controller("Umbraco.Editors.DocumentType.TemplatesController", TemplatesController);
|
||||
})();
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
<div class="sub-view-columns" ng-controller="Umbraco.Editors.DocumentType.TemplatesController">
|
||||
<div class="sub-view-columns" ng-controller="Umbraco.Editors.DocumentType.TemplatesController as vm">
|
||||
|
||||
<div class="sub-view-column-left">
|
||||
<h5>Allowed Templates</h5>
|
||||
@@ -9,34 +9,34 @@
|
||||
|
||||
<div class="templates-grid">
|
||||
|
||||
<div class="template template-default" ng-if="contentType.defaultTemplate !== null">
|
||||
<div class="template template-default" ng-if="model.defaultTemplate !== null">
|
||||
<div class="template-content">
|
||||
<i class="icon {{ contentType.defaultTemplate.icon }}"></i>
|
||||
<div class="template-name">{{ contentType.defaultTemplate.name }}</div>
|
||||
<i class="icon {{ model.defaultTemplate.icon }}"></i>
|
||||
<div class="template-name">{{ model.defaultTemplate.name }}</div>
|
||||
<span class="template-default-label">(Default)</span>
|
||||
</div>
|
||||
<i class="icon icon-trash remove-template" ng-if="contentType.allowedTemplates.length === 1" ng-click="removeDefaultTemplate()"></i>
|
||||
<i class="icon icon-trash remove-template" ng-if="model.allowedTemplates.length === 1" ng-click="vm.removeDefaultTemplate()"></i>
|
||||
</div>
|
||||
|
||||
<div class="template" ng-repeat="template in contentType.allowedTemplates | filter: { id:'!'+contentType.defaultTemplate.id }">
|
||||
<div class="template" ng-repeat="template in model.allowedTemplates | filter: { id:'!'+model.defaultTemplate.id }">
|
||||
<div class="template-content">
|
||||
<i class="icon {{ template.icon }}"></i>
|
||||
<div class="template-name">{{ template.name }}</div>
|
||||
<a href="" class="template-default-label link-blue" ng-click="setAsDefaultTemplate(template)">Set as default</a>
|
||||
<a href="" class="template-default-label link-blue" ng-click="vm.setAsDefaultTemplate(template)">Set as default</a>
|
||||
</div>
|
||||
<i class="icon icon-trash remove-template" ng-click="removeTemplate(template)"></i>
|
||||
<i class="icon icon-trash remove-template" ng-click="vm.removeTemplate(template)"></i>
|
||||
</div>
|
||||
|
||||
<div class="template template-placeholder" ng-if="(templates.availableTemplates | compareArrays:contentType.allowedTemplates:'alias').length > 0">
|
||||
<div class="template template-placeholder" ng-if="(vm.availableTemplates | compareArrays:model.allowedTemplates:'alias').length > 0">
|
||||
<div class="template-content">
|
||||
<div class="template-name" ng-if="contentType.defaultTemplate !== null" ng-click="openTemplatesPicker($event)">Choose template</div>
|
||||
<div class="template-name" ng-if="contentType.defaultTemplate === null" ng-click="openTemplatesPicker($event, true)">Choose default template</div>
|
||||
<div class="template-name" ng-if="model.defaultTemplate !== null" ng-click="vm.openTemplatesPicker($event)">Choose template</div>
|
||||
<div class="template-name" ng-if="model.defaultTemplate === null" ng-click="vm.openTemplatesPicker($event, true)">Choose default template</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="text-center" ng-if="(templates.availableTemplates | compareArrays:contentType.allowedTemplates:'alias').length === 0">
|
||||
<div class="text-center" ng-if="(vm.availableTemplates | compareArrays:model.allowedTemplates:'alias').length === 0">
|
||||
<small>All templates are added as allowed templates</small>
|
||||
</div>
|
||||
|
||||
@@ -44,11 +44,11 @@
|
||||
|
||||
<umb-overlay
|
||||
ng-style=""
|
||||
ng-if="showDialog"
|
||||
model="dialogModel"
|
||||
ng-if="vm.showDialog"
|
||||
model="vm.dialogModel"
|
||||
animation="slide-in-right"
|
||||
position="target"
|
||||
view="dialogModel.view">
|
||||
view="vm.dialogModel.view">
|
||||
</umb-overlay>
|
||||
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user