From 0613de2a092b2b8e25640ddcf83f13b43770407d Mon Sep 17 00:00:00 2001 From: Ronald Barendse Date: Tue, 8 Sep 2020 23:47:08 +0200 Subject: [PATCH 001/283] Get settings model type from configuration (instead of data) --- .../ValueConverters/BlockEditorConverter.cs | 66 +++++++++++------ .../BlockListPropertyValueConverter.cs | 71 +++++++++++-------- 2 files changed, 85 insertions(+), 52 deletions(-) diff --git a/src/Umbraco.Web/PropertyEditors/ValueConverters/BlockEditorConverter.cs b/src/Umbraco.Web/PropertyEditors/ValueConverters/BlockEditorConverter.cs index f043c8e66e..5c7fc6f14d 100644 --- a/src/Umbraco.Web/PropertyEditors/ValueConverters/BlockEditorConverter.cs +++ b/src/Umbraco.Web/PropertyEditors/ValueConverters/BlockEditorConverter.cs @@ -1,6 +1,4 @@ -using Newtonsoft.Json.Linq; -using System; -using System.Collections.Generic; +using System; using Umbraco.Core; using Umbraco.Core.Models.Blocks; using Umbraco.Core.Models.PublishedContent; @@ -10,7 +8,7 @@ using Umbraco.Web.PublishedCache; namespace Umbraco.Web.PropertyEditors.ValueConverters { /// - /// Converts json block objects into + /// Converts JSON block objects into . /// public sealed class BlockEditorConverter { @@ -23,30 +21,52 @@ namespace Umbraco.Web.PropertyEditors.ValueConverters _publishedModelFactory = publishedModelFactory; } - public IPublishedElement ConvertToElement( - BlockItemData data, - PropertyCacheLevel referenceCacheLevel, bool preview) + public IPublishedElement ConvertToElement(BlockItemData data, PropertyCacheLevel referenceCacheLevel, bool preview) { - // hack! we need to cast, we have no choice beacuse we cannot make breaking changes. + var publishedContentType = GetContentType(data.ContentTypeKey); + + // Only convert element types + if (publishedContentType == null || publishedContentType.IsElement == false) + { + return null; + } + + var propertyValues = data.RawPropertyValues; + + // Get the UDI from the deserialized object. If this is empty, we can fallback to checking the 'key' if there is one + var key = (data.Udi is GuidUdi gudi) ? gudi.Guid : Guid.Empty; + if (key == Guid.Empty && propertyValues.TryGetValue("key", out var keyo)) + { + Guid.TryParse(keyo.ToString(), out key); + } + + IPublishedElement element = new PublishedElement(publishedContentType, key, propertyValues, preview, referenceCacheLevel, _publishedSnapshotAccessor); + element = _publishedModelFactory.CreateModel(element); + + return element; + } + + public Type GetModelType(Guid contentTypeKey) + { + var publishedContentType = GetContentType(contentTypeKey); + if (publishedContentType != null) + { + var modelType = ModelType.For(publishedContentType.Alias); + + return _publishedModelFactory.MapModelType(modelType); + } + + return typeof(IPublishedElement); + } + + private IPublishedContentType GetContentType(Guid contentTypeKey) + { + // HACK! We need to cast, we have no choice because we can't make breaking changes (and we need the GUID overload) var publishedContentCache = _publishedSnapshotAccessor.PublishedSnapshot.Content as IPublishedContentCache2; if (publishedContentCache == null) throw new InvalidOperationException("The published content cache is not " + typeof(IPublishedContentCache2)); - // only convert element types - content types will cause an exception when PublishedModelFactory creates the model - var publishedContentType = publishedContentCache.GetContentType(data.ContentTypeKey); - if (publishedContentType == null || publishedContentType.IsElement == false) - return null; - - var propertyValues = data.RawPropertyValues; - - // Get the udi from the deserialized object. If this is empty we can fallback to checking the 'key' if there is one - var key = (data.Udi is GuidUdi gudi) ? gudi.Guid : Guid.Empty; - if (propertyValues.TryGetValue("key", out var keyo)) - Guid.TryParse(keyo.ToString(), out key); - - IPublishedElement element = new PublishedElement(publishedContentType, key, propertyValues, preview, referenceCacheLevel, _publishedSnapshotAccessor); - element = _publishedModelFactory.CreateModel(element); - return element; + return publishedContentCache.GetContentType(contentTypeKey); } } } diff --git a/src/Umbraco.Web/PropertyEditors/ValueConverters/BlockListPropertyValueConverter.cs b/src/Umbraco.Web/PropertyEditors/ValueConverters/BlockListPropertyValueConverter.cs index f46c118174..a4a9dd69df 100644 --- a/src/Umbraco.Web/PropertyEditors/ValueConverters/BlockListPropertyValueConverter.cs +++ b/src/Umbraco.Web/PropertyEditors/ValueConverters/BlockListPropertyValueConverter.cs @@ -1,6 +1,4 @@ -using Newtonsoft.Json; -using Newtonsoft.Json.Linq; -using System; +using System; using System.Collections.Generic; using System.Linq; using Umbraco.Core; @@ -51,16 +49,9 @@ namespace Umbraco.Web.PropertyEditors.ValueConverters using (_proflog.DebugDuration($"ConvertPropertyToBlockList ({propertyType.DataType.Id})")) { - var configuration = propertyType.DataType.ConfigurationAs(); - var blockConfigMap = configuration.Blocks.ToDictionary(x => x.ContentElementTypeKey); - var validSettingElementTypes = blockConfigMap.Values.Select(x => x.SettingsElementTypeKey).Where(x => x.HasValue).Distinct().ToList(); - - var contentPublishedElements = new Dictionary(); - var settingsPublishedElements = new Dictionary(); - - var layout = new List(); - var value = (string)inter; + + // Short-circuit on empty values if (string.IsNullOrWhiteSpace(value)) return BlockListModel.Empty; var converted = _blockListEditorDataConverter.Deserialize(value); @@ -68,49 +59,60 @@ namespace Umbraco.Web.PropertyEditors.ValueConverters var blockListLayout = converted.Layout.ToObject>(); - // convert the content data + // Get configuration + var configuration = propertyType.DataType.ConfigurationAs(); + var blockConfigMap = configuration.Blocks.ToDictionary(x => x.ContentElementTypeKey); + var validSettingsElementTypes = blockConfigMap.Values.Select(x => x.SettingsElementTypeKey).Where(x => x.HasValue).Distinct().ToList(); + + // Convert the content data + var contentPublishedElements = new Dictionary(); foreach (var data in converted.BlockValue.ContentData) { if (!blockConfigMap.ContainsKey(data.ContentTypeKey)) continue; var element = _blockConverter.ConvertToElement(data, referenceCacheLevel, preview); if (element == null) continue; + contentPublishedElements[element.Key] = element; } - // convert the settings data + + // If there are no content elements, it doesn't matter what is stored in layout + if (contentPublishedElements.Count == 0) return BlockListModel.Empty; + + // Convert the settings data + var settingsPublishedElements = new Dictionary(); foreach (var data in converted.BlockValue.SettingsData) { - if (!validSettingElementTypes.Contains(data.ContentTypeKey)) continue; + if (!validSettingsElementTypes.Contains(data.ContentTypeKey)) continue; var element = _blockConverter.ConvertToElement(data, referenceCacheLevel, preview); if (element == null) continue; + settingsPublishedElements[element.Key] = element; } - // if there's no elements just return since if there's no data it doesn't matter what is stored in layout - if (contentPublishedElements.Count == 0) return BlockListModel.Empty; - + var layout = new List(); foreach (var layoutItem in blockListLayout) { - // get the content reference - var contentGuidUdi = (GuidUdi)layoutItem.ContentUdi; + // Get the content reference + var contentGuidUdi = (GuidUdi)layoutItem.ContentUdi; if (!contentPublishedElements.TryGetValue(contentGuidUdi.Guid, out var contentData)) continue; - // get the setting reference - IPublishedElement settingsData = null; - var settingGuidUdi = layoutItem.SettingsUdi != null ? (GuidUdi)layoutItem.SettingsUdi : null; - if (settingGuidUdi != null) - settingsPublishedElements.TryGetValue(settingGuidUdi.Guid, out settingsData); - if (!contentData.ContentType.TryGetKey(out var contentTypeKey)) throw new InvalidOperationException("The content type was not of type " + typeof(IPublishedContentType2)); if (!blockConfigMap.TryGetValue(contentTypeKey, out var blockConfig)) continue; - // this can happen if they have a settings type, save content, remove the settings type, and display the front-end page before saving the content again - // we also ensure that the content type's match since maybe the settings type has been changed after this has been persisted. + // Get the setting reference + IPublishedElement settingsData = null; + var settingGuidUdi = layoutItem.SettingsUdi != null ? (GuidUdi)layoutItem.SettingsUdi : null; + if (settingGuidUdi != null) + settingsPublishedElements.TryGetValue(settingGuidUdi.Guid, out settingsData); + + // This can happen if they have a settings type, save content, remove the settings type, and display the front-end page before saving the content again + // We also ensure that the content types match, since maybe the settings type has been changed after this has been persisted if (settingsData != null) { if (!settingsData.ContentType.TryGetKey(out var settingsElementTypeKey)) @@ -120,7 +122,18 @@ namespace Umbraco.Web.PropertyEditors.ValueConverters settingsData = null; } - var layoutType = typeof(BlockListItem<,>).MakeGenericType(contentData.GetType(), settingsData?.GetType() ?? typeof(IPublishedElement)); + // Get settings type from configuration + Type settingsType; + if (blockConfig.SettingsElementTypeKey.HasValue) + { + settingsType = _blockConverter.GetModelType(blockConfig.SettingsElementTypeKey.Value); + } + else + { + settingsType = typeof(IPublishedElement); + } + + var layoutType = typeof(BlockListItem<,>).MakeGenericType(contentData.GetType(), settingsType); var layoutRef = (BlockListItem)Activator.CreateInstance(layoutType, contentGuidUdi, contentData, settingGuidUdi, settingsData); layout.Add(layoutRef); From 2470ee96ecb8d5abadfe00ccae35e0fa36f69e29 Mon Sep 17 00:00:00 2001 From: Mads Rasmussen Date: Wed, 24 Feb 2021 14:25:03 +0100 Subject: [PATCH 002/283] init doc type with tabs prototype --- src/Umbraco.Web.UI.Client/.eslintrc | 2 +- .../umbcontenttypegroup.component.js | 36 ++++ ...mbcontenttypegroupplaceholder.component.js | 33 ++++ .../umbcontenttypegroups.component.js | 23 +++ .../umbcontenttypeproperty.component.js | 28 ++++ ...ontenttypepropertyplaceholder.component.js | 33 ++++ .../components/umbgroupsbuilder.directive.js | 75 +++++++++ .../less/components/umb-group-builder.less | 103 +++++++++++- .../umb-content-type-group-placeholder.html | 3 + .../contenttype/umb-content-type-group.html | 67 ++++++++ .../contenttype/umb-content-type-groups.html | 1 + ...umb-content-type-property-placeholder.html | 11 ++ .../umb-content-type-property.html | 155 ++++++++++++++++++ .../views/components/umb-groups-builder.html | 111 ++++++++++++- 14 files changed, 670 insertions(+), 11 deletions(-) create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroup.component.js create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroupplaceholder.component.js create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroups.component.js create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypeproperty.component.js create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypepropertyplaceholder.component.js create mode 100644 src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group-placeholder.html create mode 100644 src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group.html create mode 100644 src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-groups.html create mode 100644 src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property-placeholder.html create mode 100644 src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property.html diff --git a/src/Umbraco.Web.UI.Client/.eslintrc b/src/Umbraco.Web.UI.Client/.eslintrc index a4010917fb..b3e410109e 100644 --- a/src/Umbraco.Web.UI.Client/.eslintrc +++ b/src/Umbraco.Web.UI.Client/.eslintrc @@ -8,7 +8,7 @@ }, "parserOptions": { - "ecmaVersion": 6 + "ecmaVersion": 2018 }, "globals": { diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroup.component.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroup.component.js new file mode 100644 index 0000000000..44c1aed3c2 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroup.component.js @@ -0,0 +1,36 @@ +(function () { + 'use strict'; + + /** + * A component to render the content type group + */ + + function umbContentTypeGroupController() { + + const vm = this; + + vm.updateName = updateName; + + function updateName (group) { + if (vm.onUpdateName) { + vm.onUpdateName({ group }); + } + } + + } + + const umbContentTypeGroupComponent = { + templateUrl: 'views/components/contenttype/umb-content-type-group.html', + controllerAs: 'vm', + transclude: true, + bindings: { + group: "<", + allowName: "<", + onUpdateName: "&" + }, + controller: umbContentTypeGroupController + }; + + angular.module('umbraco.directives').component('umbContentTypeGroup', umbContentTypeGroupComponent); + +})(); diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroupplaceholder.component.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroupplaceholder.component.js new file mode 100644 index 0000000000..f59915ae05 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroupplaceholder.component.js @@ -0,0 +1,33 @@ +(function () { + 'use strict'; + + /** + * A component to render the content type group placeholder + */ + + function umbContentTypeGroupPlaceholderController() { + + const vm = this; + + vm.click = click; + + function click () { + if (vm.onClick) { + vm.onClick(); + } + } + + } + + const umbContentTypeGroupPlaceholderComponent = { + templateUrl: 'views/components/contenttype/umb-content-type-group-placeholder.html', + controllerAs: 'vm', + bindings: { + onClick: '&' + }, + controller: umbContentTypeGroupPlaceholderController + }; + + angular.module('umbraco.directives').component('umbContentTypeGroupPlaceholder', umbContentTypeGroupPlaceholderComponent); + +})(); diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroups.component.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroups.component.js new file mode 100644 index 0000000000..90c83b1a39 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroups.component.js @@ -0,0 +1,23 @@ +(function () { + 'use strict'; + + /** + * A component to render the content type groups + */ + + function umbContentTypeGroupsController() { + + const vm = this; + + } + + const umbContentTypeGroupsComponent = { + templateUrl: 'views/components/contenttype/umb-content-type-groups.html', + controllerAs: 'vm', + transclude: true, + controller: umbContentTypeGroupsController + }; + + angular.module('umbraco.directives').component('umbContentTypeGroups', umbContentTypeGroupsComponent); + +})(); diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypeproperty.component.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypeproperty.component.js new file mode 100644 index 0000000000..b1af89fe73 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypeproperty.component.js @@ -0,0 +1,28 @@ +(function () { + 'use strict'; + + /** + * A component to render the content type property + */ + + function umbContentTypePropertyController() { + + const vm = this; + + + + } + + const umbContentTypePropertyComponent = { + templateUrl: 'views/components/contenttype/umb-content-type-property.html', + bindings: { + property: "<", + compact: "<" + }, + controllerAs: 'vm', + controller: umbContentTypePropertyController + }; + + angular.module('umbraco.directives').component('umbContentTypeProperty', umbContentTypePropertyComponent); + +})(); diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypepropertyplaceholder.component.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypepropertyplaceholder.component.js new file mode 100644 index 0000000000..aeadf64cce --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypepropertyplaceholder.component.js @@ -0,0 +1,33 @@ +(function () { + 'use strict'; + + /** + * A component to render the content type property + */ + + function umbContentTypePropertyPlaceholderController() { + + const vm = this; + + vm.click = click; + + function click ($event) { + if (vm.onClick) { + vm.onClick({$event}) + } + } + + } + + const umbContentTypePropertyPlaceholderComponent = { + templateUrl: 'views/components/contenttype/umb-content-type-property-placeholder.html', + bindings: { + onClick: "&" + }, + controllerAs: 'vm', + controller: umbContentTypePropertyPlaceholderController + }; + + angular.module('umbraco.directives').component('umbContentTypePropertyPlaceholder', umbContentTypePropertyPlaceholderComponent); + +})(); diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js index 06e1c61f1e..99f6dbc251 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js @@ -387,6 +387,81 @@ }; + /* ---------- TABS ---------- */ + + scope.model.hasTabs = true; + scope.openTabIndex = 0; + + scope.changeTab = function (index) { + scope.openTabIndex = index; + }; + + scope.addTab = function (tab) { + scope.addGroup(tab); + scope.openTabIndex = scope.model.groups.length - 2; + }; + + scope.addFieldset = function () { + const activeTab = scope.model.groups[scope.openTabIndex]; + + if (!activeTab) { + return + } + + if (!scope.model.fieldsets) { + scope.model.fieldsets = []; + } + + const fieldset = { + groupId: activeTab.id, + id: scope.model.fieldsets.length + 1, // temp id + name: "" + }; + + scope.model.fieldsets = [...scope.model.fieldsets, fieldset]; + }; + + scope.addNewProperty = function (group, fieldset) { + let newProperty = { + label: null, + alias: null, + propertyState: "init", + validation: { + mandatory: false, + mandatoryMessage: null, + pattern: null, + patternMessage: null + }, + labelOnTop: false + }; + + const propertySettings = { + title: "Property settings", + property: newProperty, + contentType: scope.contentType, + contentTypeName: scope.model.name, + contentTypeAllowCultureVariant: scope.model.allowCultureVariant, + contentTypeAllowSegmentVariant: scope.model.allowSegmentVariant, + view: "views/common/infiniteeditors/propertysettings/propertysettings.html", + size: "small", + submit: function (model) { + + newProperty = {...model.property}; + newProperty.fieldsetId = fieldset ? fieldset.id : null; + newProperty.propertyState = "active"; + + group.properties.push(newProperty); + + editorService.close(); + }, + close: function () { + editorService.close(); + } + }; + + editorService.open(propertySettings); + }; + /* ---------- GROUPS ---------- */ scope.addGroup = function (group) { diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less index 87e46f5d85..e96d09bd72 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less @@ -1,3 +1,98 @@ +/* ---------- TABS ---------- */ + +.umb-group-builder__tabs { + list-style: none; + margin: 0; + padding: 0; + display: flex; + align-items: center; + background-color: @white; + height: 70px; + border-bottom: 1px solid @gray-9; + margin-bottom: 20px; + + li { + height: 100%; + } +} + +.umb-group-builder__tab { + position: relative; + padding: 0 50px 0 20px; + display: flex; + align-items: center; + justify-content: center; + height: 100%; + border-right: 1px solid @gray-9; + + &:hover { + cursor: pointer; + + .umb-group-builder__tab-remove { + display: block; + } + } + + &::before { + content: ""; + position: absolute; + height: 0px; + left: 10px; + right: 10px; + background-color: @ui-light-active-border; + bottom: 0; + border-radius: @baseBorderRadius @baseBorderRadius 0 0; + opacity: 0; + transition: all .2s linear; + } + + &.is-active { + color: @ui-light-active-type !important; + + .umb-group-builder__tab-remove { + display: block; + } + + &::before { + opacity: 1; + height: 4px; + } + } + + &.is-inherited { + .umb-group-builder__group-title-input { + padding: 0; + } + } +} + +.umb-group-builder__tab-remove { + position: absolute; + right: 20px; + display: none; +} + +.umb-group-builder__tab-name { + font-weight: bold; +} + +.umb-group-builder__tab--placeholder { + border: 1px dashed @gray-7; + border-bottom: none; + border-top: none; + padding-right: 20px; +} + +.umb-group-builder__tab-inherited-label { + font-size: 12px; + color: @gray-6; + + button { + font-size: 12px; + color: @gray-6; + } +} + /* ---------- GROUPS ---------- */ .umb-group-builder__groups { @@ -14,6 +109,7 @@ background-color: @white; position: relative; box-shadow: 0 1px 1px 0 rgba(0,0,0,0.16); + margin-bottom: 20px; } .umb-group-builder__group.-inherited { @@ -137,12 +233,9 @@ input.umb-group-builder__group-title-input:disabled:hover { } .umb-group-builder__group-add-property { - - width: calc(100% - 315px); - margin-left: 270px; + width: 100%; min-height: 46px; - border-radius: 3px; - + border-radius: @baseBorderRadius; display: flex; justify-content: center; align-items: center; diff --git a/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group-placeholder.html b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group-placeholder.html new file mode 100644 index 0000000000..aa6f450609 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group-placeholder.html @@ -0,0 +1,3 @@ + \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group.html b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group.html new file mode 100644 index 0000000000..acf46e54e0 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group.html @@ -0,0 +1,67 @@ +
+ +
+ + +
+ + + +
+
{{groupNameForm.groupName.errorMsg}}
+
+
+
+ + +
+ + : {{ vm.group.inheritedFromName }} + + + , + +
+ + +
+ + + +
+
+
+
+
+ + +
+ + + +
+ +
+ + + +
\ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-groups.html b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-groups.html new file mode 100644 index 0000000000..0b73daa4bb --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-groups.html @@ -0,0 +1 @@ +
\ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property-placeholder.html b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property-placeholder.html new file mode 100644 index 0000000000..9a86923af0 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property-placeholder.html @@ -0,0 +1,11 @@ +
+ +
\ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property.html b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property.html new file mode 100644 index 0000000000..34735bfc64 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property.html @@ -0,0 +1,155 @@ +
+ + +
+ + +
+ +
{{ vm.property.alias }}
+ + + +
+ + +
+
{{propertyTypeForm.groupName.errorMsg}}
+
+
+ +
+ +
+ +
+
+ + +
+ + {{ vm.property.label }} + ({{ vm.property.alias }}) + +
+ +
+ + +
+ +
+ + + {{vm.property.dataTypeName}} + + + +
+ * + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ +
+ +
+ + + {{vm.property.contentTypeName}} +
+ +
+ + +
+ +
+ + + + + + + + +
+ + +
+ +
+ + +
+ +
+ + +
+ + + +
+ +
+ +
+ +
\ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html b/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html index 2fdef77928..15b5ec1fd9 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html @@ -4,6 +4,11 @@ +
+
Use Tabs
+ +
+ -
    + +
    +
      +
    • +
      +
      +
      + : {{ tab.inheritedFromName }} + + + , + +
      +
      {{ tab.name }}
      + +
      +
      + + + +
      +
      + +
      • +
    + + +
      +
    • + + + + + +
      • +
    +     + + + + +
      +
    • + + +
      • +
    • + + +
      • +
    +     +     + + + +
    + + +
    • - + - +
      @@ -289,8 +392,6 @@
      -
      -
    From 02e4c784cbc7db0d7939753f8a4b20bde2a103c3 Mon Sep 17 00:00:00 2001 From: Mads Rasmussen Date: Thu, 25 Feb 2021 10:04:23 +0100 Subject: [PATCH 003/283] wire up property placeholder component --- .../umbcontenttypepropertyplaceholder.component.js | 10 +++++++++- .../umb-content-type-group-placeholder.html | 7 ++++++- 2 files changed, 15 insertions(+), 2 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypepropertyplaceholder.component.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypepropertyplaceholder.component.js index aeadf64cce..ec3a9946c9 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypepropertyplaceholder.component.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypepropertyplaceholder.component.js @@ -10,6 +10,7 @@ const vm = this; vm.click = click; + vm.whenFocus = whenFocus; function click ($event) { if (vm.onClick) { @@ -17,12 +18,19 @@ } } + function whenFocus () { + if (vm.onFocus) { + vm.onFocus() + } + } } const umbContentTypePropertyPlaceholderComponent = { templateUrl: 'views/components/contenttype/umb-content-type-property-placeholder.html', bindings: { - onClick: "&" + onClick: "&", + onFocus: "&", + focus: "<" }, controllerAs: 'vm', controller: umbContentTypePropertyPlaceholderController diff --git a/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group-placeholder.html b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group-placeholder.html index aa6f450609..ca7f337a3c 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group-placeholder.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group-placeholder.html @@ -1,3 +1,8 @@ - \ No newline at end of file From 810dc0ee0afde13dc3d9392a5d919ae2b754592a Mon Sep 17 00:00:00 2001 From: Mads Rasmussen Date: Thu, 25 Feb 2021 10:04:58 +0100 Subject: [PATCH 004/283] wire up content type group component --- .../umbcontenttypegroup.component.js | 24 +++- .../contenttype/umb-content-type-group.html | 113 +++++++++--------- 2 files changed, 79 insertions(+), 58 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroup.component.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroup.component.js index 44c1aed3c2..55b0c4db39 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroup.component.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroup.component.js @@ -9,7 +9,20 @@ const vm = this; + vm.removePromptIsVisible = false; + vm.updateName = updateName; + vm.removeGroup = removeGroup; + vm.togglePrompt = togglePrompt; + vm.hidePrompt = hidePrompt; + + function togglePrompt () { + vm.removePromptIsVisible = !vm.removePromptIsVisible; + } + + function hidePrompt () { + vm.removePromptIsVisible = false; + } function updateName (group) { if (vm.onUpdateName) { @@ -17,6 +30,12 @@ } } + function removeGroup () { + if (vm.onRemove) { + vm.onRemove({ group: vm.group }); + vm.removePromptIsVisible = false; + } + } } const umbContentTypeGroupComponent = { @@ -26,7 +45,10 @@ bindings: { group: "<", allowName: "<", - onUpdateName: "&" + onUpdateName: "&", + allowRemove: "<", + onRemove: "&", + sorting: "<" }, controller: umbContentTypeGroupController }; diff --git a/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group.html b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group.html index acf46e54e0..77e69ce296 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-group.html @@ -1,67 +1,66 @@ -
    +
    -
    +
    - -
    - - + +
    + + -
    -
    {{groupNameForm.groupName.errorMsg}}
    -
    -
    -
    -     +
    +
    {{groupNameForm.groupName.errorMsg}}
    +
    +
    +
    +     -
    - - : {{ vm.group.inheritedFromName }} - - - , - -
    +
    + + : {{ vm.group.inheritedFromName }} + + + , + +
    - -
    - + +
    + - -
    -
    -
    -
    -
    -     + +
    +
    +
    +
    +
    +     -
    - - - -
    +
    + + + +
    +
    -
    - - +
    \ No newline at end of file From 8864a3d8f46e2ab5c668e78c8696f039cafdd8c6 Mon Sep 17 00:00:00 2001 From: Mads Rasmussen Date: Thu, 25 Feb 2021 10:05:30 +0100 Subject: [PATCH 005/283] fix property and fieldset filters --- .../components/umbgroupsbuilder.directive.js | 5 +++++ .../umb-content-type-property-placeholder.html | 4 ++-- .../src/views/components/umb-groups-builder.html | 16 ++++++++++------ 3 files changed, 17 insertions(+), 8 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js index 99f6dbc251..ff683a1905 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js @@ -462,6 +462,11 @@ editorService.open(propertySettings); }; + /* ---------- FIELDSETS ---------- */ + scope.fieldsetsInGroup = (groupId) => (fieldset) => fieldset && fieldset.groupId === groupId; + + scope.propertiesInFieldset = (fieldsetId) => (property) => property && property.fieldsetId === fieldsetId; + /* ---------- GROUPS ---------- */ scope.addGroup = function (group) { diff --git a/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property-placeholder.html b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property-placeholder.html index 9a86923af0..1ef7a804fa 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property-placeholder.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property-placeholder.html @@ -4,8 +4,8 @@ data-element="property-add" class="umb-group-builder__group-add-property" ng-click="vm.click($event)" - ng-focus="activateGroup(tab)" - focus-when="{{property.focus}}"> + ng-focus="vm.whenFocus()" + focus-when="{{vm.focus}}">
    \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html b/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html index 15b5ec1fd9..64a971249e 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html @@ -57,9 +57,9 @@ , -
    {{ tab.name }}
    +
    {{ tab.name }}
    + on-click="addProperty(property, model.groups[openTabIndex])" + focus="property.focus">
@@ -115,11 +116,14 @@ + ng-repeat="fieldset in model.fieldsets | filter:fieldsetsInGroup(model.groups[openTabIndex].id)" + group="fieldset" + allow-remove="!sortingMode" + on-remove="removeFieldset(fieldset)" + sorting="sortingMode && !fieldset.inherited">