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.fran...@collabora.com> AuthorDate: Mon Aug 24 22:34:27 2020 +0530 Commit: Dennis Francis <dennis.fran...@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.fran...@collabora.com> AuthorDate: Mon Aug 24 22:31:16 2020 +0530 Commit: Dennis Francis <dennis.fran...@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.fran...@collabora.com> AuthorDate: Mon Aug 24 22:12:18 2020 +0530 Commit: Dennis Francis <dennis.fran...@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.fran...@collabora.com> AuthorDate: Mon Aug 24 22:08:13 2020 +0530 Commit: Dennis Francis <dennis.fran...@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.fran...@collabora.com> AuthorDate: Mon Aug 24 18:57:45 2020 +0530 Commit: Dennis Francis <dennis.fran...@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.fran...@collabora.com> AuthorDate: Mon Aug 24 18:01:16 2020 +0530 Commit: Dennis Francis <dennis.fran...@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.fran...@collabora.com> AuthorDate: Mon Aug 24 17:59:45 2020 +0530 Commit: Dennis Francis <dennis.fran...@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.fran...@collabora.com> AuthorDate: Mon Aug 24 16:53:29 2020 +0530 Commit: Dennis Francis <dennis.fran...@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.fran...@collabora.com> AuthorDate: Mon Aug 24 16:49:47 2020 +0530 Commit: Dennis Francis <dennis.fran...@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.fran...@collabora.com> AuthorDate: Mon Aug 24 15:50:44 2020 +0530 Commit: Dennis Francis <dennis.fran...@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.fran...@collabora.com> AuthorDate: Mon Aug 24 15:34:30 2020 +0530 Commit: Dennis Francis <dennis.fran...@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); _______________________________________________ Libreoffice-commits mailing list libreoffice-comm...@lists.freedesktop.org https://lists.freedesktop.org/mailman/listinfo/libreoffice-commits