From 108ca9f0e4d194b7baddc69c5956ff5dad3882ea Mon Sep 17 00:00:00 2001 From: Jan-Hendrik Popp Date: Sat, 10 Aug 2019 18:36:53 +0200 Subject: [PATCH] #26 form element validation: studio implementation --- form-editor-studio-plugin/pom.xml | 6 + .../studio/AppliedFormElementContainer.mxml | 39 ++--- .../formeditor/studio/FormsStudioPlugin.mxml | 8 +- .../bundles/FormContentTypes.properties | 9 +- .../bundles/FormContentTypes_de.properties | 8 +- .../components/StateFulCollapsiblePanel.mxml | 10 ++ .../StateFulCollapsiblePanelBase.as | 61 ++++++++ .../studio/elements/AbstractFormElement.mxml | 7 +- .../elements/AbstractFormElementBase.as | 21 ++- .../studio/fields/AddOptionField.mxml | 33 ++-- .../studio/fields/FormEditorField.mxml | 19 ++- .../studio/fields/LinkedContentField.mxml | 17 ++- .../formeditor/studio/fields/NumberField.mxml | 27 ++-- .../formeditor/studio/fields/TextField.mxml | 13 +- .../formeditor/studio/fields/TextFieldBase.as | 4 +- .../studio/model/FormElementStructWrapper.as | 13 +- .../formeditor/studio/model/FormIssues.as | 74 +++++++++ .../studio/plugins/ShowFormIssuesPlugin.mxml | 16 ++ .../plugins/ShowFormIssuesPluginBase.as | 141 ++++++++++++++++++ .../formeditor/studio/FormsStudioPlugin.scss | 16 ++ 20 files changed, 462 insertions(+), 80 deletions(-) create mode 100644 form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/components/StateFulCollapsiblePanel.mxml create mode 100644 form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/components/StateFulCollapsiblePanelBase.as create mode 100644 form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/model/FormIssues.as create mode 100644 form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/plugins/ShowFormIssuesPlugin.mxml create mode 100644 form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/plugins/ShowFormIssuesPluginBase.as diff --git a/form-editor-studio-plugin/pom.xml b/form-editor-studio-plugin/pom.xml index bef42418..be67772b 100644 --- a/form-editor-studio-plugin/pom.xml +++ b/form-editor-studio-plugin/pom.xml @@ -41,6 +41,12 @@ swc + + com.coremedia.blueprint.base + bpbase-studio-dynamic-query-list + swc + + diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/AppliedFormElementContainer.mxml b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/AppliedFormElementContainer.mxml index 47198386..06ca9896 100644 --- a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/AppliedFormElementContainer.mxml +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/AppliedFormElementContainer.mxml @@ -1,14 +1,16 @@ + xmlns:fx="http://ns.adobe.com/mxml/2009" + xmlns:editor="exml:com.coremedia.cms.editor.sdk.config" + xmlns="exml:ext.config" + xmlns:exml="http://www.jangaroo.net/exml/0.8" + xmlns:editor="exml:com.coremedia.cms.editor.sdk.config" + xmlns:dragdrop="com.tallence.formeditor.studio.dragdrop.*" + xmlns:local="com.tallence.formeditor.studio.*" + xmlns:u="exml:untyped" + xmlns:ui="exml:com.coremedia.ui.config" + xmlns:plugins="com.tallence.formeditor.studio.plugins.*" + xmlns:components="com.tallence.formeditor.studio.components.*"> - - + - - + + + - - + +
-
-
+ + -
\ No newline at end of file + diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/FormsStudioPlugin.mxml b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/FormsStudioPlugin.mxml index 5b57bdc6..51609b14 100644 --- a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/FormsStudioPlugin.mxml +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/FormsStudioPlugin.mxml @@ -8,6 +8,8 @@ xmlns:local="com.tallence.formeditor.studio.*" xmlns:bpb-components="exml:com.coremedia.blueprint.base.components.config" xmlns:ui="exml:com.coremedia.ui.config"> + [ResourceBundle('com.tallence.formeditor.studio.bundles.FormContentTypes')] + [ResourceBundle('com.coremedia.blueprint.base.queryeditor.QueryEditor')] [ResourceBundle('com.coremedia.cms.editor.ContentTypes')] [ResourceBundle('com.coremedia.cms.editor.sdk.validation.Validators')] [ResourceBundle('com.coremedia.cms.editor.sdk.actions.Actions')] @@ -18,12 +20,6 @@ public static const xtype:String = "com.tallence.formeditor.studio.config.formsStudioPlugin"; - private var config:FormsStudioPlugin; - - // called by generated constructor code - private function __initialize__(config:FormsStudioPlugin):void { - } - public native function FormsStudioPlugin(config:FormsStudioPlugin = null); ]]> diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/bundles/FormContentTypes.properties b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/bundles/FormContentTypes.properties index 7b812d0f..c6feb79d 100644 --- a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/bundles/FormContentTypes.properties +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/bundles/FormContentTypes.properties @@ -8,4 +8,11 @@ FormEditor_formData_text=Form-Settings FormEditor_spamProtectionEnabled_text=activate spam protection FormEditor_spamProtectionEnabled_true_text=activate spam protection FormEditor_spamProtectionEnabled_group_text=Spam protection -FormEditor_icon=tallence-icons tallence-icons--form \ No newline at end of file +FormEditor_icon=tallence-icons tallence-icons--form + +FormEditor_localSettings.formElements.{formElementId\:[0-9]+}.name_text=Name +FormEditor_localSettings.formElements.{formElementId\:[0-9]+}.hint_text=Hint +FormEditor_localSettings.formElements.{formElementId\:[0-9]+}.linkTarget_text=Consent Form +FormEditor_localSettings.formElements.{formElementId\:[0-9]+}.groupElements_text=Check-, Radio-Boxes +FormEditor_localSettings.formElements.{formElementId\:[0-9]+}.validator.maxSize_text=Max. Characters +FormEditor_localSettings.formElements.{formElementId\:[0-9]+}.validator.minSize_text=Min. Characters diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/bundles/FormContentTypes_de.properties b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/bundles/FormContentTypes_de.properties index 5efc5fdc..268f85f8 100644 --- a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/bundles/FormContentTypes_de.properties +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/bundles/FormContentTypes_de.properties @@ -7,4 +7,10 @@ FormEditor_formAction_group_text=Formular-Ziel FormEditor_formData_text=Formular-Einstellungen FormEditor_spamProtectionEnabled_text=Spam-Schutz aktivieren FormEditor_spamProtectionEnabled_true_text=Spam-Schutz aktivieren -FormEditor_spamProtectionEnabled_group_text=Spam-Schutz \ No newline at end of file +FormEditor_spamProtectionEnabled_group_text=Spam-Schutz +FormEditor_localSettings.formElements.{formElementId\:[0-9]+}.name_text=Name +FormEditor_localSettings.formElements.{formElementId\:[0-9]+}.hint_text=Hinweis +FormEditor_localSettings.formElements.{formElementId\:[0-9]+}.linkTarget_text=Einverst\u00E4ndniserkl\u00E4rung +FormEditor_localSettings.formElements.{formElementId\:[0-9]+}.groupElements_text=Check-, Radio-Boxes +FormEditor_localSettings.formElements.{formElementId\:[0-9]+}.validator.maxSize_text=Max. Zeichen +FormEditor_localSettings.formElements.{formElementId\:[0-9]+}.validator.minSize_text=Min. Zeichen diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/components/StateFulCollapsiblePanel.mxml b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/components/StateFulCollapsiblePanel.mxml new file mode 100644 index 00000000..ffd4190c --- /dev/null +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/components/StateFulCollapsiblePanel.mxml @@ -0,0 +1,10 @@ + + + + + + + diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/components/StateFulCollapsiblePanelBase.as b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/components/StateFulCollapsiblePanelBase.as new file mode 100644 index 00000000..9a52a72d --- /dev/null +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/components/StateFulCollapsiblePanelBase.as @@ -0,0 +1,61 @@ +/* + * Copyright 2018 Tallence AG + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +package com.tallence.formeditor.studio.components { +import com.coremedia.cms.editor.sdk.premular.CollapsiblePanel; +import com.coremedia.ui.mixins.IHighlightableMixin; +import com.coremedia.ui.mixins.IValidationStateMixin; +import com.coremedia.ui.mixins.ValidationState; + +/** + * This component extends the {@link CollapsiblePanel} and implements the {@link IValidationStateMixin} and + * {@link IHighlightableMixin} interface to display a validation state. + */ +public class StateFulCollapsiblePanelBase extends CollapsiblePanel implements IValidationStateMixin, IHighlightableMixin { + + public function StateFulCollapsiblePanelBase(config:StateFulCollapsiblePanel = null) { + super(config); + this.initValidationStateMixin(); + } + + /** @inheritDoc */ + public native function initValidationStateMixin():void; + + /** @private */ + [Bindable(event="DUMMY")] + public native function set validationState(validationState:ValidationState):void; + + /** @private */ + [Bindable(event="DUMMY")] + public native function set validationMessage(validationMessage:String):void; + + /** @inheritDoc */ + [Bindable(event="DUMMY")] + public native function get validationState():ValidationState; + + /** @inheritDoc */ + [Bindable(event="DUMMY")] + public native function get validationMessage():String; + + /** @private */ + [Bindable(event="DUMMY")] + public native function set highlighted(newHighlighted:Boolean):void; + + /** @inheritDoc */ + [Bindable(event="DUMMY")] + public native function get highlighted():Boolean; +} +} diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/elements/AbstractFormElement.mxml b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/elements/AbstractFormElement.mxml index b1a48535..e08e9e52 100644 --- a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/elements/AbstractFormElement.mxml +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/elements/AbstractFormElement.mxml @@ -30,15 +30,14 @@ [Bindable] public var formElement:FormElementStructWrapper; - private var config:AbstractFormElement; - public native function AbstractFormElement(config:AbstractFormElement = null); ]]> + formElementStructVE="{getFormElementStructVE()}" + formIssuesVE="{getFormIssuesVE()}"/> - \ No newline at end of file + diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/elements/AbstractFormElementBase.as b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/elements/AbstractFormElementBase.as index 14c95e77..2e7a2dd9 100644 --- a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/elements/AbstractFormElementBase.as +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/elements/AbstractFormElementBase.as @@ -34,6 +34,7 @@ public class AbstractFormElementBase extends Container implements FormElement { private var formElementStructVE:ValueExpression; private var bindTo:ValueExpression; private var forceReadOnlyValueExpression:ValueExpression; + private var formIssuesVE:ValueExpression; public function AbstractFormElementBase(config:AbstractFormElement = null) { if (!config.formElementType) { @@ -63,6 +64,7 @@ public class AbstractFormElementBase extends Container implements FormElement { formElementStructVE = wrapper.getFormElementVE(); bindTo = wrapper.getBindTo(); forceReadOnlyValueExpression = wrapper.getForceReadOnlyValueExpression(); + formIssuesVE = wrapper.getFormIssuesVE(); fireEvent(FORM_ELEMENT_UPDATE_EVT); } @@ -118,5 +120,22 @@ public class AbstractFormElementBase extends Container implements FormElement { return new ValueExpressionValueHolder(forceReadOnlyValueExpression); }); } + + /** + * Since the editors for form elements are reused, the component is created without a + * form issues value expression. As soon as the method updateFormElementStructWrapper is called and + * the form element is updated, a new value expression is returned. This is necessary so that the binding to the + * correct formIssuesVE works after the update. + */ + public function getFormIssuesVE():ValueExpression { + if (!formIssuesVE) { + formIssuesVE = ValueExpressionFactory.createFromValue([]); + } + var self:AbstractFormElementBase = this; + return ValueExpressionFactory.createFromFunction(function ():ValueExpressionValueHolder { + DependencyTracker.dependOnObservable(self, FORM_ELEMENT_UPDATE_EVT); + return new ValueExpressionValueHolder(formIssuesVE); + }); + } +} } -} \ No newline at end of file diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/AddOptionField.mxml b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/AddOptionField.mxml index 1e37b17c..e79d1842 100644 --- a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/AddOptionField.mxml +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/AddOptionField.mxml @@ -1,11 +1,12 @@ + xmlns:fx="http://ns.adobe.com/mxml/2009" + xmlns="exml:ext.config" + xmlns:editor="exml:com.coremedia.cms.editor.sdk.config" + xmlns:ui="exml:com.coremedia.ui.config" + xmlns:fields="com.tallence.formeditor.studio.fields.*" + xmlns:elements="exml:com.tallence.formeditor.studio.config" + xmlns:plugins="com.tallence.formeditor.studio.plugins.*"> - - + + - - + + + + iconCls="{resourceManager.getString('com.coremedia.cms.editor.Editor', 'LinkListPropertyField_icon')}" + ariaLabel="{resourceManager.getString('com.tallence.formeditor.studio.bundles.FormEditor', 'FormEditor_text_add_option')}" + handler="{addGroupElement}"> @@ -61,4 +64,4 @@ - \ No newline at end of file + diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/FormEditorField.mxml b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/FormEditorField.mxml index 4f925208..1e38c93d 100644 --- a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/FormEditorField.mxml +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/FormEditorField.mxml @@ -1,16 +1,14 @@ + xmlns:fx="http://ns.adobe.com/mxml/2009" + xmlns="exml:ext.config" + xmlns:fields="com.tallence.formeditor.studio.fields.*" + margin="10 0 0 0"> - \ No newline at end of file + diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/LinkedContentField.mxml b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/LinkedContentField.mxml index 19ab9ec3..8a04577f 100644 --- a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/LinkedContentField.mxml +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/LinkedContentField.mxml @@ -1,12 +1,13 @@ + xmlns:fx="http://ns.adobe.com/mxml/2009" + xmlns="exml:ext.config" + xmlns:exml="http://www.jangaroo.net/exml/0.8" + xmlns:editor="exml:com.coremedia.cms.editor.sdk.config" + xmlns:fields="com.tallence.formeditor.studio.fields.*" + xmlns:container="ext.layout.container.*" + xmlns:plugins="com.tallence.formeditor.studio.plugins.*" + width="100%"> + diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/NumberField.mxml b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/NumberField.mxml index f27175e9..1c50947e 100644 --- a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/NumberField.mxml +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/NumberField.mxml @@ -1,10 +1,11 @@ + xmlns:fx="http://ns.adobe.com/mxml/2009" + xmlns="exml:ext.config" + xmlns:editor="exml:com.coremedia.cms.editor.sdk.config" + xmlns:ui="exml:com.coremedia.ui.config" + xmlns:fields="com.tallence.formeditor.studio.fields.*" + xmlns:plugins="com.tallence.formeditor.studio.plugins.*"> - - + + - - + + + - \ No newline at end of file + diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/TextField.mxml b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/TextField.mxml index 664284ae..e88c913e 100644 --- a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/TextField.mxml +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/TextField.mxml @@ -4,6 +4,7 @@ xmlns="exml:ext.config" xmlns:editor="exml:com.coremedia.cms.editor.sdk.config" xmlns:ui="exml:com.coremedia.ui.config" + xmlns:plugins="com.tallence.formeditor.studio.plugins.*" xmlns:fields="com.tallence.formeditor.studio.fields.*"> - - + + - - + + - \ No newline at end of file + diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/TextFieldBase.as b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/TextFieldBase.as index cb32cc9a..576d4b27 100644 --- a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/TextFieldBase.as +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/fields/TextFieldBase.as @@ -27,10 +27,10 @@ public class TextFieldBase extends FormEditorField { } override protected function initWithDefault(ve:ValueExpression):void { - if (defaultValue) { + if (defaultValue != undefined) { ve.setValue(defaultValue); } } } -} \ No newline at end of file +} diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/model/FormElementStructWrapper.as b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/model/FormElementStructWrapper.as index 5dde4394..7feee5fc 100644 --- a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/model/FormElementStructWrapper.as +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/model/FormElementStructWrapper.as @@ -17,6 +17,7 @@ package com.tallence.formeditor.studio.model { import com.coremedia.cap.common.impl.StructSubBean; import com.coremedia.ui.data.ValueExpression; +import com.coremedia.ui.data.ValueExpressionFactory; public class FormElementStructWrapper { @@ -28,6 +29,7 @@ public class FormElementStructWrapper { private var type:String; private var bindTo:ValueExpression; private var forceReadOnlyValueExpression:ValueExpression; + private var formIssuesVE:ValueExpression; public function FormElementStructWrapper(formElementStruct:StructSubBean, id:String, @@ -62,6 +64,15 @@ public class FormElementStructWrapper { return type; } + public function getFormIssuesVE():ValueExpression { + if (!formIssuesVE) { + formIssuesVE = ValueExpressionFactory.createFromFunction(function ():FormIssues { + return new FormIssues(formElementStruct.getType().getPropertyNames(), bindTo, id); + }); + } + return formIssuesVE; + } + private function getString(propertyName:String):String { if (formElementStruct && formElementStruct.get(propertyName)) { return formElementStruct.get(propertyName); @@ -70,4 +81,4 @@ public class FormElementStructWrapper { } } -} \ No newline at end of file +} diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/model/FormIssues.as b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/model/FormIssues.as new file mode 100644 index 00000000..8a28f524 --- /dev/null +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/model/FormIssues.as @@ -0,0 +1,74 @@ +/* + * Copyright 2018 Tallence AG + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +package com.tallence.formeditor.studio.model { +import com.coremedia.ui.data.ValueExpression; +import com.coremedia.ui.data.impl.BeanImpl; + +/** + * Bean which contains all form issues for the respective form element. Used by the {@link ShowFormIssuesPlugin} plugin + * to display error messages. + */ +public class FormIssues extends BeanImpl { + + private static const PROPERTY_NAMES:String = "propertyNames"; + + /** + * Creates a new bean containing all form issues. + * + * @param propertyNames the property names of the form element + * @param bindTo the value expression evaluating to the content + * @param formElementId the id of the form element + */ + public function FormIssues(propertyNames:Array, bindTo:ValueExpression, formElementId:String) { + if (propertyNames) { + propertyNames.forEach(function (propertyName:String):void { + set(PROPERTY_NAMES, propertyNames); + propertyNames.forEach(function (propertyName:String):void { + var ve:ValueExpression = bindTo.extendBy([ + "issues", + "byProperty", + "localSettings.formElements." + formElementId + "." + propertyName + ]); + + set(propertyName, ve.getValue() ? ve.getValue() : []); + }); + }); + } + } + + public function getIssues(propertyName:String):Array { + var issues:Array = get(propertyName); + return issues ? issues : []; + } + + public function getAllIssues():Array { + var allIssues:Array = []; + var propertyNames:Array = get(PROPERTY_NAMES); + if (propertyNames) { + propertyNames.forEach(function (propertyName:String):void { + var issues:Array = get(propertyName); + if (issues) { + allIssues = allIssues.concat(issues); + } + }); + } + return allIssues; + } + + +} +} diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/plugins/ShowFormIssuesPlugin.mxml b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/plugins/ShowFormIssuesPlugin.mxml new file mode 100644 index 00000000..b1dcb78e --- /dev/null +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/plugins/ShowFormIssuesPlugin.mxml @@ -0,0 +1,16 @@ + + + + + + + diff --git a/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/plugins/ShowFormIssuesPluginBase.as b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/plugins/ShowFormIssuesPluginBase.as new file mode 100644 index 00000000..f3c64b74 --- /dev/null +++ b/form-editor-studio-plugin/src/main/joo/com/tallence/formeditor/studio/plugins/ShowFormIssuesPluginBase.as @@ -0,0 +1,141 @@ +/* + * Copyright 2018 Tallence AG + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +package com.tallence.formeditor.studio.plugins { +import com.coremedia.cms.editor.sdk.validation.ValidationUtil; +import com.coremedia.ui.data.ValueExpression; +import com.coremedia.ui.data.validation.Issue; +import com.coremedia.ui.data.validation.Severity; +import com.coremedia.ui.mixins.IValidationStateMixin; +import com.coremedia.ui.mixins.ValidationState; +import com.coremedia.ui.mixins.ValidationStateMixin; +import com.coremedia.ui.plugins.BindPlugin; +import com.coremedia.ui.util.EncodingUtil; +import com.tallence.formeditor.studio.model.FormIssues; + +import mx.resources.ResourceManager; + +/** + * The plugin is partially copied from the {@link com.coremedia.cms.editor.sdk.validation.ShowIssuesPlugin} and used to + * set validation sates on form elements. It is not possible to extend the existing plugin because some methods are + * private. The plugin can be applied to: + *
    + *
  • form input fields implementing the {@link IValidationStateMixin} interface to show errors on form element + * propertiers
  • + *
  • form elements {@link com.tallence.formeditor.studio.AppliedFormElementsContainer} to indicate that the form + * element contains a property with an error
  • + *
+ * + * + */ +public class ShowFormIssuesPluginBase extends BindPlugin { + + /** + * A ValueExpression evaluation to a {@link com.tallence.formeditor.studio.model.FormIssues} bean that contains all + * issues for all form elements of the content. + */ + [Bindable] + public var issuesVE:ValueExpression; + + /** + * The property name of the form field. If the value is undefined, the plugin checks if at least one field in the form + * element has an error. + */ + [Bindable] + public var propertyName:String; + + public function ShowFormIssuesPluginBase(config:ShowFormIssuesPlugin = null) { + propertyName = config.propertyName; + super(config); + } + + protected function issuesChanged():void { + var formIssues:FormIssues = bindTo.getValue() as FormIssues; + var issues:Array; + if (formIssues === null) { + issues = []; + } else if (!propertyName) { + issues = formIssues.getAllIssues(); + } else { + issues = formIssues.getIssues(propertyName); + } + if (issues) { + // Find the highest severity level. + var maxSeverity:String = ValidationUtil.computeMaximumSeverity(issues); + + //set the severity on the component + this.setSeverityOnComponent(maxSeverity, issues); + } + } + + /** + * Copied from {@link com.coremedia.cms.editor.sdk.validation.ShowIssuesPlugin} + */ + private function setSeverityOnComponent(maxSeverity:String, issues:Array):void { + var issueText:String = issuesAsText(issues); + setValidationState(getComponent() as ValidationStateMixin, maxSeverity, issueText); + } + + /** + * Copied from {@link com.coremedia.cms.editor.sdk.validation.ShowIssuesPlugin} + */ + private static function setValidationState(component:IValidationStateMixin, newSeverity:String, errorIssuesText:String = undefined):void { + if (component) { + var newValidationState:ValidationState = ValidationUtil.TO_VALIDATION_STATE[newSeverity]; + if (newValidationState) { + component.validationState = newValidationState; + component.validationMessage = errorIssuesText; + } else { + if (component.validationState != ValidationState.SUCCESS) { + component.validationState = null; + component.validationMessage = null; + } + } + } + } + + /** + * Copied from {@link com.coremedia.cms.editor.sdk.validation.ShowIssuesPlugin} + */ + private static function issuesAsText(issues:Array):String { + var text:String = calculateIssuesText(issues, Severity.ERROR); + text += calculateIssuesText(issues, Severity.WARN); + text += calculateIssuesText(issues, Severity.INFO); + return text; + } + + /** + * Copied from {@link com.coremedia.cms.editor.sdk.validation.ShowIssuesPlugin} + */ + private static function calculateIssuesText(issues:Array, severity:String):String { + // adding explicit \n after
so stripping html tags will not remove spacings between the characters + //calculate title + var result:String = "" + ResourceManager.getInstance().getString('com.coremedia.cms.editor.Editor', severity) + "" + + "
\n"; + //filter issues + var filteredIssues:Array = issues.filter(function (issue:Issue):Boolean { + return issue.severity === severity; + }); + + //combine the text, return the empty string + return filteredIssues.length > 0 ? result + filteredIssues.map( + function (issue:Issue):String { + return EncodingUtil.encodeForHTML(ValidationUtil.formatText(issue)); + }).join("
\n") : ""; + } + +} +} diff --git a/form-editor-studio-plugin/src/main/sencha/sass/src/com/tallence/formeditor/studio/FormsStudioPlugin.scss b/form-editor-studio-plugin/src/main/sencha/sass/src/com/tallence/formeditor/studio/FormsStudioPlugin.scss index ff305c26..d0bc3346 100644 --- a/form-editor-studio-plugin/src/main/sencha/sass/src/com/tallence/formeditor/studio/FormsStudioPlugin.scss +++ b/form-editor-studio-plugin/src/main/sencha/sass/src/com/tallence/formeditor/studio/FormsStudioPlugin.scss @@ -48,4 +48,20 @@ } } + .x-panel-card-200.cm-validation-state-error .x-panel-header { + z-index: 1; + position: relative; + border: 1px solid #c41313; + border-left-width: 5px; + padding-left: 8px; + } + + .x-panel-card-200.cm-validation-state-error .x-panel-body-card-200 { + border-top: 0; + } + + .x-panel-card-200.cm-validation-state-error .x-panel-header.x-collapsed-form-element { + border-bottom-width: 1px!important; + } + }