loleaflet/Makefile.am | 1
loleaflet/src/core/Socket.js | 7 -
loleaflet/src/layer/CalcGridLines.js | 112 ----------------------------
loleaflet/src/layer/tile/CalcTileLayer.js | 101 +++++++++++++++++++++++--
loleaflet/src/layer/tile/CanvasTileLayer.js | 26 ++++--
loleaflet/src/map/Map.js | 1
6 files changed, 111 insertions(+), 137 deletions(-)
New commits:
commit 6c1d69e248e36c2afc9499bcacbf5750d47e19c6
Author: Michael Meeks <michael.me...@collabora.com>
AuthorDate: Wed Sep 9 22:47:14 2020 +0100
Commit: Michael Meeks <michael.me...@collabora.com>
CommitDate: Wed Sep 9 22:47:14 2020 +0100
calc canvas: remove svg grid-line background layer.
occluded by opaque canvas above it anyway.
Change-Id: I954da92c43ae680e6041cbff6092f9a2ac71ebe2
diff --git a/loleaflet/Makefile.am b/loleaflet/Makefile.am
index 44c4886fa..62036d993 100644
--- a/loleaflet/Makefile.am
+++ b/loleaflet/Makefile.am
@@ -221,7 +221,6 @@ LOLEAFLET_JS =\
src/layer/marker/Marker.Popup.js \
src/layer/LayerGroup.js \
src/layer/FeatureGroup.js \
- src/layer/CalcGridLines.js \
src/layer/vector/Renderer.js \
src/layer/vector/Path.js \
src/layer/vector/Path.Popup.js \
diff --git a/loleaflet/src/core/Socket.js b/loleaflet/src/core/Socket.js
index fa78bf1a3..473c85ce5 100644
--- a/loleaflet/src/core/Socket.js
+++ b/loleaflet/src/core/Socket.js
@@ -994,13 +994,6 @@ L.Socket = L.Class.extend({
tileHeightTwips: tileHeightTwips,
docType: command.type
});
-
- this._map.options.backgroundLayerEnabled =
!(docLayer instanceof L.CanvasTileLayer);
-
- if (this._map.options.backgroundLayerEnabled) {
- docLayer.backgroundLayer = new
L.CalcBackground().addTo(this._map);
- (new
L.CalcGridLines()).addTo(this._map);
- }
}
else {
if (command.type === 'presentation' &&
diff --git a/loleaflet/src/layer/CalcGridLines.js
b/loleaflet/src/layer/CalcGridLines.js
deleted file mode 100644
index fce802101..000000000
--- a/loleaflet/src/layer/CalcGridLines.js
+++ /dev/null
@@ -1,112 +0,0 @@
-/*
- * A Leaflet layer that draws grid lines for spreadsheet row/column separators.
- */
-
-L.CalcGridLines = L.LayerGroup.extend({
- // Options given to L.CalcGridLines will be propagated into the spawned
- // L.PolyLines. Default is thin grey lines.
- options: {
- color: '#c0c0c0',
- weight: 1,
- interactive: false
- },
-
-
- initialize: function(options) {
- L.LayerGroup.prototype.initialize.call(this, options);
- this._rowLines = L.layerGroup();
- this._colLines = L.layerGroup();
- },
-
- onAdd: function(map) {
-
- // The SVG renderer needs some specific customizations
- if (!this.options.renderer) {
- map.createPane('calc-background');
-
- this.options.renderer = new L.SVG({
- pane: 'calc-background'
- });
-
- // Hack the _updatePoly private method so it offsets
all SVG path coordinates
- // to 0.5. This makes the rendered lines align to the
screen pixel grid
- // nicely (at least in non-HPI screens)
- this.options.renderer._updatePoly = function(layer,
closed) {
- var str = '', i, j, len, len2, points, p, rings
= layer._parts;
-
- for (i = 0, len = rings.length; i < len; i++) {
- points = rings[i];
-
- for (j = 0, len2 = points.length; j <
len2; j++) {
- p = points[j];
- str += (j ? 'L' : 'M') +
(Math.ceil(p.x) - 0.5) + ' ' + (Math.ceil(p.y) - 0.5);
- }
-
- // closes the ring for polygons; "x" is
VML syntax
- str += closed ? (L.Browser.svg ? 'z' :
'x') : '';
- }
-
- // SVG complains about empty path strings
- if (str === '') {
- str = 'M0 0';
- }
-
- this._setPath(layer, str, closed);
- }.bind(this.options.renderer);
- }
-
- this._map.on('viewrowcolumnheaders', this.onUpdate, this);
-
- this.addLayer(this._rowLines);
- this.addLayer(this._colLines);
-
- },
-
- remove: function() {
- this._map.off('viewrowcolumnheaders', this.onUpdate, this);
-
- this.removeLayer(this._rowLines);
- this.removeLayer(this._colLines);
- },
-
- // Redraw col/row lines whenever new information about them is
available.
- // One websocket message might have info about cols, rows, or both
- onUpdate: function onUpdate(ev) {
- var headerInfo, pos;
-
- // Aux stuff to convert css pixels to map coordinate units
- var pixelToMapUnitRatio =
this._map.options.crs.scale(this._map.getZoom());
-
- if (ev.updatecolumns) {
- headerInfo = new L.Control.Header.HeaderInfo(this._map,
true /* isCol */);
- this._colLines.clearLayers();
-
- headerInfo.forEachElement(function(columnData) {
- pos = headerInfo.headerToDocPos(columnData.pos)
/ pixelToMapUnitRatio;
- this._colLines.addLayer(
- L.polyline([[[ L.Util.MIN_SAFE_INTEGER,
pos ],[ L.Util.MAX_SAFE_INTEGER, pos ]]],
- this.options
- )
- );
- }.bind(this));
- }
-
- if (ev.updaterows) {
- headerInfo = new L.Control.Header.HeaderInfo(this._map,
false /* isCol */);
- this._rowLines.clearLayers();
-
- headerInfo.forEachElement(function(rowData) {
- pos = headerInfo.headerToDocPos(rowData.pos) /
pixelToMapUnitRatio;
- this._rowLines.addLayer(
- // Note that y-coordinates are
inverted: Leaflet's CRS.Simple assumes
- // down = negative latlngs, whereas
loolkit assumes down = positive twips
- L.polyline([[[ -pos,
L.Util.MIN_SAFE_INTEGER ],[ -pos, L.Util.MAX_SAFE_INTEGER ]]],
- this.options
- )
- );
- }.bind(this));
- }
- }
-
-});
-
diff --git a/loleaflet/src/map/Map.js b/loleaflet/src/map/Map.js
index 673af34b8..312fbd45b 100644
--- a/loleaflet/src/map/Map.js
+++ b/loleaflet/src/map/Map.js
@@ -42,7 +42,6 @@ L.Map = L.Evented.extend({
urlPrefix: 'lool',
wopiSrc: '',
cursorURL: L.LOUtil.getURL('cursors'),
- backgroundLayerEnabled: true,
},
// Control.UIManager instance, set in main.js
commit f9f07d165357bb9e431371a77874aed0932e0404
Author: Michael Meeks <michael.me...@collabora.com>
AuthorDate: Wed Sep 9 10:05:44 2020 +0100
Commit: Michael Meeks <michael.me...@collabora.com>
CommitDate: Wed Sep 9 22:43:22 2020 +0100
calc canvas: start of direct grid rendering.
Change-Id: If471fc4ff94b3cb8e2897ac76e712aa3958fc7d2
diff --git a/loleaflet/src/layer/tile/CalcTileLayer.js
b/loleaflet/src/layer/tile/CalcTileLayer.js
index fc96f0546..7cf1318a7 100644
--- a/loleaflet/src/layer/tile/CalcTileLayer.js
+++ b/loleaflet/src/layer/tile/CalcTileLayer.js
@@ -735,6 +735,67 @@ L.CalcTileLayer = L.CanvasTileLayer.extend({
converter: this._twipsToPixels,
context: this
});
+ var that = this;
+ this._painter.renderBackground = function(canvas, ctx)
+ {
+ if (this._layer._debug)
+ this._canvasCtx.fillStyle = 'rgba(255, 0, 0,
0.5)';
+ else
+ this._canvasCtx.fillStyle = 'white'; // FIXME:
sheet bg color
+ this._canvasCtx.fillRect(0, 0, ctx.canvasSize.x,
ctx.canvasSize.y);
+
+ if (that._debug)
+ canvas.strokeStyle = 'blue';
+ else // now fr some grid-lines ...
+ canvas.strokeStyle = '#c0c0c0';
+ canvas.lineWidth = 1.0;
+
+ canvas.beginPath();
+ for (var i = 0; i < ctx.paneBoundsList.length; ++i) {
+ // FIXME: de-duplicate before firing myself:
+
+ // co-ordinates of this pane in core document
pixels
+ var paneBounds =
that._cssBoundsToCore(ctx.paneBoundsList[i]);
+ // co-ordinates of the main-(bottom right) pane
in core document pixels
+ var viewBounds =
that._cssBoundsToCore(ctx.viewBounds);
+ // into real pixel-land ...
+ paneBounds.round();
+ viewBounds.round();
+
+ var paneOffset = paneBounds.getTopLeft(); //
allocates
+ // Cute way to detect the in-canvas pixel
offset of each pane
+ paneOffset.x = Math.min(paneOffset.x,
viewBounds.min.x);
+ paneOffset.y = Math.min(paneOffset.y,
viewBounds.min.y);
+
+ // when using the pinch to zoom, set additional
translation based */
+ // on the pinch movement
+ if (that._map._animatingZoom) {
+ var centerOffset =
this._map._getCenterOffset(this._map._animateToCenter);
+ paneOffset.x +=
Math.round(centerOffset.x);
+ paneOffset.y +=
Math.round(centerOffset.y);
+ }
+
+ // URGH -> zooming etc. (!?) ...
+ if (that.sheetGeometry._columns)
+
that.sheetGeometry._columns.forEachInCorePixelRange(
+ paneBounds.min.x,
paneBounds.max.x,
+ function(pos) {
+ canvas.moveTo(pos -
paneOffset.x - 0.5, paneBounds.min.y - paneOffset.y - 0.5);
+ canvas.lineTo(pos -
paneOffset.x - 0.5, paneBounds.max.y - paneOffset.y - 0.5);
+ canvas.stroke();
+ });
+
+ if (that.sheetGeometry._rows)
+
that.sheetGeometry._rows.forEachInCorePixelRange(
+ paneBounds.min.y,
paneBounds.max.y,
+ function(pos) {
+
canvas.moveTo(paneBounds.min.x - paneOffset.x - 0.5, pos - paneOffset.y - 0.5);
+
canvas.lineTo(paneBounds.max.x - paneOffset.x - 0.5, pos - paneOffset.y - 0.5);
+ canvas.stroke();
+ });
+ }
+ canvas.closePath();
+ };
},
_handleSheetGeometryDataMsg: function (jsonMsgObj) {
@@ -912,12 +973,15 @@ L.CalcTileLayer = L.CanvasTileLayer.extend({
comment.tab = parseInt(comment.tab);
comment.cellPos =
L.LOUtil.stringToBounds(comment.cellPos);
comment.cellPos =
L.latLngBounds(this._twipsToLatLng(comment.cellPos.getBottomLeft()),
-
this._twipsToLatLng(comment.cellPos.getTopRight()));
- var annotation =
this._annotations[comment.tab][comment.id];
- if (annotation) {
-
annotation.setLatLngBounds(comment.cellPos);
- if (annotation.mark) {
-
annotation.mark.setLatLng(comment.cellPos.getNorthEast());
+
this._twipsToLatLng(comment.cellPos.getTopRight()));
+ if (this._annotations &&
this._annotations[comment.tab])
+ {
+ var annotation =
this._annotations[comment.tab][comment.id];
+ if (annotation) {
+
annotation.setLatLngBounds(comment.cellPos);
+ if (annotation.mark) {
+
annotation.mark.setLatLng(comment.cellPos.getNorthEast());
+ }
}
}
}
@@ -1767,6 +1831,25 @@ L.SheetDimension = L.Class.extend({
});
},
+ // callback with a position for each grid line in this pixel range
+ forEachInCorePixelRange: function(startPix, endPix, callback) {
+ this._visibleSizes.forEachSpan(function (spanData) {
+ // do we overlap ?
+ var spanFirstCorePx = spanData.data.poscorepx -
+ (spanData.data.sizecore * (spanData.end -
spanData.start + 1));
+ if (spanFirstCorePx < endPix && spanData.data.poscorepx
> startPix)
+ {
+ var firstCorePx = startPix +
spanData.data.sizecore -
+ ((startPix - spanFirstCorePx) %
spanData.data.sizecore);
+ var lastCorePx = Math.min(endPix,
spanData.data.poscorepx);
+
+ for (var pos = firstCorePx; pos <= lastCorePx;
pos += spanData.data.sizecore) {
+ callback(pos);
+ }
+ }
+ });
+ },
+
// computes element index from tile-twips position and returns
// an object with this index and the span data.
_getSpanAndIndexFromTileTwipsPos: function (pos) {
@@ -2147,6 +2230,12 @@ L.SpanList = L.Class.extend({
}
},
+ forEachSpan: function(callback) {
+ for (var id = 0; id < this._spanlist.length; ++id) {
+ callback(this._getSpanData(id));
+ }
+ },
+
_getSpanData: function (spanid) {
var span = this._spanlist[spanid];
diff --git a/loleaflet/src/layer/tile/CanvasTileLayer.js
b/loleaflet/src/layer/tile/CanvasTileLayer.js
index ab7850853..e60042334 100644
--- a/loleaflet/src/layer/tile/CanvasTileLayer.js
+++ b/loleaflet/src/layer/tile/CanvasTileLayer.js
@@ -91,7 +91,6 @@ L.CanvasTilePainter = L.Class.extend({
this._canvasCtx.imageSmoothingEnabled = false;
this._canvasCtx.msImageSmoothingEnabled = false;
var mapSize = this._map.getPixelBounds().getSize();
- this._lastSize = mapSize;
this._lastMapSize = mapSize;
this._setCanvasSize(mapSize.x, mapSize.y);
this._canvasCtx.setTransform(1,0,0,1,0,0);
@@ -116,6 +115,8 @@ L.CanvasTilePainter = L.Class.extend({
this._height = parseInt(this._canvas.style.height);
this.clear();
this._syncTileContainerSize();
+
+ this._lastSize = new L.Point(widthCSSPx, heightCSSPx);
},
canvasDPIScale: function () {
@@ -148,13 +149,13 @@ L.CanvasTilePainter = L.Class.extend({
splitPanesContext.getPxBoundList(viewBounds) :
[viewBounds];
- return { tileSize: tileSize,
+ return { canvasSize: this._lastSize,
+ tileSize: tileSize,
viewBounds: viewBounds,
paneBoundsList: paneBoundsList };
},
paint: function (tile, ctx) {
-
if (!ctx)
ctx = this._paintContext();
@@ -251,9 +252,9 @@ L.CanvasTilePainter = L.Class.extend({
var mapSizeChanged = !newMapSize.equals(this._lastMapSize);
// To avoid flicker, only resize the canvas element if width or
height of the map increases.
- var newSize = new L.Point(Math.max(newMapSize.x,
this._lastSize.x),
- Math.max(newMapSize.y, this._lastSize.y));
- var resizeCanvas = !newSize.equals(this._lastSize);
+ var newSize = new L.Point(Math.max(newMapSize.x, this._lastSize
? this._lastSize.x : 0),
+ Math.max(newMapSize.y, this._lastSize
? this._lastSize.y : 0));
+ var resizeCanvas = !this._lastSize ||
!newSize.equals(this._lastSize);
var topLeftChanged = this._topLeft === undefined ||
!newTopLeft.equals(this._topLeft);
var splitPosChanged = !newSplitPos.equals(this._splitPos);
@@ -273,7 +274,6 @@ L.CanvasTilePainter = L.Class.extend({
if (resizeCanvas || scaleChanged) {
this._setCanvasSize(newSize.x, newSize.y);
- this._lastSize = newSize;
}
else if (mapSizeChanged && topLeftChanged) {
this.clear();
@@ -298,14 +298,16 @@ L.CanvasTilePainter = L.Class.extend({
_paintWholeCanvas: function () {
- if (this._layer._debug)
- this.clear();
-
var zoom = this._lastZoom || Math.round(this._map.getZoom());
var part = this._lastPart || this._layer._selectedPart;
// Calculate all this here intead of doing it per tile.
var ctx = this._paintContext();
+
+ // First render the background / sheet grid if we can
+ if (this.renderBackground)
+ this.renderBackground(this._canvasCtx, ctx);
+
var tileRanges =
ctx.paneBoundsList.map(this._layer._pxBoundsToTileRange, this._layer);
for (var rangeIdx = 0; rangeIdx < tileRanges.length;
++rangeIdx) {
@@ -331,6 +333,10 @@ L.CanvasTilePainter = L.Class.extend({
}
}
}
+
+ // Render on top to check matchup
+ if (this._layer._debug && this.renderBackground)
+ this.renderBackground(this._canvasCtx, ctx);
},
});
_______________________________________________
Libreoffice-commits mailing list
libreoffice-comm...@lists.freedesktop.org
https://lists.freedesktop.org/mailman/listinfo/libreoffice-commits
