Merge pull request #5677 from umbraco/v8/feature/5656-ux-doctype-property-creation-journey
New user journey for the DataType Picker in the DocumentType Editor
This commit is contained in:
Warren Buckley
@@ -1,6 +1,6 @@
|
||||
/**
|
||||
* @ngdoc filter
|
||||
* @name umbraco.filters.filter:CMS_joinArray
|
||||
* @name umbraco.filters.filter:umbCmsJoinArray
|
||||
* @namespace umbCmsJoinArray
|
||||
*
|
||||
* param {array} array of string or objects, if an object use the third argument to specify which prop to list.
|
||||
|
||||
@@ -0,0 +1,19 @@
|
||||
/**
|
||||
* @ngdoc filter
|
||||
* @name umbraco.filters.filter:umbCmsTitleCase
|
||||
* @namespace umbCmsTitleCase
|
||||
*
|
||||
* param {string} the text turned into title case.
|
||||
*
|
||||
* @description
|
||||
* Transforms text to title case. Capitalizes the first letter of each word, and transforms the rest of the word to lower case.
|
||||
*
|
||||
*/
|
||||
angular.module("umbraco.filters").filter('umbCmsTitleCase', function() {
|
||||
return function (str) {
|
||||
return str.replace(
|
||||
/\w\S*/g,
|
||||
txt => txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase()
|
||||
);
|
||||
}
|
||||
});
|
||||
@@ -2,20 +2,28 @@
|
||||
Library of card related compoents, like the right-hand icon list on the grid "cards"
|
||||
*/
|
||||
|
||||
.umb-card{
|
||||
.umb-card {
|
||||
position: relative;
|
||||
padding: 5px 10px 5px 10px;
|
||||
background: @white;
|
||||
width: 100%;
|
||||
|
||||
.title{padding: 12px; color: @gray-3; border-bottom: 1px solid @gray-8; font-weight: 400; font-size: 16px; text-transform: none; margin: 0 -10px 10px -10px;}
|
||||
.title {
|
||||
padding: 12px;
|
||||
color: @gray-3;
|
||||
border-bottom: 1px solid @gray-8;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
text-transform: none;
|
||||
margin: 0 -10px 10px -10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.umb-card-thumb{
|
||||
.umb-card-thumb {
|
||||
text-align: center;
|
||||
|
||||
i{
|
||||
i {
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
line-height: 40px;
|
||||
@@ -25,18 +33,28 @@
|
||||
}
|
||||
}
|
||||
|
||||
.umb-card-content{
|
||||
.item-title{color: @blackLight; font-weight: 400; border: none; font-size: 16px; text-transform: none; margin-bottom: 3px;}
|
||||
p{color: @gray-3; margin-bottom: 1px;}
|
||||
.umb-card-content {
|
||||
.item-title {
|
||||
color: @blackLight;
|
||||
font-weight: 400;
|
||||
border: none;
|
||||
font-size: 16px;
|
||||
text-transform: none;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
p {
|
||||
color: @gray-3;
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.umb-card-actions{
|
||||
.umb-card-actions {
|
||||
padding-top: 10px;
|
||||
border-top: @gray-10 1px solid;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.umb-card-icons{
|
||||
.umb-card-icons {
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
display: block;
|
||||
@@ -45,7 +63,7 @@
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.umb-card-icons.vertical{
|
||||
.umb-card-icons.vertical {
|
||||
position: absolute;
|
||||
top: 7px;
|
||||
right: 7px;
|
||||
@@ -53,19 +71,19 @@
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.umb-card-icons li{
|
||||
.umb-card-icons li {
|
||||
display: inline-block;
|
||||
margin: 0 2px 0 2px;
|
||||
}
|
||||
|
||||
.umb-card-icons.vertical li{
|
||||
.umb-card-icons.vertical li {
|
||||
float: right;
|
||||
display: block;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
//card iocn list
|
||||
.umb-card-list{
|
||||
.umb-card-list {
|
||||
display: block;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
@@ -81,7 +99,7 @@
|
||||
|
||||
|
||||
//Card icon grid for picking items off a card
|
||||
.umb-card-grid{
|
||||
.umb-card-grid {
|
||||
padding: 0;
|
||||
margin: 0 auto;
|
||||
list-style: none;
|
||||
@@ -101,14 +119,24 @@
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.umb-card-grid.-six-in-row li {
|
||||
flex: 0 0 25%;
|
||||
max-width: 117px;
|
||||
}
|
||||
|
||||
.umb-card-grid.-four-in-row li {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
}
|
||||
|
||||
.umb-card-grid.-three-in-row li {
|
||||
flex: 0 0 33.33%;
|
||||
max-width:33.33%;
|
||||
flex: 0 0 33.333%;
|
||||
max-width:33.333%;
|
||||
|
||||
i {
|
||||
font-size: 36px;
|
||||
line-height: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
.umb-card-grid .umb-card-grid-item {
|
||||
@@ -117,7 +145,7 @@
|
||||
width: 100%;
|
||||
//height: 100%;
|
||||
padding-top: 100%;
|
||||
border-radius: 3px;
|
||||
border-radius: @baseBorderRadius * 2;
|
||||
transition: background-color 120ms;
|
||||
|
||||
> span {
|
||||
@@ -141,6 +169,41 @@
|
||||
color: @ui-option-type-hover;
|
||||
}
|
||||
|
||||
.umb-card-grid .umb-card-grid-item-slot {
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding-top: 100%;
|
||||
border-radius: @baseBorderRadius * 2;
|
||||
|
||||
box-sizing: border-box;
|
||||
transition: background-color 120ms;
|
||||
|
||||
&:hover, &:focus {
|
||||
background-color: @ui-option-hover;
|
||||
> span {
|
||||
color:@ui-action-discreet-type-hover;
|
||||
border-color:@ui-action-discreet-border-hover;
|
||||
}
|
||||
}
|
||||
|
||||
> span {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
bottom: 10px;
|
||||
left: 10px;
|
||||
right: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
background-color: transparent;
|
||||
border:1.5px dashed @ui-action-discreet-border;
|
||||
border-radius: @baseBorderRadius * 2;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.umb-card-grid a {
|
||||
color: @ui-option-type;
|
||||
text-decoration: none;
|
||||
@@ -149,6 +212,7 @@
|
||||
.umb-card-grid i {
|
||||
font-size: 30px;
|
||||
line-height: 20px;
|
||||
margin-top: 6px;
|
||||
margin-bottom: 10px;
|
||||
display: block;
|
||||
}
|
||||
@@ -164,7 +228,7 @@
|
||||
|
||||
|
||||
//Round icon-like button - this should be somewhere else
|
||||
.umb-btn-round{
|
||||
.umb-btn-round {
|
||||
padding: 4px 6px 4px 6px;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
@@ -174,7 +238,8 @@
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
.umb-btn-round:hover, .umb-btn-round:hover *{
|
||||
.umb-btn-round:hover,
|
||||
.umb-btn-round:hover * {
|
||||
background: @blueDark !important;
|
||||
color: @white !important;
|
||||
border-color: @blueDark !important;
|
||||
|
||||
@@ -24,16 +24,19 @@
|
||||
margin-top: 0;
|
||||
flex-grow: 0;
|
||||
flex-shrink: 0;
|
||||
padding: 20px 20px 0;
|
||||
padding: 30px 30px 0;
|
||||
}
|
||||
|
||||
.umb-overlay__section-header {
|
||||
width: 100%;
|
||||
margin-top:30px;
|
||||
margin-bottom: 10px;
|
||||
margin-bottom: 20px;
|
||||
|
||||
h5 {
|
||||
display: inline;
|
||||
font-size: 16px;
|
||||
line-height: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
button {
|
||||
@@ -66,7 +69,7 @@
|
||||
flex-shrink: 1;
|
||||
flex-basis: auto;
|
||||
position: relative;
|
||||
padding: 30px;
|
||||
padding: 20px 30px;
|
||||
background: @white;
|
||||
max-height: calc(100vh - 170px);
|
||||
overflow-y: auto;
|
||||
|
||||
@@ -1,6 +1,3 @@
|
||||
.umb-itempicker .form-search {
|
||||
margin-top:10px;
|
||||
}
|
||||
.umb-card-grid {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
@@ -23,6 +23,7 @@
|
||||
}
|
||||
|
||||
.umb-group-builder__group.-placeholder {
|
||||
width:100%;
|
||||
min-height: 86px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
@@ -136,9 +137,10 @@ input.umb-group-builder__group-title-input:disabled:hover {
|
||||
}
|
||||
|
||||
.umb-group-builder__group-add-property {
|
||||
min-height: 46px;
|
||||
margin-right: 45px;
|
||||
|
||||
width: calc(100% - 315px);
|
||||
margin-left: 270px;
|
||||
min-height: 46px;
|
||||
border-radius: 3px;
|
||||
|
||||
display: flex;
|
||||
@@ -344,8 +346,9 @@ input.umb-group-builder__group-title-input:disabled:hover {
|
||||
|
||||
.umb-group-builder__property-actions {
|
||||
flex: 0 0 44px;
|
||||
text-align: right;
|
||||
margin-top: 7px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.umb-group-builder__property-action {
|
||||
@@ -473,7 +476,7 @@ input.umb-group-builder__group-sort-value {
|
||||
font-weight: bold;
|
||||
resize: none;
|
||||
line-height: 1.5em;
|
||||
padding-left: 0;
|
||||
padding: 0;
|
||||
border: none;
|
||||
|
||||
&:focus {
|
||||
@@ -498,45 +501,82 @@ input.umb-group-builder__group-sort-value {
|
||||
text-decoration: none;
|
||||
color: @ui-action-type-hover;
|
||||
border-color: @ui-action-border-hover;
|
||||
background-color: @ui-action-discreet-hover;
|
||||
}
|
||||
}
|
||||
|
||||
.editor {
|
||||
.editor-wrapper {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.editor-icon-wrapper {
|
||||
border: 1px solid @gray-8;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
border-radius: 5px;
|
||||
float: left;
|
||||
margin-right: 20px;
|
||||
.editor {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
align-content: stretch;
|
||||
|
||||
.icon {
|
||||
font-size: 26px;
|
||||
}
|
||||
min-height: 80px;
|
||||
|
||||
border: 1px solid @gray-9;
|
||||
color: @ui-action-discreet-type;
|
||||
border-radius: @baseBorderRadius;
|
||||
|
||||
}
|
||||
|
||||
.editor-info {
|
||||
flex: 1 0 auto;
|
||||
text-align: left;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
max-width: calc(100% - 48px);
|
||||
min-height: 80px;
|
||||
color: @ui-action-discreet-type;
|
||||
|
||||
&:hover {
|
||||
color: @ui-action-discreet-type-hover;
|
||||
background-color: @ui-action-discreet-hover;
|
||||
}
|
||||
}
|
||||
|
||||
.editor-icon-wrapper {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
flex: 0 0 60px;
|
||||
padding-left: 10px;
|
||||
|
||||
.icon {
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
.editor-details {
|
||||
flex: 1 1 auto;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.editor-name {
|
||||
display: block;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.editor-details {
|
||||
float: left;
|
||||
margin-top: 10px;
|
||||
|
||||
.editor-name {
|
||||
display: block;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.editor-editor {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
}
|
||||
.editor-editor {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.editor-settings-icon {
|
||||
font-size: 18px;
|
||||
margin-top: 8px;
|
||||
.editor-remove-icon {
|
||||
flex: 0 0 48px;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
font-size: 18px;
|
||||
|
||||
min-height: 80px;
|
||||
color: @ui-action-discreet-type;
|
||||
&:hover {
|
||||
color: @ui-action-discreet-type-hover;
|
||||
background-color: @ui-action-discreet-hover;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -544,6 +584,11 @@ input.umb-group-builder__group-sort-value {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.editor-description {
|
||||
margin-top: 20px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.editor-description,
|
||||
.editor-validation-pattern {
|
||||
min-width: 100%;
|
||||
|
||||
@@ -1,13 +1,17 @@
|
||||
.umb-validation-label {
|
||||
position: absolute;
|
||||
top: 27px;
|
||||
min-width: 100px;
|
||||
max-width: 200px;
|
||||
padding: 1px 5px;
|
||||
z-index: 1;
|
||||
top: 28px;
|
||||
min-width: 80px;
|
||||
max-width: 260px;
|
||||
padding: 2px 6px;
|
||||
background: @red;
|
||||
color: @white;
|
||||
font-size: 11px;
|
||||
font-size: 12px;
|
||||
line-height: 1.5em;
|
||||
border-radius: @baseBorderRadius;
|
||||
pointer-events: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.umb-validation-label:after {
|
||||
|
||||
@@ -83,6 +83,8 @@
|
||||
@sand-5: #F3ECE8;// added 2019
|
||||
@sand-6: #F6F1EF;// added 2019
|
||||
@sand-7: #F9F7F5;// added 2019
|
||||
@sand-8: #fbfaf9;// added 2019
|
||||
@sand-9: #fdfcfc;// added 2019
|
||||
|
||||
|
||||
// Additional Icon Colours
|
||||
|
||||
+106
@@ -0,0 +1,106 @@
|
||||
/**
|
||||
* @ngdoc controller
|
||||
* @name Umbraco.Editors.DataTypeConfigurationPickerController
|
||||
* @function
|
||||
*
|
||||
* @description
|
||||
* The controller for the content type editor data type configuration picker dialog
|
||||
*/
|
||||
|
||||
(function() {
|
||||
"use strict";
|
||||
|
||||
function DataTypeConfigurationPicker($scope, $filter, dataTypeResource, dataTypeHelper, contentTypeResource, localizationService, editorService) {
|
||||
|
||||
var vm = this;
|
||||
|
||||
vm.configs = [];
|
||||
|
||||
vm.loading = true;
|
||||
|
||||
vm.newDataType = newDataType;
|
||||
vm.pickDataType = pickDataType;
|
||||
vm.close = close;
|
||||
|
||||
function activate() {
|
||||
setTitle();
|
||||
load();
|
||||
}
|
||||
|
||||
function setTitle() {
|
||||
if (!$scope.model.title) {
|
||||
localizationService.localize("defaultdialogs_selectEditorConfiguration")
|
||||
.then(function(data){
|
||||
$scope.model.title = data;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function load() {
|
||||
|
||||
dataTypeResource.getGroupedDataTypes().then(function(configs) {
|
||||
|
||||
var filteredConfigs = [];
|
||||
|
||||
_.each(configs, function(configGroup) {
|
||||
for(var i = 0; i<configGroup.length; i++) {
|
||||
if (configGroup[i].alias === $scope.model.editor.alias) {
|
||||
filteredConfigs.push(configGroup[i]);
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
vm.configs = filteredConfigs;
|
||||
vm.loading = false;
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function newDataType() {
|
||||
|
||||
var dataTypeSettings = {
|
||||
propertyEditor: $scope.model.editor,
|
||||
property: $scope.model.property,
|
||||
contentTypeName: $scope.model.contentTypeName,
|
||||
create: true,
|
||||
view: "views/common/infiniteeditors/datatypesettings/datatypesettings.html",
|
||||
submit: function(model) {
|
||||
contentTypeResource.getPropertyTypeScaffold(model.dataType.id).then(function(propertyType) {
|
||||
$scope.model.submit(model.dataType, propertyType, true);
|
||||
editorService.close();
|
||||
});
|
||||
},
|
||||
close: function() {
|
||||
editorService.close();
|
||||
}
|
||||
};
|
||||
|
||||
editorService.open(dataTypeSettings);
|
||||
|
||||
}
|
||||
|
||||
function pickDataType(selectedConfig) {
|
||||
|
||||
selectedConfig.loading = true;
|
||||
dataTypeResource.getById(selectedConfig.id).then(function(dataType) {
|
||||
contentTypeResource.getPropertyTypeScaffold(dataType.id).then(function(propertyType) {
|
||||
selectedConfig.loading = false;
|
||||
$scope.model.submit(dataType, propertyType, false);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function close() {
|
||||
if($scope.model.close) {
|
||||
$scope.model.close();
|
||||
}
|
||||
}
|
||||
|
||||
activate();
|
||||
|
||||
}
|
||||
|
||||
angular.module("umbraco").controller("Umbraco.Editors.DataTypeConfigurationPickerController", DataTypeConfigurationPicker);
|
||||
|
||||
})();
|
||||
+70
@@ -0,0 +1,70 @@
|
||||
<div ng-controller="Umbraco.Editors.DataTypeConfigurationPickerController as vm">
|
||||
<umb-editor-view data-element="editor-data-type-picker">
|
||||
|
||||
<form novalidate name="DataTypeConfigurationPickerForm" 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>
|
||||
|
||||
<umb-load-indicator ng-if="vm.loading"></umb-load-indicator>
|
||||
|
||||
<div ng-if="!vm.loading">
|
||||
|
||||
<ul class="umb-card-grid -three-in-row">
|
||||
<li ng-repeat="dataTypeConfig in vm.configs | orderBy:'name'"
|
||||
data-element="datatypeconfig-{{dataTypeConfig.name}}"
|
||||
ng-click="vm.pickDataType(dataTypeConfig)">
|
||||
<div ng-if="dataTypeConfig.loading" class="umb-card-grid-item__loading">
|
||||
<div class="umb-button__progress"></div>
|
||||
</div>
|
||||
<a class="umb-card-grid-item" href="" title="{{ dataTypeConfig.name }}">
|
||||
<span>
|
||||
<i class="{{ dataTypeConfig.icon }}" ng-class="{'icon-autofill': dataTypeConfig.icon == null}"></i>
|
||||
{{ dataTypeConfig.name }}
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="umb-card-grid -three-in-row">
|
||||
<li ng-click="vm.newDataType()">
|
||||
<a class="umb-card-grid-item-slot" href="" title="Create a new configuration of {{ model.dataType.name }}">
|
||||
<span>
|
||||
<i class="icon icon-add"></i>
|
||||
Create new
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
</umb-box-content>
|
||||
</umb-box>
|
||||
</umb-editor-container>
|
||||
|
||||
<umb-editor-footer>
|
||||
<umb-editor-footer-content-right>
|
||||
<umb-button
|
||||
type="button"
|
||||
button-style="link"
|
||||
label-key="general_close"
|
||||
shortcut="esc"
|
||||
action="vm.close()">
|
||||
</umb-button>
|
||||
</umb-editor-footer-content-right>
|
||||
</umb-editor-footer>
|
||||
|
||||
</form>
|
||||
|
||||
</umb-editor-view>
|
||||
|
||||
</div>
|
||||
+90
-130
@@ -13,30 +13,23 @@
|
||||
function DataTypePicker($scope, $filter, dataTypeResource, contentTypeResource, localizationService, editorService) {
|
||||
|
||||
var vm = this;
|
||||
|
||||
|
||||
vm.showDataTypes = true;
|
||||
vm.dataTypes = [];
|
||||
vm.loading = true;
|
||||
vm.loadingConfigs = false;
|
||||
vm.searchTerm = "";
|
||||
vm.showTabs = false;
|
||||
vm.tabsLoaded = 0;
|
||||
vm.typesAndEditors = [];
|
||||
vm.userConfigured = [];
|
||||
vm.loading = false;
|
||||
vm.tabs = [];
|
||||
vm.labels = {};
|
||||
|
||||
vm.onTabChange = onTabChange;
|
||||
vm.filterItems = filterItems;
|
||||
vm.showDetailsOverlay = showDetailsOverlay;
|
||||
vm.hideDetailsOverlay = hideDetailsOverlay;
|
||||
vm.pickEditor = pickEditor;
|
||||
vm.searchResult = null;
|
||||
|
||||
vm.viewOptionsForEditor = viewOptionsForEditor;
|
||||
vm.pickDataType = pickDataType;
|
||||
vm.pickEditor = pickEditor;
|
||||
vm.close = close;
|
||||
vm.searchTermChanged = searchTermChanged;
|
||||
|
||||
function activate() {
|
||||
setTitle();
|
||||
loadTabs();
|
||||
getGroupedDataTypes();
|
||||
getGroupedPropertyEditors();
|
||||
|
||||
loadTypes();
|
||||
}
|
||||
|
||||
function setTitle() {
|
||||
@@ -44,128 +37,104 @@
|
||||
localizationService.localize("defaultdialogs_selectEditor")
|
||||
.then(function(data){
|
||||
$scope.model.title = data;
|
||||
});
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function loadTabs() {
|
||||
|
||||
var labels = ["contentTypeEditor_availableEditors", "contentTypeEditor_reuse"];
|
||||
|
||||
localizationService.localizeMany(labels)
|
||||
.then(function(data){
|
||||
vm.labels.availableDataTypes = data[0];
|
||||
vm.labels.reuse = data[1];
|
||||
|
||||
vm.tabs = [{
|
||||
active: true,
|
||||
id: 1,
|
||||
label: vm.labels.availableDataTypes,
|
||||
alias: "Default",
|
||||
typesAndEditors: []
|
||||
}, {
|
||||
active: false,
|
||||
id: 2,
|
||||
label: vm.labels.reuse,
|
||||
alias: "Reuse",
|
||||
userConfigured: []
|
||||
}];
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function getGroupedPropertyEditors() {
|
||||
|
||||
vm.loading = true;
|
||||
|
||||
dataTypeResource.getGroupedPropertyEditors().then(function(data) {
|
||||
vm.tabs[0].typesAndEditors = data;
|
||||
vm.typesAndEditors = data;
|
||||
vm.tabsLoaded = vm.tabsLoaded + 1;
|
||||
checkIfTabContentIsLoaded();
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function getGroupedDataTypes() {
|
||||
|
||||
vm.loading = true;
|
||||
|
||||
dataTypeResource.getGroupedDataTypes().then(function(data) {
|
||||
vm.tabs[1].userConfigured = data;
|
||||
vm.userConfigured = data;
|
||||
vm.tabsLoaded = vm.tabsLoaded + 1;
|
||||
checkIfTabContentIsLoaded();
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function checkIfTabContentIsLoaded() {
|
||||
if (vm.tabsLoaded === 2) {
|
||||
|
||||
function loadTypes() {
|
||||
|
||||
dataTypeResource.getGroupedPropertyEditors().then(function(dataTypes) {
|
||||
vm.dataTypes = dataTypes;
|
||||
vm.loading = false;
|
||||
vm.showTabs = true;
|
||||
}
|
||||
}
|
||||
|
||||
function onTabChange(selectedTab) {
|
||||
vm.tabs.forEach(function(tab) {
|
||||
tab.active = false;
|
||||
});
|
||||
selectedTab.active = true;
|
||||
|
||||
}
|
||||
|
||||
function loadConfigurations() {
|
||||
|
||||
vm.loading = true;
|
||||
vm.loadingConfigs = true;
|
||||
|
||||
dataTypeResource.getGroupedDataTypes().then(function(configs) {
|
||||
vm.configs = configs;
|
||||
vm.loading = false;
|
||||
performeSearch();
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function filterItems() {
|
||||
// clear item details
|
||||
$scope.model.itemDetails = null;
|
||||
|
||||
if (vm.searchTerm) {
|
||||
vm.showTabs = false;
|
||||
|
||||
var regex = new RegExp(vm.searchTerm, "i");
|
||||
|
||||
var userConfigured = filterCollection(vm.userConfigured, regex),
|
||||
typesAndEditors = filterCollection(vm.typesAndEditors, regex);
|
||||
|
||||
var totalResults = _.reduce(_.pluck(_.union(userConfigured, typesAndEditors), 'count'), (m, n) => m + n, 0);
|
||||
|
||||
vm.filterResult = {
|
||||
userConfigured: userConfigured,
|
||||
typesAndEditors: typesAndEditors,
|
||||
totalResults: totalResults
|
||||
};
|
||||
|
||||
|
||||
function searchTermChanged() {
|
||||
|
||||
vm.showDataTypes = (vm.searchTerm === "");
|
||||
|
||||
if(vm.loadingConfigs !== true) {
|
||||
loadConfigurations()
|
||||
} else {
|
||||
vm.filterResult = null;
|
||||
vm.showTabs = true;
|
||||
performeSearch();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
function performeSearch() {
|
||||
|
||||
if (vm.searchTerm) {
|
||||
if (vm.configs) {
|
||||
|
||||
var regex = new RegExp(vm.searchTerm, "i");
|
||||
vm.searchResult = {
|
||||
configs: filterCollection(vm.configs, regex),
|
||||
dataTypes: filterCollection(vm.dataTypes, regex)
|
||||
};
|
||||
}
|
||||
} else {
|
||||
vm.searchResult = null;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function filterCollection(collection, regex) {
|
||||
return _.map(_.keys(collection), function (key) {
|
||||
|
||||
var filteredDataTypes = $filter('filter')(collection[key], function (dataType) {
|
||||
return regex.test(dataType.name) || regex.test(dataType.alias);
|
||||
});
|
||||
|
||||
return {
|
||||
group: key,
|
||||
count: filteredDataTypes.length,
|
||||
dataTypes: filteredDataTypes
|
||||
entries: $filter('filter')(collection[key], function (dataType) {
|
||||
return regex.test(dataType.name) || regex.test(dataType.alias);
|
||||
})
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function showDetailsOverlay(property) {
|
||||
|
||||
function viewOptionsForEditor(editor) {
|
||||
|
||||
var dataTypeConfigurationPicker = {
|
||||
editor: editor,
|
||||
property: $scope.model.property,
|
||||
contentTypeName: $scope.model.contentTypeName,
|
||||
view: "views/common/infiniteeditors/datatypeconfigurationpicker/datatypeconfigurationpicker.html",
|
||||
size: "small",
|
||||
submit: function(dataType, propertyType, isNew) {
|
||||
submit(dataType, propertyType, isNew);
|
||||
editorService.close();
|
||||
},
|
||||
close: function() {
|
||||
editorService.close();
|
||||
}
|
||||
};
|
||||
|
||||
var propertyDetails = {};
|
||||
propertyDetails.icon = property.icon;
|
||||
propertyDetails.title = property.name;
|
||||
editorService.open(dataTypeConfigurationPicker);
|
||||
|
||||
$scope.model.itemDetails = propertyDetails;
|
||||
}
|
||||
|
||||
function hideDetailsOverlay() {
|
||||
$scope.model.itemDetails = null;
|
||||
function pickDataType(selectedDataType) {
|
||||
selectedDataType.loading = true;
|
||||
dataTypeResource.getById(selectedDataType.id).then(function(dataType) {
|
||||
contentTypeResource.getPropertyTypeScaffold(dataType.id).then(function(propertyType) {
|
||||
selectedDataType.loading = false;
|
||||
submit(dataType, propertyType, false);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function pickEditor(propertyEditor) {
|
||||
@@ -188,16 +157,7 @@
|
||||
};
|
||||
|
||||
editorService.open(dataTypeSettings);
|
||||
}
|
||||
|
||||
function pickDataType(selectedDataType) {
|
||||
selectedDataType.loading = true;
|
||||
dataTypeResource.getById(selectedDataType.id).then(function(dataType) {
|
||||
contentTypeResource.getPropertyTypeScaffold(dataType.id).then(function(propertyType) {
|
||||
selectedDataType.loading = false;
|
||||
submit(dataType, propertyType, false);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function submit(dataType, propertyType, isNew) {
|
||||
@@ -213,9 +173,9 @@
|
||||
|
||||
$scope.model.submit($scope.model);
|
||||
}
|
||||
|
||||
|
||||
function close() {
|
||||
if ($scope.model.close) {
|
||||
if($scope.model.close) {
|
||||
$scope.model.close();
|
||||
}
|
||||
}
|
||||
|
||||
+59
-105
@@ -15,127 +15,81 @@
|
||||
<umb-box>
|
||||
<umb-box-content>
|
||||
|
||||
<!-- FILTER -->
|
||||
<div class="umb-control-group -no-border">
|
||||
<div class="form-search">
|
||||
<i class="icon-search"></i>
|
||||
<input type="text"
|
||||
style="width: 100%"
|
||||
ng-change="vm.filterItems()"
|
||||
ng-model="vm.searchTerm"
|
||||
class="umb-search-field search-query search-input input-block-level"
|
||||
localize="placeholder"
|
||||
placeholder="@placeholders_filter"
|
||||
umb-auto-focus
|
||||
no-dirty-check />
|
||||
style="width: 100%"
|
||||
ng-change="vm.searchTermChanged()"
|
||||
ng-model="vm.searchTerm"
|
||||
class="umb-search-field search-query search-input input-block-level"
|
||||
localize="placeholder"
|
||||
placeholder="@placeholders_search"
|
||||
umb-auto-focus
|
||||
no-dirty-check />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<umb-load-indicator ng-if="vm.loading"></umb-load-indicator>
|
||||
<umb-load-indicator ng-if="vm.loading === true"></umb-load-indicator>
|
||||
|
||||
<!-- TABS -->
|
||||
<div ng-if="vm.showTabs">
|
||||
<umb-tabs-nav
|
||||
ng-if="vm.tabs"
|
||||
tabs="vm.tabs"
|
||||
on-tab-change="vm.onTabChange(tab)">
|
||||
</umb-tabs-nav>
|
||||
<umb-tab-content ng-repeat="tab in vm.tabs" tab="tab" ng-if="tab.active">
|
||||
<div ng-if="tab.alias==='Default'">
|
||||
<div ng-repeat="(key,value) in tab.typesAndEditors">
|
||||
<h5>{{key}}</h5>
|
||||
<ul class="umb-card-grid -four-in-row" ng-mouseleave="vm.hideDetailsOverlay()">
|
||||
<li ng-repeat="systemDataType in value | orderBy:'name'"
|
||||
data-element="editor-{{systemDataType.name}}"
|
||||
ng-mouseover="vm.showDetailsOverlay(systemDataType)"
|
||||
ng-click="vm.pickEditor(systemDataType)"
|
||||
class="cursor-pointer">
|
||||
<span class="umb-card-grid-item" title="{{ systemDataType.name }}">
|
||||
<span>
|
||||
<i class="{{ systemDataType.icon }}" ng-class="{'icon-autofill': systemDataType.icon == null}"></i>
|
||||
{{ systemDataType.name }}
|
||||
</span>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-if="tab.alias==='Reuse'">
|
||||
<div ng-repeat="(key,value) in tab.userConfigured">
|
||||
<h5>{{key}}</h5>
|
||||
<ul class="umb-card-grid -four-in-row" ng-mouseleave="vm.hideDetailsOverlay()">
|
||||
<li ng-repeat="dataType in value | orderBy:'name'"
|
||||
data-element="editor-{{dataType.name}}"
|
||||
ng-mouseover="vm.showDetailsOverlay(dataType)"
|
||||
ng-click="vm.pickDataType(dataType)"
|
||||
class="cursor-pointer">
|
||||
<div ng-if="dataType.loading" class="umb-card-grid-item__loading">
|
||||
<div class="umb-button__progress"></div>
|
||||
</div>
|
||||
<span class="umb-card-grid-item" title="{{ dataType.name }}">
|
||||
<span>
|
||||
<i class="{{ dataType.icon }}" ng-class="{'icon-autofill': dataType.icon == null}"></i>
|
||||
{{ dataType.name }}
|
||||
</span>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</umb-tab-content>
|
||||
<div ng-if="vm.loading === false && vm.showDataTypes === true">
|
||||
<div ng-repeat="(key,value) in vm.dataTypes">
|
||||
<h5>{{key | umbCmsTitleCase}}</h5>
|
||||
<ul class="umb-card-grid -six-in-row">
|
||||
<li ng-repeat="dataType in value | orderBy:'name'"
|
||||
data-element="datatype-{{dataType.name}}"
|
||||
ng-click="vm.viewOptionsForEditor(dataType)">
|
||||
<a class="umb-card-grid-item" href="" title="{{ dataType.name }}">
|
||||
<span>
|
||||
<i class="{{ dataType.icon }}" ng-class="{'icon-autofill': dataType.icon == null}"></i>
|
||||
{{ dataType.name }}
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- FILTER RESULTS -->
|
||||
<div ng-if="vm.filterResult">
|
||||
<div ng-if="vm.filterResult.totalResults > 0">
|
||||
<h5 class="-border-bottom -black"><localize key="contentTypeEditor_reuse"></localize></h5>
|
||||
<div ng-repeat="result in vm.filterResult.userConfigured">
|
||||
<div ng-if="result.dataTypes.length > 0">
|
||||
<h5>{{result.group}}</h5>
|
||||
<ul class="umb-card-grid -four-in-row" ng-mouseleave="vm.hideDetailsOverlay()">
|
||||
<li ng-repeat="dataType in result.dataTypes | orderBy:'name'"
|
||||
ng-mouseover="vm.showDetailsOverlay(dataType)"
|
||||
ng-click="vm.pickDataType(dataType)"
|
||||
class="cursor-pointer">
|
||||
<div ng-if="dataType.loading" class="umb-card-grid-item__loading">
|
||||
<div class="umb-button__progress"></div>
|
||||
</div>
|
||||
<span class="umb-card-grid-item" title="{{dataType.name}}">
|
||||
<span>
|
||||
<i class="{{dataType.icon}}" ng-class="{'icon-autofill': dataType.icon == null}"></i>
|
||||
{{dataType.name}}
|
||||
</span>
|
||||
<!-- SEARCH RESULTS -->
|
||||
<div ng-if="vm.loading === false && vm.showDataTypes === false && vm.searchResult !== null">
|
||||
<h5 class="-border-bottom -black"><localize key="contentTypeEditor_searchResultSettings"></localize></h5>
|
||||
<div ng-repeat="result in vm.searchResult.configs">
|
||||
<div ng-if="result.entries.length > 0">
|
||||
<h5>{{result.group | umbCmsTitleCase}}</h5>
|
||||
<ul class="umb-card-grid -six-in-row">
|
||||
<li ng-repeat="dataType in result.entries | orderBy:'name'"
|
||||
ng-mouseover="vm.showDetailsOverlay(dataType)"
|
||||
ng-click="vm.pickDataType(dataType)">
|
||||
<div ng-if="dataType.loading" class="umb-card-grid-item__loading">
|
||||
<div class="umb-button__progress"></div>
|
||||
</div>
|
||||
<a class="umb-card-grid-item" href="" title="{{ dataType.name }}">
|
||||
<span>
|
||||
<i class="{{ dataType.icon }}" ng-class="{'icon-autofill': dataType.icon == null}"></i>
|
||||
{{ dataType.name }}
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-if="vm.filterResult.totalResults > 0">
|
||||
<h5 class="-border-bottom -black"><localize key="contentTypeEditor_availableEditors"></localize></h5>
|
||||
<div ng-repeat="result in vm.filterResult.typesAndEditors">
|
||||
<div ng-if="result.dataTypes.length > 0">
|
||||
<h5>{{result.group}}</h5>
|
||||
<ul class="umb-card-grid -four-in-row" ng-mouseleave="vm.hideDetailsOverlay()">
|
||||
<li ng-repeat="systemDataType in result.dataTypes | orderBy:'name'"
|
||||
ng-mouseover="vm.showDetailsOverlay(systemDataType)"
|
||||
ng-click="vm.pickEditor(systemDataType)"
|
||||
class="cursor-pointer">
|
||||
<span class="umb-card-grid-item" title="{{systemDataType.name}}">
|
||||
<span>
|
||||
<i class="{{systemDataType.icon}}" ng-class="{'icon-autofill': systemDataType.icon == null}"></i>
|
||||
{{systemDataType.name}}
|
||||
</span>
|
||||
<h5 class="-border-bottom -black"><localize key="contentTypeEditor_searchResultEditors"></localize></h5>
|
||||
<div ng-repeat="result in vm.searchResult.dataTypes">
|
||||
<div ng-if="result.entries.length > 0">
|
||||
<h5>{{result.group | umbCmsTitleCase}}</h5>
|
||||
<ul class="umb-card-grid -six-in-row">
|
||||
<li ng-repeat="dataType in result.entries | orderBy:'name'"
|
||||
ng-click="vm.pickEditor(dataType)">
|
||||
<a class="umb-card-grid-item" href="" title="{{ dataType.name }}">
|
||||
<span>
|
||||
<i class="{{ dataType.icon }}" ng-class="{'icon-autofill': dataType.icon == null}"></i>
|
||||
{{ dataType.name }}
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<umb-empty-state position="center" ng-if="vm.filterResult.totalResults === 0">
|
||||
<localize key="general_searchNoResult"></localize>
|
||||
</umb-empty-state>
|
||||
</div>
|
||||
|
||||
</umb-box-content>
|
||||
|
||||
+1
-1
@@ -115,7 +115,7 @@
|
||||
property: $scope.model.property,
|
||||
contentTypeName: $scope.model.contentTypeName,
|
||||
view: "views/common/infiniteeditors/datatypepicker/datatypepicker.html",
|
||||
size: "small",
|
||||
size: "medium",
|
||||
submit: function(model) {
|
||||
|
||||
$scope.model.updateSameDataTypes = model.updateSameDataTypes;
|
||||
|
||||
+34
-29
@@ -18,8 +18,8 @@
|
||||
|
||||
<div class="content-type-editor-dialog edit-property-settings">
|
||||
|
||||
<div class="umb-control-group" ng-if="!model.property.locked">
|
||||
<div class="control-group">
|
||||
<div class="umb-control-group -no-border" ng-if="!model.property.locked">
|
||||
<div class="control-group -no-margin">
|
||||
<textarea class="editor-label"
|
||||
data-element="property-name"
|
||||
name="propertyLabel"
|
||||
@@ -36,12 +36,12 @@
|
||||
<span class="umb-validation-label" ng-message="required">Required label</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group -no-margin">
|
||||
<div class="control-group -no-margin" style="margin-top:2px;">
|
||||
<umb-generate-alias enable-lock="true" alias-from="model.property.label" alias="model.property.alias"></umb-generate-alias>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="umb-control-group control-group">
|
||||
<div class="umb-control-group control-group -no-border">
|
||||
<textarea data-element="property-description"
|
||||
class="editor-description"
|
||||
ng-model="model.property.description"
|
||||
@@ -55,27 +55,34 @@
|
||||
<div class="editor-wrapper umb-control-group control-group" ng-model="model.property.editor" val-require-component ng-if="!model.property.locked">
|
||||
|
||||
<a data-element="editor-add" href="" ng-if="!model.property.editor" class="editor-placeholder" hotkey="alt+shift+e" ng-click="vm.openDataTypePicker(model.property)">
|
||||
<localize key="shortcuts_addEditor"></localize>
|
||||
<localize key="defaultdialogs_selectEditor"></localize>
|
||||
<div ng-messages="model.property.editor" show-validation-on-submit>
|
||||
<span class="umb-validation-label" ng-message="required">Required editor</span>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div class="editor clearfix" ng-if="model.property.editor">
|
||||
|
||||
<a href="" class="editor-icon-wrapper" ng-click="vm.openDataTypePicker(model.property)">
|
||||
<i class="icon {{ model.property.dataTypeIcon }}" ng-class="{'icon-autofill': model.property.dataTypeIcon == null}"></i>
|
||||
</a>
|
||||
<button class="btn-reset editor-info" ng-click="vm.openDataTypeSettings(model.property)">
|
||||
<div class="editor-icon-wrapper">
|
||||
<i class="icon {{ model.property.dataTypeIcon }}" ng-class="{'icon-autofill': model.property.dataTypeIcon == null}"></i>
|
||||
</div>
|
||||
|
||||
<div class="editor-details">
|
||||
<a href="" class="editor-name" ng-click="vm.openDataTypePicker(model.property)">{{ model.property.dataTypeName }}</a>
|
||||
<a href="" class="editor-editor" ng-click="vm.openDataTypePicker(model.property)">{{ model.property.editor }}</a>
|
||||
</div>
|
||||
<div class="editor-details">
|
||||
<span class="editor-name">{{ model.property.dataTypeName }}</span>
|
||||
<span class="editor-editor">{{ model.property.editor }}</span>
|
||||
</div>
|
||||
|
||||
<a href class="editor-settings-icon pull-right"
|
||||
ng-click="vm.openDataTypeSettings(model.property)"
|
||||
hotkey="alt+shift+d"
|
||||
ng-if="model.property.editor">
|
||||
<i class="icon icon-settings"></i>
|
||||
</a>
|
||||
</button>
|
||||
|
||||
<button class="editor-remove-icon btn-reset pull-right"
|
||||
ng-click="vm.openDataTypePicker(model.property)"
|
||||
hotkey="alt+shift+d"
|
||||
localize="title"
|
||||
title="@actions_changeDataType"
|
||||
>
|
||||
<i class="icon icon-wrong"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -132,18 +139,16 @@
|
||||
ng-keypress="vm.submitOnEnter($event)" />
|
||||
|
||||
</div>
|
||||
<div class="umb-control-group clearfix" ng-if="model.contentType === 'documentType' && model.contentTypeAllowCultureVariant">
|
||||
<div class="umb-control-group clearfix -no-border" ng-if="model.contentType === 'documentType' && model.contentTypeAllowCultureVariant">
|
||||
|
||||
<h5><localize key="contentTypeEditor_cultureVariantHeading" /></h5>
|
||||
|
||||
<umb-toggle data-element="permissions-allow-culture-variant"
|
||||
checked="model.property.allowCultureVariant"
|
||||
on-click="vm.toggleAllowCultureVariants()"
|
||||
>
|
||||
</umb-toggle>
|
||||
<h5><localize key="contentTypeEditor_cultureVariantHeading" /></h5>
|
||||
<umb-toggle data-element="permissions-allow-culture-variant"
|
||||
checked="model.property.allowCultureVariant"
|
||||
on-click="vm.toggleAllowCultureVariants()"
|
||||
>
|
||||
</umb-toggle>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="umb-control-group clearfix" ng-if="model.contentType === 'documentType' && model.contentTypeAllowSegmentVariant">
|
||||
|
||||
<h5><localize key="contentTypeEditor_segmentVariantHeading" /></h5>
|
||||
@@ -154,9 +159,9 @@
|
||||
>
|
||||
</umb-toggle>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="umb-control-group clearfix" ng-if="model.contentType === 'memberType'">
|
||||
<div class="umb-control-group clearfix -no-border" ng-if="model.contentType === 'memberType'">
|
||||
|
||||
<h5><localize key="general_options"></localize></h5>
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<div data-element="overlay" class="umb-overlay umb-overlay-{{position}} umb-overlay--{{size}}" on-outside-click="outSideClick()" role="dialog" aria-labelledby="umb-overlay-title" aria-describedby="umb-overlay-description">
|
||||
<ng-form class="umb-overlay__form" name="overlayForm" novalidate val-form-manager>
|
||||
<div data-element="overlay-header" class="umb-overlay-header">
|
||||
<div data-element="overlay-header" class="umb-overlay-header" ng-show="!model.hideHeader">
|
||||
<h1 class="umb-overlay__title" id="umb-overlay-title">{{model.title}}</h1>
|
||||
<p class="umb-overlay__subtitle" id="umb-overlay-description" ng-if="model.subtitle">{{model.subtitle}}</p>
|
||||
</div>
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
alias="compositions"
|
||||
ng-if="compositions !== false"
|
||||
type="button"
|
||||
button-style="action"
|
||||
button-style="outline"
|
||||
label-key="contentTypeEditor_compositions"
|
||||
icon="icon-merge"
|
||||
action="openCompositionsDialog()"
|
||||
@@ -22,7 +22,7 @@
|
||||
alias="reorder"
|
||||
ng-if="sorting !== false"
|
||||
type="button"
|
||||
button-style="action"
|
||||
button-style="outline"
|
||||
label-key="{{sortingButtonKey}}"
|
||||
icon="icon-navigation"
|
||||
action="toggleSortingMode();"
|
||||
@@ -44,9 +44,9 @@
|
||||
<li ng-repeat="tab in model.groups" ng-class="{'umb-group-builder__group-sortable': sortingMode}" data-element="group-{{tab.name}}">
|
||||
|
||||
<!-- TAB INIT STATE -->
|
||||
<a href="" class="umb-group-builder__group -placeholder" hotkey="alt+shift+g" ng-click="addGroup(tab)" ng-if="tab.tabState=='init' && !sortingMode" data-element="group-add">
|
||||
<button href="" class="umb-group-builder__group -placeholder" hotkey="alt+shift+g" ng-click="addGroup(tab)" ng-if="tab.tabState=='init' && !sortingMode" data-element="group-add">
|
||||
<localize key="contentTypeEditor_addGroup"></localize>
|
||||
</a>
|
||||
</button>
|
||||
|
||||
<!-- TAB ACTIVE OR INACTIVE STATE -->
|
||||
<div class="umb-group-builder__group" ng-if="tab.tabState !== 'init'" ng-class="{'-active':tab.tabState=='active', '-inherited': tab.inherited, 'umb-group-builder__group-handle -sortable': sortingMode && !tab.inherited}" tabindex="0" ng-focus="activateGroup(tab)">
|
||||
@@ -117,7 +117,7 @@
|
||||
<li data-element="property-{{property.alias}}" ng-class="{'umb-group-builder__property-sortable': sortingMode && !property.inherited}" ng-repeat="property in tab.properties">
|
||||
|
||||
<!-- Add new property -->
|
||||
<a href=""
|
||||
<button href=""
|
||||
data-element="property-add"
|
||||
class="umb-group-builder__group-add-property"
|
||||
ng-if="property.propertyState=='init' && !sortingMode"
|
||||
@@ -125,7 +125,7 @@
|
||||
ng-focus="activateGroup(tab)"
|
||||
focus-when="{{property.focus}}">
|
||||
<localize key="contentTypeEditor_addProperty"></localize>
|
||||
</a>
|
||||
</button>
|
||||
|
||||
<div class="umb-group-builder__property" ng-if="property.propertyState!=='init'" ng-class="{'-active': property.dialogIsOpen, '-active': property.propertyState=='active', '-inherited': property.inherited, '-locked': property.locked, 'umb-group-builder__property-handle -sortable': sortingMode && !property.inherited, '-sortable-locked': sortingMode && property.inherited}">
|
||||
|
||||
|
||||
@@ -48,7 +48,7 @@
|
||||
"shortcuts_navigateSections",
|
||||
"shortcuts_addGroup",
|
||||
"shortcuts_addProperty",
|
||||
"shortcuts_addEditor",
|
||||
"defaultdialogs_selectEditor",
|
||||
"shortcuts_editDataType",
|
||||
"shortcuts_toggleListView",
|
||||
"shortcuts_toggleAllowAsRoot",
|
||||
|
||||
@@ -47,13 +47,18 @@
|
||||
|
||||
<div class="editor clearfix" ng-if="model.parameter.editor">
|
||||
|
||||
<a href="" class="editor-icon-wrapper" ng-click="vm.openMacroParameterPicker(model.parameter)">
|
||||
<i class="icon {{model.parameter.dataTypeIcon}}" ng-class="{'icon-autofill': model.parameter.dataTypeIcon == null}"></i>
|
||||
</a>
|
||||
|
||||
<div class="editor-details">
|
||||
<a href="" class="editor-name" ng-click="vm.openMacroParameterPicker(model.parameter)">{{model.parameter.dataTypeName}}</a>
|
||||
<a href="" class="editor-editor" ng-click="vm.openMacroParameterPicker(model.parameter)">{{model.parameter.editor}}</a>
|
||||
<button class="btn-reset editor-info" ng-click="vm.openMacroParameterPicker(model.parameter)">
|
||||
|
||||
<div class="editor-icon-wrapper">
|
||||
<i class="icon {{model.parameter.dataTypeIcon}}" ng-class="{'icon-autofill': model.parameter.dataTypeIcon == null}"></i>
|
||||
</div>
|
||||
|
||||
<div class="editor-details">
|
||||
<a href="" class="editor-name">{{model.parameter.dataTypeName}}</a>
|
||||
<a href="" class="editor-editor">{{model.parameter.editor}}</a>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
+3
-1
@@ -208,7 +208,8 @@
|
||||
});
|
||||
});
|
||||
|
||||
vm.overlayMenu.title = vm.overlayMenu.pasteItems.length > 0 ? labels.grid_addElement : labels.content_createEmpty;
|
||||
vm.overlayMenu.title = labels.grid_addElement;
|
||||
vm.overlayMenu.hideHeader = vm.overlayMenu.pasteItems.length > 0;
|
||||
|
||||
vm.overlayMenu.clickClearPaste = function ($event) {
|
||||
$event.stopPropagation();
|
||||
@@ -216,6 +217,7 @@
|
||||
clipboardService.clearEntriesOfType("elementType", contentTypeAliases);
|
||||
clipboardService.clearEntriesOfType("elementTypeArray", contentTypeAliases);
|
||||
vm.overlayMenu.pasteItems = [];// This dialog is not connected via the clipboardService events, so we need to update manually.
|
||||
vm.overlayMenu.hideHeader = false;
|
||||
};
|
||||
|
||||
if (vm.overlayMenu.availableItems.length === 1 && vm.overlayMenu.pasteItems.length === 0) {
|
||||
|
||||
@@ -8,7 +8,8 @@
|
||||
<key alias="assignDomain">Tilføj domæne</key>
|
||||
<key alias="auditTrail">Revisionsspor</key>
|
||||
<key alias="browse">Gennemse elementer</key>
|
||||
<key alias="changeDocType">Skift dokumenttype</key>
|
||||
<key alias="changeDocType">Skift Dokument Type</key>
|
||||
<key alias="changeDataType">Skift Input Type</key>
|
||||
<key alias="copy">Kopier</key>
|
||||
<key alias="create">Opret</key>
|
||||
<key alias="export">Eksportér</key>
|
||||
@@ -479,6 +480,7 @@
|
||||
<key alias="unLinkYour">Fjern link fra dit</key>
|
||||
<key alias="account">konto</key>
|
||||
<key alias="selectEditor">Vælg editor</key>
|
||||
<key alias="selectEditorConfiguration">Vælg konfiguration</key>
|
||||
<key alias="selectSnippet">Vælg snippet</key>
|
||||
<key alias="variantdeletewarning">Dette vil slette noden og alle dets sprog. Hvis du kun vil slette et sprog, så afpublicér det i stedet.</key>
|
||||
</area>
|
||||
@@ -1379,9 +1381,11 @@ Mange hilsner fra Umbraco robotten
|
||||
<key alias="compositionInUse">Indholdstypen bliver brugt i en komposition og kan derfor ikke blive anvendt som komposition</key>
|
||||
<key alias="noAvailableCompositions">Der er ingen indholdstyper tilgængelige at bruge som komposition</key>
|
||||
<key alias="compositionRemoveWarning">Når du fjerner en komposition vil alle associerede indholdsdata blive slettet. Når først dokumenttypen er gemt, er der ingen vej tilbage.</key>
|
||||
<key alias="availableEditors">Tilgængelige editors</key>
|
||||
<key alias="availableEditors">Opret ny indstilling</key>
|
||||
<key alias="reuse">Genbrug</key>
|
||||
<key alias="editorSettings">Editor indstillinger</key>
|
||||
<key alias="editorSettings">Input indstillinger</key>
|
||||
<key alias="searchResultSettings">Tilgængelige indstillinger</key>
|
||||
<key alias="searchResultEditors">Opret ny indstilling</key>
|
||||
<key alias="configuration">Konfiguration</key>
|
||||
<key alias="yesDelete">Ja, slet</key>
|
||||
<key alias="movedUnderneath">blev flyttet til</key>
|
||||
|
||||
@@ -9,6 +9,7 @@
|
||||
<key alias="auditTrail">Audit Trail</key>
|
||||
<key alias="browse">Browse Node</key>
|
||||
<key alias="changeDocType">Change Document Type</key>
|
||||
<key alias="changeDataType">Change Data Type</key>
|
||||
<key alias="copy">Copy</key>
|
||||
<key alias="create">Create</key>
|
||||
<key alias="export">Export</key>
|
||||
@@ -503,6 +504,7 @@
|
||||
<key alias="unLinkYour">Un-link your</key>
|
||||
<key alias="account">account</key>
|
||||
<key alias="selectEditor">Select editor</key>
|
||||
<key alias="selectEditorConfiguration">Select configuration</key>
|
||||
<key alias="selectSnippet">Select snippet</key>
|
||||
<key alias="variantdeletewarning">This will delete the node and all its languages. If you only want to delete one language, you should unpublish the node in that language instead.</key>
|
||||
</area>
|
||||
@@ -1642,6 +1644,8 @@ To manage your website, simply open the Umbraco back office and start adding con
|
||||
<key alias="availableEditors">Create new</key>
|
||||
<key alias="reuse">Use existing</key>
|
||||
<key alias="editorSettings">Editor settings</key>
|
||||
<key alias="searchResultSettings">Available configurations</key>
|
||||
<key alias="searchResultEditors">Create a new configuration</key>
|
||||
<key alias="configuration">Configuration</key>
|
||||
<key alias="yesDelete">Yes, delete</key>
|
||||
<key alias="movedUnderneath">was moved underneath</key>
|
||||
|
||||
Reference in New Issue
Block a user