diff options
| author | Pranam Lashkari <lpranam@collabora.com> | 2020-08-09 23:50:30 +0530 |
|---|---|---|
| committer | Andras Timar <andras.timar@collabora.com> | 2020-09-02 21:00:53 +0200 |
| commit | 2ba27901d6477e449319ec8ca4e8652c71ef5599 (patch) | |
| tree | bbc497beb315019686a20e97278df14175bbfa4a | |
| parent | tdf#133284: Improve hardware and on-screen keyboard in the iOS app (diff) | |
| download | online-cp-4.2.8-1.tar.gz online-cp-4.2.8-1.zip | |
leaflet: hyperlink popup will not displace the view
cp-4.2.8-1
hyperlink popups always opend above the links
when it did not fit into the view it would scroll
this scrolling caused problem in calc by messing the grid
now popup will not trigger the scroll
and would be adjusted to fit in view
Change-Id: I6c886e0dc57b010db16f51baed0e7a0465e52d4f
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/101863
Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice@gmail.com>
Reviewed-by: Andras Timar <andras.timar@collabora.com>
| -rw-r--r-- | loleaflet/src/layer/tile/TileLayer.js | 31 |
1 files changed, 30 insertions, 1 deletions
diff --git a/loleaflet/src/layer/tile/TileLayer.js b/loleaflet/src/layer/tile/TileLayer.js index cba7cf179f..ba0157ac78 100644 --- a/loleaflet/src/layer/tile/TileLayer.js +++ b/loleaflet/src/layer/tile/TileLayer.js @@ -1207,13 +1207,42 @@ L.TileLayer = L.GridLayer.extend({ _showURLPopUp: function(position, url) { // # for internal links if (!url.startsWith('#')) { - this._map.hyperlinkPopup = new L.Popup({className: 'hyperlink-popup', closeButton: false, closeOnClick: false}) + this._map.hyperlinkPopup = new L.Popup({className: 'hyperlink-popup', closeButton: false, closeOnClick: false, autoPan: false}) .setContent('<a href="' + url + '" target="_blank">' + url + '</a>') .setLatLng(position) .openOn(this._map); + var offsetDiffTop = $('.hyperlink-popup').offset().top - $('#map').offset().top; + var offsetDiffLeft = $('.hyperlink-popup').offset().left - $('#map').offset().left; + if (offsetDiffTop < 10) this._movePopUpBelow(); + if (offsetDiffLeft < 10) this._movePopUpRight(); } }, + _movePopUpBelow: function() { + var popUp = $('.hyperlink-popup').first(); + var pixBounds = L.bounds(this._map.latLngToLayerPoint(this._visibleCursor.getSouthWest()), + this._map.latLngToLayerPoint(this._visibleCursor.getNorthEast())); + var cursorSize = pixBounds.getSize().multiplyBy(this._map.getZoomScale(this._map.getZoom())); + var bottom = cursorSize.y + popUp.height(); + + popUp.css({ + 'bottom': bottom ? -bottom + 'px': '', + 'display': 'flex', + 'flex-direction': 'column-reverse' + }); + $('.leaflet-popup-tip-container').first().css('transform', 'rotate(180deg)'); + }, + + _movePopUpRight: function() { + $('.leaflet-popup-content-wrapper').first().css({ + 'position': 'relative', + 'left': this._map.hyperlinkPopup._containerLeft * -1 + }); + $('.leaflet-popup-tip-container').first().css({ + 'left': '25px' + }); + }, + _closeURLPopUp: function() { this._map.closePopup(this._map.hyperlinkPopup); this._map.hyperlinkPopup = null; |