@node-projects/web-component-designer 0.0.33 → 0.0.34

package/dist/elements/widgets/designerView/designerCanvas.js

@@ -184,7 +184,6 @@ export class DesignerCanvas extends BaseCustomWebComponentLazyAppend {
         this.instanceServiceContainer.selectionService.setSelectedElements(null);
     }
     handleMoveCommand(command) {
-        //TODO: -> via undo redo service
         let sel = this.instanceServiceContainer.selectionService.primarySelection;
         if (command == CommandType.moveBackward)
             this.instanceServiceContainer.undoService.execute(new MoveElementInDomAction(sel, DesignItem.GetDesignItem(sel.element.previousElementSibling), 'beforebegin', DesignItem.GetDesignItem(sel.element.previousElementSibling), 'afterend'));
@@ -223,10 +222,10 @@ export class DesignerCanvas extends BaseCustomWebComponentLazyAppend {
             this._outercanvas2.addEventListener(EventNames.PointerDown, this._pointerEventHandlerBound);
             this._outercanvas2.addEventListener(EventNames.PointerMove, this._pointerEventHandlerBound);
             this._outercanvas2.addEventListener(EventNames.PointerUp, this._pointerEventHandlerBound);
-            this._canvas.addEventListener(EventNames.DragEnter, event => this._onDragEnter(event));
-            this._canvas.addEventListener(EventNames.DragLeave, event => this._onDragLeave(event));
-            this._canvas.addEventListener(EventNames.DragOver, event => this._onDragOver(event));
-            this._canvas.addEventListener(EventNames.Drop, event => this._onDrop(event));
+            this._outercanvas2.addEventListener(EventNames.DragEnter, event => this._onDragEnter(event));
+            this._outercanvas2.addEventListener(EventNames.DragLeave, event => this._onDragLeave(event));
+            this._outercanvas2.addEventListener(EventNames.DragOver, event => this._onDragOver(event));
+            this._outercanvas2.addEventListener(EventNames.Drop, event => this._onDrop(event));
             this._canvas.addEventListener(EventNames.KeyDown, this._onKeyDownBound, true);
             this._canvas.addEventListener(EventNames.KeyUp, this._onKeyUpBound, true);
             this._canvas.addEventListener(EventNames.DblClick, this._onDblClickBound, true);
@@ -304,9 +303,9 @@ export class DesignerCanvas extends BaseCustomWebComponentLazyAppend {
             let di = await this.serviceContainer.forSomeServicesTillResult("instanceService", (service) => service.getElement(elementDefinition, this.serviceContainer, this.instanceServiceContainer));
             let grp = di.openGroup("Insert");
             di.setStyle('position', 'absolute');
-            const targetRect = event.target.getBoundingClientRect();
-            di.setStyle('top', ((event.offsetY - (this.containerBoundingRect.y * this._zoomFactor)) / this._zoomFactor + targetRect.top) + 'px');
-            di.setStyle('left', ((event.offsetX - (this.containerBoundingRect.x * this._zoomFactor)) / this._zoomFactor + targetRect.left) + 'px');
+            const canvasRect = this._canvasContainer.getBoundingClientRect();
+            di.setStyle('top', ((event.offsetY + event.target.scrollTop - (this.containerBoundingRect.y * this._zoomFactor)) / this._zoomFactor + canvasRect.top) + 'px');
+            di.setStyle('left', ((event.offsetX + event.target.scrollLeft - (this.containerBoundingRect.x * this._zoomFactor)) / this._zoomFactor + canvasRect.left) + 'px');
             this.instanceServiceContainer.undoService.execute(new InsertAction(this.rootDesignItem, this.rootDesignItem.childCount, di));
             grp.commit();
             requestAnimationFrame(() => this.instanceServiceContainer.selectionService.setSelectedElements([di]));
@@ -415,8 +414,8 @@ export class DesignerCanvas extends BaseCustomWebComponentLazyAppend {
             offsetInControlX: (startPoint ? startPoint.offsetInControlX : event.x - targetRect.x),
             offsetInControlY: (startPoint ? startPoint.offsetInControlY : event.y - targetRect.y),
             zoom: this._zoomFactor,
-            normalizedX: ((event.offsetX - (this.containerBoundingRect.x * this._zoomFactor)) / this._zoomFactor + targetRect.left),
-            normalizedY: ((event.offsetY - (this.containerBoundingRect.y * this._zoomFactor)) / this._zoomFactor + targetRect.top)
+            normalizedX: ((event.offsetX + event.target.scrollLeft - (this.containerBoundingRect.x * this._zoomFactor)) / this._zoomFactor + targetRect.left),
+            normalizedY: ((event.offsetY + event.target.scrollTop - (this.containerBoundingRect.y * this._zoomFactor)) / this._zoomFactor + targetRect.top)
         };
     }
     //todo remove, is in base custom webcomp domhelper

package/package.json

@@ -1,7 +1,7 @@
 {
   "description": "A UI designer for Polymer apps",
   "name": "@node-projects/web-component-designer",
-  "version": "0.0.33",
+  "version": "0.0.34",
   "type": "module",
   "main": "./dist/index.js",
   "author": "",