[Libreoffice-commits] online.git: loleaflet/dist loleaflet/src

[Henry Castro]

 loleaflet/dist/spreadsheet.css                |   68 +++++++++++++++++++-------
 loleaflet/src/control/Control.ColumnHeader.js |   15 +++--
 loleaflet/src/control/Control.RowHeader.js    |   16 +++---
 3 files changed, 70 insertions(+), 29 deletions(-)

New commits:
commit 3336af0804b919b2441d162626f298c09ddcac16
Author: Henry Castro <hcastro at collabora.com>
Date:   Thu Aug 4 16:48:47 2016 -0400

    loleaflet: add Column/Row cursor resize

diff --git a/loleaflet/dist/spreadsheet.css b/loleaflet/dist/spreadsheet.css
index 7537600..7927b23 100644
--- a/loleaflet/dist/spreadsheet.css
+++ b/loleaflet/dist/spreadsheet.css
@@ -99,24 +99,12 @@
 
 .spreadsheet-header-column {
 	border-right: 1px solid darkgrey;
-	font: 12px/1.5 "Segoe UI", Tahoma, Arial, Helvetica, sans-serif;
-
 	display: inline-block;
-	text-align: center;
-	text-overflow: ellipsis;
-	white-space: nowrap;
+	text-align: left;
 	padding: 0px;
 	padding-top: 1px;
 	margin: 0px;
 	height: 100%;
-	cursor: pointer;
-
-	/* Make the text unselectable for all browsers */
-	-webkit-touch-callout: none;
-	-webkit-user-select: none;
-	-khtml-user-select: none;
-	-moz-user-select: none;
-	-ms-user-select: none;
 	}
 
 .spreadsheet-header-column:hover {
@@ -146,14 +134,56 @@
 
 .spreadsheet-header-row {
 	border-bottom: 1px solid darkgrey;
-	font: 12px/1.5 "Segoe UI", Tahoma, Arial, Helvetica, sans-serif;
+	padding: 0px;
+	margin: 0px;
+	height: 100%;
+	cursor: pointer;
+	}
+
+.spreadsheet-header-row:hover {
+	background-color: #DDD;
+	}
 
+.spreadsheet-header-column-text {
+	display: inline-block;
+	vertical-align: top;
+	font: 12px/1.5 "Segoe UI", Tahoma, Arial, Helvetica, sans-serif;
 	text-overflow: ellipsis;
-	text-align: center;
 	white-space: nowrap;
+	text-align: center;
+	height: 100%;
+	margin: 0px;
+	border: 0px;
 	padding: 0px;
+	cursor: pointer;
+
+	/* Make the text unselectable for all browsers */
+	-webkit-touch-callout: none;
+	-webkit-user-select: none;
+	-khtml-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	}
+
+.spreadsheet-header-column-resize {
+	display: inline-block;
+	vertical-align: top;
+	cursor: col-resize;
+	height: 100%;
 	margin: 0px;
+	border: 0px;
+	padding: 0px;
+	}
+
+.spreadsheet-header-row-text {
+	font: 12px/1.5 "Segoe UI", Tahoma, Arial, Helvetica, sans-serif;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	text-align: center;
 	height: 100%;
+	margin: 0px;
+	border: 0px;
+	padding: 0px;
 	cursor: pointer;
 
 	/* Make the text unselectable for all browsers */
@@ -164,6 +194,10 @@
 	-ms-user-select: none;
 	}
 
-.spreadsheet-header-row:hover {
-	background-color: #DDD;
+.spreadsheet-header-row-resize {
+	cursor: row-resize;
+	height: 100%;
+	margin: 0px;
+	border: 0px;
+	padding: 0px;
 	}
diff --git a/loleaflet/src/control/Control.ColumnHeader.js b/loleaflet/src/control/Control.ColumnHeader.js
index a5cfcdc..45d48b5 100644
--- a/loleaflet/src/control/Control.ColumnHeader.js
+++ b/loleaflet/src/control/Control.ColumnHeader.js
@@ -92,24 +92,27 @@ L.Control.ColumnHeader = L.Control.extend({
 	},
 
 	fillColumns: function (columns, converter, context) {
-		var iterator, twip, width, text;
+		var iterator, twip, width, column, text, resize;
 
 		this.clearColumns();
 		for (iterator = 0; iterator < columns.length; iterator++) {
 			width = columns[iterator].size - (iterator > 0 ? columns[iterator - 1].size : 0);
 			twip = new L.Point(width, width);
-			text = L.DomUtil.create('div', 'spreadsheet-header-column', this._columns);
+			column = L.DomUtil.create('div', 'spreadsheet-header-column', this._columns);
+			text = L.DomUtil.create('div', 'spreadsheet-header-column-text', column);
+			resize = L.DomUtil.create('div', 'spreadsheet-header-column-resize', column);
 			var content = columns[iterator].text;
 			text.setAttribute('rel', 'spreadsheet-column-' + content); // for easy addressing
 			text.innerHTML = content;
-			width = Math.round(converter.call(context, twip).x) - 1 + 'px';
-			if (width === '-1px') {
+			width = Math.round(converter.call(context, twip).x) - 1;
+			if (width === -1) {
 				L.DomUtil.setStyle(text, 'display', 'none');
 			}
 			else {
-				L.DomUtil.setStyle(text, 'width', width);
+				L.DomUtil.setStyle(column, 'width', width + 'px');
+				L.DomUtil.setStyle(text, 'width', width - 3 + 'px');
+				L.DomUtil.setStyle(resize, 'width', '3px');
 			}
-
 			L.DomEvent.addListener(text, 'click', this._onColumnHeaderClick, this);
 		}
 	},
diff --git a/loleaflet/src/control/Control.RowHeader.js b/loleaflet/src/control/Control.RowHeader.js
index 11cf0da..5cd01c1 100644
--- a/loleaflet/src/control/Control.RowHeader.js
+++ b/loleaflet/src/control/Control.RowHeader.js
@@ -90,22 +90,26 @@ L.Control.RowHeader = L.Control.extend({
 	},
 
 	fillRows: function (rows, converter, context) {
-		var iterator, twip, height, text;
+		var iterator, twip, height, row, text, resize;
 
 		this.clearRows();
 		for (iterator = 0; iterator < rows.length; iterator++) {
 			height = rows[iterator].size - (iterator > 0 ? rows[iterator - 1].size : 0);
 			twip = new L.Point(height, height);
-			text = L.DomUtil.create('div', 'spreadsheet-header-row', this._rows);
+			row = L.DomUtil.create('div', 'spreadsheet-header-row', this._rows);
+			text = L.DomUtil.create('div', 'spreadsheet-header-row-text', row);
+			resize = L.DomUtil.create('div', 'spreadsheet-header-row-resize', row);
 			var content = rows[iterator].text;
 			text.setAttribute('rel', 'spreadsheet-row-' + content); // for easy addressing
 			text.innerHTML = content;
-			height = Math.round(converter.call(context, twip).y) - 1 + 'px';
-			if (height === '-1px') {
+			height = Math.round(converter.call(context, twip).y) - 1;
+			if (height === -1) {
 				L.DomUtil.setStyle(text, 'display', 'none');
 			} else {
-				L.DomUtil.setStyle(text, 'line-height', height);
-				L.DomUtil.setStyle(text, 'height', height);
+				L.DomUtil.setStyle(row, 'height', height + 'px');
+				L.DomUtil.setStyle(row, 'line-height', height + 'px');
+				L.DomUtil.setStyle(text, 'height', height - 3 + 'px');
+				L.DomUtil.setStyle(resize, 'height', '3px');
 			}
 
 			L.DomEvent.addListener(text, 'click', this._onRowHeaderClick, this);