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

Merge tabs when they have the same name

Browse Source
This commit is contained in:
Mads Rasmussen
2015-05-26 13:48:26 +02:00
parent 1a65b85816
commit 3d0ccc9405
3 changed files with 87 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/Umbraco.Web.UI.Client/src/less/pages/document-type-editor.less
View File

@@ -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

64
src/Umbraco.Web.UI.Client/src/views/documenttype/edit.controller.js
View File

@@ -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);
}

30
src/Umbraco.Web.UI.Client/src/views/documenttype/edit.html
View File

@@ -105,23 +105,25 @@
</div>
<div class="edt-property" ng-show="property.propertyState!=='init'" ng-class="{'active': property.dialogIsOpen, 'property-state-active animated fadeIn': property.propertyState=='active'}">
<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}">
<!-- property meta text -->
<div class="edt-property-meta" ng-class="{'edt-property-handle': sortingMode}">
<div class="edt-property-inherited-from" ng-if="property.inherited"><i class="icon icon-merge"></i> Inherited from {{property.inheritedFromName}}</div>
<div ng-if="!sortingMode">
<div class="edt-property-meta-alias invisible-field">
<input type="text" placeholder="Alias.." ng-model="property.alias" ng-disabled="tab.inherited">
<input type="text" placeholder="Alias.." ng-model="property.alias" ng-disabled="property.inherited">
</div>
<div class="edt-property-meta-label invisible-field">
<input type="text" placeholder="Label.." ng-model="property.label" ng-change="changePropertyLabel(property)" ng-disabled="tab.inherited" />
<input type="text" placeholder="Label.." ng-model="property.label" ng-change="changePropertyLabel(property)" ng-disabled="property.inherited" />
</div>
<div class="edt-property-meta-description invisible-field">
<textarea ng-model="property.description" placeholder="Enter your description..." ng-disabled="tab.inherited"></textarea>
<textarea ng-model="property.description" placeholder="Enter your description..." ng-disabled="property.inherited"></textarea>
</div>
</div>
@@ -153,15 +155,19 @@
<!-- row tools -->
<div tabindex="-1" class="edt-property-actions">
<!-- delete property -->
<a href="" class="property-action property-action-delete" ng-click="deleteProperty(tab, $index)">
<i class="icon icon-trash"></i>
</a>
<div ng-if="!property.inherited">
<!-- settings for property -->
<a href="" class="property-action property-action-edit" ng-click="editPropertyTypeSettings(property)">
<i class="icon icon-settings"></i>
</a>
<!-- delete property -->
<a href="" class="property-action property-action-delete" ng-click="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)">
<i class="icon icon-settings"></i>
</a>
</div>
</div>