displayed grid: avoid ui elements

This commit is contained in:
Laura Klünder 2018-12-12 02:33:03 +01:00
parent 0dbbcbb749
commit ae3a9c7492
2 changed files with 20 additions and 8 deletions

View file

@ -760,7 +760,7 @@ body:not(.mobileclient) .leaflet-control-user-location a {
border-width: 1px 0 0; border-width: 1px 0 0;
} }
.c3nav-grid-row span { .c3nav-grid-row span {
padding: 2px 0; padding: 0 5px;
} }
.c3nav-grid-column { .c3nav-grid-column {
top: 0; top: 0;
@ -768,8 +768,11 @@ body:not(.mobileclient) .leaflet-control-user-location a {
flex-direction: column; flex-direction: column;
border-width: 0 0 0 1px; border-width: 0 0 0 1px;
} }
.c3nav-grid-row span { .c3nav-grid-column span {
padding: 0 2px; padding: 5px 0;
}
.c3nav-grid-column.avoid-top {
padding-top: 65px;
} }

View file

@ -1533,30 +1533,37 @@ L.SquareGridLayer = L.Layer.extend({
this._updateGrid(map); this._updateGrid(map);
map.on('viewreset zoom move toomend moveend', this._update, this); map.on('viewreset zoom move zoomend moveend', this._update, this);
}, },
onRemove: function(map) { onRemove: function(map) {
L.DomUtil.remove(this._container); L.DomUtil.remove(this._container);
map.off('viewreset zoom move toomend moveend', this._update, this); map.off('viewreset zoom move zoomend moveend', this._update, this);
}, },
_update: function(e) { _update: function(e) {
console.log(e);
this._updateGrid(e.target); this._updateGrid(e.target);
}, },
_updateGrid: function(map) { _updateGrid: function(map) {
var mapSize = map.getSize(), coord = null, lastCoord = null, size; var mapSize = map.getSize(),
sidebarStart = $('#sidebar').outerWidth() + 15,
attributionStart = mapSize.x - $('.leaflet-control-attribution').outerWidth() - 16,
bottomRightStart = mapSize.y - $('.leaflet-bottom.leaflet-right').outerHeight() - 24,
coord = null, lastCoord = null, size, center;
console.log(bottomRightStart);
for(i=0;i<this.config.cols.length;i++) { for(i=0;i<this.config.cols.length;i++) {
coord = map.latLngToContainerPoint([0, this.config.cols[i]], map.getZoom()).x; coord = map.latLngToContainerPoint([0, this.config.cols[i]], map.getZoom()).x;
coord = Math.min(mapSize.x, Math.max(-1, coord)); coord = Math.min(mapSize.x, Math.max(-1, coord));
this.cols[i].style.left = coord+'px'; this.cols[i].style.left = coord+'px';
if (i>0) { if (i>0) {
size = coord-lastCoord; size = coord-lastCoord;
center = (lastCoord+coord)/2;
if (size > 0) { if (size > 0) {
this.cols[i - 1].style.display = ''; this.cols[i - 1].style.display = '';
this.cols[i - 1].style.width = size+'px'; this.cols[i - 1].style.width = size + 'px';
this.cols[i - 1].style.paddingTop = Math.max(0, Math.min(65, (sidebarStart-center)/15*65)) + 'px';
this.cols[i - 1].style.paddingBottom = Math.max(0, Math.min(16, (center-attributionStart))) + 'px';
} else { } else {
this.cols[i - 1].style.display = 'none'; this.cols[i - 1].style.display = 'none';
} }
@ -1569,9 +1576,11 @@ L.SquareGridLayer = L.Layer.extend({
this.rows[i].style.top = coord+'px'; this.rows[i].style.top = coord+'px';
if (i>0) { if (i>0) {
size = lastCoord-coord; size = lastCoord-coord;
center = (lastCoord+coord)/2;
if (size > 0) { if (size > 0) {
this.rows[i].style.display = ''; this.rows[i].style.display = '';
this.rows[i].style.height = (lastCoord-coord)+'px'; this.rows[i].style.height = (lastCoord-coord)+'px';
this.rows[i].style.paddingRight = Math.max(0, Math.min(36, (center-bottomRightStart)*2)) + 'px';
} else { } else {
this.rows[i].style.display = 'none'; this.rows[i].style.display = 'none';
} }