content type permissions sub view
This commit is contained in:
Mads Rasmussen
@@ -602,4 +602,98 @@
|
||||
|
||||
}
|
||||
|
||||
/* ---------- SUB VIEWS COLUMNS ----------- */
|
||||
|
||||
.sub-view-columns {
|
||||
display: flex;
|
||||
margin-bottom: 40px;
|
||||
h5 {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.sub-view-column-left {
|
||||
flex: 0 0 250px;
|
||||
margin-right: 70px;
|
||||
}
|
||||
|
||||
.sub-view-column-right {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
/* ---------- CHILD NODE TREE ---------- */
|
||||
|
||||
.node-tree {
|
||||
|
||||
.child-notes-wrapper {
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
.node {
|
||||
background: @grayLighter;
|
||||
padding: 5px 15px;
|
||||
margin-bottom: 5px;
|
||||
min-width: 300px;
|
||||
display: flex;
|
||||
border-radius: 5px;
|
||||
animation: fadeIn 0.5s;
|
||||
}
|
||||
|
||||
.node-description {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.node-actions {
|
||||
flex: 0 0 50px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.node.node-parent {
|
||||
background: #f1f1f1;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
.node-icon-wrapper {
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
}
|
||||
.node-name {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.node.node-child {
|
||||
.node-icon-wrapper {
|
||||
display: inline-block;
|
||||
width: 15px;
|
||||
}
|
||||
.node-name {
|
||||
font-size: 12px;
|
||||
}
|
||||
.icon-trash {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.node-placeholder {
|
||||
border: 1px dashed @grayLight;
|
||||
background: none;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
padding: 10px;
|
||||
.node-placeholder-text {
|
||||
color: @blue;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.node-select {
|
||||
margin-bottom: 0;
|
||||
margin-right: 10px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -0,0 +1,111 @@
|
||||
/**
|
||||
* @ngdoc controller
|
||||
* @name Umbraco.Editors.DocumentType.PropertyController
|
||||
* @function
|
||||
*
|
||||
* @description
|
||||
* The controller for the content type editor property dialog
|
||||
*/
|
||||
function PermissionsController($scope, contentTypeResource) {
|
||||
|
||||
/* ----------- SCOPE VARIABLES ----------- */
|
||||
|
||||
$scope.contentTypes = [];
|
||||
$scope.showPlaceholderDetails = false;
|
||||
|
||||
/* ---------- INIT ---------- */
|
||||
|
||||
init();
|
||||
|
||||
function init() {
|
||||
|
||||
contentTypeResource.getAll().then(function(contentTypes){
|
||||
|
||||
$scope.contentTypes = contentTypes;
|
||||
|
||||
angular.forEach($scope.contentTypes, function(contentType){
|
||||
|
||||
var exists = false;
|
||||
|
||||
angular.forEach($scope.contentType.allowedContentTypes, function(allowedContentType){
|
||||
|
||||
if( contentType.alias === allowedContentType.alias ) {
|
||||
exists = true;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
if(exists) {
|
||||
contentType.show = false;
|
||||
} else {
|
||||
contentType.show = true;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
$scope.addSelectedContentType = function(selectedContentType) {
|
||||
|
||||
if(selectedContentType.alias !== "undefined" || selectedContentType.alias !== null) {
|
||||
|
||||
var reformatedContentType = {
|
||||
"name": selectedContentType.name,
|
||||
"id": {
|
||||
"m_boxed": {
|
||||
"m_value": selectedContentType.id
|
||||
}
|
||||
},
|
||||
"icon": selectedContentType.icon,
|
||||
"key": selectedContentType.key,
|
||||
"alias": selectedContentType.alias
|
||||
};
|
||||
|
||||
// push selected content type to allowed array
|
||||
$scope.contentType.allowedContentTypes.push(reformatedContentType);
|
||||
|
||||
// hide selected content type from content types array
|
||||
for (var contentTypeIndex = 0; contentTypeIndex < $scope.contentTypes.length; contentTypeIndex++) {
|
||||
|
||||
var contentType = $scope.contentTypes[contentTypeIndex];
|
||||
|
||||
if( selectedContentType.alias === contentType.alias ) {
|
||||
contentType.show = false;
|
||||
}
|
||||
}
|
||||
|
||||
// hide placeholder details
|
||||
$scope.showPlaceholderDetails = false;
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
$scope.togglePlaceholderDetails = function() {
|
||||
$scope.showPlaceholderDetails = !$scope.showPlaceholderDetails;
|
||||
};
|
||||
|
||||
$scope.removeAllowedChildNode = function(selectedContentType) {
|
||||
|
||||
// splice from array
|
||||
var selectedContentTypeIndex = $scope.contentType.allowedContentTypes.indexOf(selectedContentType);
|
||||
$scope.contentType.allowedContentTypes.splice(selectedContentTypeIndex, 1);
|
||||
|
||||
// show content type in content types array
|
||||
for (var contentTypeIndex = 0; contentTypeIndex < $scope.contentTypes.length; contentTypeIndex++) {
|
||||
|
||||
var contentType = $scope.contentTypes[contentTypeIndex];
|
||||
|
||||
if( selectedContentType.alias === contentType.alias ) {
|
||||
contentType.show = true;
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
|
||||
}
|
||||
|
||||
angular.module("umbraco").controller("Umbraco.Editors.DocumentType.PermissionsController", PermissionsController);
|
||||
@@ -1 +1,77 @@
|
||||
permissions
|
||||
<div ng-controller="Umbraco.Editors.DocumentType.PermissionsController">
|
||||
<div class="sub-view-columns">
|
||||
|
||||
<div class="sub-view-column-left">
|
||||
<h5>Allow as root</h5>
|
||||
<small>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vulputate velit a velit consectetur luctus.</small>
|
||||
</div>
|
||||
<div class="sub-view-column-right">
|
||||
<label class="checkbox no-indent">
|
||||
<input type="checkbox" ng-model="contentType.allowAsRoot" /> Yes - lorem ipsum dolor sit
|
||||
</label>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="sub-view-columns">
|
||||
|
||||
<div class="sub-view-column-left">
|
||||
<h5>Allowed child node types</h5>
|
||||
<small>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vulputate velit a velit consectetur luctus.</small>
|
||||
</div>
|
||||
|
||||
<div class="sub-view-column-right">
|
||||
|
||||
<div class="node-tree">
|
||||
|
||||
<!-- CURRENT CONTENT TYPE -->
|
||||
<div class="node node-parent">
|
||||
<div class="node-description">
|
||||
<div class="node-icon-wrapper">
|
||||
<i class="icon {{ contentType.icon }}"></i>
|
||||
</div>
|
||||
<span class="node-name">{{ contentType.name }}</span>
|
||||
<small>(Current)</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="child-notes-wrapper">
|
||||
|
||||
<!-- ADDED NODES -->
|
||||
<div class="node node-child" ng-repeat="allowedType in contentType.allowedContentTypes">
|
||||
<div class="node-description">
|
||||
<div class="node-icon-wrapper">
|
||||
<i class="icon {{ allowedType.icon }}"></i>
|
||||
</div>
|
||||
<span class="node-name"> {{ allowedType.name }}</span>
|
||||
</div>
|
||||
<div class="node-actions">
|
||||
<i class="icon icon-trash" ng-click="removeAllowedChildNode(allowedType)"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- NODE PLACEHOLDER -->
|
||||
<div class="node node-placeholder" ng-if="(contentTypes | filter:{show:true}).length > 0">
|
||||
<div class="node-placeholder-text" ng-click="togglePlaceholderDetails()" ng-if="showPlaceholderDetails==false">Allow child node</div>
|
||||
<div class="node-placeholder-details" ng-if="showPlaceholderDetails">
|
||||
<select class="node-select" ng-model="selectedContentType" ng-options="contentType as contentType.name for contentType in contentTypes | filter:{show:true} | orderBy:'name'">
|
||||
<option value="">Select content type</option>
|
||||
</select>
|
||||
<a href="" class="btn" ng-click="addSelectedContentType(selectedContentType)">Allow</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ALL NODES ADDED -->
|
||||
<div class="text-center" ng-if="(contentTypes | filter:{show:true}).length === 0">
|
||||
<small>All content types are added as child nodes</small>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
Reference in New Issue
Block a user