Novik · stickz · Dec 27, 2024 · Oct 26, 2024
diff --git a/css/stable.css b/css/stable.css
@@ -3,6 +3,7 @@
   --header-bg-image: linear-gradient(0deg, #dfdfdf 0%, #ffffff 100%);
   --header-border-color: #d0d0d0;
   --header-asc-icon: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAGCAYAAAARx7TFAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAU0lEQVQImYXOsQ0AMQgDQFIgZRxG9G60zECTBdJQ+6t8EfR6JDfWSUbkOgC8uwYyk5/wgL03q6pDAIwIZibXWm8OHABoZjLnFFVtC+4u4+9ZAOMBnF07zgszHpwAAAAASUVORK5CYII=);
+  --col-resize-sep-bg-color: #a0a0a0;
   height: 100%;
   background-color: #FFFFFF;
   overflow: hidden;
@@ -67,6 +68,7 @@
 }
 .stable-head div.resz {border: 1px solid #FF0000; width: 5px; height: 14px; padding: 0 !important; float: right; background: transparent url(../images/s.gif) no-repeat scroll left center; cursor: e-resize}
 .stable-body {
+  position: relative;
   width: 100%;
   flex: 1 1 auto;
   background: #F5F5F5;
@@ -108,7 +110,13 @@
 .stable-separator-header {position: absolute; top: 0px; left: 0px; font: menu; height: 1em; width: 1px; overflow: hidden; background: #0099FF; padding: 3px 0px}
 .stable-virtpad {width: 10px; height: 0px}
 .stable-scrollpos {width: 80%; height: 16px; left: 10%; top: 50%; position: absolute; padding: 0 5px; margin-top: -8px; background: #FFFFFF; color: #AAAAAA; font-size: 11px; font-weight: bold; text-align: center; overflow: hidden; display: none; white-space: nowrap}
-.stable-resize-header {	position: absolute; background-color: #A0A0A0; width: 1px; top: 0px; font: menu; visibility: hidden; overflow: hidden; z-index: 100; }
+.stable-resize-header {
+  position: absolute;
+  background-color: var(--col-resize-sep-bg-color);
+  width: 1px;
+  overflow: hidden;
+  z-index: 100;
+}
 
 .rowcover {
   position: absolute;

diff --git a/js/stable.js b/js/stable.js
@@ -124,7 +124,7 @@ dxSTable.prototype.create = function(ele, styles, aName)
 				$("<colgroup>"),  // -> cg
 			),
 			$("<div>").addClass("stable-virtpad"),  // -> this.bpad
-			$("<div>").addClass("stable-resize-header"),  // -> this.colReszObj
+			$("<div>").addClass("stable-resize-header").hide(),  // -> this.colReszObj
 		),
 		$("<span>").addClass("stable-scrollpos"),  // -> this.scp
 	);
@@ -146,12 +146,10 @@ dxSTable.prototype.create = function(ele, styles, aName)
 		this.colsdata[i].width = iv(this.colsdata[i].width);
 		this.ids[i] = styles[i].id;
 
-		td = $("<td>").on( "mousemove touchstart", function(e) 
-		{
+		td = $("<td>").on( "mousemove", function(e) {
 			if(self.isResizing) 
 				return;
 			var x = e.clientX - $(this).offset().left;	
-			this.lastMouseX = e.clientX;
 			var w = this.offsetWidth;
 			var i = parseInt(this.getAttribute("index"));
 			var delta = $.support.touchable ? 16 : 8;
@@ -173,7 +171,7 @@ dxSTable.prototype.create = function(ele, styles, aName)
 				}
 			}
 		});
-		$(this.tHeadRow).append(
+		this.tHeadRow.append(
 			td.append(
 				$("<div>").append($("<span>").text(styles[this.colOrder[i]].text))
 			)
@@ -317,26 +315,21 @@ dxSTable.prototype.resizeColumn = function() {
 		return;
 
 	var _e = this.tBody.getElementsByTagName("colgroup")[0].getElementsByTagName("col");
-	var needCallHandler = false;
 	var w = 0, c;
 	for (var i = 0; i < _e.length; i++) {
 		c = this.tHeadCols[i];
 		w = this.colsdata[i].width;
 		if (iv(_e[i].style.width) !== w) {
 			_e[i].style.width = w + "px";
-			needCallHandler = true;
 		}
 		if ((browser.isAppleWebKit || browser.isKonqueror) && this.tBody.rows.length > 0) {
 			if ((this.tBody.rows[0].cells[i].width || browser.isSafari) && (this.tBody.rows[0].cells[i].width !== w) && (w >= 4)) {
 				this.tBody.rows[0].cells[i].width = w;
-				needCallHandler = true;
 			}
 //			for( var j=0; j<this.tBody.rows.length; j++ )
 //				this.tBody.rows[j].cells[i].style.textAlign = c.style.textAlign;
 		}
 	}
-
-	(($type(this.onresize) === "function") && needCallHandler) && this.onresize();
 }
 
 var moveColumn = function(_11, _12) 
@@ -482,8 +475,8 @@ dxSTable.ColumnMove.prototype =
 		o.style.visibility = "visible";
 		var self = this;
 		self.ignoreNextMove = true;
-		$(document).on("mousemove",self,self.drag);
-		$(document).on("mouseup touchend",self,self.end);
+		$(document).on("mousemove", self,self.drag);
+		$(document).on("mouseup", self,self.end);
 		this.rx = $(this.parent.dHead).offset().left;
 		this.obj.style.cursor = "move";
 		return(false);
@@ -547,7 +540,7 @@ dxSTable.ColumnMove.prototype =
 		self.parent.isMoving = false;
 		self.parent.cancelSort = false;
 		$(document).off("mousemove",self.drag);
-		$(document).off("mouseup touchend",self.end);
+		$(document).off("mouseup",self.end);
 		return(false);
 	}
 }
@@ -561,7 +554,7 @@ dxSTable.prototype.renameColumn = function(no, name) {
 	no = this.getColOrder(no);
 	if (no>=0) {
 		this.colsdata[no].text = name;
-		this.tHeadRow.cells[no].getElementsByTagName("span")[0].innerText = name;
+		this.tHeadRow[0].cells[no].getElementsByTagName("span")[0].innerText = name;
 	}
 }
 
@@ -783,21 +776,17 @@ dxSTable.prototype.assignEvents = function()
 				self.syncDOMAsync();
 			}
 		});
-	this.tHead.onmousedown = function(e) 
-		{
-			if(self.isResizing)
-			      self.colDragEnd(e);
-			else
-			if((self.hotCell >- 1) && !self.isMoving) 
-			{
-				self.cancelSort = true;
-				self.cancelMove = true;
-                                $(document).on("mousemove",self,self.colDrag);
-                                $(document).on("mouseup touchend",self,self.colDragEnd);
-				$(self.rowCover).show();
-				return(false);
-         		}
-      		};
+	this.tHead.onmousedown = function(e) {
+		if (self.isResizing)
+			self.colDragEnd(e);
+		else if((self.hotCell >- 1) && !self.isMoving) {
+			self.cancelSort = true;
+			self.cancelMove = true;
+			$(document).on("mousemove", self, self.colDrag).on("mouseup", self, self.colDragEnd);
+			self.rowCover.show();
+			return(false);
+		}
+	};
 	this.tHead.onmouseup = function(e) 
 		{
 			if((self.hotCell >- 1) && !self.isMoving)
@@ -810,56 +799,43 @@ dxSTable.prototype.assignEvents = function()
 		this.dCont.on('mousedown', function(e) { self.bindKeys(); } );
 }
 
-dxSTable.prototype.colDrag = function(e) 
-{
-	var self = e.data;
+dxSTable.prototype.colDrag = function(e) {
+	const self = e.data;
 	self.isResizing = true;
-	if(self.hotCell ==- 1) 
+	if (self.hotCell < 0)
 		return(true);
 	while(!self.colsdata[self.hotCell].enabled && self.hotCell>0)
 		self.hotCell--;
-	var o = self.tHeadCols[self.hotCell];
-
-	var ex = e.clientX;
-	var w = parseInt(o.style.width);
-	var nw = w + ex;
-	if(!$type(o.lastMouseX)) 
-		o.lastMouseX = ex;
-	nw-=o.lastMouseX;
-	if(nw < 10) 
-	{
+	const o = self.tHeadCols[self.hotCell];
+	const nw = o.clientWidth + e.originalEvent.movementX;
+	if (nw < 10) {
 		return(true);
 	}
-	self.colsdata[self.hotCell].width += (e.clientX-o.lastMouseX);
+	self.colsdata[self.hotCell].width = nw;
 	o.style.width = nw + "px";
-	o.lastMouseX = ex;
 	document.body.style.cursor = "e-resize";
 
-	self.colReszObj.style.visibility = "visible";
-	if(!browser.isAppleWebKit && !browser.isKonqueror)
-		nw+=4;
-	self.colReszObj.style.left = (o.offsetLeft+nw-self.dHead.scrollLeft) + "px";
-
-	nw = iv(self.dBody.style.height) + iv(self.dHead.offsetHeight);
-	if(self.dBody.scrollWidth > self.dBody.clientWidth)
-		nw-=window.scrollbarHeight;
-	self.colReszObj.style.height = nw + "px";
+	self.colReszObj
+		.height($(self.tBody).height())
+		.css({
+			top: $(self.tpad).height(),
+			left: o.offsetLeft + nw - self.dHead.scrollLeft,
+		})
+		.show();
+	self.resizeColumn();
 
 	try { document.selection.empty(); } catch(ex) {}
 	return(false);
 }
 
-dxSTable.prototype.colDragEnd = function(e) 
-{
-        var self = e.data;
-	$(document).off("mousemove",self.colDrag);
-	$(document).off("mouseup touchend",self.colDragEnd);
-	$(self.rowCover).hide();
+dxSTable.prototype.colDragEnd = function(e) {
+	const self = e.data;
+	if ($type(self.onresize) === "function")
+		self.onresize();
+	$(document).off("mousemove", self.colDrag).off("mouseup", self.colDragEnd);
+	self.rowCover.hide();
 	self.isResizing = false;
-	self.colReszObj.style.left = 0;
-	self.colReszObj.style.height = 0;
-	self.colReszObj.style.visibility = "hidden";
-	self.resizeColumn();
+	self.colReszObj.hide();
 	self.cancelSort = false;
 	self.cancelMove = false;
 	document.body.style.cursor = "default";
@@ -1739,11 +1715,11 @@ Object.defineProperties(dxSTable.prototype, {
 	dHead: {get: function() {return this.dCont.find(".stable-head")[0];}},
 	dBody: {get: function() {return this.dCont.find(".stable-body")[0];}},
 	tHead: {get: function() {return this.dCont.find(".stable-head > table")[0];}},
-	tHeadRow: {get: function() {return this.dCont.find(".stable-head tr:first-child")[0];}},
+	tHeadRow: {get: function() {return this.dCont.find(".stable-head tr:first-child");}},
 	tpad: {get: function() {return this.dCont.find(".stable-body > .stable-virtpad:first-of-type")[0];}},
 	tBody: {get: function() {return this.dCont.find(".stable-body > table")[0];}},
 	bpad: {get: function() {return this.dCont.find(".stable-body > .stable-virtpad:nth-of-type(2)")[0];}},
 	scp: {get: function() {return this.dCont.find(".stable-scrollpos")[0];}},
-	colReszObj: {get: function() {return this.dCont.find(".stable-resize-header")[0];}},
-	rowCover: {get: function() {return this.dCont.find(".rowcover")[0];}},
+	colReszObj: {get: function() {return this.dCont.find(".stable-resize-header");}},
+	rowCover: {get: function() {return this.dCont.find(".rowcover");}},
 });
diff --git a/plugins/theme/themes/Acid/stable.css b/plugins/theme/themes/Acid/stable.css
@@ -3,6 +3,7 @@
   --header-bg-image: none;
   --header-border-color: #a0a0a0;
   --header-asc-icon: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAGCAYAAAARx7TFAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAfElEQVQImV2OQQqCYBhE3xctau9RxAt0BLeuvErnbKlYKCH/DyUtXouMpIGB4TEMg8rWjY3/bMdGLa2JREXllu+/oaZ2ZmZgoKMjHqFHAyBUSkozmZGRaZmgB25ABk9GFBYmEktaYOBXmIEXcFiX4hLSr4UrcAeenzOejTe+01J0omVRDQAAAABJRU5ErkJggg==);
+  --col-resize-sep-bg-color: #a0a0a0;
 }
 .stable-head td {color: #00ff00; font-weight: bold;}
 .stable-head div.resz {background: transparent url(./images/s.gif) no-repeat scroll left center; }

diff --git a/plugins/theme/themes/Blue/stable.css b/plugins/theme/themes/Blue/stable.css
@@ -3,6 +3,7 @@
   /* --header-bg-image: undefined - inherit from standard theme; */
   /* --header-border-color: undefined - inherit from standard theme; */
   --header-asc-icon: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAFCAYAAACXU8ZrAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAMUlEQVQImWN0+O/AgAwUJ/b+v59fzIgsxoSuAJnGUIQugcxnwqYAXSHj43e/sSpABgAAzBbHU/fvogAAAABJRU5ErkJggg==);
+  --col-resize-sep-bg-color: #a0a0a0;
   border-color:  #8DB2E3 #FFFFFF #FFFFFF #8DB2E3;
 }
 .stable-body tr.selected td {background: #D9E8FB}
diff --git a/plugins/theme/themes/Dark/stable.css b/plugins/theme/themes/Dark/stable.css
@@ -3,6 +3,7 @@
   --header-bg-image: linear-gradient(0deg, #202020 0%, #000000 100%);
   --header-border-color: #333333;
   /* --header-asc-icon: undefined - inherit from standard theme; */
+  --col-resize-sep-bg-color: #a0a0a0;
 }
 .stable-head div.resz {border: 1px solid #FF0000; background: transparent url(./images/s.gif) no-repeat scroll left center;}
 .stable-body {background: window; background-color: #181818; }

diff --git a/plugins/theme/themes/DarkBetter/stable.css b/plugins/theme/themes/DarkBetter/stable.css
@@ -3,6 +3,7 @@
   --header-bg-image: linear-gradient(0deg, #202020 0%, #000000 100%);
   --header-border-color: #333333;
   --header-asc-icon: url("data:image/svg+xml,%3csvg version='1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3e%3cpath fill='%232196F3' d='M43 17.1L39.9 14 24 29.9 8.1 14 5 17.1 24 36z'/%3e%3c/svg%3e");
+  --col-resize-sep-bg-color: #a0a0a0;
 }
 .stable-head div.resz {border: 1px solid #FF0000; background: transparent url(./images/s.gif) no-repeat scroll left center}
 .stable-body {background: window; background-color: #181818}

diff --git a/plugins/theme/themes/Excel/stable.css b/plugins/theme/themes/Excel/stable.css
@@ -3,6 +3,7 @@
   --header-bg-image: linear-gradient(0deg, #e1c15f 0%, #f8d79b 100%);
   --header-border-color: #f2993c;
   --header-asc-icon: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAFCAYAAACXU8ZrAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAM0lEQVQImWP4//8/AzJOnHD2P7oYEwMSSJp47j8yDQNM6Aqw8ZmwKUBXyPjj+mysCpABAMnILpbMeCuyAAAAAElFTkSuQmCC);
+  --col-resize-sep-bg-color: #a0a0a0;
 }
 #list-table { border-color: #9eb6ce }
 .stable-head {

diff --git a/plugins/theme/themes/MaterialDesign/stable.css b/plugins/theme/themes/MaterialDesign/stable.css
@@ -57,6 +57,7 @@
   --header-bg-image: none;
   --header-border-color: transparent;
   --header-asc-icon: url(data:image/gif;base64,R0lGODlhEAAQAPcAAP//////zP//mf//Zv//M///AP/M///MzP/Mmf/MZv/MM//MAP+Z//+ZzP+Zmf+ZZv+ZM/+ZAP9m//9mzP9mmf9mZv9mM/9mAP8z//8zzP8zmf8zZv8zM/8zAP8A//8AzP8Amf8AZv8AM/8AAMz//8z/zMz/mcz/Zsz/M8z/AMzM/8zMzMzMmczMZszMM8zMAMyZ/8yZzMyZmcyZZsyZM8yZAMxm/8xmzMxmmcxmZsxmM8xmAMwz/8wzzMwzmcwzZswzM8wzAMwA/8wAzMwAmcwAZswAM8wAAJn//5n/zJn/mZn/Zpn/M5n/AJnM/5nMzJnMmZnMZpnMM5nMAJmZ/5mZzJmZmZmZZpmZM5mZAJlm/5lmzJlmmZlmZplmM5lmAJkz/5kzzJkzmZkzZpkzM5kzAJkA/5kAzJkAmZkAZpkAM5kAAGb//2b/zGb/mWb/Zmb/M2b/AGbM/2bMzGbMmWbMZmbMM2bMAGaZ/2aZzGaZmWaZZmaZM2aZAGZm/2ZmzGZmmWZmZmZmM2ZmAGYz/2YzzGYzmWYzZmYzM2YzAGYA/2YAzGYAmWYAZmYAM2YAADP//zP/zDP/mTP/ZjP/MzP/ADPM/zPMzDPMmTPMZjPMMzPMADOZ/zOZzDOZmTOZZjOZMzOZADNm/zNmzDNmmTNmZjNmMzNmADMz/zMzzDMzmTMzZjMzMzMzADMA/zMAzDMAmTMAZjMAMzMAAAD//wD/zAD/mQD/ZgD/MwD/AADM/wDMzADMmQDMZgDMMwDMAACZ/wCZzACZmQCZZgCZMwCZAABm/wBmzABmmQBmZgBmMwBmAAAz/wAzzAAzmQAzZgAzMwAzAAAA/wAAzAAAmQAAZgAAMwAAAICAgHZ2dnV1dVZWVioqKgsLC////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAN4ALAAAAAAQABAAAAg5AL0JHEiwoMGDCBMqXMjQ4DZsECNuQ9hNW0Rs2bol5HaRm8JrD7Ftu7awojaNDLl5bMiypcuXCwMCADs=);
+  --col-resize-sep-bg-color: #a0a0a0;
 }
 .stable-head {
   text-shadow: 0px 1px 0px #000;

diff --git a/plugins/theme/themes/Oblivion/stable.css b/plugins/theme/themes/Oblivion/stable.css
@@ -3,6 +3,7 @@
   --header-bg-image: linear-gradient(0deg, #161616 0%, #191919 100%);
   --header-border-color: transparent;
   --header-asc-icon: url(data:image/gif;base64,R0lGODlhEAAQAPQeAGZmZoeHh4WFhYCAgH9/f3p6enh4eHV1dXR0dHNzc2hoaGdnZ2RkZF1dXVZWVlVVVVNTU01NTUNDQzs7OzU1NSoqKigoKCUlJSIiIhYWFg4ODgwMDAYGBgMDAwAAAAAAACH5BAUAAB4ALAAAAAAQABAAAAU4oCeOZGmeaKqubDkBRiEby3RuUEIMxPFsKAyDIBgoLKmOBBEwRDoqTcPAyLAuDkqrU+G0vuBwKwQAOw==);
+  --col-resize-sep-bg-color: #a0a0a0;
 }
 .stable-head {
   color: #626262;