From 3d0ccc9405644760a0232ca13dd2076f2dfcb61b Mon Sep 17 00:00:00 2001 From: Mads Rasmussen Date: Tue, 26 May 2015 13:48:26 +0200 Subject: [PATCH] Merge tabs when they have the same name --- .../src/less/pages/document-type-editor.less | 24 ++++++- .../src/views/documenttype/edit.controller.js | 64 +++++++++++++------ .../src/views/documenttype/edit.html | 30 +++++---- 3 files changed, 87 insertions(+), 31 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/less/pages/document-type-editor.less b/src/Umbraco.Web.UI.Client/src/less/pages/document-type-editor.less index b5ae73bd3b..b87ef89d26 100644 --- a/src/Umbraco.Web.UI.Client/src/less/pages/document-type-editor.less +++ b/src/Umbraco.Web.UI.Client/src/less/pages/document-type-editor.less @@ -158,7 +158,6 @@ } // tab is inherited from compositions - .edt-tab.tab-is-inherited { background: #F2F2F2; border-color: #F2F2F2; @@ -315,6 +314,13 @@ } + .edt-property.property-is-inherited { + background: #F2F2F2; + &:hover { + border-color: transparent; + } + } + /* ---------- SORTING ---------- */ @@ -324,6 +330,11 @@ min-height: 0; cursor: move; } + + .edt-tab.tab-is-inherited { + cursor: auto; + } + } // sorting properties @@ -375,6 +386,17 @@ display: none; } + .edt-property.property-is-inherited { + cursor: auto; + .icon-navigation { + visibility: hidden; + } + .edt-property-inherited-from { + text-align: right; + float: right; + } + } + } // sorting placeholders diff --git a/src/Umbraco.Web.UI.Client/src/views/documenttype/edit.controller.js b/src/Umbraco.Web.UI.Client/src/views/documenttype/edit.controller.js index d6e27c0174..88ffd6a03f 100644 --- a/src/Umbraco.Web.UI.Client/src/views/documenttype/edit.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/documenttype/edit.controller.js @@ -63,32 +63,48 @@ function DocumentTypeEditController($scope, $rootScope, $routeParams, $log, cont case true: - var test = $scope.contentType.groups.length; - var positionToPush = test - 1; + var groupsArrayLength = $scope.contentType.groups.length; + var positionToPush = groupsArrayLength - 1; - console.log(test); - console.log(positionToPush); + //console.log(groupsArrayLength); + //console.log(positionToPush); - angular.forEach(compositeContentType.contentType.groups, function(group){ + angular.forEach(compositeContentType.contentType.groups, function(compositionGroup){ // set inherited state on tab - group.inherited = true; - group.inheritedFromId = compositeContentType.id; - group.inheritedFromName = compositeContentType.name; + compositionGroup.inherited = true; + compositionGroup.inheritedFromId = compositeContentType.id; + compositionGroup.inheritedFromName = compositeContentType.name; // set inherited state on properties - angular.forEach(group.properties, function(property){ + angular.forEach(compositionGroup.properties, function(property){ property.inherited = true; property.inheritedFromId = compositeContentType.id; property.inheritedFromName = compositeContentType.name; }); // set tab state - group.tabState = "inActive"; + compositionGroup.tabState = "inActive"; - // push groups to content type - $scope.contentType.groups.splice(positionToPush,0,group); - //$scope.contentType.groups.push(group); + // if groups are named the same - merge the groups + angular.forEach($scope.contentType.groups, function(contentTypeGroup){ + + if( contentTypeGroup.name === compositionGroup.name ) { + + // set flag to show if properties has been merged into a tab + compositionGroup.groupIsMerged = true; + + // add properties to the top of the array + contentTypeGroup.properties = compositionGroup.properties.concat(contentTypeGroup.properties); + + } + + }); + + // if group is not merged - push it to the end of the array - before init tab + if( compositionGroup.groupIsMerged === false || compositionGroup.groupIsMerged == undefined ) { + $scope.contentType.groups.splice(positionToPush,0,compositionGroup); + } }); @@ -98,14 +114,15 @@ function DocumentTypeEditController($scope, $rootScope, $routeParams, $log, cont var newGroupsArray = []; - angular.forEach($scope.contentType.groups, function(group){ + angular.forEach($scope.contentType.groups, function(contentTypeGroup){ - if( group.inheritedFromId === compositeContentType.id ) { + // remove inherited tabs + if( contentTypeGroup.inheritedFromId === compositeContentType.id ) { var newProperties = false; // check if group contains properties that are not inherited - angular.forEach(group.properties, function(property){ + angular.forEach(contentTypeGroup.properties, function(property){ if(property.inherited === false) { newProperties = true; } @@ -113,12 +130,23 @@ function DocumentTypeEditController($scope, $rootScope, $routeParams, $log, cont // if new properties keep tab in array if(newProperties) { - newGroupsArray.push(group); + newGroupsArray.push(contentTypeGroup); } + // remove inherited properties in merged tabs } else { - newGroupsArray.push(group); + var newPropertiesArray = []; + + // create new array of properties which are not inherited + angular.forEach(contentTypeGroup.properties, function(property){ + if(property.inheritedFromId !== compositeContentType.id) { + newPropertiesArray.push(property); + } + }); + + contentTypeGroup.properties = newPropertiesArray; + newGroupsArray.push(contentTypeGroup); } diff --git a/src/Umbraco.Web.UI.Client/src/views/documenttype/edit.html b/src/Umbraco.Web.UI.Client/src/views/documenttype/edit.html index 49f7da2e00..ed848d354d 100644 --- a/src/Umbraco.Web.UI.Client/src/views/documenttype/edit.html +++ b/src/Umbraco.Web.UI.Client/src/views/documenttype/edit.html @@ -105,23 +105,25 @@ -
+
+
Inherited from {{property.inheritedFromName}}
+
- +
- +
- +
@@ -153,15 +155,19 @@
- - - - +
- - - - + + + + + + + + + + +