1 files changed, 38 insertions, 9 deletions

diff --git a/src/client/goldenLayout.js b/src/client/goldenLayout.js
index 896237e1d..012ee163c 100644
--- a/src/client/goldenLayout.js
+++ b/src/client/goldenLayout.js
@@ -366,6 +366,7 @@
         this._nOriginalY = 0;
 
         this._bDragging = false;
+        this._bAborting = false;
 
         this._fMove = lm.utils.fnBind(this.onMouseMove, this);
         this._fUp = lm.utils.fnBind(this.onMouseUp, this);
@@ -387,8 +388,8 @@
         },
 
         onMouseDown: function (oEvent) {
-            oEvent.preventDefault();
-
+            //oEvent.preventDefault();  // don't prevent deafult as this will stop text selection
+            if (oEvent.target && oEvent.target.className === "lm_title") return;  // if the title is active and receiving events, then don't do tab dragging.
             if (oEvent.button == 0 || oEvent.type === "touchstart") {
                 var coordinates = this._getCoordinates(oEvent);
 
@@ -427,6 +428,24 @@
             }
         },
 
+        AbortDrag: function () {
+            if (this._timeout != null) {
+                clearTimeout(this._timeout);
+                this._eBody.removeClass('lm_dragging');
+                this._eElement.removeClass('lm_dragging');
+                this._oDocument.find('iframe').css('pointer-events', '');
+                this._oDocument.unbind('mousemove touchmove', this._fMove);
+                this._oDocument.unbind('mouseup touchend', this._fUp);
+
+                if (this._bDragging === true) {
+                    this._bDragging = false;
+                    this._bAborting = true;
+                    this.emit('dragStop', { pageX: 0, pageY: 0 }, this._nOriginalX + this._nX);
+                    this._bAborting = false;
+                }
+            }
+        },
+
         onMouseUp: function (oEvent) {
             if (this._timeout != null) {
                 clearTimeout(this._timeout);
@@ -439,7 +458,14 @@
                 if (this._bDragging === true) {
                     this._bDragging = false;
                     this.emit('dragStop', oEvent, this._nOriginalX + this._nX);
+                } else  { // make title receive pointer events to allow setting insertion position or selecting texst range
+                    const classname = typeof oEvent.target?.className === "string" ? oEvent.target.className : "";
+                    if (classname.includes("lm_title_wrap")) {
+                        oEvent.target.children[0].style.pointerEvents = "all";
+                        oEvent.target.children[0].focus();
+                    }
                 }
+
             }
         },
 
@@ -1406,7 +1432,7 @@
             this.root.callDownwards('_$init');
 
             if (config.maximisedItemId === '__glMaximised') {
-                this.root.getItemsById(config.maximisedItemId)[0].toggleMaximise();
+                this.root.getItemsById(config.maximisedItemId)[0]?.toggleMaximise();
             }
         },
 
@@ -2178,18 +2204,18 @@
          */
         _onDrop: function () {
             this._layoutManager.dropTargetIndicator.hide();
-
+            let abortedDrop = this._dragListener._bAborting;
             /*
              * Valid drop area found
              */
-            if (this._area !== null) {
+            if (!abortedDrop && this._area !== null) {
                 this._area.contentItem._$onDrop(this._contentItem, this._area);
 
                 /**
                  * No valid drop area available at present, but one has been found before.
                  * Use it
                  */
-            } else if (this._lastValidArea !== null) {
+            } else if (!abortedDrop && this._lastValidArea !== null) {
                 this._lastValidArea.contentItem._$onDrop(this._contentItem, this._lastValidArea);
 
                 /**
@@ -2197,7 +2223,7 @@
                  * content item to its original position if a original parent is provided.
                  * (Which is not the case if the drag had been initiated by createDragSource)
                  */
-            } else if (this._originalParent) {
+            } else if (!abortedDrop && this._originalParent) {
                 this._originalParent.addChild(this._contentItem);
 
                 /**
@@ -2212,7 +2238,7 @@
             restoreScrollTops(this._contentItem.element)
             this.element.remove();
 
-            this._layoutManager.emit('itemDropped', this._contentItem);
+            !abortedDrop && this._layoutManager.emit('itemDropped', this._contentItem);
         },
 
         /**
@@ -2851,6 +2877,8 @@
         this.closeElement = this.element.find('.lm_close_tab');
         this.closeElement[contentItem.config.isClosable ? 'show' : 'hide']();
         this.isActive = false;
+        this.titleElement[0].style.pointerEvents = "none";  // don't let title receive pointer events by default -- need to click on it to make it editable -- this allows the tab to be dragged
+        this.titleElement[0].onblur = () => this.titleElement[0].style.pointerEvents = "none";
 
         this.setTitle(contentItem.config.title);
         this.contentItem.on('titleChanged', this.setTitle, this);
@@ -2963,7 +2991,7 @@
             if (this.contentItem.parent.isMaximised === true) {
                 this.contentItem.parent.toggleMaximise();
             }
-            new lm.controls.DragProxy(
+            let proxy = new lm.controls.DragProxy(
                 x,
                 y,
                 this._dragListener,
@@ -2971,6 +2999,7 @@
                 this.contentItem,
                 this.header.parent
             );
+            this._layoutManager.emit('dragStart', proxy);
         },
 
         /**