dbm 1.4.15 → 1.4.17

package/commands/index.js

@@ -57,7 +57,7 @@ export const trackEvent = function(aEventName, aAdditionalData = {}) {
 }
 
 export const performCommands = function(aCommands, aFromObject = null, aEventData = null) {
-    let currentArray = aCommands;
+    let currentArray = Dbm.utils.ArrayFunctions.singleOrArray(aCommands);
     let currentArrayLength = currentArray.length;
     for(let i = 0; i < currentArrayLength; i++) {
         let currentCommand = currentArray[i];

package/css/admin.css

@@ -1,5 +1,10 @@
 .dbm-admin {
     background-color: #f6f7f9;
+    color: #313131;
+
+    h1, h2, h3, h4, h5, h6 {
+        color: #313131;
+    }
 }
 
 .dbm-admin-box {
@@ -15,7 +20,7 @@
 
 .dbm-admin-hero {
     background: rgb(41,56,97);
-    background: linear-gradient(117deg, #4b4795 0%, #608be1 100%);
+    background: linear-gradient(to bottom right, #4b4795 0%, #608be1 100%);
 }
 
 .dbm-admin-hero .on-hero-text {

package/css/all.css

@@ -6,4 +6,7 @@
 @import './icons.css';
 @import './tags.css';
 @import './elements.css';
-@import './text.css';
+@import './text.css';
+@import './cookie-bar.css';
+@import './form-field.css';
+@import './grid.css';

package/css/cookie-bar.css

@@ -0,0 +1,40 @@
+.cookie-bar-position {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+}
+
+.cookie-bar {
+    box-sizing: border-box;
+    border-top: 1px solid #1A1A1A;
+    -webkit-backdrop-filter: blur(5px);
+    backdrop-filter: blur(5px);
+    background-color: rgba(255, 255, 255, 0.7);
+}
+
+.cookie-bar-padding {
+    padding: 10px;
+}
+
+.cookie-bar-title {
+    font-size: 18px;
+    font-weight: bold;
+}
+
+.cookie-overlay-message-box {
+    box-sizing: border-box;
+    border: 1px solid #1A1A1A;
+    border-radius: 20px;
+    -webkit-backdrop-filter: blur(5px);
+    backdrop-filter: blur(5px);
+    background-color: rgba(255, 255, 255, 0.7);
+}
+
+.cookie-overlay-message-box-padding {
+    padding: 20px;
+}
+
+.cookie-bar-description {
+    line-height: 1.3;
+}

package/css/elements.css

@@ -24,4 +24,45 @@
 
 .standard-dropdown-row-padding {
     padding: 8px 15px;
+}
+
+.help-section-row {
+    border: 1px solid var(--help-section-row-border-color, #3b3b3b);
+    border-radius: var(--help-section-row-border-radius, 5px);
+    overflow: hidden;
+}
+
+.help-section-row-question {
+    color: #FFFFFF;
+    background-color: var(--help-section-row-question-background-color, #3b3b3b);
+    font-weight: bold;
+}
+
+.help-section-row-question-padding {
+    padding: 5px 11px;
+}
+
+.help-section-row-answer-padding {
+    padding: 5px 11px;
+}
+
+.help-section-row-answer-title {
+    font-weight: bold;
+}
+
+.help-section-row-read-more-link {
+    color: var(--standard-link-color, #0000FF);
+    font-weight: bold;
+}
+
+@media (min-width: 600px) {
+    .help-section-row-read-more-link {
+        font-size: 14px;
+    }
+    
+}
+
+.help-section-row-question-icon {
+    width: 15px;
+    height: 15px;
 }

package/css/form-field.css

@@ -0,0 +1,46 @@
+.standard-field {
+    border: 1px solid var(--standard-field-border-color, #797979);
+    border-radius: var(--standard-field-border-radius, 5px);
+    font-size: var(--standard-field-size, 18px);
+    font-family: var(--standard-body-font, sans-serif);
+    box-sizing: border-box;
+}
+
+.standard-field-padding {
+    padding: var(--standard-field-vertical-padding, 10px) var(--standard-field-horizontal-padding, 10px);
+}
+
+.standard-field-padding-left-side {
+    padding-left: var(--standard-field-horizontal-padding, 10px);
+    padding-top: var(--standard-field-vertical-padding, 10px);
+    padding-bottom: var(--standard-field-vertical-padding, 10px);
+}
+
+.standard-field-padding-right-side {
+    padding-right: var(--standard-field-horizontal-padding, 10px);
+    padding-top: var(--standard-field-vertical-padding, 10px);
+    padding-bottom: var(--standard-field-vertical-padding, 10px);
+}
+
+.standard-field-padding-vertical {
+    padding-top: var(--standard-field-vertical-padding, 10px);
+    padding-bottom: var(--standard-field-vertical-padding, 10px);
+}
+
+.with-left-field-icon {
+    padding-left: calc(2 * var(--standard-field-horizontal-padding, 10px) + var(--field-icon-size, 16px));
+}
+
+.left-field-icon-position {
+    position: absolute;
+    top: 50%;
+    left: calc(var(--standard-field-horizontal-padding, 10px) + 0.5 * var(--field-icon-size, 16px));
+    transform: translate(-50%, -50%);
+}
+
+.integrated-field {
+    box-sizing: border-box;
+    border: none;
+    display: block;
+    font-size: var(--standard-body-font, sans-serif);
+}

package/css/grid.css

@@ -0,0 +1,8 @@
+.section-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+}
+
+.section-grid-gap {
+    gap: 20px;
+}

package/css/icons.css

@@ -13,6 +13,7 @@
     height: var(--field-icon-size, 16px);
 }
 
+/*
 .standard-icon-color {
     filter: url("#standard-icon-color");
 }
@@ -33,6 +34,7 @@
 .hover-icon.remove-action-icon-color:hover {
     filter: url("#remove-action-icon-hover-color");
 }
+*/
 
 .drag-handle-icon {
     width: 8px;

package/css/utils.css

@@ -95,6 +95,12 @@
     top: 0;
 }
 
+.middle-left {
+    left: 0;
+    top: 50%;
+    transform: translate(-50%, -50%);
+}
+
 .top-right {
     right: 0;
     top: 0;
@@ -105,6 +111,12 @@
     bottom: 0;
 }
 
+.middle-right {
+    right: 0;
+    top: 50%;
+    transform: translate(50%, -50%);
+}
+
 .bottom-right {
     right: 0;
     bottom: 0;
@@ -209,12 +221,6 @@
 	pointer-events: all;
 }
 
-.integrated-field {
-    box-sizing: border-box;
-    border: none;
-    display: block;
-}
-
 .centered-cell-holder {
 	display: flex;
 	justify-content: center;

package/dbm.js

@@ -103,8 +103,8 @@ export const getCachedGraphApi = function() {
 export * as utils from "./utils/index.js";
 export * as core from "./core/index.js";
 export * as loading from "./loading/index.js";
-export * as react from "./react/index.js";
 export * as repository from "./repository/index.js";
+export * as react from "./react/index.js";
 export * as graphapi from "./graphapi/index.js";
 export * as commands from "./commands/index.js";
 export * as flow from "./flow/index.js";

package/ecommerce/Cart.js

@@ -4,10 +4,11 @@ export default class Cart extends Dbm.core.BaseObject {
     _construct() {
         super._construct();
 
-        this._changeCommand = Dbm.commands.callFunction(this._changed.bind(this));
+        this._changeCommand = this._getScopedCallFunctionCommand(this._changed);
+
+        this.item.requireProperty("lineItems", []).addUpdate(this._changeCommand);
+        this.item.requireProperty("meta", {}).addUpdate(this._changeCommand);
 
-        this.item.setValue("lineItems", []);
-        Dbm.flow.addUpdateCommand(this.item.properties.lineItems, this._changeCommand);
         this.item.setValue("numberOfItems", 0);
         this.item.setValue("numberOfLines", 0);
 
@@ -29,7 +30,9 @@ export default class Cart extends Dbm.core.BaseObject {
             }
         }
 
+        Dbm.flow.addUpdateCommand(lineItem.item.properties.product, this._changeCommand);
         Dbm.flow.addUpdateCommand(lineItem.item.properties.quantity, this._changeCommand);
+        //METODO: save change for meta
 
         this.item.addToArray("lineItems", lineItem.item);
 
@@ -65,13 +68,45 @@ export default class Cart extends Dbm.core.BaseObject {
     }
 
     removeLineItem(aItem) {
-        let lineItems = [].concat(this.item.lineItems);
-        
-        let index = lineItems.indexOf(aItem);
-        if(index >= 0) {
-            lineItems.splice(index, 1);
-            this.item.lineItems = lineItems;
+        this.item.removeFromArray("lineItems", aItem);
+    }
+
+    emptyCart() {
+        this.item.lineItems = [];
+
+        return this;
+    }
+
+    setMeta(aKey, aValue) {
+        let newMeta = {...this.item.meta};
+        newMeta[aKey] = aValue;
+        this.item.meta = newMeta;
+
+        return this;
+    }
+
+    getAsObject() {
+        let returnObject = {};
+
+        let encodedLineItems = [];
+
+        let currentArray = this.item.lineItems;
+        let currentArrayLength = currentArray.length;
+        for(let i = 0; i < currentArrayLength; i++) {
+            let currentData = currentArray[i];
+
+            let meta = currentData.meta.controller.getAsObject();
+            //METODO: links in meta
+            let encodedData = {"type": currentData.type, "quantity": currentData.quantity, "meta": meta};
+            if(currentData.product) {
+                encodedData["product"] = currentData.product.id;
+            }
+            encodedLineItems.push(encodedData);
         }
+
+        returnObject = {"lineItems": encodedLineItems, "meta": {...this.item.meta}};
+
+        return returnObject;
     }
 
     _changed() {

package/ecommerce/LocalStorageCartLoader.js

@@ -49,6 +49,10 @@ export default class LocalStorageCartLoader extends Dbm.core.BaseObject {
                         lineItem.setProduct(product);
                     }
                 }
+
+                if(cartData.meta) {
+                    this.item.cart.meta = cartData.meta;
+                }
             }
         }
         catch(theError) {
@@ -81,10 +85,10 @@ export default class LocalStorageCartLoader extends Dbm.core.BaseObject {
             encodedLineItems.push(encodedData);
         }
 
-        console.log(encodedLineItems);
-
         try {
-            let cartDataString = localStorage.setItem(this.item.storageKey, JSON.stringify({"lineItems": encodedLineItems}));
+            let saveData = {"lineItems": encodedLineItems, "meta": this.item.cart.meta};
+            console.log(saveData);
+            let cartDataString = localStorage.setItem(this.item.storageKey, JSON.stringify(saveData));
         }
         catch(theError) {
             console.error(theError);

package/flow/controllers/select/SingleSelection.js

@@ -5,6 +5,9 @@ export default class SingleSelection extends Dbm.core.BaseObject {
         super._construct();
 
         this._valueMap = new Map();
+        let proxy = new Proxy({}, {get: this._proxy_get_selectionProperty.bind(this)});
+
+        this.item.setValue("selectionProperties", proxy);
 
         let valueUpdatedCommand = Dbm.commands.callFunction(this._valueUpdated.bind(this));
 
@@ -16,6 +19,10 @@ export default class SingleSelection extends Dbm.core.BaseObject {
         this.item.requireProperty("matched", false);
     }
 
+    _proxy_get_selectionProperty(aTarget, aPropertyName, aReceiver) {
+        return this.addSelectionValue(aPropertyName);
+    }
+
     addSelectionValue(aValue) {
         //console.log("addSelectionValue");
         //console.log(aValue);

package/flow/updatefunctions/basic/index.js

@@ -114,7 +114,7 @@ export const translation = function(aId, aDefaultValue = null, aPath = null, aAd
 	updateFunction.input.properties.additionalPath.setOrConnect(aAdditionalPath);
 
 	if(!aTranslations) {
-		aTranslations = Dbm.getRepositoryItem("site/translations").requireProperty("data");
+		aTranslations = Dbm.getRepositoryItem("site/translations").requireProperty("data", {});
 	}
 	updateFunction.input.properties.translations.setOrConnect(aTranslations);
 

package/graphapi/webclient/decode/Relations.js

@@ -20,6 +20,8 @@ export default class Relations extends Dbm.graphapi.webclient.decode.DecodeBaseO
             let currentRelationsItem = aItem["relations/in"];
             if(!currentRelationsItem) {
                 currentRelationsItem = new Dbm.repository.Item();
+                currentRelationsItem.setValue("direction", "in");
+                currentRelationsItem.setValue("all", []);
                 aItem.setValue("relations/in", currentRelationsItem);
             }
 
@@ -31,9 +33,12 @@ export default class Relations extends Dbm.graphapi.webclient.decode.DecodeBaseO
                 let typeItem = currentRelationsItem[currentType];
                 if(!typeItem) {
                     typeItem = new Dbm.repository.Item();
+                    typeItem.setValue("type", currentType);
                     typeItem.setValue("objects", []);
                     typeItem.setValue("relations", []);
+                    typeItem.setValue("allRelations", []);
                     currentRelationsItem.setValue(currentType, typeItem);
+                    currentRelationsItem.addToArray("all", typeItem);
                 }
 
                 let relation = Dbm.getRepositoryItem(currentRelationData["relationId"]);
@@ -44,6 +49,7 @@ export default class Relations extends Dbm.graphapi.webclient.decode.DecodeBaseO
                     relation.setValue("to", aItem);
                     relation.setValue("startAt", currentRelationData["startAt"]);
                     relation.setValue("endAt", currentRelationData["endAt"]);
+                    typeItem.addToArray("allRelations", relation);
 
                     if(this._isRelationValid(currentRelationData["startAt"], currentRelationData["endAt"])) {
                         typeItem.addToArray("objects", linkedItem);
@@ -58,6 +64,8 @@ export default class Relations extends Dbm.graphapi.webclient.decode.DecodeBaseO
             let currentRelationsItem = aItem["relations/out"];
             if(!currentRelationsItem) {
                 currentRelationsItem = new Dbm.repository.Item();
+                currentRelationsItem.setValue("direction", "out");
+                currentRelationsItem.setValue("all", []);
                 aItem.setValue("relations/out", currentRelationsItem);
             }
 
@@ -69,9 +77,12 @@ export default class Relations extends Dbm.graphapi.webclient.decode.DecodeBaseO
                 let typeItem = currentRelationsItem[currentType];
                 if(!typeItem) {
                     typeItem = new Dbm.repository.Item();
+                    typeItem.setValue("type", currentType);
                     typeItem.setValue("objects", []);
                     typeItem.setValue("relations", []);
+                    typeItem.setValue("allRelations", []);
                     currentRelationsItem.setValue(currentType, typeItem);
+                    currentRelationsItem.addToArray("all", typeItem);
                 }
 
                 let relation = Dbm.getRepositoryItem(currentRelationData["relationId"]);
@@ -82,6 +93,7 @@ export default class Relations extends Dbm.graphapi.webclient.decode.DecodeBaseO
                     relation.setValue("to", linkedItem);
                     relation.setValue("startAt", currentRelationData["startAt"]);
                     relation.setValue("endAt", currentRelationData["endAt"]);
+                    typeItem.addToArray("allRelations", relation);
 
                     if(this._isRelationValid(currentRelationData["startAt"], currentRelationData["endAt"])) {
                         typeItem.addToArray("objects", linkedItem);

package/loading/index.js

@@ -74,4 +74,38 @@ export const loadFont = function(aUrl, aFontName) {
     loader.load();
 
     return loader;
+}
+
+export const getJson = function(aUrl, aCallback = null, aHeaders = null) {
+    let request = new Dbm.loading.JsonLoader();
+    request.setUrl(aUrl);
+    if(aHeaders) {
+        request.item.headers = aHeaders;
+    }
+
+    if(aCallback) {
+        let callbackCommand = Dbm.commands.callFunction(aCallback, [Dbm.core.source.staticObject(request, "item.data")]);
+        Dbm.flow.runWhenMatched(request.item.properties.status, Dbm.loading.LoadingStatus.LOADED, callbackCommand);
+    }
+
+    request.load();
+    
+    return request.item.properties.data;
+}
+
+export const postJson = function(aUrl, aBody, aCallback = null, aHeaders = null) {
+    let request = new Dbm.loading.JsonLoader();
+    request.setupJsonPost(aUrl, aBody);
+    if(aHeaders) {
+        request.item.headers = aHeaders;
+    }
+
+    if(aCallback) {
+        let callbackCommand = Dbm.commands.callFunction(aCallback, [Dbm.core.source.staticObject(request, "item.data")]);
+        Dbm.flow.runWhenMatched(request.item.properties.status, Dbm.loading.LoadingStatus.LOADED, callbackCommand);
+    }
+
+    request.load();
+    
+    return request.item.properties.data;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dbm",
-  "version": "1.4.15",
+  "version": "1.4.17",
   "main": "index.js",
   "type": "module",
   "exports": {

package/react/BaseObject.js

@@ -6,13 +6,30 @@ export default class BaseObject extends Component {
     constructor(aProps, aContext) {
         super(aProps, aContext);
         this.state = {"dynamicUpdate": 0};
-        this._dynamicProps = {}
-        this._construct();
-
-        this._prepareProps();
-        this._constructAfterProps();
+        this._dynamicProps = {};
+        this._safeConstruct();
     }
 
+    _safeConstruct() {
+		if(Dbm.getRepositoryItem("development").catchRenderErrors) {
+			try {
+				this._construct();
+
+                this._prepareProps();
+                this._constructAfterProps();
+			}
+			catch(theError) {
+				console.error("Error while constructing", this, theError);
+			}
+		}
+		else {
+			this._construct();
+
+            this._prepareProps();
+            this._constructAfterProps();
+		}
+	}
+
     _construct() {
 
     }

package/react/admin/editor/Editor.js

@@ -12,16 +12,15 @@ export default class Editor extends Dbm.react.BaseObject {
 
         let all = Dbm.flow.updatefunctions.logic.allAtValue(1);
 
-        all.addCheck(Dbm.loading.loadScript("https://cdn.jsdelivr.net/npm/@editorjs/image@latest").item.properties.status);
-        all.addCheck(Dbm.loading.loadScript("https://cdn.jsdelivr.net/npm/@editorjs/header@latest").item.properties.status);
-        all.addCheck(Dbm.loading.loadScript("https://cdn.jsdelivr.net/npm/@editorjs/image@latest").item.properties.status);
-        all.addCheck(Dbm.loading.loadScript("https://cdn.jsdelivr.net/npm/@editorjs/list@latest").item.properties.status);
-        all.addCheck(Dbm.loading.loadScript("https://cdn.jsdelivr.net/npm/@editorjs/raw@latest").item.properties.status);
+        all.addCheck(Dbm.loading.loadScript("/assets/js/admin/image.js").item.properties.status);
+        all.addCheck(Dbm.loading.loadScript("/assets/js/admin/header.js").item.properties.status);
+        all.addCheck(Dbm.loading.loadScript("/assets/js/admin/list.js").item.properties.status);
+        all.addCheck(Dbm.loading.loadScript("/assets/js/admin/raw.js").item.properties.status);
         
         
         //METODO: select which tools should be used
 
-        all.addCheck(Dbm.loading.loadScript("https://cdn.jsdelivr.net/npm/@editorjs/editorjs@latest").item.properties.status);
+        all.addCheck(Dbm.loading.loadScript("/assets/js/admin/editor.js").item.properties.status);
 
         this.item.setValue("element", document.createElement("div"));
 

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

@@ -1,7 +1,7 @@
 import React from "react";
 import Dbm from "../../../../index.js";
 
-export default class SelectObjectsField extends Dbm.react.BaseObject {
+export default class ArrayField extends Dbm.react.BaseObject {
     _construct() {
         super._construct();
 
@@ -66,14 +66,31 @@ export default class SelectObjectsField extends Dbm.react.BaseObject {
 
 
         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("div", {"className": "flex-row small-item-spacing"}, 
+                React.createElement("div", {"className": "flex-row-item flex-resize"},
+                    this.getPropValue("children")
+                ),
+                React.createElement("div", {"className": "flex-row-item flex-no-resize"},
+                    React.createElement("div", {className: "spacing small"}),
+                    React.createElement(Dbm.react.interaction.ConfirmButton, {"command": this._getScopedCallFunctionCommand(this._removeItem, [Dbm.react.source.contextVariable("arrayEditor"), Dbm.react.source.contextVariable("item")])},
+                        React.createElement(Dbm.react.image.Image, {"src": "/assets/img/icons/delete.svg", "className": "background-contain text-row-icon action-icon-color cursor-pointer"}),
+                        React.createElement("div", {"data-slot": "confirm", className: "absolute-container cursor-pointer", title: "Click to remove"},
+                            React.createElement(Dbm.react.image.Image, {"src": "/assets/img/icons/delete.svg", "className": "background-contain text-row-icon hover-icon remove-action-icon-color cursor-pointer"}),
+                            React.createElement("div", {className:"centered-tip-text no-pointer-events"},
+                                "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")
+            React.createElement("div", {"data-slot": "spacing", className: "spacing small"}),
+            React.createElement("div", {"data-slot": "after", "className": "flex-row"},
+                React.createElement("div", {className: "spacing small"}),
+                React.createElement("div", {"className": "flex-row-item"},
+                    React.createElement(Dbm.react.interaction.CommandButton, {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/Link.js

@@ -0,0 +1,53 @@
+import React from "react";
+import Dbm from "../../../../index.js";
+
+export default class Link 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;
+    }
+
+    _objectChanged() {
+        //console.log("_objectChanged");
+
+        this.item.value = this._getObjectData();
+    }
+
+    _renderMainElement() {
+        return this._createMainElement(Dbm.react.form.Link, {value: this.item.properties.value, className: "standard-field standard-field-padding full-width"});
+    }
+}

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

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