dbm 1.1.14 → 1.1.16

package/flow/FlowProperty.js

@@ -48,6 +48,12 @@ export default class FlowProperty extends Dbm.flow.FlowBaseObject {
         return this;
     }
 
+    delayValue(aToValue, aDelay = 0) {
+        Dbm.getInstance().repository.getItem("propertyUpdater").controller.delayUpdateProperty(this, aToValue, aDelay);
+
+        return this;
+    }
+
     getMostUpstreamProperty() {
 
         let debugCounter = 0;

package/flow/controllers/select/SingleSelection.js

@@ -28,8 +28,8 @@ export default class SingleSelection extends Dbm.core.BaseObject {
     }
 
     _selectionChanged(aSelected, aValue) {
-        //console.log("_selectionChanged");
-        //console.log(aSelected, aValue);
+        console.log("_selectionChanged");
+        console.log(aSelected, aValue);
 
         if(aSelected) {
             this.item.properties.value.getMostUpstreamProperty().setValue(aValue);

package/flow/updatefunctions/thirdparty/threejs/UpdateObjectParent.js

@@ -0,0 +1,39 @@
+import Dbm from "../../../../index.js";
+
+export default class UpdateObjectParent extends Dbm.flow.FlowUpdateFunction {
+
+    _construct() {
+        super._construct();
+        
+        this.input.register("object", null);
+        this.input.register("parent", null);
+        this.input.register("added", false);
+
+        this.output.register("dynamicUpdate", 0);
+    }
+
+    _update() {
+        console.log("UpdateObjectParent::_update");
+
+        let dynamicUpdate = this.output.dynamicUpdate;
+        dynamicUpdate++;
+
+        let object = this.input.object;
+        //MENOTE: if object is changed, it doesn't remove the old one from the parent
+
+        if(object) {
+            let parent = this.input.parent;
+
+            if(parent && this.input.added) {
+                parent.add(object);
+            }
+            else {
+                if(object.parent) {
+                    object.parent.remove(object);
+                }
+            }
+        }
+
+        this.output.dynamicUpdate = dynamicUpdate;
+    }
+}

package/flow/updatefunctions/thirdparty/threejs/index.js

@@ -1,6 +1,7 @@
 import Dbm from "../../../../index.js";
 
 export {default as UpdateObjectPosition} from "./UpdateObjectPosition.js";
+export {default as UpdateObjectParent} from "./UpdateObjectParent.js";
 
 export const updateObjectPosition = function(aObject, aX = 0, aY = 0, aZ = 0, aRotationX = 0, aRotationY = 0, aRotationZ = 0, aScaleX = 1, aScaleY = 1, aScaleZ = 1) {
     let newUpdateObjectPosition = new Dbm.flow.updatefunctions.thirdparty.threejs.UpdateObjectPosition();
@@ -23,4 +24,18 @@ export const updateObjectPosition = function(aObject, aX = 0, aY = 0, aZ = 0, aR
     newUpdateObjectPosition.output.properties.dynamicUpdate.startUpdating();
 
     return newUpdateObjectPosition;
+}
+
+export const updateObjectParent = function(aObject, aParent, aAdded = false) {
+    let newUpdateFunction = new Dbm.flow.updatefunctions.thirdparty.threejs.UpdateObjectParent();
+
+    let inputProperties = newUpdateFunction.input.properties;
+    inputProperties.object.setOrConnect(aObject);
+
+    inputProperties.parent.setOrConnect(aParent);
+    inputProperties.added.setOrConnect(aAdded);
+    
+    newUpdateFunction.output.properties.dynamicUpdate.startUpdating();
+
+    return newUpdateFunction;
 }

package/graphapi/webclient/admin/ItemEditor.js

@@ -104,6 +104,26 @@ export default class ItemEditor extends Dbm.core.BaseObject {
         return this._addMultipleRelationsEditor(name, aType, aObjectType, aInitialValue, Dbm.graphapi.webclient.admin.SaveFunctions.multipleOutgoingRelations, aUpdateEncoding);
     }
 
+    getVisibilityEditor(aInitialValue) {
+        let name = "visibility"
+        let valueEditor = this.item["visibility"];
+        if(!valueEditor) {
+            valueEditor = new Dbm.graphapi.webclient.admin.ValueEditor();
+            valueEditor.item.editValue.setInitialValue(aInitialValue);
+
+            valueEditor.item.setValue("itemEditor", this.item);
+            valueEditor.item.setValue("updateEncoding", "visibility");
+
+            this.item.anyChange.addCheck(valueEditor.item.properties.changed);
+            this.item.setValue(name, valueEditor); 
+            this.item.editors = [].concat(this.item.editors, valueEditor);
+            
+            valueEditor.addSaveFunction(Dbm.graphapi.webclient.admin.SaveFunctions.setVisibility);
+        }
+
+        return valueEditor;
+    }
+
     addCommandsToSaveData(aSaveData) {
 
         let editedItemId = Dbm.objectPath(this.item, "editedItem.id");

package/graphapi/webclient/decode/index.js

@@ -138,7 +138,8 @@ export const fullSetup = function() {
     {
         let name = "helpSection";
         let currentDecoder = new Dbm.graphapi.webclient.decode.DecodeBaseObject();
-        currentDecoder.item.setValue("copyFields", ["title", "link"]);
+        currentDecoder.item.setValue("copyFields", ["question", "title", "link", "description", "linkText"]);
+        currentDecoder.item.setValue("copyLink", ["page"]);
         currentDecoder.item.setValue("encodingType", name);
         currentDecoder.item.register(decodePrefix + name);
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dbm",
-  "version": "1.1.14",
+  "version": "1.1.16",
   "main": "index.js",
   "type": "module",
   "scripts": {},

package/react/admin/editor/fields/ArrayField.js

@@ -0,0 +1,80 @@
+import React from "react";
+import Dbm from "../../../../index.js";
+
+export default class SelectObjectsField extends Dbm.react.BaseObject {
+    _construct() {
+        super._construct();
+
+        this._valueChangedBound = this._valueChanged.bind(this);
+        this._objectChangedBound = this._objectChanged.bind(this);
+
+        Dbm.flow.addUpdateCommand(this.item.requireProperty("value", this._getObjectData()), Dbm.commands.callFunction(this._valueChangedBound));
+
+        let editorData = Dbm.objectPath(this.context, "moduleData.editorData");
+        Dbm.flow.addUpdateCommand(editorData.properties.data, Dbm.commands.callFunction(this._objectChangedBound));
+    }
+
+    _getObjectData() {
+        let fieldName = this.getPropValue("name");
+
+        let editorData = Dbm.objectPath(this.context, "moduleData.editorData");
+
+        let returnData = editorData.data[fieldName];
+        if(!returnData) {
+            returnData = [];
+        }
+
+        return returnData;
+    }
+
+
+    _valueChanged() {
+        //console.log("_valueChanged");
+
+        let fieldName = this.getPropValue("name");
+        let newValue = this.item.value;
+        let editorData = Dbm.objectPath(this.context, "moduleData.editorData");
+
+        let newData = {...editorData.data};
+        newData[fieldName] = newValue;
+
+        editorData.data = newData;
+
+        this.context.moduleData.editorData.editorBlock.dataUpdated();
+    }
+
+    _objectChanged() {
+        //console.log("_objectChanged");
+
+        this.item.value = this._getObjectData();
+    }
+
+    _add(aArrayEditor) {
+        console.log("_add");
+        console.log(aArrayEditor);
+
+        let newItemData = this.getPropValueWithDefault("newItemData", {});
+
+        aArrayEditor.push(newItemData);
+    }
+
+    _removeItem(aArrayEditor, aItem) {
+        aArrayEditor.removeItem(aItem);
+    }
+
+    _renderMainElement() {
+
+
+        return this._createMainElement(Dbm.react.form.EditArray, {value: this.item.properties.value},
+            React.createElement("div", {}, 
+                this.getPropValue("children"),
+                React.createElement(Dbm.react.interaction.CommandButton, {command: Dbm.commands.callFunction(this._removeItem, [Dbm.react.source.contextVariable("arrayEditor"), Dbm.react.source.contextVariable("item")])},
+                    React.createElement("div", {}, "Remove")
+                )
+            ),
+            React.createElement(Dbm.react.interaction.CommandButton, {"data-slot": "after", command: Dbm.commands.callFunction(this._add.bind(this), [Dbm.react.source.contextVariable("arrayEditor")])},
+                React.createElement("div", {className: "action-button action-button-padding"}, "Add")
+            )
+         );
+    }
+}

package/react/admin/editor/fields/SelectObjectField.js

@@ -52,6 +52,6 @@ export default class SelectObjectField extends Dbm.react.BaseObject {
     }
 
     _renderMainElement() {
-        return this._createMainElement(Dbm.react.form.GraphApiObjectSelection, {value: this.item.properties.value, objectType: this.getPropValue("objectType"), className: "standard-field standard-field-padding full-width"});
+        return this._createMainElement(Dbm.react.form.GraphApiObjectSelection, {value: this.item.properties.value, objectType: this.getPropValue("objectType"), encoding: this.getPropValue("encoding"), nameField: this.getPropValue("nameField"), className: "standard-field standard-field-padding full-width"});
     }
 }

package/react/admin/editor/fields/SelectObjectsField.js

@@ -19,8 +19,6 @@ export default class SelectObjectsField extends Dbm.react.BaseObject {
 
         let editorData = Dbm.objectPath(this.context, "moduleData.editorData");
 
-        console.log(">>>>>", editorData);
-
         let returnData = editorData.data[fieldName];
         if(!returnData) {
             returnData = [];
@@ -31,7 +29,7 @@ export default class SelectObjectsField extends Dbm.react.BaseObject {
 
 
     _valueChanged() {
-        console.log("_valueChanged");
+        //console.log("_valueChanged");
 
         let fieldName = this.getPropValue("name");
         let newValue = this.item.value;

package/react/admin/editor/fields/index.js

@@ -4,4 +4,5 @@ export {default as ImageField} from "./ImageField.js";
 export {default as CheckboxField} from "./CheckboxField.js";
 export {default as SelectObjectField} from "./SelectObjectField.js";
 export {default as SelectObjectsField} from "./SelectObjectsField.js";
-export {default as SelectionField} from "./SelectionField.js";
+export {default as SelectionField} from "./SelectionField.js";
+export {default as ArrayField} from "./ArrayField.js";

package/react/admin/editorsgroup/EditItem.js

@@ -22,7 +22,7 @@ export default class EditItem extends Dbm.react.BaseObject {
                     {"type": "includeDraft"},
                     {"type": "idSelection", "ids": [item.id]},
                 ],
-                ["admin_fields", "relations"]
+                ["admin_fields", "relations", "visibility"]
             );
             allLoaded.addCheck(request.properties.status);
         }

package/react/admin/editorsgroup/EditVisibility.js

@@ -0,0 +1,25 @@
+import React from "react";
+import Dbm from "../../../index.js";
+
+export default class EditVisibility extends Dbm.react.BaseObject {
+    _construct() {
+        super._construct();
+
+        let item = this.context.item;
+        let itemEditor = this.context.itemEditor;
+        let initialDataPath = this.getPropValueWithDefault("initialDataPath", "visibility");
+        let initialData = Dbm.objectPath(item, initialDataPath);
+
+        let editor = itemEditor.getVisibilityEditor(initialData);
+        this.item.setValue("editor", editor.item);
+    }
+
+    _renderMainElement() {
+
+        let children = this.getPropValue("children")
+
+        return React.createElement("div", {},
+            React.createElement(Dbm.react.context.AddContextVariables, {"values": {"valueEditor": this.item.editor}}, children)
+        );
+    }
+}

package/react/admin/editorsgroup/index.js

@@ -1,3 +1,4 @@
 export {default as EditField} from "./EditField.js";
 export {default as EditItem} from "./EditItem.js";
-export {default as EditRelation} from "./EditRelation.js";
+export {default as EditRelation} from "./EditRelation.js";
+export {default as EditVisibility} from "./EditVisibility.js";

package/react/admin/objects/itemeditors/RichDescription.js

@@ -0,0 +1,46 @@
+import React from "react";
+import Dbm from "../../../../index.js";
+
+export default class RichDescription extends Dbm.react.BaseObject {
+    _construct() {
+        super._construct();
+
+        let graphApi = Dbm.getInstance().repository.getItem("graphApi").controller;
+
+        let id = this.context.item.id;
+
+        let allLoaded = Dbm.flow.updatefunctions.logic.allAtValue(Dbm.loading.LoadingStatus.LOADED);
+        this.item.requireProperty("loaded", false);
+
+        {
+            let request = graphApi.requestRange(
+                [
+                    {"type": "includePrivate"},
+                    {"type": "includeDraft"},
+                    {"type": "idSelection", "ids": [id]},
+                ],
+                ["adbmi_fields"]
+            );
+            allLoaded.addCheck(request.properties.status);
+        }
+
+        this.item.properties.loaded.connectInput(allLoaded.output.properties.value);
+    }
+
+    _renderMainElement() {
+
+        let id = this.context.item.id;
+
+        return React.createElement("div", {},
+            
+            React.createElement(Dbm.react.area.HasData, {check: this.item.properties.loaded},
+                React.createElement(Dbm.react.form.LabelledArea, {label: "Description"}, 
+                    React.createElement(Dbm.react.admin.editorsgroup.EditField, {"fieldName": "description"},
+                        React.createElement(Dbm.react.form.TextArea, {value: Dbm.react.source.contextVariable("valueEditor.editValue.value"), className: "standard-field standard-field-padding full-width"})
+                    )
+                )
+            )
+            
+        )
+    }
+}

package/react/admin/objects/itemeditors/Visibility.js

@@ -35,7 +35,9 @@ export default class Visibility extends Dbm.react.BaseObject {
             
             React.createElement(Dbm.react.area.HasData, {check: this.item.properties.loaded},
                 React.createElement(Dbm.react.form.LabelledArea, {label: "Visibility"}, 
-                    Dbm.react.text.text(Dbm.react.source.contextVariable("item.visibility"))
+                    React.createElement(Dbm.react.admin.editorsgroup.EditVisibility, {},
+                        React.createElement(Dbm.react.form.FormField, {value: Dbm.react.source.contextVariable("valueEditor.editValue.value"), className: "standard-field standard-field-padding full-width"})
+                    )
                 )
             )
             

package/react/admin/objects/itemeditors/index.js

@@ -4,4 +4,5 @@ export {default as Name} from "./Name.js";
 export {default as Link} from "./Link.js";
 export {default as Visibility} from "./Visibility.js";
 export {default as LinkedPage} from "./LinkedPage.js";
-export {default as Question} from "./Question.js";
+export {default as Question} from "./Question.js";
+export {default as RichDescription} from "./RichDescription.js";

package/react/blocks/content/Card.js

@@ -13,11 +13,20 @@ export default class Card extends Dbm.react.BaseObject {
               React.createElement("h3", {"className": "no-margins"},
                 Dbm.react.text.text(Dbm.react.source.blockData("title"))
               ),
-              Dbm.react.text.htmlText(Dbm.react.source.blockData("text")),
+              React.createElement("div", {"className": "body-text"},
+                Dbm.react.text.htmlText(Dbm.react.source.blockData("text")),
+              ),
               React.createElement("div", {"className": "flex-row justify-between"},
                 React.createElement("div", {"className": "flex-row-item"}),
-                React.createElement("div", {"className": "flex-row-item"},
-                  Dbm.react.text.text(Dbm.react.source.blockData("buttonText")),
+                React.createElement("div", {"className": "flex-row-item standard-card-read-more-link"},
+                  React.createElement("div", {className: "flex-row micro-item-spacing vertically-center-items"},
+                      React.createElement("div", {className: "flex-row-item flex-resize"},
+                        Dbm.react.text.text(Dbm.react.source.blockData("buttonText"))
+                      ),
+                      React.createElement("div", {className: "flex-row-item flex-no-resize"},
+                          React.createElement(Dbm.react.image.Image, {src: "/assets/img/read-more-right-arrow.svg", className: "right-arrow-read-more-link-icon background-contain"})
+                      )
+                  )
                 )
               )
             )
@@ -34,11 +43,23 @@ export default class Card extends Dbm.react.BaseObject {
               React.createElement("h3", {"className": "no-margins"},
                 Dbm.react.text.text(Dbm.react.source.blockData("title"))
               ),
-              Dbm.react.text.htmlText(Dbm.react.source.blockData("text")),
+              React.createElement("div", {"className": "spacing small"}),
+              React.createElement("div", {"className": "body-text"},
+                Dbm.react.text.htmlText(Dbm.react.source.blockData("text")),
+              ),
+              
+              React.createElement("div", {"className": "spacing small"}),
               React.createElement("div", {"className": "flex-row justify-between"},
                 React.createElement("div", {"className": "flex-row-item"}),
-                React.createElement("div", {"className": "flex-row-item"},
-                  Dbm.react.text.text(Dbm.react.source.blockData("buttonText")),
+                React.createElement("div", {"className": "flex-row-item standard-card-read-more-link"},
+                  React.createElement("div", {className: "flex-row micro-item-spacing vertically-center-items"},
+                    React.createElement("div", {className: "flex-row-item flex-resize"},
+                      Dbm.react.text.text(Dbm.react.source.blockData("buttonText"))
+                    ),
+                    React.createElement("div", {className: "flex-row-item flex-no-resize"},
+                        React.createElement(Dbm.react.image.Image, {src: "/assets/img/read-more-right-arrow.svg", className: "right-arrow-read-more-link-icon background-contain"})
+                    )
+                )
                 )
               )
             )

package/react/blocks/content/ContentBlock.js

@@ -27,7 +27,6 @@ export default class ContentBlock extends Dbm.react.BaseObject {
     _loaded(aRequest) {
       //console.log("_loaded");
       this.item.item = aRequest.items[0];
-      
     }
 
     _renderMainElement() {

package/react/blocks/faq/AskAQuestion.js

@@ -9,71 +9,78 @@ export default class AskAQuestion extends Dbm.react.BaseObject {
         this.item.requireProperty("currentQuery", "");
 
         this.item.requireProperty("state", "start");
+        this.item.requireProperty("openSection", 0);
+
+        this._singelSelection = new Dbm.flow.controllers.select.SingleSelection();
+        this._singelSelection.item.properties.value.connectInput(this.item.properties.openSection);
+        this._rowProperties = [];
 
         this.item.requireProperty("results", []);
 
         let switchValue = Dbm.flow.updatefunctions.logic.switchValue(this.item.properties.state);
 
-        switchValue.addCase("start", React.createElement("div", null, React.createElement(Dbm.react.text.Link, {
-            href: Dbm.react.source.blockData("url1"),
-            className: "custom-styled-link"
-          }, React.createElement("div", {
-            className: "standard-row faq-row hover-row faq-row-padding"
-          }, React.createElement("div", {
-            className: "flex-row small-item-spacing"
-          }, React.createElement("div", {
-            className: "flex-row-item flex-resize"
-          }, Dbm.react.text.text(Dbm.react.source.blockData("text1"))), React.createElement("div", {
-            className: "flex-row-item flex-no-resize"
-          }, React.createElement("div", {
-            className: "spacing micro"
-          }), React.createElement(Dbm.react.image.Image, {
-            src: "/assets/img/right-arrow.svg",
-            className: "right-arrow-link-icon background-contain"
-          }))))), React.createElement(Dbm.react.text.Link, {
-            href: Dbm.react.source.blockData("url2"),
-            className: "custom-styled-link"
-          }, React.createElement("div", {
-            className: "standard-row faq-row hover-row faq-row-padding cursor-pointer"
-          }, React.createElement("div", {
-            className: "flex-row small-item-spacing"
-          }, React.createElement("div", {
-            className: "flex-row-item flex-resize"
-          }, Dbm.react.text.text(Dbm.react.source.blockData("text2"))), React.createElement("div", {
-            className: "flex-row-item flex-no-resize"
-          }, React.createElement("div", {
-            className: "spacing micro"
-          }), React.createElement(Dbm.react.image.Image, {
-            src: "/assets/img/right-arrow.svg",
-            className: "right-arrow-link-icon background-contain"
-          })))))));
-        switchValue.addCase("loading", React.createElement("div", null, React.createElement("div", {
-            className: "spacing small"
-          }), "Loading..."));
-        switchValue.addCase("results", React.createElement("div", null, React.createElement(Dbm.react.area.List, {
-            items: this.item.properties.results
-          }, React.createElement(Dbm.react.text.Link, {
-            href: Dbm.react.source.contextVariable("item.link"),
-            className: "custom-styled-link"
-          }, React.createElement("div", {
-            className: "standard-row faq-row hover-row faq-row-padding cursor-pointer"
-          }, React.createElement("div", {
-            className: "flex-row small-item-spacing"
-          }, React.createElement("div", {
-            className: "flex-row-item flex-resize"
-          }, Dbm.react.text.text(Dbm.react.source.contextVariable("item.title"))), React.createElement("div", {
-            className: "flex-row-item flex-no-resize"
-          }, React.createElement("div", {
-            className: "spacing micro"
-          }), React.createElement(Dbm.react.image.Image, {
-            src: "/assets/img/right-arrow.svg",
-            className: "right-arrow-link-icon background-contain"
-          }))))))));
-        switchValue.addCase("noResults", React.createElement("div", {
-            className: "faq-row-padding"
-          }, "We could not find what you were looking for. Please contact us by phone or email instead."));
+        switchValue.addCase("start", React.createElement("div", null));
+        switchValue.addCase("loading", React.createElement("div", null, React.createElement("div", {className: "spacing small"}), "Loading..."));
+        switchValue.addCase("results", React.createElement("div", null,
+          React.createElement(Dbm.react.area.List, {items: this.item.properties.results, as: "row"},
+            React.createElement(Dbm.react.context.AddItemToContext, {item: Dbm.react.source.contextVariable("row.item")},
+              React.createElement(Dbm.react.area.InsertElement, {element: Dbm.react.source.contextVariable("row.element")})
+            ),
+            React.createElement("div", {"data-slot": "spacing", "className": "spacing small help-section-row-spacing"})
+          )
+        ));
+        switchValue.addCase("noResults", React.createElement("div", {className: "faq-row-padding"}, "We could not find what you were looking for. Please contact us by phone or email instead."));
 
         this.item.requireProperty("resultElement", null).connectInput(switchValue.output.properties.value);
+
+        let ids = this.context.blockData.initialSections;
+        let graphApi = Dbm.getInstance().repository.getItem("cachedGraphApi").controller;
+        {
+            let request = graphApi.requestRange(
+                [
+                    {type: "idSelection", "ids": ids}
+                ],
+                ["helpSection"]
+            );
+            
+            this.item.requireProperty("initialLoadStatus", 0);
+            Dbm.flow.addUpdateCommandWhenMatched(this.item.properties.initialLoadStatus, Dbm.loading.LoadingStatus.LOADED, Dbm.commands.callFunction(this._initalDataLoaded.bind(this), [request]));
+            this.item.properties.initialLoadStatus.connectInput(request.properties.status);
+        }
+    }
+
+    _getOpenProperty(aIndex) {
+      for(let i = this._rowProperties.length; i <= aIndex; i++) {
+        this._rowProperties.push(this._singelSelection.addSelectionValue(i));
+      }
+      
+      return this._rowProperties[aIndex];
+    }
+
+    _createRows(aItems) {
+      let rows = new Array();
+      let currentArray = aItems;
+      let currentArrayLength = currentArray.length;
+      for(let i = 0; i < currentArrayLength; i++) {
+        let currentItem = currentArray[i];
+        let currentRow = new Dbm.repository.Item();
+        currentRow.setId("_dbmInternal/row" + Dbm.getInstance().getNextId());
+        currentRow.setValue("item", currentItem);
+        currentRow.setValue("element", React.createElement(Dbm.react.blocks.faq.HelpSectionRowItem, {"open": this._getOpenProperty(i)}));
+        rows.push(currentRow);
+      }
+      this.item.results = rows;
+    }
+
+    _initalDataLoaded(aRequest) {
+      console.log("_initalDataLoaded")
+      console.log(aRequest);
+
+      if(aRequest.items.length) {
+        this._createRows(aRequest.items);
+        this.item.state = "results";
+      }
+      
     }
 
     _dataLoaded(aQuery, aRequest) {
@@ -84,8 +91,9 @@ export default class AskAQuestion extends Dbm.react.BaseObject {
             let ids = Dbm.objectPath(aRequest, "data.answers");
             if(ids.length > 0) {
                 let items = Dbm.getInstance().repository.getItems(ids);
-                this.item.results = items;
+                this._createRows(items);
                 this.item.state = "results";
+                this.item.openSection = 0;
             }
             else {
                 this.item.state = "noResults";

package/react/blocks/faq/HelpSectionRowItem.js

@@ -0,0 +1,79 @@
+import React from "react";
+import Dbm from "../../../index.js";
+
+export default class HelpSectionRowItem extends Dbm.react.BaseObject {
+    _construct() {
+        super._construct();
+
+        this._toggleOpenCommand = Dbm.commands.callFunction(this._toggleOpen.bind(this));
+    }
+
+    _toggleOpen() {
+        //console.log("_toggleOpen");
+        let open = this.getDynamicProp("open");
+        open.getMostUpstreamProperty().setValue(!open.value);
+    }
+
+    _renderMainElement() {
+
+        let open = this.getDynamicProp("open");
+
+        let linkText = "Read more";
+        if(this.context.item.linkText) {
+            linkText = this.context.item.linkText;
+        }
+
+        let answerElement = React.createElement("div", {className: "help-section-row-answer help-section-row-answer-padding"}, 
+            React.createElement("div", {className: "help-section-row-answer-title"},
+                Dbm.react.text.text(Dbm.react.source.contextVariable("item.title"))
+            ),
+            React.createElement("div", {className: "help-section-row-answer-description body-text"},
+                Dbm.react.text.htmlText(Dbm.react.source.contextVariable("item.description"))
+            ),
+            React.createElement("div", {className: "flex-row justify-between"},
+                React.createElement("div", {className: "flex-row-item"}),
+                React.createElement("div", {className: "flex-row-item flex-no-resize help-section-row-read-more-link"},
+                    React.createElement("div", {className: "flex-row micro-item-spacing vertically-center-items"},
+                        React.createElement("div", {className: "flex-row-item flex-resize"},
+                            linkText
+                        ),
+                        React.createElement("div", {className: "flex-row-item flex-no-resize"},
+                            React.createElement(Dbm.react.image.Image, {src: "/assets/img/read-more-right-arrow.svg", className: "right-arrow-read-more-link-icon background-contain"})
+                        )
+                    )
+                )
+            )
+        );
+
+        let link = Dbm.objectPath(this.context.item, "page.url");
+        if(!link) {
+            link = Dbm.objectPath(this.context.item, "link");
+        }
+
+        if(link) {
+            answerElement = React.createElement(Dbm.react.text.Link, {"href": link, "className": "custom-styled-link"}, answerElement);
+        }
+
+        return React.createElement("div", {className: "help-section-row help-section-row-padding"},
+            React.createElement(Dbm.react.interaction.CommandButton, {command: this._toggleOpenCommand}, 
+                React.createElement("div", {className: "help-section-row-question help-section-row-question-padding cursor-pointer"}, 
+                    React.createElement("div", {className: "flex-row small-item-spacing vertically-center-items"},
+                        React.createElement("div", {className: "flex-row-item flex-no-resize"},
+                            React.createElement(Dbm.react.image.Image, {src: "/assets/img/faq-question.svg", className: "help-section-row-question-icon background-contain"})
+                        ),
+                        React.createElement("div", {className: "flex-row-item flex-resize"},
+                            Dbm.react.text.text(Dbm.react.source.contextVariable("item.question"))
+                        ),
+                        React.createElement("div", {className: "flex-row-item flex-no-resize"},
+                            React.createElement(Dbm.react.area.HasData, {check: open}, "-"),
+                            React.createElement(Dbm.react.area.HasData, {check: open, checkType: "invert/default"}, "+"),
+                        )
+                    )
+                )
+            ),
+            React.createElement(Dbm.react.area.OpenCloseExpandableArea, {open: open}, 
+                answerElement
+            )
+        );
+    }
+}

package/react/blocks/faq/index.js

@@ -1 +1,2 @@
-export {default as AskAQuestion} from "./AskAQuestion.js";
+export {default as AskAQuestion} from "./AskAQuestion.js";
+export {default as HelpSectionRowItem} from "./HelpSectionRowItem.js";

package/react/blocks/index.js

@@ -214,16 +214,8 @@ export let registerAllBlocks = function() {
                 createElement(Dbm.react.admin.editor.fields.TextField, {name: "text1"})
             ),
             createElement("div", {className: "spacing medium"}),
-            createElement(Dbm.react.form.LabelledArea, {label: "Url 1"},
-                createElement(Dbm.react.admin.editor.fields.TextField, {name: "url1"})
-            ),
-            createElement("div", {className: "spacing medium"}),
-            createElement(Dbm.react.form.LabelledArea, {label: "Text 2"},
-                createElement(Dbm.react.admin.editor.fields.TextField, {name: "text2"})
-            ),
-            createElement("div", {className: "spacing medium"}),
-            createElement(Dbm.react.form.LabelledArea, {label: "Url 2"},
-                createElement(Dbm.react.admin.editor.fields.TextField, {name: "url2"})
+            createElement(Dbm.react.form.LabelledArea, {label: "Initial sections"}, 
+                createElement(Dbm.react.admin.editor.fields.SelectObjectsField, {objectType: "helpSection", name:"initialSections", "encoding": "title", "nameField": "title"})
             ),
         );
         registerBlock("faq/askAQuestion", "FAQ / Ask a question", createElement(Dbm.react.blocks.faq.AskAQuestion, {}), editor, {}, {"text1": true, "text2": true});
@@ -239,6 +231,11 @@ export let registerAllBlocks = function() {
         itemEditor.setValue("element", createElement(Dbm.react.admin.objects.itemeditors.Content, {}));
     }
 
+    {
+        let itemEditor = Dbm.getInstance().repository.getItem("admin/itemEditors/richDescription");
+        itemEditor.setValue("element", createElement(Dbm.react.admin.objects.itemeditors.RichDescription, {}));
+    }
+
     {
         let itemEditor = Dbm.getInstance().repository.getItem("admin/itemEditors/name");
         itemEditor.setValue("element", createElement(Dbm.react.admin.objects.itemeditors.Name, {}));
@@ -297,7 +294,7 @@ export let registerAllBlocks = function() {
         let newArray = [].concat(objectTypeEditor.editors);
         newArray.push(Dbm.getInstance().repository.getItem("admin/itemEditors/question"));
         newArray.push(Dbm.getInstance().repository.getItem("admin/itemEditors/title"));
-        newArray.push(Dbm.getInstance().repository.getItem("admin/itemEditors/content"));
+        newArray.push(Dbm.getInstance().repository.getItem("admin/itemEditors/richDescription"));
         newArray.push(Dbm.getInstance().repository.getItem("admin/itemEditors/linkedPage"));
         newArray.push(Dbm.getInstance().repository.getItem("admin/itemEditors/link"));
         newArray.push(Dbm.getInstance().repository.getItem("admin/itemEditors/visibility"));

package/react/cookies/CookieBar.js

@@ -156,6 +156,8 @@ export default class CookieBar extends Dbm.react.BaseObject {
         Dbm.getInstance().repository.getItem("trackingController").allowStatistics = true;
         Dbm.getInstance().repository.getItem("trackingController").allowMarketing = true;
 
+        Dbm.getInstance().repository.getItem("userSettings").setValue("hideCookieBar", true);
+
         this.getDynamicProp("open").getMostUpstreamProperty().setValue(false);
     }
 
@@ -175,6 +177,8 @@ export default class CookieBar extends Dbm.react.BaseObject {
         Dbm.getInstance().repository.getItem("trackingController").allowStatistics = false;
         Dbm.getInstance().repository.getItem("trackingController").allowMarketing = false;
 
+        Dbm.getInstance().repository.getItem("userSettings").setValue("hideCookieBar", true);
+
         this.getDynamicProp("open").getMostUpstreamProperty().setValue(false);
     }
 

package/react/form/EditObjectProperty.js

@@ -0,0 +1,28 @@
+import React from "react";
+import Dbm from "../../index.js";
+
+export default class EditObjectProperty extends Dbm.react.BaseObject {
+    _construct() {
+        super._construct();
+
+        this._valueSelector = new Dbm.flow.controllers.transform.PartOfObject();
+
+        this._valueSelector.item.properties.object.connectInput(this.getDynamicPropWithoutState("value", {}));
+        this._valueSelector.item.properties.path.connectInput(this.getDynamicPropWithoutState("path", {}));
+
+        this.item.requireProperty("value", []).connectInput(this._valueSelector.item.properties.value);
+
+    }
+
+    _renderMainElement() {
+
+        let children = this.getPropValue("children");
+
+        return this._createMainElement("div", {},
+            React.createElement(Dbm.react.context.AddContextVariables, {values: {"value": this.item.properties.value}},
+                children
+            )
+        );
+    }
+}
+

package/react/form/index.js

@@ -7,4 +7,5 @@ export {default as GraphApiObjectSelection} from "./GraphApiObjectSelection.js";
 export {default as GraphApiSelectOrCreateObject} from "./GraphApiSelectOrCreateObject.js";
 export {default as GraphApiImage} from "./GraphApiImage.js";
 export {default as EditArray} from "./EditArray.js";
-export {default as TextArea} from "./TextArea.js";
+export {default as TextArea} from "./TextArea.js";
+export {default as EditObjectProperty} from "./EditObjectProperty.js";

package/tracking/Controller.js

@@ -40,6 +40,9 @@ export default class Controller extends Dbm.core.BaseObject {
     setupPermissionsFromCookies() {
 		this.item.allowStatistics = Cookies.get("cookie/allowStatistics") === "1";
 		this.item.allowMarketing = Cookies.get("cookie/allowMarketing") === "1";
+
+        let cookieBarHiddenInitialSetting = Cookies.get("cookie/hideCookieBar") === "1";
+        let showingCookieBar = Dbm.getInstance().repository.getItem("userSettings").setValue("hideCookieBar", cookieBarHiddenInitialSetting);
 		
 		return this;
 	}

package/updater/PropertyUpdater.js

@@ -108,7 +108,30 @@ export default class PropertyUpdater extends Dbm.core.BaseObject {
         if(!aEasing) {
             aEasing = Easing.Quadratic.Out;
         }
-        let tween = new Tween(tweenObject).to({"envelope": aToValue}, 1000*aTime).delay(1000*aDelay).easing(aEasing).onUpdate(function(aData) {aProperty.value = aData.envelope}).onComplete(() => {this.removeTween(tween)}).start();
+
+        let tween = new Tween(tweenObject).to({"envelope": aToValue}, 1000*aTime).delay(1000*aDelay).easing(aEasing).onUpdate(function(aData) {
+            aProperty.value = aData.envelope;
+        }).onComplete(() => {this.removeTween(tween)}).start();
+
+        let tweens = [].concat(this.item.tweens);
+        tweens.push(tween);
+        this.item.tweens = tweens;
+
+        this._currentTweens.set(aProperty, tween);
+
+        return this;
+    }
+
+    delayUpdateProperty(aProperty, aToValue, aDelay = 0) {
+        if(this._currentTweens.has(aProperty)) {
+            this._currentTweens.get(aProperty).stop();
+        }
+        
+        let tweenObject = {"envelope": aProperty.value};
+
+        let tween = new Tween(tweenObject).to({"envelope": aToValue}, 0).delay(1000*aDelay).onUpdate(function(aData) {
+            aProperty.value = aToValue;
+        }).onComplete(() => {this.removeTween(tween)}).start();
 
         let tweens = [].concat(this.item.tweens);
         tweens.push(tween);