diff --git a/src/css/main.css b/src/css/main.css index 27f5001f3..e681cdf6f 100644 --- a/src/css/main.css +++ b/src/css/main.css @@ -1249,3 +1249,10 @@ span.superimpose sub { -moz-box-sizing: border-box; box-sizing: border-box; } + +/* Print styles - suppress box-shadows for printing */ +@media print { + * { + box-shadow: none !important; + } +} diff --git a/src/modules/types/display/template-twig/view.js b/src/modules/types/display/template-twig/view.js index 95528dc3a..8f662b5e5 100644 --- a/src/modules/types/display/template-twig/view.js +++ b/src/modules/types/display/template-twig/view.js @@ -137,10 +137,12 @@ define([ }, getForm() { - return (this.currentForm = this.form.getData(false)); + this.currentForm = this.form.getData(false); + return this.currentForm; }, submitChange(event, noChange) { + if (!event) return; event = event || { target: {} }; const toSend = { data: this.getForm(), @@ -200,10 +202,10 @@ define([ update: { value(value, name) { /* - Convert special DataObjects - (twig does some check depending on the filter used - and the values need to be native) - */ + Convert special DataObjects + (twig does some check depending on the filter used + and the values need to be native) + */ this._values[name] = DataObject.resurrect(value.get()); this.rerender(); @@ -234,22 +236,24 @@ define([ .then(() => this.submitChange()); }, + // we want to set the values based on an object + // we should take care that the template is maybe not yet there async form(value, name) { this.formName = name; this.formObject = value; // fill form should execute when the template exists // It doesn't make sense otherwise - this.hasTemplate.then(() => { - this.fillForm(true); - if ( - this.module.getConfigurationCheckbox( - 'formOptions', - 'rerenderIfFormValueChanges', - ) - ) { - this.rerender(); - } - }); + await this.hasTemplate; + + this.fillForm(true); + if ( + this.module.getConfigurationCheckbox( + 'formOptions', + 'rerenderIfFormValueChanges', + ) + ) { + this.rerender(); + } }, style(value) { diff --git a/src/src/util/Form.js b/src/src/util/Form.js index 82c376239..c37478480 100644 --- a/src/src/util/Form.js +++ b/src/src/util/Form.js @@ -24,6 +24,7 @@ define(['jquery', 'lodash', 'src/util/debug'], function ($, _, Debug) { this.bind(); this.changeCb = null; this.submitCb = null; + this.data = null; } // maps each dom input elements to a plain object diff --git a/testcase/data/twig-form-timing/data.json b/testcase/data/twig-form-timing/data.json new file mode 100644 index 000000000..0967ef424 --- /dev/null +++ b/testcase/data/twig-form-timing/data.json @@ -0,0 +1 @@ +{} diff --git a/testcase/data/twig-form-timing/view.json b/testcase/data/twig-form-timing/view.json new file mode 100644 index 000000000..880c0b3f8 --- /dev/null +++ b/testcase/data/twig-form-timing/view.json @@ -0,0 +1,633 @@ +{ + "version": "2.172.1-0", + "grid": { + "layers": { + "Default layer": { + "name": "Default layer" + } + }, + "xWidth": 10, + "yHeight": 10 + }, + "modules": [ + { + "url": "modules/types/display/template-twig/", + "configuration": { + "sections": {}, + "groups": { + "group": [ + { + "selectable": [ + [] + ], + "template": [ + "" + ], + "modifyInForm": [ + [ + "yes" + ] + ], + "debouncing": [ + 100 + ], + "formOptions": [ + [ + "keepFormValueIfDataUndefined" + ] + ], + "templateOptions": [ + [ + "removeTemplateLeadingSpaces" + ] + ] + } + ] + } + }, + "layers": { + "Default layer": { + "position": { + "left": 54, + "top": 0 + }, + "size": { + "width": 40, + "height": 23 + }, + "zIndex": 0, + "display": true, + "title": "", + "bgColor": [ + 255, + 255, + 255, + 0 + ], + "wrapper": true, + "created": true, + "name": "Default layer" + } + }, + "id": 1, + "vars_in": [ + { + "rel": "tpl", + "name": "template" + }, + { + "rel": "form", + "name": "data" + } + ], + "actions_in": [ + {} + ], + "vars_out": [ + { + "jpath": [] + } + ], + "actions_out": [ + { + "jpath": [] + } + ], + "toolbar": { + "custom": [ + [ + { + "title": "", + "icon": "", + "action": "", + "position": "begin", + "color": [ + 100, + 100, + 100, + 1 + ] + } + ] + ], + "common": [ + { + "toolbar": [ + [ + "Open Preferences" + ] + ] + } + ] + }, + "css": [ + { + "fontSize": [ + "" + ], + "fontFamily": [ + "" + ] + } + ], + "title": "" + }, + { + "url": "modules/types/edition/quill_editor/", + "configuration": { + "sections": {}, + "groups": { + "group": [ + { + "editable": [ + [ + "isEditable" + ] + ], + "toolbarMode": [ + "minimal" + ], + "debouncing": [ + 0 + ], + "storeInView": [ + [ + "yes" + ] + ], + "modifyVarIn": [ + [] + ], + "className": [ + "quill" + ], + "css": [ + ".quill {}" + ] + } + ] + } + }, + "layers": { + "Default layer": { + "position": { + "left": 0, + "top": 0 + }, + "size": { + "width": 53, + "height": 23 + }, + "zIndex": 0, + "display": true, + "title": "", + "bgColor": [ + 255, + 255, + 255, + 0 + ], + "wrapper": true, + "created": true, + "name": "Default layer" + } + }, + "id": 2, + "vars_in": [ + {} + ], + "actions_in": [ + {} + ], + "vars_out": [ + { + "jpath": [] + } + ], + "actions_out": [ + { + "jpath": [] + } + ], + "toolbar": { + "custom": [ + [ + { + "title": "", + "icon": "", + "action": "", + "position": "begin", + "color": [ + 100, + 100, + 100, + 1 + ] + } + ] + ], + "common": [ + { + "toolbar": [ + [ + "Open Preferences" + ] + ] + } + ] + }, + "css": [ + { + "fontSize": [ + "" + ], + "fontFamily": [ + "" + ] + } + ], + "title": "", + "richtext": { + "ops": [ + { + "insert": "\n" + } + ] + } + }, + { + "url": "modules/types/edition/object_editor/", + "configuration": { + "sections": {}, + "groups": { + "group": [ + { + "editable": [ + "view" + ], + "expanded": [ + [ + "expand" + ] + ], + "storeObject": [ + [] + ], + "displayValue": [ + [] + ], + "searchBox": [ + [ + "search" + ] + ], + "sendButton": [ + [] + ], + "output": [ + "new" + ], + "storedObject": [ + "{}" + ] + } + ] + } + }, + "layers": { + "Default layer": { + "position": { + "left": 54, + "top": 24 + }, + "size": { + "width": 40, + "height": 54 + }, + "zIndex": 0, + "display": true, + "title": "", + "bgColor": [ + 255, + 255, + 255, + 0 + ], + "wrapper": true, + "created": true, + "name": "Default layer" + } + }, + "id": 4, + "vars_in": [ + { + "rel": "value", + "name": "data" + } + ], + "actions_in": [ + {} + ], + "vars_out": [ + { + "jpath": [] + } + ], + "actions_out": [ + { + "jpath": [] + } + ], + "toolbar": { + "custom": [ + [ + { + "title": "", + "icon": "", + "action": "", + "position": "begin", + "color": [ + 100, + 100, + 100, + 1 + ] + } + ] + ], + "common": [ + { + "toolbar": [ + [ + "Open Preferences" + ] + ] + } + ] + }, + "css": [ + { + "fontSize": [ + "" + ], + "fontFamily": [ + "" + ] + } + ], + "title": "" + }, + { + "url": "modules/types/display/single_value/", + "configuration": { + "sections": {}, + "groups": { + "group": [ + { + "append": [ + [] + ], + "maxEntries": [ + 1 + ], + "editable": [ + [] + ], + "editSearchRegexp": [ + null + ], + "editReplace": [ + null + ], + "debounce": [ + 0 + ], + "defaultvalue": [ + "
The data are created in the general preferences before the module is loaded to trigger possible problems
\n" + ], + "font": [ + "Arial" + ], + "fontcolor": [ + [ + 0, + 0, + 0, + 1 + ] + ], + "fontsize": [ + null + ], + "align": [ + "left" + ], + "valign": [ + "top" + ], + "rendererOptions": [ + "" + ], + "forceType": [ + "" + ], + "sprintf": [ + null + ], + "sprintfOrder": [ + null + ], + "preformatted": [ + [] + ] + } + ] + } + }, + "layers": { + "Default layer": { + "position": { + "left": 0, + "top": 24 + }, + "size": { + "width": 53, + "height": 54 + }, + "zIndex": 0, + "display": true, + "title": "", + "bgColor": [ + 255, + 255, + 255, + 0 + ], + "wrapper": true, + "created": true, + "name": "Default layer" + } + }, + "id": 5, + "vars_in": [ + {} + ], + "actions_in": [ + {} + ], + "vars_out": [], + "actions_out": [ + { + "jpath": [] + } + ], + "toolbar": { + "custom": [ + [ + { + "title": "", + "icon": "", + "action": "", + "position": "begin", + "color": [ + 100, + 100, + 100, + 1 + ] + } + ] + ], + "common": [ + { + "toolbar": [ + [ + "Open Preferences" + ] + ] + } + ] + }, + "css": [ + { + "fontSize": [ + "" + ], + "fontFamily": [ + "" + ] + } + ], + "title": "" + } + ], + "variables": [ + { + "jpath": [ + "" + ] + } + ], + "aliases": [ + {} + ], + "configuration": { + "title": "Twig dynamic form experiments" + }, + "actionscripts": [ + { + "sections": {}, + "groups": { + "action": [ + { + "name": [ + null + ], + "script": [ + null + ] + } + ] + } + } + ], + "init_script": [ + { + "sections": {}, + "groups": { + "general": [ + { + "script": [ + "//const delay = await API.require('delay');\n\nconst template = `\nTitle: