[Libreoffice-commits] online.git: Branch 'feature/calc-canvas' - 11 commits - loleaflet/css loleaflet/src

Dennis Francis (via logerrit) logerrit at kemper.freedesktop.org
Mon Aug 24 17:23:49 UTC 2020


 loleaflet/css/spreadsheet.css                 |    2 
 loleaflet/src/control/Control.ColumnHeader.js |    3 
 loleaflet/src/control/Control.Header.js       |    3 
 loleaflet/src/control/Control.RowHeader.js    |    3 
 loleaflet/src/core/Util.js                    |    7 +
 loleaflet/src/layer/tile/CalcTileLayer.js     |  100 ++++++++++++++------------
 loleaflet/src/layer/tile/CanvasTileLayer.js   |   29 +++++--
 loleaflet/src/map/Map.js                      |   15 +++
 8 files changed, 106 insertions(+), 56 deletions(-)

New commits:
commit d6ce39ca74bfee96a76853c97de4b0f66a925c24
Author:     Dennis Francis <dennis.francis at collabora.com>
AuthorDate: Mon Aug 24 22:34:27 2020 +0530
Commit:     Dennis Francis <dennis.francis at collabora.com>
CommitDate: Mon Aug 24 22:52:23 2020 +0530

    WIP: fix the mapping between twips/css-px/core-px in a backward compatible way
    
    DO NOT MERGE.
    
    Change-Id: I18952393f17e0391167e0219b829be47723c5c47

diff --git a/loleaflet/src/layer/tile/CalcTileLayer.js b/loleaflet/src/layer/tile/CalcTileLayer.js
index 3daa75e69..b117165ae 100644
--- a/loleaflet/src/layer/tile/CalcTileLayer.js
+++ b/loleaflet/src/layer/tile/CalcTileLayer.js
@@ -79,6 +79,7 @@ L.CalcTileLayer = BaseTileLayer.extend({
 	},
 
 	onAdd: function (map) {
+		this._useExactDPR = this._hasCanvasRenderer = (this instanceof L.CanvasTileLayer);
 		map.addControl(L.control.tabs());
 		map.addControl(L.control.columnHeader());
 		map.addControl(L.control.rowHeader());
@@ -467,7 +468,7 @@ L.CalcTileLayer = BaseTileLayer.extend({
 		this._sendClientZoom();
 		if (this.sheetGeometry) {
 			this.sheetGeometry.setTileGeometryData(this._tileWidthTwips, this._tileHeightTwips,
-				this._tileSize, this._tilePixelScale);
+				this._tileSize, this._hasCanvasRenderer ? L.getDpiScaleFactor(true /* useExactDPR */) : this._tilePixelScale);
 		}
 		this._restrictDocumentSize();
 		this._replayPrintTwipsMsgs();
@@ -733,9 +734,10 @@ L.CalcTileLayer = BaseTileLayer.extend({
 	_handleSheetGeometryDataMsg: function (jsonMsgObj) {
 		if (!this.sheetGeometry) {
 			this._sheetGeomFirstWait = false;
+			var dpiScale = this._hasCanvasRenderer ? L.getDpiScaleFactor(true /* useExactDPR */) : this._tilePixelScale;
 			this.sheetGeometry = new L.SheetGeometry(jsonMsgObj,
 				this._tileWidthTwips, this._tileHeightTwips,
-				this._tileSize, this._tilePixelScale, this._selectedPart);
+				this._tileSize, dpiScale, this._selectedPart);
 		}
 		else {
 			this.sheetGeometry.update(jsonMsgObj, /* checkCompleteness */ false, this._selectedPart);
@@ -1215,12 +1217,12 @@ L.SheetGeometry = L.Class.extend({
 	// all flags (ie 'columns', 'rows', 'sizes', 'hidden', 'filtered',
 	// 'groups') enabled.
 	initialize: function (sheetGeomJSON, tileWidthTwips, tileHeightTwips,
-		tileSizeCSSPixels, dpiScale, part) {
+		tileSizePixels, dpiScale, part) {
 
 		if (typeof sheetGeomJSON !== 'object' ||
 			typeof tileWidthTwips !== 'number' ||
 			typeof tileHeightTwips !== 'number' ||
-			typeof tileSizeCSSPixels !== 'number' ||
+			typeof tileSizePixels !== 'number' ||
 			typeof dpiScale !== 'number' ||
 			typeof part !== 'number') {
 			console.error('Incorrect constructor argument types or missing required arguments');
@@ -1233,7 +1235,7 @@ L.SheetGeometry = L.Class.extend({
 		this._unoCommand = '.uno:SheetGeometryData';
 
 		// Set various unit conversion info early on because on update() call below, these info are needed.
-		this.setTileGeometryData(tileWidthTwips, tileHeightTwips, tileSizeCSSPixels,
+		this.setTileGeometryData(tileWidthTwips, tileHeightTwips, tileSizePixels,
 			dpiScale, false /* update position info ?*/);
 
 		this.update(sheetGeomJSON, /* checkCompleteness */ true, part);
@@ -1277,10 +1279,10 @@ L.SheetGeometry = L.Class.extend({
 		return this._part;
 	},
 
-	setTileGeometryData: function (tileWidthTwips, tileHeightTwips, tileSizeCSSPixels,
+	setTileGeometryData: function (tileWidthTwips, tileHeightTwips, tileSizePixels,
 		dpiScale, updatePositions) {
-		this._columns.setTileGeometryData(tileWidthTwips, tileSizeCSSPixels, dpiScale, updatePositions);
-		this._rows.setTileGeometryData(tileHeightTwips, tileSizeCSSPixels, dpiScale, updatePositions);
+		this._columns.setTileGeometryData(tileWidthTwips, tileSizePixels, dpiScale, updatePositions);
+		this._rows.setTileGeometryData(tileHeightTwips, tileSizePixels, dpiScale, updatePositions);
 	},
 
 	setViewArea: function (topLeftTwipsPoint, sizeTwips) {
@@ -1421,7 +1423,7 @@ L.SheetGeometry = L.Class.extend({
 	},
 
 	// Returns full sheet size as L.Point in the given unit.
-	// unit must be one of 'csspixels', 'devpixels', 'tiletwips', 'printtwips'
+	// unit must be one of 'csspixels', 'corepixels', 'tiletwips', 'printtwips'
 	getSize: function (unit) {
 		return new L.Point(this._columns.getSize(unit),
 			this._rows.getSize(unit));
@@ -1429,8 +1431,8 @@ L.SheetGeometry = L.Class.extend({
 
 	// Returns the CSS pixel position/size of the requested cell at a specified zoom.
 	getCellRect: function (columnIndex, rowIndex, zoomScale) {
-		var horizPosSize = this._columns.getElementData(columnIndex, false /* devicePixels */, zoomScale);
-		var vertPosSize  = this._rows.getElementData(rowIndex, false /* devicePixels */, zoomScale);
+		var horizPosSize = this._columns.getElementData(columnIndex, false /* corePixels */, zoomScale);
+		var vertPosSize  = this._rows.getElementData(rowIndex, false /* corePixels */, zoomScale);
 
 		var topLeft = new L.Point(horizPosSize.startpos, vertPosSize.startpos);
 		var size = new L.Point(horizPosSize.size, vertPosSize.size);
@@ -1447,13 +1449,13 @@ L.SheetGeometry = L.Class.extend({
 	},
 
 	// Returns the start position of the column containing posX in the specified unit.
-	// unit must be one of 'csspixels', 'devpixels', 'tiletwips', 'printtwips'
+	// unit must be one of 'csspixels', 'corepixels', 'tiletwips', 'printtwips'
 	getSnapDocPosX: function (posX, unit) {
 		return this._columns.getSnapPos(posX, unit);
 	},
 
 	// Returns the start position of the row containing posY in the specified unit.
-	// unit must be one of 'csspixels', 'devpixels', 'tiletwips', 'printtwips'
+	// unit must be one of 'csspixels', 'corepixels', 'tiletwips', 'printtwips'
 	getSnapDocPosY: function (posY, unit) {
 		return this._rows.getSnapPos(posY, unit);
 	},
@@ -1585,7 +1587,7 @@ L.SheetDimension = L.Class.extend({
 		this._maxIndex = maxIndex;
 	},
 
-	setTileGeometryData: function (tileSizeTwips, tileSizeCSSPixels, dpiScale, updatePositions) {
+	setTileGeometryData: function (tileSizeTwips, tileSizePixels, dpiScale, updatePositions) {
 
 		if (updatePositions === undefined) {
 			updatePositions = true;
@@ -1593,17 +1595,24 @@ L.SheetDimension = L.Class.extend({
 
 		// Avoid position re-computations if no change in Zoom/dpiScale.
 		if (this._tileSizeTwips === tileSizeTwips &&
-			this._tileSizeCSSPixels === tileSizeCSSPixels &&
+			this._tileSizePixels === tileSizePixels &&
 			this._dpiScale === dpiScale) {
 			return;
 		}
 
 		this._tileSizeTwips = tileSizeTwips;
-		this._tileSizeCSSPixels = tileSizeCSSPixels;
+		this._tileSizePixels = tileSizePixels;
 		this._dpiScale = dpiScale;
 
-		this._twipsPerCSSPixel = tileSizeTwips / tileSizeCSSPixels;
-		this._devPixelsPerCssPixel = dpiScale;
+		var tileSizeDevicePixels = this._tileSizePixels;
+		this._devicePixelsPerCSSPixel = this._dpiScale;
+
+		this._corePixelsPerDevicePixel = tileSizeTwips / (tileSizeDevicePixels * 15.0);
+		this._corePixelsPerCSSPixel = this._corePixelsPerDevicePixel * this._devicePixelsPerCSSPixel;
+
+		this._CSSPixelsPerCorePixel = 1.0 / this._corePixelsPerCSSPixel;
+
+		this._twipsPerCorePixel =
 
 		if (updatePositions) {
 			// We need to compute positions data for every zoom change.
@@ -1620,7 +1629,7 @@ L.SheetDimension = L.Class.extend({
 
 	_updatePositions: function() {
 
-		var posDevPx = 0; // position in device pixels.
+		var posDevPx = 0; // position in core pixels.
 		var posPrintTwips = 0;
 		var dimensionObj = this;
 		this._visibleSizes.addCustomDataForEachSpan(function (
@@ -1628,11 +1637,11 @@ L.SheetDimension = L.Class.extend({
 			size, /* size in twips of one element in the span */
 			spanLength /* #elements in the span */) {
 
-			// Important: rounding needs to be done in device pixels exactly like the core.
-			var sizeDevPxOne = Math.floor(size / dimensionObj._twipsPerCSSPixel * dimensionObj._devPixelsPerCssPixel);
+			// Important: rounding needs to be done in core pixels to match core.
+			var sizeCorePxOne = Math.floor(size / dimensionObj._twipsPerCSSPixel * dimensionObj._corePixelsPerCssPixel);
 			posDevPx += (sizeDevPxOne * spanLength);
-			var posCssPx = posDevPx / dimensionObj._devPixelsPerCssPixel;
-			// position in device-pixel aligned twips.
+			var posCssPx = posDevPx / dimensionObj._corePixelsPerCssPixel;
+			// position in core-pixel aligned twips.
 			var posTileTwips = Math.floor(posCssPx * dimensionObj._twipsPerCSSPixel);
 			posPrintTwips += (size * spanLength);
 
@@ -1649,7 +1658,7 @@ L.SheetDimension = L.Class.extend({
 	},
 
 	// returns the element pos/size in css pixels by default.
-	getElementData: function (index, useDevicePixels, zoomScale) {
+	getElementData: function (index, useCorePixels, zoomScale) {
 		if (zoomScale !== undefined) {
 			var startpos = 0;
 			var size = 0;
@@ -1677,7 +1686,7 @@ L.SheetDimension = L.Class.extend({
 			return undefined;
 		}
 
-		return this._getElementDataFromSpanByIndex(index, span, useDevicePixels);
+		return this._getElementDataFromSpanByIndex(index, span, useCorePixels);
 	},
 
 	getElementDataAny: function (index, unitName) {
@@ -1690,9 +1699,9 @@ L.SheetDimension = L.Class.extend({
 	},
 
 	// returns element pos/size in css pixels by default.
-	_getElementDataFromSpanByIndex: function (index, span, useDevicePixels) {
+	_getElementDataFromSpanByIndex: function (index, span, useCorePixels) {
 		return this._getElementDataAnyFromSpanByIndex(index, span,
-				useDevicePixels ? 'devpixels' : 'csspixels');
+				useCorePixels ? 'corepixels' : 'csspixels');
 	},
 
 	// returns element pos/size in the requested unit.
@@ -1702,17 +1711,17 @@ L.SheetDimension = L.Class.extend({
 			return undefined;
 		}
 
-		if (unitName !== 'csspixels' && unitName !== 'devpixels' &&
+		if (unitName !== 'csspixels' && unitName !== 'corepixels' &&
 				unitName !== 'tiletwips' && unitName !== 'printtwips') {
 			console.error('unsupported unitName: ' + unitName);
 			return undefined;
 		}
 
 		var numSizes = span.end - index + 1;
-		var inPixels = (unitName === 'csspixels' || unitName === 'devpixels');
+		var inPixels = (unitName === 'csspixels' || unitName === 'corepixels');
 		if (inPixels) {
-			var useDevicePixels = (unitName === 'devpixels');
-			var pixelScale = useDevicePixels ? 1 : this._devPixelsPerCssPixel;
+			var useCorePixels = (unitName === 'corepixels');
+			var pixelScale = useCorePixels ? 1 : this._corePixelsPerCssPixel;
 			return {
 				startpos: (span.data.posdevpx - span.data.sizedev * numSizes) / pixelScale,
 				size: span.data.sizedev / pixelScale
@@ -1727,8 +1736,8 @@ L.SheetDimension = L.Class.extend({
 		}
 
 		// unitName is 'tiletwips'
-		// It is very important to calculate this from device pixel units to mirror the core calculations.
-		var twipsPerDevPixels = this._twipsPerCSSPixel / this._devPixelsPerCssPixel;
+		// It is very important to calculate this from core pixel units to mirror the core calculations.
+		var twipsPerDevPixels = this._twipsPerCSSPixel / this._corePixelsPerCssPixel;
 		return {
 			startpos: Math.floor(
 				(span.data.posdevpx - span.data.sizedev * numSizes) * twipsPerDevPixels),
@@ -1762,7 +1771,7 @@ L.SheetDimension = L.Class.extend({
 		}
 		var elementCount = span.end - span.start + 1;
 		var posStart = ((span.data.posdevpx - span.data.sizedev * elementCount) /
-			this._devPixelsPerCssPixel * this._twipsPerCSSPixel);
+			this._corePixelsPerCssPixel * this._twipsPerCSSPixel);
 		var posEnd = span.data.postiletwips;
 		var sizeOne = (posEnd - posStart) / elementCount;
 
@@ -1829,8 +1838,8 @@ L.SheetDimension = L.Class.extend({
 		this._outlines.forEachGroupInRange(this._viewStartIndex, this._viewEndIndex,
 			function (levelIdx, groupIdx, start, end, hidden) {
 
-				var startElementData = dimensionObj.getElementData(start, true /* device pixels */);
-				var endElementData = dimensionObj.getElementData(end, true /* device pixels */);
+				var startElementData = dimensionObj.getElementData(start, true /* core pixels */);
+				var endElementData = dimensionObj.getElementData(end, true /* core pixels */);
 				groupsData.push({
 					level: (levelIdx + 1).toString(),
 					index: groupIdx.toString(),
@@ -1892,9 +1901,9 @@ L.SheetDimension = L.Class.extend({
 		var startData = this._getElementDataAnyFromSpanByIndex(startElement.index, startElement.span, 'tiletwips');
 		if (posStartPT === posEndPT) {
 			// range is hidden, send a minimal sized tile-twips range.
-			// Set the size = twips equivalent of 1 device pixel,
+			// Set the size = twips equivalent of 1 core pixel,
 			// to imitate what core does when it sends cursor/ranges in tile-twips coordinates.
-			var rangeSize = Math.floor(this._twipsPerCSSPixel / this._devPixelsPerCssPixel);
+			var rangeSize = Math.floor(this._twipsPerCSSPixel / this._corePixelsPerCssPixel);
 			return {
 				startpos: startData.startpos,
 				endpos: startData.startpos + rangeSize
@@ -1927,7 +1936,7 @@ L.SheetDimension = L.Class.extend({
 	isUnitSupported: function (unitName) {
 		return (
 			unitName === 'csspixels' ||
-			unitName === 'devpixels' ||
+			unitName === 'corepixels' ||
 			unitName === 'tiletwips' ||
 			unitName === 'printtwips'
 		);
@@ -1939,8 +1948,8 @@ L.SheetDimension = L.Class.extend({
 
 		var origUnit = unit;
 
-		if (unit === 'devpixels') {
-			pos = (pos * this._twipsPerCSSPixel) / this._devPixelsPerCssPixel;
+		if (unit === 'corepixels') {
+			pos = (pos * this._twipsPerCSSPixel) / this._corePixelsPerCssPixel;
 			unit = 'tiletwips';
 		}
 		else if (unit === 'csspixels') {
@@ -1960,8 +1969,8 @@ L.SheetDimension = L.Class.extend({
 		console.assert(typeof pos === 'number', 'pos is not a number');
 		console.assert(this.isUnitSupported(unit), 'unit: ' + unit + ' is not supported');
 
-		if (unit === 'devpixels') {
-			pos = (pos * this._twipsPerCSSPixel) / this._devPixelsPerCssPixel;
+		if (unit === 'corepixels') {
+			pos = (pos * this._twipsPerCSSPixel) / this._corePixelsPerCssPixel;
 			unit = 'tiletwips';
 		}
 		else if (unit === 'csspixels') {
commit 4c8d35698d1ef19abcc0a0e3ac396afa74b30c01
Author:     Dennis Francis <dennis.francis at collabora.com>
AuthorDate: Mon Aug 24 22:31:16 2020 +0530
Commit:     Dennis Francis <dennis.francis at collabora.com>
CommitDate: Mon Aug 24 22:52:23 2020 +0530

    header canvases should resize with map-resize
    
    This is now safe as we update their contents on resize.
    
    Change-Id: Ie8b33e03e9b67de0f5c4d0e4822154032c171a70

diff --git a/loleaflet/css/spreadsheet.css b/loleaflet/css/spreadsheet.css
index c0c6b95e0..abf6cad98 100644
--- a/loleaflet/css/spreadsheet.css
+++ b/loleaflet/css/spreadsheet.css
@@ -130,6 +130,7 @@
 .spreadsheet-header-columns {
 	display: inline-block;
 	white-space: nowrap;
+	width: 100%;
 	height: 100%;
 	border-spacing: 0px !important;
 	position: relative;
@@ -172,6 +173,7 @@
 
 .spreadsheet-header-rows {
 	width: 100%;
+	height: 100%;
 	border-spacing: 0px !important;
 	position: relative;
 	margin: 0px;
commit e5b6df7953adeae2fd4b2628e8f9a11074ad3d1d
Author:     Dennis Francis <dennis.francis at collabora.com>
AuthorDate: Mon Aug 24 22:12:18 2020 +0530
Commit:     Dennis Francis <dennis.francis at collabora.com>
CommitDate: Mon Aug 24 22:52:23 2020 +0530

    setup the header canvases in the same way as the tile-canvas
    
    All drawings to it needs to in css pixels for now, because the
    mouse/touch handlers need positions in css pixels and the HeaderInfo
    datastructure has everything in css pixels.
    
    Moving the headers to the main-canvas needs more work but this change
    will help in doing that.
    
    Change-Id: I6a19e62a67b2b42975a51bb695db300ce493ba01

diff --git a/loleaflet/src/control/Control.ColumnHeader.js b/loleaflet/src/control/Control.ColumnHeader.js
index cbd73c919..53ae8b9f2 100644
--- a/loleaflet/src/control/Control.ColumnHeader.js
+++ b/loleaflet/src/control/Control.ColumnHeader.js
@@ -224,7 +224,8 @@ L.Control.ColumnHeader = L.Control.Header.extend({
 			return;
 
 		ctx.save();
-		var scale = L.getDpiScaleFactor();
+		var useExactDPR = this._map && (this._map._docLayer instanceof L.CanvasTileLayer);
+		var scale = L.getDpiScaleFactor(useExactDPR);
 		ctx.scale(scale, scale);
 		// background gradient
 		var selectionBackgroundGradient = null;
diff --git a/loleaflet/src/control/Control.Header.js b/loleaflet/src/control/Control.Header.js
index bb0d4433f..757cfd5c8 100644
--- a/loleaflet/src/control/Control.Header.js
+++ b/loleaflet/src/control/Control.Header.js
@@ -579,6 +579,7 @@ L.Control.Header = L.Control.extend({
 	},
 
 	_setCanvasSizeImpl: function (container, canvas, property, value, isCorner) {
+		var useExactDPR = this._map && (this._map._docLayer instanceof L.CanvasTileLayer);
 		if (!value) {
 			value = parseInt(L.DomUtil.getStyle(container, property));
 		}
@@ -586,7 +587,7 @@ L.Control.Header = L.Control.extend({
 			L.DomUtil.setStyle(container, property, value + 'px');
 		}
 
-		var scale = L.getDpiScaleFactor();
+		var scale = L.getDpiScaleFactor(useExactDPR);
 		if (property === 'width') {
 			canvas.width = value * scale;
 			if (!isCorner)
diff --git a/loleaflet/src/control/Control.RowHeader.js b/loleaflet/src/control/Control.RowHeader.js
index e39162ff2..32974d9e9 100644
--- a/loleaflet/src/control/Control.RowHeader.js
+++ b/loleaflet/src/control/Control.RowHeader.js
@@ -217,7 +217,8 @@ L.Control.RowHeader = L.Control.Header.extend({
 			return;
 
 		ctx.save();
-		var scale = L.getDpiScaleFactor();
+		var useExactDPR = this._map && (this._map._docLayer instanceof L.CanvasTileLayer);
+		var scale = L.getDpiScaleFactor(useExactDPR);
 		ctx.scale(scale, scale);
 		// background gradient
 		var selectionBackgroundGradient = null;
commit 362165181fbd1381b622168e27d5ba28b3ffa066
Author:     Dennis Francis <dennis.francis at collabora.com>
AuthorDate: Mon Aug 24 22:08:13 2020 +0530
Commit:     Dennis Francis <dennis.francis at collabora.com>
CommitDate: Mon Aug 24 22:52:23 2020 +0530

    fixup : use window.devicePixelRatio without rounding
    
    Change-Id: I8a35ce249b9e4b09ca90a4c811af6450678d91b0

diff --git a/loleaflet/src/core/Util.js b/loleaflet/src/core/Util.js
index eed99e752..e5f461cab 100644
--- a/loleaflet/src/core/Util.js
+++ b/loleaflet/src/core/Util.js
@@ -159,17 +159,11 @@ L.Util = {
 	// minimal image URI, set to an image when disposing to flush memory
 	emptyImageUrl: 'data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=',
 
-	getDpiScaleFactor: function() {
-		var dpiScale = window.devicePixelRatio ? Math.ceil(window.devicePixelRatio) : 1;
-		if (dpiScale == 1 && L.Browser.retina) {
-			dpiScale = 2;
-		}
-
-		return dpiScale;
-	},
-
-	getCanvasScaleFactor: function() {
+	getDpiScaleFactor: function(useExactDPR) {
 		var dpiScale = window.devicePixelRatio ? window.devicePixelRatio : 1;
+		if (!useExactDPR)
+			dpiScale = Math.ceil(dpiScale);
+
 		if (dpiScale == 1 && L.Browser.retina) {
 			dpiScale = 2;
 		}
@@ -275,7 +269,6 @@ L.stamp = L.Util.stamp;
 L.setOptions = L.Util.setOptions;
 L.round = L.Util.round;
 L.getDpiScaleFactor = L.Util.getDpiScaleFactor;
-L.getCanvasScaleFactor = L.Util.getCanvasScaleFactor;
 L.toggleFullScreen = L.Util.toggleFullScreen;
 L.isEmpty = L.Util.isEmpty;
 L.mm100thToInch = L.Util.mm100thToInch;
diff --git a/loleaflet/src/layer/tile/CanvasTileLayer.js b/loleaflet/src/layer/tile/CanvasTileLayer.js
index e7f5e71f2..bbfe97058 100644
--- a/loleaflet/src/layer/tile/CanvasTileLayer.js
+++ b/loleaflet/src/layer/tile/CanvasTileLayer.js
@@ -44,7 +44,7 @@ L.CanvasTilePainter = L.Class.extend({
 		this._layer = layer;
 		this._canvas = this._layer._canvas;
 
-		var dpiScale = L.getCanvasScaleFactor();
+		var dpiScale = L.getDpiScaleFactor(true /* useExactDPR */);
 		this._dpiScale = dpiScale;
 
 		this._map = this._layer._map;
@@ -214,7 +214,7 @@ L.CanvasTilePainter = L.Class.extend({
 		var part = this._layer._selectedPart;
 		var newSplitPos = splitPanesContext ?
 		    splitPanesContext.getSplitPos(): this._splitPos;
-		var newDpiScale = L.getCanvasScaleFactor();
+		var newDpiScale = L.getDpiScaleFactor(true /* useExactDPR */);
 
 		var zoomChanged = (zoom !== this._lastZoom);
 		var partChanged = (part !== this._lastPart);
@@ -243,7 +243,7 @@ L.CanvasTilePainter = L.Class.extend({
 			return;
 
 		if (scaleChanged) {
-			this._dpiScale = L.getCanvasScaleFactor();
+			this._dpiScale = L.getDpiScaleFactor(true /* useExactDPR */);
 			console.log('DEBUG: scaleChanged : this._dpiScale = ' + this._dpiScale);
 		}
 
diff --git a/loleaflet/src/map/Map.js b/loleaflet/src/map/Map.js
index 946896e0c..c7c479b3d 100644
--- a/loleaflet/src/map/Map.js
+++ b/loleaflet/src/map/Map.js
@@ -456,7 +456,7 @@ L.Map = L.Evented.extend({
 	findNearestProductZoom: function (zoom) {
 		var clientZoomScale = Math.pow(1.2, (zoom - this.options.zoom));
 
-		var zoomScale = clientZoomScale * L.getCanvasScaleFactor();
+		var zoomScale = clientZoomScale * L.getDpiScaleFactor(true /* useExactDPR */);
 		var nearestZoom = Math.round((Math.log(zoomScale) / Math.log(1.2)) + this.options.zoom);
 		nearestZoom = this._limitZoom(nearestZoom);
 
commit b93ca884906d60601528db8a78ce46018baa8ddd
Author:     Dennis Francis <dennis.francis at collabora.com>
AuthorDate: Mon Aug 24 18:57:45 2020 +0530
Commit:     Dennis Francis <dennis.francis at collabora.com>
CommitDate: Mon Aug 24 22:52:23 2020 +0530

    fixup : 388ea7e6a grim hack try to get 1:1 pixels in canvas
    
    Change-Id: Icee2e212135fda43374dcca069e88f8428215fda

diff --git a/loleaflet/src/layer/tile/CanvasTileLayer.js b/loleaflet/src/layer/tile/CanvasTileLayer.js
index 4db84bd56..e7f5e71f2 100644
--- a/loleaflet/src/layer/tile/CanvasTileLayer.js
+++ b/loleaflet/src/layer/tile/CanvasTileLayer.js
@@ -288,8 +288,8 @@ L.CanvasTilePainter = L.Class.extend({
 			for (var j = tileRange.min.y; j <= tileRange.max.y; ++j) {
 				for (var i = tileRange.min.x; i <= tileRange.max.x; ++i) {
 					var coords = new L.TileCoordData(
-						i * ctx.tileSize,
-						j * ctx.tileSize,
+						i * ctx.tileSize.x,
+						j * ctx.tileSize.y,
 						zoom,
 						part);
 
commit de8b3053db424f19a864a75c1a034e95ae59c9f8
Author:     Dennis Francis <dennis.francis at collabora.com>
AuthorDate: Mon Aug 24 18:01:16 2020 +0530
Commit:     Dennis Francis <dennis.francis at collabora.com>
CommitDate: Mon Aug 24 22:52:23 2020 +0530

    fixup #2 - calc-canvas: make tile size fixed (256)
    
    Change-Id: Id5d5b8dad09a6d992a5273064d3626e6d1f03dae

diff --git a/loleaflet/src/layer/tile/CalcTileLayer.js b/loleaflet/src/layer/tile/CalcTileLayer.js
index 35eae4c14..3daa75e69 100644
--- a/loleaflet/src/layer/tile/CalcTileLayer.js
+++ b/loleaflet/src/layer/tile/CalcTileLayer.js
@@ -4,7 +4,8 @@
  */
 
 /* global */
-L.CalcTileLayer = (L.Browser.mobile ? L.TileLayer : L.CanvasTileLayer).extend({
+var BaseTileLayer = L.Browser.mobile ? L.TileLayer : L.CanvasTileLayer;
+L.CalcTileLayer = BaseTileLayer.extend({
 	options: {
 		// TODO: sync these automatically from SAL_LOK_OPTIONS
 		sheetGeometryDataEnabled: true,
@@ -81,7 +82,7 @@ L.CalcTileLayer = (L.Browser.mobile ? L.TileLayer : L.CanvasTileLayer).extend({
 		map.addControl(L.control.tabs());
 		map.addControl(L.control.columnHeader());
 		map.addControl(L.control.rowHeader());
-		L.TileLayer.prototype.onAdd.call(this, map);
+		BaseTileLayer.prototype.onAdd.call(this, map);
 
 		map.on('resize', function () {
 			if (this.isCursorVisible()) {
diff --git a/loleaflet/src/layer/tile/CanvasTileLayer.js b/loleaflet/src/layer/tile/CanvasTileLayer.js
index 5773f3c1d..4db84bd56 100644
--- a/loleaflet/src/layer/tile/CanvasTileLayer.js
+++ b/loleaflet/src/layer/tile/CanvasTileLayer.js
@@ -380,12 +380,12 @@ L.CanvasTileLayer = L.TileLayer.extend({
 		this._tileHeightPx = this.options.tileSize;
 		this._tilePixelScale = 1;
 
+		L.TileLayer.prototype.onAdd.call(this, map);
+
 		// FIXME: workaround for correcting initial zoom with dpiscale included.
 		// The one set during Map constructor is does not include dpiscale because
 		// there we don't have enough info to specialize for calc-canvas
 		map.setZoom(map.getZoom());
-
-		L.TileLayer.prototype.onAdd.call(this, map);
 	},
 
 	onRemove: function (map) {
commit 27d5247e875ced39f9c9c846d39039d3d606663e
Author:     Dennis Francis <dennis.francis at collabora.com>
AuthorDate: Mon Aug 24 17:59:45 2020 +0530
Commit:     Dennis Francis <dennis.francis at collabora.com>
CommitDate: Mon Aug 24 22:52:22 2020 +0530

    fixup: compute nearest zoomlevel with devpixelratio
    
    Change-Id: I2dcf080d931312baff32de94b0dbd0f138baa401

diff --git a/loleaflet/src/map/Map.js b/loleaflet/src/map/Map.js
index 0245423ba..946896e0c 100644
--- a/loleaflet/src/map/Map.js
+++ b/loleaflet/src/map/Map.js
@@ -464,17 +464,15 @@ L.Map = L.Evented.extend({
 	},
 
 	setZoom: function (zoom, options) {
+
+		if (this._docLayer instanceof L.CanvasTileLayer)
+			zoom = this.findNearestProductZoom(zoom);
+
 		if (!this._loaded) {
 			this._zoom = this._limitZoom(zoom);
 			return this;
 		}
 		if (this._docLayer && this._docLayer._docType === 'spreadsheet') {
-
-			if (this._docLayer instanceof L.CanvasTileLayer) {
-				console.log('DEBUG: setZoom : actual zoom code = ' + zoom);
-				zoom = this.findNearestProductZoom(zoom);
-				console.log('DEBUG: setZoom : nearest product-zoom code = ' + zoom);
-			}
 			// for spreadsheets, when the document is smaller than the viewing area
 			// we want it to be glued to the row/column headers instead of being centered
 			this._docLayer._checkSpreadSheetBounds(zoom);
commit ddeaf7ba28cf0cf3cd17b3807b9a39caf2184784
Author:     Dennis Francis <dennis.francis at collabora.com>
AuthorDate: Mon Aug 24 16:53:29 2020 +0530
Commit:     Dennis Francis <dennis.francis at collabora.com>
CommitDate: Mon Aug 24 22:52:22 2020 +0530

    fixup - calc-canvas: make tile size fixed (256)
    
    Change-Id: I59743ab85e03989c81aa2b6b8fc6af0f9dc3032a

diff --git a/loleaflet/src/layer/tile/CanvasTileLayer.js b/loleaflet/src/layer/tile/CanvasTileLayer.js
index ce1b14abf..5773f3c1d 100644
--- a/loleaflet/src/layer/tile/CanvasTileLayer.js
+++ b/loleaflet/src/layer/tile/CanvasTileLayer.js
@@ -376,8 +376,8 @@ L.CanvasTileLayer = L.TileLayer.extend({
 	onAdd: function (map) {
 
 		// Override L.TileLayer._tilePixelScale to 1 (independent of the device).
-		this._tileWidthPx = options.tileSize;
-		this._tileHeightPx = options.tileSize;
+		this._tileWidthPx = this.options.tileSize;
+		this._tileHeightPx = this.options.tileSize;
 		this._tilePixelScale = 1;
 
 		// FIXME: workaround for correcting initial zoom with dpiscale included.
commit f28fd185933688c331165e8f98b969f50b97b475
Author:     Dennis Francis <dennis.francis at collabora.com>
AuthorDate: Mon Aug 24 16:49:47 2020 +0530
Commit:     Dennis Francis <dennis.francis at collabora.com>
CommitDate: Mon Aug 24 22:52:22 2020 +0530

    compute nearest zoomlevel with devpixelratio included
    
    and use this for every setZoom call.
    
    Change-Id: I37f0d7503e4087f062576bc03b13bd8155c3c994

diff --git a/loleaflet/src/layer/tile/CanvasTileLayer.js b/loleaflet/src/layer/tile/CanvasTileLayer.js
index a819a2f94..ce1b14abf 100644
--- a/loleaflet/src/layer/tile/CanvasTileLayer.js
+++ b/loleaflet/src/layer/tile/CanvasTileLayer.js
@@ -380,6 +380,11 @@ L.CanvasTileLayer = L.TileLayer.extend({
 		this._tileHeightPx = options.tileSize;
 		this._tilePixelScale = 1;
 
+		// FIXME: workaround for correcting initial zoom with dpiscale included.
+		// The one set during Map constructor is does not include dpiscale because
+		// there we don't have enough info to specialize for calc-canvas
+		map.setZoom(map.getZoom());
+
 		L.TileLayer.prototype.onAdd.call(this, map);
 	},
 
diff --git a/loleaflet/src/map/Map.js b/loleaflet/src/map/Map.js
index 6f5677a26..0245423ba 100644
--- a/loleaflet/src/map/Map.js
+++ b/loleaflet/src/map/Map.js
@@ -452,12 +452,29 @@ L.Map = L.Evented.extend({
 		this._progressBar.end(this);
 	},
 
+	// Compute the nearest zoom level corresponding to the effective zoom-scale (ie, with dpiscale included).
+	findNearestProductZoom: function (zoom) {
+		var clientZoomScale = Math.pow(1.2, (zoom - this.options.zoom));
+
+		var zoomScale = clientZoomScale * L.getCanvasScaleFactor();
+		var nearestZoom = Math.round((Math.log(zoomScale) / Math.log(1.2)) + this.options.zoom);
+		nearestZoom = this._limitZoom(nearestZoom);
+
+		return nearestZoom;
+	},
+
 	setZoom: function (zoom, options) {
 		if (!this._loaded) {
 			this._zoom = this._limitZoom(zoom);
 			return this;
 		}
 		if (this._docLayer && this._docLayer._docType === 'spreadsheet') {
+
+			if (this._docLayer instanceof L.CanvasTileLayer) {
+				console.log('DEBUG: setZoom : actual zoom code = ' + zoom);
+				zoom = this.findNearestProductZoom(zoom);
+				console.log('DEBUG: setZoom : nearest product-zoom code = ' + zoom);
+			}
 			// for spreadsheets, when the document is smaller than the viewing area
 			// we want it to be glued to the row/column headers instead of being centered
 			this._docLayer._checkSpreadSheetBounds(zoom);
commit 67ed345be0a1890eafd6a4c1ec2f4adbcc8cf9d4
Author:     Dennis Francis <dennis.francis at collabora.com>
AuthorDate: Mon Aug 24 15:50:44 2020 +0530
Commit:     Dennis Francis <dennis.francis at collabora.com>
CommitDate: Mon Aug 24 22:52:22 2020 +0530

    calc-canvas: make tile size fixed (256) for every device
    
    Change-Id: I4e00b8b43f73f001a8bcfc77931f5fa22982642e

diff --git a/loleaflet/src/layer/tile/CanvasTileLayer.js b/loleaflet/src/layer/tile/CanvasTileLayer.js
index 84e5e27d1..a819a2f94 100644
--- a/loleaflet/src/layer/tile/CanvasTileLayer.js
+++ b/loleaflet/src/layer/tile/CanvasTileLayer.js
@@ -373,6 +373,16 @@ L.CanvasTileLayer = L.TileLayer.extend({
 		return false;
 	},
 
+	onAdd: function (map) {
+
+		// Override L.TileLayer._tilePixelScale to 1 (independent of the device).
+		this._tileWidthPx = options.tileSize;
+		this._tileHeightPx = options.tileSize;
+		this._tilePixelScale = 1;
+
+		L.TileLayer.prototype.onAdd.call(this, map);
+	},
+
 	onRemove: function (map) {
 		this._painter.dispose();
 		L.TileLayer.prototype.onRemove.call(this, map);
commit 01b1d4d3a245defbd1a79f3f14dd1d30a04fe76a
Author:     Dennis Francis <dennis.francis at collabora.com>
AuthorDate: Mon Aug 24 15:34:30 2020 +0530
Commit:     Dennis Francis <dennis.francis at collabora.com>
CommitDate: Mon Aug 24 22:52:22 2020 +0530

    use window.devicePixelRatio without rounding
    
    at least for the canvas tile layer.
    
    Change-Id: Ia830cad1fe0aaac6df03288cc1ee9e0371ef6f47

diff --git a/loleaflet/src/core/Util.js b/loleaflet/src/core/Util.js
index 596dfa756..eed99e752 100644
--- a/loleaflet/src/core/Util.js
+++ b/loleaflet/src/core/Util.js
@@ -168,6 +168,15 @@ L.Util = {
 		return dpiScale;
 	},
 
+	getCanvasScaleFactor: function() {
+		var dpiScale = window.devicePixelRatio ? window.devicePixelRatio : 1;
+		if (dpiScale == 1 && L.Browser.retina) {
+			dpiScale = 2;
+		}
+
+		return dpiScale;
+	},
+
 	toggleFullScreen: function() {
 		if (!document.fullscreenElement &&
 			!document.mozFullscreenElement &&
@@ -266,6 +275,7 @@ L.stamp = L.Util.stamp;
 L.setOptions = L.Util.setOptions;
 L.round = L.Util.round;
 L.getDpiScaleFactor = L.Util.getDpiScaleFactor;
+L.getCanvasScaleFactor = L.Util.getCanvasScaleFactor;
 L.toggleFullScreen = L.Util.toggleFullScreen;
 L.isEmpty = L.Util.isEmpty;
 L.mm100thToInch = L.Util.mm100thToInch;
diff --git a/loleaflet/src/layer/tile/CanvasTileLayer.js b/loleaflet/src/layer/tile/CanvasTileLayer.js
index 94937e047..84e5e27d1 100644
--- a/loleaflet/src/layer/tile/CanvasTileLayer.js
+++ b/loleaflet/src/layer/tile/CanvasTileLayer.js
@@ -44,7 +44,7 @@ L.CanvasTilePainter = L.Class.extend({
 		this._layer = layer;
 		this._canvas = this._layer._canvas;
 
-		var dpiScale = L.getDpiScaleFactor();
+		var dpiScale = L.getCanvasScaleFactor();
 		this._dpiScale = dpiScale;
 
 		this._map = this._layer._map;
@@ -214,7 +214,7 @@ L.CanvasTilePainter = L.Class.extend({
 		var part = this._layer._selectedPart;
 		var newSplitPos = splitPanesContext ?
 		    splitPanesContext.getSplitPos(): this._splitPos;
-		var newDpiScale = L.getDpiScaleFactor();
+		var newDpiScale = L.getCanvasScaleFactor();
 
 		var zoomChanged = (zoom !== this._lastZoom);
 		var partChanged = (part !== this._lastPart);
@@ -242,8 +242,10 @@ L.CanvasTilePainter = L.Class.extend({
 		if (skipUpdate)
 			return;
 
-		if (scaleChanged)
-			this._dpiScale = L.getDpiScaleFactor();
+		if (scaleChanged) {
+			this._dpiScale = L.getCanvasScaleFactor();
+			console.log('DEBUG: scaleChanged : this._dpiScale = ' + this._dpiScale);
+		}
 
 		if (resizeCanvas || scaleChanged) {
 			this._setCanvasSize(newSize.x, newSize.y);


More information about the Libreoffice-commits mailing list