dbm 1.1.6 → 1.1.8

package/flow/controllers/interaction/MoveElement.js

@@ -118,11 +118,8 @@ export default class MoveElement extends Dbm.core.BaseObject {
 		let minY = this.item.minY;
 		let maxY = this.item.maxY;
 		
-		this.item.xParameter = Math.max(minX, Math.min(x, maxX));
-        this.item.yParameter = Math.max(minY, Math.min(y, maxY));
-		
-        console.log(this.item.xParameter);
-        console.log(this.item.yParameter);
+		this.item.properties.xParameter.getMostUpstreamProperty().value = Math.max(minX, Math.min(x, maxX));
+        this.item.properties.yParameter.getMostUpstreamProperty().value = Math.max(minY, Math.min(y, maxY));
 	}
 	
 	_callback_mouseUp(aEvent) {
@@ -146,7 +143,7 @@ export default class MoveElement extends Dbm.core.BaseObject {
 	}
 	
 	_callback_mouseMove(aEvent) {
-		console.log("_callback_mouseMove");
+		//console.log("_callback_mouseMove");
 		//console.log(aEvent);
 		
 		if(aEvent.type === "touchmove") {
@@ -158,7 +155,7 @@ export default class MoveElement extends Dbm.core.BaseObject {
 	}
 	
 	_callback_startDrag(aEvent) {
-		console.log("_callback_startDrag");
+		//console.log("_callback_startDrag");
 		//console.log(aEvent, aEvent.type);
 		
 		if(aEvent.type === "touchstart") {

package/flow/index.js

@@ -67,8 +67,6 @@ export const animateValue = function(aValue, aTime = 0.5, aEasing = null) {
 	returnObject._internal_addProperty("output", outputProperty);
 	
 	let updateCommand = Dbm.flow.addUpdateCommand(inputProperty, Dbm.commands.callFunction(function(aItem) {
-		console.log("animate value");
-		
 		aItem.properties.output.animateValue(aItem.input, aItem.time, aItem.easing);
 	}, [returnObject]));
 	

package/flow/updatefunctions/dom/TransformStyle.js

@@ -0,0 +1,51 @@
+import Dbm from "../../../index.js";
+
+export default class TransformStyle extends Dbm.flow.updatefunctions.basic.CombineString {
+
+    _construct() {
+        super._construct();
+        
+        this.stringCombiners = []; 
+        this.input.delimeter = " ";
+    }
+
+    addSingleValueOperation(aOperation, aValue, aUnit = "") {
+        let newCombineString = new Dbm.flow.updatefunctions.basic.CombineString();
+        newCombineString.addParts(aOperation, "(", aValue, aUnit, ")");
+        this.stringCombiners.push(newCombineString);
+
+        this.addPart(newCombineString.output.properties.value);
+    }
+
+    addDoubleValueOperation(aOperation, aValue1, aUnit1 = "", aValue2, aUnit2 = "") {
+        let newCombineString = new Dbm.flow.updatefunctions.basic.CombineString();
+        newCombineString.addParts(aOperation, "(", aValue1, aUnit1, ", ", aValue2, aUnit2, ")");
+        this.stringCombiners.push(newCombineString);
+
+        this.addPart(newCombineString.output.properties.value);
+    }
+
+    translate(aValue1, aUnit1 = "px", aValue2, aUnit2 = "px") {
+        this.addDoubleValueOperation("translate", aValue1, aUnit1, aValue2, aUnit2);
+    }
+
+    translateX(aValue, aUnit = "px") {
+        this.addSingleValueOperation("translateX", aValue, aUnit);
+    }
+
+    translateY(aValue, aUnit = "px") {
+        this.addSingleValueOperation("translateY", aValue, aUnit);
+    }
+
+    uniformScale(aValue, aUnit = "") {
+        this.addDoubleValueOperation("scale", aValue, aUnit, aValue, aUnit);
+    }
+
+    rotate(aValue, aUnit = "deg") {
+        this.addSingleValueOperation("rotate", aValue, aUnit);
+    }
+
+    perspective(aValue, aUnit = "px") {
+        this.addSingleValueOperation("perspective", aValue, aUnit);
+    }
+}

package/flow/updatefunctions/dom/index.js

@@ -1,4 +1,5 @@
 export {default as ElementSize} from "./ElementSize.js";
 export {default as StyleObject} from "./StyleObject.js";
 export {default as HorizontalFlip} from "./HorizontalFlip.js";
-export {default as ElementPosition} from "./ElementPosition.js";
+export {default as ElementPosition} from "./ElementPosition.js";
+export {default as TransformStyle} from "./TransformStyle.js";

package/flow/updatefunctions/index.js

@@ -2,4 +2,5 @@ export * as logic from "./logic/index.js";
 export * as debug from "./debug/index.js";
 export * as react from "./react/index.js";
 export * as basic from "./basic/index.js";
-export * as dom from "./dom/index.js";
+export * as dom from "./dom/index.js";
+export * as thirdparty from "./thirdparty/index.js";

package/flow/updatefunctions/thirdparty/index.js

@@ -0,0 +1 @@
+export * as threejs from "./threejs/index.js";

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

@@ -0,0 +1,48 @@
+import Dbm from "../../../../index.js";
+
+export default class UpdateObjectPosition extends Dbm.flow.FlowUpdateFunction {
+
+    _construct() {
+        super._construct();
+        
+        this.input.register("object", null);
+        this.input.register("x", 0);
+        this.input.register("y", 0);
+        this.input.register("z", 0);
+
+        this.input.register("rotationX", 0);
+        this.input.register("rotationY", 0);
+        this.input.register("rotationZ", 0);
+
+        this.input.register("scaleX", 1);
+        this.input.register("scaleY", 1);
+        this.input.register("scaleZ", 1);
+
+        this.output.register("dynamicUpdate", 0);
+    }
+
+    _update() {
+        //console.log("UpdateObjectPosition::_update");
+
+        let dynamicUpdate = this.output.dynamicUpdate;
+        dynamicUpdate++;
+
+        let object = this.input.object;
+
+        if(object) {
+            object.position.x = this.input.x;
+            object.position.y = this.input.y;
+            object.position.z = this.input.z;
+
+            object.rotation.x = this.input.rotationX;
+            object.rotation.y = this.input.rotationY;
+            object.rotation.z = this.input.rotationZ;
+
+            object.scale.x = this.input.scaleX;
+            object.scale.y = this.input.scaleY;
+            object.scale.z = this.input.scaleY;
+        }
+
+        this.output.dynamicUpdate = dynamicUpdate;
+    }
+}

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

@@ -0,0 +1,26 @@
+import Dbm from "../../../../index.js";
+
+export {default as UpdateObjectPosition} from "./UpdateObjectPosition.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();
+
+    let inputProperties = newUpdateObjectPosition.input.properties;
+    inputProperties.object.setOrConnect(aObject);
+
+    inputProperties.x.setOrConnect(aX);
+    inputProperties.y.setOrConnect(aY);
+    inputProperties.z.setOrConnect(aZ);
+
+    inputProperties.rotationX.setOrConnect(aRotationX);
+    inputProperties.rotationY.setOrConnect(aRotationY);
+    inputProperties.rotationZ.setOrConnect(aRotationZ);
+
+    inputProperties.scaleX.setOrConnect(aScaleX);
+    inputProperties.scaleY.setOrConnect(aScaleY);
+    inputProperties.scaleZ.setOrConnect(aScaleZ);
+    
+    newUpdateObjectPosition.output.properties.dynamicUpdate.startUpdating();
+
+    return newUpdateObjectPosition;
+}

package/graphapi/webclient/ApiConnection.js

@@ -6,6 +6,8 @@ export default class ApiConnection extends Dbm.core.BaseObject {
 
         this._url = null;
 		this._setupItemResponseBound = this._setupItemResponse.bind(this);
+        this._setupItemsResponseBound = this._setupItemsResponse.bind(this);
+        this._setupDataResponseBound = this._setupDataResponse.bind(this);
     }
 
     setup(aUrl) {
@@ -26,7 +28,32 @@ export default class ApiConnection extends Dbm.core.BaseObject {
 
     requestRange(aSelect, aEncode) {
         let item = this._getRequestItem();
+
+        let selectArray = [];
+        let encodeString = aEncode.join(",");
+        let parametersArray = [];
+
+        {
+            let currentArray = aSelect;
+            let currentArrayLength = currentArray.length;
+            for(let i = 0; i < currentArrayLength; i++) {
+                let currentSelect = currentArray[i];
+                selectArray.push(currentSelect.type);
+
+                for(let objectName in currentSelect) {
+                    if(objectName !== "type") {
+                        parametersArray.push(objectName + "=" + encodeURIComponent(currentSelect[objectName]));
+                    }
+                }
+            }
+        }
         
+        let fullUrl = this._url + "range/" + selectArray.join(",") + "/" + encodeString + "?" + parametersArray.join("&");
+		fetch(fullUrl).then((aRequest) => {
+			return aRequest.json();
+		}).then((aData) => {
+			this._setupItemsResponseBound(item, aData);
+		});
         
         return item;
     }
@@ -34,17 +61,41 @@ export default class ApiConnection extends Dbm.core.BaseObject {
     requestItem(aId, aEncode) {
         let item = this._getRequestItem();
         
+        let encodeString = aEncode.join(",");
+
+        let fullUrl = this._url + "item/" + aId + "/" + encodeString;
+		fetch(fullUrl).then((aRequest) => {
+			return aRequest.json();
+		}).then((aData) => {
+			this._setupItemResponseBound(item, aData);
+		});
         
         return item;
     }
 
     requestData(aFunctionName, aData) {
         let item = this._getRequestItem();
+
+        let parametersArray = [];
+
+        for(let objectName in aData) {
+            if(objectName !== "type") {
+                parametersArray.push(objectName + "=" + encodeURIComponent(aData[objectName]));
+            }
+        }
         
+        let fullUrl = this._url + "data/" + aFunctionName + "?" + parametersArray.join("&");
+		fetch(fullUrl).then((aRequest) => {
+			return aRequest.json();
+		}).then((aData) => {
+			this._setupDataResponseBound(item, aData);
+		});
         
         return item;
     }
 
+    //METODO: action
+
     createItem(aTypes, aVisibility = "draft", aChanges = [], aEncode = []) {
         let item = this._getRequestItem();
         
@@ -76,6 +127,22 @@ export default class ApiConnection extends Dbm.core.BaseObject {
             }
 		}
 	}
+
+    _setupItemsResponse(aRequestItem, aData) {
+		this._updateObjects(aData.objects);
+		
+		let repository = Dbm.getInstance().repository;
+		
+		let ids = aData.data.ids;
+		if(ids) {
+			aRequestItem.setValue("items", repository.getItems(ids));
+		}
+		else {
+			aRequestItem.setValue("items", []);
+		}
+		
+		aRequestItem.status = 1;
+	}
 	
 	_setupItemResponse(aRequestItem, aData) {
 		this._updateObjects(aData.objects);
@@ -93,6 +160,20 @@ export default class ApiConnection extends Dbm.core.BaseObject {
 		aRequestItem.status = 1;
 	}
 
+    _setupDataResponse(aRequestItem, aData) {
+		this._updateObjects(aData.objects);
+		
+		let data = aData.data;
+		if(data) {
+			aRequestItem.setValue("data", data);
+		}
+		else {
+			aRequestItem.setValue("data", null);
+		}
+		
+		aRequestItem.status = 1;
+	}
+
     requestUrl(aUrl) {
 		
         let item = this._getRequestItem();

package/graphapi/webclient/CachedRequests.js

@@ -0,0 +1,107 @@
+import Dbm from "../../index.js";
+
+export default class CachedRequests extends Dbm.core.BaseObject {
+    _construct() {
+        super._construct();
+
+        this._ranges = {};
+        this._items = {};
+        this._data = {};
+    }
+
+    _getRangeIdentifier(aSelect, aEncode) {
+        let selects = [];
+        let paramters = [];
+
+        {
+            let currentArray = aSelect;
+            let currentArrayLength = currentArray.length;
+            for(let i = 0; i < currentArrayLength; i++) {
+                let currentSelect = currentArray[i];
+                selects.push(currentSelect.type);
+
+                for(let objectName in currentSelect) {
+                    if(objectName !== "type") {
+                        paramters.push(objectName + "=" + encodeURIComponent(currentSelect[objectName]));
+                    }
+                }
+            }
+        }
+
+        selects.sort();
+        paramters.sort();
+
+        let returnString = selects.join(",") + "/" + this._getEncodeIdentifier(aEncode) + "?" + paramters.join("&");
+
+        return returnString;
+    }
+
+    _getEncodeIdentifier(aEncode) {
+        let encodes = [].concat(aEncode).sort();
+        return encodes.join(",");
+    }
+	
+	requestRange(aSelect, aEncode) {
+        console.log("requestRange");
+
+        let id = this._getRangeIdentifier(aSelect, aEncode);
+        console.log(id);
+
+        if(this._ranges[id]) {
+            return this._ranges[id];
+        }
+
+        let graphApi = Dbm.getInstance().repository.getItem("graphApi").controller;
+        let request = graphApi.requestRange(aSelect, aEncode);
+
+        this._ranges[id] = request;
+        return request;
+    }
+
+    requestItem(aId, aEncode) {
+        console.log("requestItem");
+
+        let id = aId + "/" + this._getEncodeIdentifier(aEncode);
+        console.log(id);
+
+        if(this._items[id]) {
+            return this._items[id];
+        }
+
+        let graphApi = Dbm.getInstance().repository.getItem("graphApi").controller;
+        let request = graphApi.requestItem(aId, aEncode);
+
+        this._items[id] = request;
+        return request;
+    }
+
+    requestData(aFunctionName, aData) {
+        let paramters = [];
+        for(let objectName in aData) {
+            if(objectName !== "type") {
+                paramters.push(objectName + "=" + encodeURIComponent(aData[objectName]));
+            }
+        }
+
+        paramters.sort();
+
+        let id = aFunctionName + "?" + paramters.join("&");
+        console.log(">>>>>>>>>", id);
+
+        if(this._data[id]) {
+            return this._data[id];
+        }
+
+        let graphApi = Dbm.getInstance().repository.getItem("graphApi").controller;
+        let request = graphApi.requestData(aFunctionName, aData);
+
+        this._data[id] = request;
+        return request;
+    }
+
+	requestUrl(aUrl) {
+		//console.log("requestUrl");
+		//console.log(aUrl);
+		
+	}
+}

package/graphapi/webclient/GraphApi.js

@@ -21,15 +21,31 @@ export default class GraphApi extends Dbm.core.BaseObject {
 	}
 	
     requestRange(aSelect, aEncode) {
-        return this._websocketConnection.requestRange(aSelect, aEncode);
+        console.log("requestRange");
+
+        if(this._websocketConnection && this._websocketConnection.item.status === 1) {
+			return this._websocketConnection.requestRange(aSelect, aEncode);
+		}
+
+        return this._apiConnection.requestRange(aSelect, aEncode);
     }
 
     requestItem(aId, aEncode) {
-        return this._websocketConnection.requestItem(aId, aEncode);
+        console.log("requestItem");
+
+        if(this._websocketConnection && this._websocketConnection.item.status === 1) {
+            return this._websocketConnection.requestItem(aId, aEncode);
+        }
+
+        return this._apiConnection.requestItem(aId, aEncode);
     }
 
     requestData(aFunctionName, aData) {
-        return this._websocketConnection.requestData(aFunctionName, aData);
+        if(this._websocketConnection && this._websocketConnection.item.status === 1) {
+            return this._websocketConnection.requestData(aFunctionName, aData);
+        }
+
+        return this._apiConnection.requestData(aFunctionName, aData);
     }
 
     performAction(aFunctionName, aData) {

package/graphapi/webclient/WebSocketConnection.js

@@ -6,6 +6,7 @@ export default class WebSocketConnection extends Dbm.core.BaseObject {
 
 		this._url = null;
         this._webSocket = null;
+        this._reconnectIfDisconnected = false;
 		
 		this._intervalId = -1;
         this._callback_onOpenBound = this._callback_onOpen.bind(this);
@@ -28,8 +29,16 @@ export default class WebSocketConnection extends Dbm.core.BaseObject {
 	
 	_connect() {
 		if(this.item.status === 0) {
-	        this._webSocket = new WebSocket(this._url);
-	        this.item.setValue("status", 2);
+            this.item.setValue("status", 2);
+            try{
+                this._webSocket = new WebSocket(this._url);
+            }
+	        catch(theError) {
+                this._webSocket = null;;
+                this.item.setValue("status", 0);
+                return;
+            }
+	        
 
 	        this._webSocket.onopen = this._callback_onOpenBound;
 	        this._webSocket.onmessage = this._callback_onMessageBound;
@@ -65,6 +74,7 @@ export default class WebSocketConnection extends Dbm.core.BaseObject {
     requestRange(aSelect, aEncode) {
         let item = this._getRequestItem();
         item.setValue("requestData", {"type": "range", "select": aSelect, "encode": aEncode, "requestId": item.id});
+        item.requireProperty("items", []);
         this._runRequest(item);
         
         return item;
@@ -127,6 +137,7 @@ export default class WebSocketConnection extends Dbm.core.BaseObject {
 		if(this._intervalId === -1) {
 			this._intervalId = setInterval(this._callback_sendHeartbeatBound, 20*1000);
 		}
+        this._reconnectIfDisconnected = true;
     }
 	
     _callback_onClose(aEvent) {
@@ -148,13 +159,19 @@ export default class WebSocketConnection extends Dbm.core.BaseObject {
 		}
 		
 		this.item.setValue("status", 0);
-		this._connect();;
+
+        if(this._reconnectIfDisconnected) {
+            this._connect();
+        }
     }
 	
     _callback_onError(aEvent) {
-        console.log("_callback_onError");
-		console.log(aEvent);
+        //console.log("_callback_onError");
+		//console.log(aEvent);
 
+        if(this._reconnectIfDisconnected) {
+            console.log(aEvent);;
+        }
         //MENOTE: do nothing
     }
 	

package/graphapi/webclient/decode/DecodeBaseObject.js

@@ -41,7 +41,12 @@ export default class DecodeBaseObject extends Dbm.core.BaseObject {
             for(let i = 0; i < currentArrayLength; i++) {
                 let currentField = currentArray[i];
                 let currentIds = aData[currentField];
-                aItem.setValue(currentField, Dbm.getInstance().repository.getItems(currentIds));
+                if(currentIds) {
+                    aItem.setValue(currentField, Dbm.getInstance().repository.getItems(currentIds));
+                }
+                else {
+                    aItem.setValue(currentField, []);
+                }
             }
         }
     }

package/graphapi/webclient/decode/index.js

@@ -63,6 +63,14 @@ export const fullSetup = function() {
         currentDecoder.item.register(decodePrefix + name);
     }
 
+    {
+        let name = "pageRepresentation";
+        let currentDecoder = new Dbm.graphapi.webclient.decode.DecodeBaseObject();
+        currentDecoder.item.setValue("copyLink", ["representing"]);
+        currentDecoder.item.setValue("encodingType", name);
+        currentDecoder.item.register(decodePrefix + name);
+    }
+
     {
         let name = "navigationName";
         let currentDecoder = new Dbm.graphapi.webclient.decode.DecodeBaseObject();
@@ -101,4 +109,12 @@ export const fullSetup = function() {
         currentDecoder.item.setValue("encodingType", name);
         currentDecoder.item.register(decodePrefix + name);
     }
+
+    {
+        let name = "representingPage";
+        let currentDecoder = new Dbm.graphapi.webclient.decode.DecodeBaseObject();
+        currentDecoder.item.setValue("copyLink", ["representingPage"]);
+        currentDecoder.item.setValue("encodingType", name);
+        currentDecoder.item.register(decodePrefix + name);
+    }
 }

package/graphapi/webclient/index.js

@@ -5,6 +5,7 @@ export {default as WebSocketRequest} from "./WebSocketRequest.js";
 export {default as GraphApi} from "./GraphApi.js";
 export {default as ApiConnection} from "./ApiConnection.js";
 export {default as ApiRequest} from "./ApiRequest.js";
+export {default as CachedRequests} from "./CachedRequests.js";
 
 export * as decode from "./decode/index.js";
 export * as admin from "./admin/index.js";
@@ -20,4 +21,7 @@ export const setup = function(aWsPath, aApiPath) {
     graphApi.setWebsocketConnection(webSocketConnection);
     graphApi.setApiConnection(apiConnection);
     graphApi.item.register("graphApi");
+
+    let cachedRequests = new Dbm.graphapi.webclient.CachedRequests();
+    cachedRequests.item.register("cachedGraphApi");
 }

package/package.json

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

package/react/BaseObject.js

@@ -98,6 +98,16 @@ export default class BaseObject extends Component {
         return currentProp;
     }
 
+    getPropValueWithDefault(aName, aDefaultValue) {
+        let value = this.getPropValue(aName);
+
+        if(!value) {
+            value = aDefaultValue;
+        }
+
+        return value;
+    }
+
     createRef(aName) {
         let refToProperty = this.item["ref/" + aName];
 

package/react/admin/EditPage.js

@@ -22,6 +22,8 @@ export default class EditPage extends Dbm.react.BaseObject {
         let descriptionEditor = itemEditor.addFieldEditor("meta/description", page["meta/description"], "meta/description");
         let descriptionLength = Dbm.flow.updatefunctions.basic.length(descriptionEditor.item.editValue.value);
         this.item.requireProperty("descriptionLength", 0).connectInput(descriptionLength.output.properties.length);
+
+        this.item.requireProperty("importText", "");
     }
 
     _save() {
@@ -37,11 +39,64 @@ export default class EditPage extends Dbm.react.BaseObject {
         itemSaveData.setField("lastModified", (new Date()).toISOString());
         itemSaveData.createChange("clearCache", {});
 
-        console.log(editorGroup, saveData);
-
         saveData.save();
     }
 
+    _export() {
+        let editorGroup = this.item.editorGroup;
+
+        let page = this.context.page;
+        let id = page.id;
+        let itemEditor = editorGroup.getItemEditor(id);
+        let url = itemEditor.addFieldEditor("url").item.editValue.value.value;   
+        let content = itemEditor.addFieldEditor("content").item.editValue.value.value;
+
+        let blob = new Blob([JSON.stringify(content, null, 2)], { type: 'application/json' });
+        let downloadUrl = URL.createObjectURL(blob);
+
+        let fileName = id  + Dbm.utils.StringFunctions.createNiceFilePath(url) + ".json";
+        let a = document.createElement('a');
+        a.href = downloadUrl;
+        a.download = fileName;
+        document.body.appendChild(a);
+        a.click();
+
+        document.body.removeChild(a);
+        URL.revokeObjectURL(downloadUrl);
+    }
+
+    _import() {
+
+        let editorGroup = this.item.editorGroup;
+
+        let page = this.context.page;
+        let id = page.id;
+        let itemEditor = editorGroup.getItemEditor(id); 
+        
+
+        let data = JSON.parse(this.item.importText);
+        console.log(data);
+
+        let newContent = {...itemEditor.addFieldEditor("content").item.editValue.value.value};
+        if(!newContent) {
+            newContent = {};
+        }
+        if(!newContent.blocks) {
+            newContent.blocks = [];
+        }
+
+        let currentArray = data.blocks;
+        let currentArrayLength = currentArray.length;
+        for(let i = 0; i < currentArrayLength; i++) {
+            let currentBlock = currentArray[i];
+            delete currentBlock["id"];
+            newContent.blocks.push(currentBlock);
+        }
+        
+        itemEditor.addFieldEditor("content").item.editValue.value.value = newContent;
+        this.item.editor.contentUpdatedExternally();
+    }
+
     _generateSeoSummary() {
 
         let page = this.context.page;
@@ -122,7 +177,15 @@ export default class EditPage extends Dbm.react.BaseObject {
                         "Content"
                     ),
                     React.createElement("div", {},
-                        React.createElement(Dbm.react.admin.editor.Editor, {"value": itemEditor.getEditor("content").item.editValue.value}),
+                        React.createElement(Dbm.react.admin.editor.Editor, {"value": itemEditor.getEditor("content").item.editValue.value, "ref": this.createRef("editor")}),
+                    ),
+                    React.createElement("div", {className: "spacing small"}),
+                    React.createElement("div", {"className": "standard-button standard-button-padding", "onClick": () => {this._export()}},
+                        "Export"
+                    ),
+                    React.createElement(Dbm.react.form.FormField, {value: this.item.properties.importText}),
+                    React.createElement("div", {"className": "standard-button standard-button-padding", "onClick": () => {this._import()}},
+                        "Import"
                     )
                 ),
                 React.createElement("div", {className: "spacing standard"}),

package/react/admin/editor/Editor.js

@@ -153,6 +153,14 @@ export default class Editor extends Dbm.react.BaseObject {
         }
     }
 
+    contentUpdatedExternally() {
+
+        let data = this.getDynamicProp("value").value;
+        this.item.editor.render(data);
+
+        return this;
+    }
+
     /*
     _save() {
         this.item.editor.save().then((aOutputData) => {

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

@@ -0,0 +1,57 @@
+import React from "react";
+import Dbm from "../../../../index.js";
+
+export default class SelectObjectField 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");
+
+        console.log(">>>>>", editorData);
+
+        let returnData = editorData.data[fieldName];
+        if(!returnData) {
+            returnData = 0;
+        }
+
+        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();
+    }
+
+    _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"});
+    }
+}

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

@@ -1,4 +1,5 @@
 export {default as TextField} from "./TextField.js";
 export {default as RichTextField} from "./RichTextField.js";
 export {default as ImageField} from "./ImageField.js";
-export {default as CheckboxField} from "./CheckboxField.js";
+export {default as CheckboxField} from "./CheckboxField.js";
+export {default as SelectObjectField} from "./SelectObjectField.js";

package/react/area/List.js

@@ -27,6 +27,10 @@ export default class List extends Dbm.react.BaseObject {
         let mainChildren = slots.main;
 
         let currentArray = items;
+        if(!currentArray || isNaN(currentArray.length)) {
+            console.error("Items is not an array", this);
+            return null;
+        }
         let currentArrayLength = currentArray.length;
         let newChildren = [];
         for(let i = 0; i < currentArrayLength; i++) {

package/react/context/AddItemToContext.js

@@ -0,0 +1,24 @@
+import React from "react";
+import Dbm from "../../index.js";
+
+export default class AddItemToContext extends Dbm.react.BaseObject {
+    _construct() {
+        super._construct();
+    }
+
+    render() {
+        
+        let item = this.getPropValue("item");
+        let id = Dbm.objectPath(item, "id");
+
+        let as = this.getPropValue("as");
+        if(!as) {
+            as = "item";
+        }
+
+        let values = {};
+        values[as] = item;
+
+        return React.createElement(Dbm.react.context.AddContextVariables, {"values": values, "key": id}, this.props.children);
+    }
+}

package/react/context/index.js

@@ -1,2 +1,3 @@
 export {default as Context} from "./Context.js";
-export {default as AddContextVariables} from "./AddContextVariables.js";
+export {default as AddContextVariables} from "./AddContextVariables.js";
+export {default as AddItemToContext} from "./AddItemToContext.js";

package/react/cookies/CookieBar.js

@@ -6,7 +6,24 @@ export default class CookieBar extends Dbm.react.BaseObject {
     _construct() {
         super._construct();
 
-        this.getDynamicProp("open", false);
+        let openProperty = this.getDynamicProp("open", false);
+        this.item.requireProperty("envelope", 0);
+
+        let stateToEnvelope = Dbm.flow.updatefunctions.logic.switchValue(openProperty).setDefaultValue(100).addCase(true, 0);
+        let inDomCase = Dbm.flow.updatefunctions.logic.switchValue(this.item.properties.envelope).setDefaultValue(true).addCase(100, false);
+
+        this.item.requireProperty("inDom", false).connectInput(inDomCase.output.properties.value);
+
+        let animation = new Dbm.flow.animateValue(stateToEnvelope.output.properties.value);
+        
+        this.item.properties.envelope.connectInput(animation.properties.output);
+
+        let transform = new Dbm.flow.updatefunctions.dom.TransformStyle();
+        transform.translateY(animation.properties.output, "%");
+
+        let style = new Dbm.flow.updatefunctions.dom.StyleObject();
+        style.addProperty("transform", transform.output.properties.value);
+        this.item.requireProperty("style", null).connectInput(style.output.properties.style);
 
         let shouldShow = Cookies.get("cookie/hideCookieBar") !== "1";
 
@@ -108,10 +125,25 @@ export default class CookieBar extends Dbm.react.BaseObject {
         this.item.properties.element.connectInput(layoutSwitch.output.properties.value);
     }
 
+    _getDomain() {
+
+        let parts = document.location.hostname.split('.');
+
+        let length = parts.length;
+        if (length === 1) {
+            return parts[0];
+        }
+        else if(parts[length-2] === "co" && parts[length-1] === "uk") {
+            return '.' + parts.slice(-3).join('.');
+        }
+        
+        return '.' + parts.slice(-2).join('.');
+    }
+
     _acceptAll() {
         console.log("_acceptAll");
 
-        let options = {"expires": 365};
+        let options = {"expires": 365, "domain": this._getDomain()};
 
         Cookies.set("cookie/allowPreferences", "1", options);
         Cookies.set("cookie/allowStatistics", "1", options);
@@ -120,7 +152,7 @@ export default class CookieBar extends Dbm.react.BaseObject {
 
         let consentTime = (new Date()).toISOString();
 
-        Cookies.set("cookie/consentTime", consentTime);
+        Cookies.set("cookie/consentTime", consentTime, options);
 
         Dbm.getInstance().repository.getItem("trackingController").allowStatistics = true;
         Dbm.getInstance().repository.getItem("trackingController").allowMarketing = true;
@@ -130,7 +162,7 @@ export default class CookieBar extends Dbm.react.BaseObject {
 
     _rejectAll() {
 
-        let options = {"expires": 365};
+        let options = {"expires": 365, "domain": this._getDomain()};
 
         Cookies.set("cookie/allowPreferences", "0", options);
         Cookies.set("cookie/allowStatistics", "0", options);
@@ -139,7 +171,7 @@ export default class CookieBar extends Dbm.react.BaseObject {
 
         let consentTime = (new Date()).toISOString();
 
-        Cookies.set("cookie/consentTime", consentTime);
+        Cookies.set("cookie/consentTime", consentTime, options);
 
         Dbm.getInstance().repository.getItem("trackingController").allowStatistics = false;
         Dbm.getInstance().repository.getItem("trackingController").allowMarketing = false;
@@ -149,10 +181,16 @@ export default class CookieBar extends Dbm.react.BaseObject {
 
     _renderMainElement() {
 
-        return this._createMainElement("div", {className: "cookie-bar-position", ref: this.createRef("widthElement")},
-			React.createElement(Dbm.react.area.OpenCloseExpandableArea, {open: this.getDynamicProp("open")},
-            	React.createElement(Dbm.react.area.InsertElement, {element: this.item.properties.element})
-			)
+        return this._createMainElement("div", {className: "cookie-bar-position no-pointer-events", ref: this.createRef("widthElement")},
+            React.createElement(Dbm.react.area.HasData, {"check": this.item.properties.inDom},
+                React.createElement("div", {className: "overflow-hidden"},	
+                    React.createElement(Dbm.react.BaseObject, {style: this.item.properties.style},
+                        React.createElement("div", {className: "all-pointer-events"},
+                            React.createElement(Dbm.react.area.InsertElement, {element: this.item.properties.element})
+                        )
+                    )
+                )
+            )
         );
     }
 }

package/react/cookies/CookieSettings.js

@@ -59,11 +59,26 @@ export default class CookieSettings extends Dbm.react.BaseObject {
         return currentItem;
     }
 
+    _getDomain() {
+
+        let parts = document.location.hostname.split('.');
+
+        let length = parts.length;
+        if (length === 1) {
+            return parts[0];
+        }
+        else if(parts[length-2] === "co" && parts[length-1] === "uk") {
+            return '.' + parts.slice(-3).join('.');
+        }
+        
+        return '.' + parts.slice(-2).join('.');
+    }
+
     _save() {
         console.log("_save");
 
         let settings = this.item.settings;
-        let options = {"expires": 365};
+        let options = {"expires": 365, "domain": this._getDomain()};
 
         let currentArray = settings;
         let currentArrayLength = currentArray.length;
@@ -85,8 +100,8 @@ export default class CookieSettings extends Dbm.react.BaseObject {
         
         let consentTime = (new Date()).toISOString();
 
-        Cookies.set("cookie/consentTime", consentTime)
-        this.item.setValue("consentTime", consentTime, options);
+        Cookies.set("cookie/consentTime", consentTime, options);
+        this.item.setValue("consentTime", consentTime);
     }
 
     _renderMainElement() {

package/react/form/GraphApiObjectSelection.js

@@ -0,0 +1,53 @@
+import React from "react";
+import Dbm from "../../index.js";
+
+export default class GraphApiObjectSelection extends Dbm.react.form.Selection {
+    _construct() {
+        super._construct();
+
+        this.getDynamicProp("value", "");
+        this.item.requireProperty("items", []);
+
+        let objectType = this.getPropValue("objectType")
+
+        let graphApi = Dbm.getInstance().repository.getItem("graphApi").controller;
+        {
+            let request = graphApi.requestRange(
+                [
+                    {"type": "byObjectType", "objectType": objectType},
+                    {"type": "includeDraft"},
+                    {"type": "includePrivate"}
+                ],
+                ["name"]
+            );
+
+    
+           Dbm.flow.addUpdateCommandWhenMatched(request.properties.status, Dbm.loading.LoadingStatus.LOADED, Dbm.commands.callFunction(this._itemsLoaded.bind(this), [request]));
+        }
+    }
+
+    _itemsLoaded(aRequest) {
+        let options = [];
+
+        options.push(React.createElement("option", {key: 0, value: 0}, "None"));
+
+        let currentArray = [].concat(aRequest.items);
+        Dbm.utils.ArrayFunctions.sortOnField(currentArray, "name");
+
+        let currentArrayLength = currentArray.length;
+        for(let i = 0; i < currentArrayLength; i++) {
+            let currentItem = currentArray[i];
+            options.push(React.createElement("option", {key: currentItem["id"], value: currentItem["id"]}, currentItem["name"] + " (id: " + currentItem["id"] + ")"));
+        }
+
+        this.item.items = options;
+    }
+
+    _renderMainElement() {
+
+        let value = this.getDynamicProp("value");
+
+        return this._createMainElement(Dbm.react.form.Selection, {"value": value}, this.item.properties.items);
+    }
+}
+

package/react/form/Selection.js

@@ -0,0 +1,29 @@
+import React from "react";
+import Dbm from "../../index.js";
+
+export default class Selection extends Dbm.react.BaseObject {
+    _construct() {
+        super._construct();
+
+        this.getDynamicProp("value", "");
+
+        this._callback_changeBound = this._callback_change.bind(this);
+    }
+
+    _callback_change(aEvent) {
+        //console.log("_callback_change");
+        //console.log(aEvent);
+
+        let value = aEvent.target.value;
+
+        this.getDynamicProp("value").getMostUpstreamProperty().setValue(value);
+    }
+
+    _renderMainElement() {
+
+        let value = this.getDynamicProp("value").value;
+
+        return this._createMainElement("select", {"value": value, onChange: this._callback_changeBound}, this.getPropValue("children"));
+    }
+}
+

package/react/form/index.js

@@ -1,4 +1,6 @@
 export {default as Checkbox} from "./Checkbox.js";
 export {default as FormField} from "./FormField.js";
 export {default as LabelledArea} from "./LabelledArea.js";
-export {default as FileDropArea} from "./FileDropArea.js";
+export {default as FileDropArea} from "./FileDropArea.js";
+export {default as Selection} from "./Selection.js";
+export {default as GraphApiObjectSelection} from "./GraphApiObjectSelection.js";

package/tracking/DataLayerTracker.js

@@ -3,6 +3,9 @@ import Dbm from "../index.js";
 export default class DataLayerTracker extends Dbm.core.BaseObject {
     _construct() {
         super._construct();
+
+		this._statisticsTracking = false;
+		this._marketingTracking = false;
     }
 
     addToDataLayer(aData) {
@@ -35,6 +38,7 @@ export default class DataLayerTracker extends Dbm.core.BaseObject {
 
     startStatisticsTracking() {
 		
+		this._statisticsTracking = true;
 		this._gtag("consent", "update", {
 			"analytics_storage": "granted"
 		});
@@ -46,6 +50,7 @@ export default class DataLayerTracker extends Dbm.core.BaseObject {
 	
 	startMarketingTracking() {
 		
+		this._marketingTracking = true;
 		this._gtag("consent", "update", {
 			"ad_storage": "granted",
 			"ad_user_data": "granted",
@@ -66,8 +71,15 @@ export default class DataLayerTracker extends Dbm.core.BaseObject {
         console.log("trackEvent");
         console.log(aEventName, aData);
 
-        this.addToDataLayer({"event": "trackEvent", "value": {"name": aEventName, "data": aData}});
-		this._gtag("event", aEventName, aData);
+		if(this._statisticsTracking) {
+			this.addToDataLayer({"event": "trackEvent", "value": {"name": aEventName, "data": aData}});
+			this._gtag("event", aEventName, aData);
+		}
+
+        if(this._marketingTracking) {
+			this.addToDataLayer({"event": "trackMarketingEvent", "value": {"name": aEventName, "data": aData}});
+			this._gtag("event", "Marketing / " + aEventName, aData);
+		}
     }
 
     trackCurrentPage() {

package/utils/ArrayFunctions.js

@@ -117,6 +117,17 @@ export const arrayOrSeparatedString = function(aData, aSeparator = ",", aTrim =
     return [];
 }
 
+export const numericArrayOrSeparatedString = function(aData, aSeparator = ",", aTrim = 3) {
+    let returnArray = new Array();
+    let currentArray = arrayOrSeparatedString(aData, aSeparator, aTrim);
+    let currentarrayLength = currentArray.length;
+    for(let i = 0; i < currentarrayLength; i++) {
+        returnArray.push(parseFloat(currentArray[i]));
+    }
+    
+    return returnArray;
+}
+
 export const filterByField = function(aArray, aField, aValue) {
     let returnArray = [];
 
@@ -144,4 +155,117 @@ export const mapField = function(aArray, aField) {
     }
 
     return returnArray;
+}
+
+export const group = function(aArray, aField) {
+   
+    let groups = new Map();
+
+    let currentArray = aArray;
+    let currentArrayLength = currentArray.length;
+    for(let i = 0; i < currentArrayLength; i++) {
+        let currentObject = aArray[i];
+        let groupValue = Dbm.objectPath(aArray[i], aField);
+
+        if(!groups.has(groupValue)) {
+            groups.set(groupValue, []);
+        }
+
+        groups.get(groupValue).push(currentObject);
+    }
+
+    let returnArray = [];
+
+    for (const value of groups.entries()) {
+        returnArray.push({"key": value[0], "value": value[1]});
+    }
+
+    return returnArray;
+}
+
+export const makeFlat = function(aArray) {
+    let returnArray = [];
+
+    let currentArray = aArray;
+    let currentArrayLength = currentArray.length;
+    for(let i = 0; i < currentArrayLength; i++) {
+        returnArray = returnArray.concat(currentArray[i]);
+    }
+
+    return returnArray;
+}
+
+export const getUnselectedItems = function(aSelectedItems, aAllItems) {
+    let returnItems = new Array();
+    
+    let currentArray = aAllItems;
+    let currentArrayLength = currentArray.length;
+    for(let i = 0; i < currentArrayLength; i++) {
+        let currentItem = currentArray[i];
+        if(aSelectedItems.indexOf(currentItem) === -1) {
+            returnItems.push(currentItem);
+        }
+    }
+    
+    return returnItems;
+}
+
+export const sortOnField = function(aArray, aField) {
+    let sortFunction = function(aA, aB) {
+        let aValue = Dbm.objectPath(aA, aField);
+        let bValue = Dbm.objectPath(aB, aField);
+
+        if(aValue < bValue) {
+            return -1;
+        }
+        else if(aValue > bValue) {
+            return 1;
+        }
+
+        return 0;
+    }
+
+    aArray.sort(sortFunction);
+    
+    return aArray;
+}
+
+export const sortOnNumericField = function(aArray, aField) {
+    let sortFunction = function(aA, aB) {
+        let aValue = 1*Dbm.objectPath(aA, aField);
+        let bValue = 1*Dbm.objectPath(aB, aField);
+
+        if(aValue < bValue) {
+            return -1;
+        }
+        else if(aValue > bValue) {
+            return 1;
+        }
+
+        return 0;
+    }
+
+    aArray.sort(sortFunction);
+    
+    return aArray;
+}
+
+export const getItemIndexByIfExists = function(aArray, aField, aIdentifier) {
+		
+    if(!Array.isArray(aArray)) {
+        console.warn("No array provided", aArray);
+        return -1;
+    }
+    
+    let currentArray = aArray;
+    let currentArrayLength = currentArray.length;
+    for(let i = 0; i < currentArrayLength; i++) {
+        let currentItem = currentArray[i];
+        let currentValue = Dbm.objectPath(currentItem, aField);
+        if(currentValue == aIdentifier) {
+            return i;
+        }
+    }
+    
+    return -1;
 }