Skip to content

Commit ad50017

Browse files
axeluhlCopilot
andcommitted
maplibre-runtime-loader: start MapLibre attribution control collapsed
MapLibre's AttributionControl with compact:true still opens expanded once attributions populate (on styledata/sourcedata), because _updateCompact adds the maplibregl-compact-show class. Added a shared addCollapsedAttributionControl helper that strips that class the first time it appears, leaving the compact "i" bubble collapsed initially while user clicks still toggle it. Used it for both the test map and the production Google-Maps compat map, and bumped the module cache-busting version tags so browsers reload the changed modules. Assisted-By: Claude Opus 4.8 (via GitHub Copilot CLI) Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
1 parent 53ee4e2 commit ad50017

4 files changed

Lines changed: 31 additions & 5 deletions

File tree

java/com.sap.sailing.gwt.ui/js/maps/google-maps-maplibre-compat.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
// Core facade: implements the Google Maps JavaScript API surface on MapLibre GL JS.
22
// Keep GWT wrapper conventions in gwt-maps-maplibre-compat.js.
3-
import { applyRaceStyle, createArrowSvg, createRaceStyle, lngLat, setSatelliteVisible } from './maplibre-test-utils.js?v=race-map-feedback-9';
3+
import { addCollapsedAttributionControl, applyRaceStyle, createArrowSvg, createRaceStyle, lngLat, setSatelliteVisible } from './maplibre-test-utils.js?v=race-map-feedback-18';
44

55
function asLngLatLiteral(value) {
66
if (Array.isArray(value)) return { lat: value[1], lng: value[0] };
@@ -199,8 +199,10 @@ class CompatMap {
199199
center: lngLat(initialCenter),
200200
zoom: toMapLibreZoom(options.zoom ?? 0),
201201
bearing: options.heading || 0,
202-
pitch: 0
202+
pitch: 0,
203+
attributionControl: false
203204
});
205+
addCollapsedAttributionControl(this.map, 'bottom-right');
204206
// MapLibre listens for gestures on this container, so interactive panes must be descendants.
205207
this.map.getCanvasContainer().append(this.overlayLayer, this.markerLayer, this.overlayMouseTarget, this.floatPane);
206208
requestAnimationFrame(() => this.map.resize());

java/com.sap.sailing.gwt.ui/js/maps/gwt-maps-maplibre-compat.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
// GWT adapter: exposes branflake GWT Maps wrapper conventions over the Google-style MapLibre facade.
22
// Keep MapLibre provider behavior in google-maps-maplibre-compat.js.
3-
import { installGoogleMapsCompat } from './google-maps-maplibre-compat.js?v=race-map-feedback-16';
3+
import { installGoogleMapsCompat } from './google-maps-maplibre-compat.js?v=race-map-feedback-18';
44

55
function call(handler, event = {}) {
66
if (typeof handler === 'function') handler(event);

java/com.sap.sailing.gwt.ui/js/maps/maplibre-test-utils.js

Lines changed: 25 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -77,6 +77,28 @@ export function setSatelliteVisible(map, visible) {
7777
else map.once('idle', apply);
7878
}
7979

80+
// Adds a compact AttributionControl that starts collapsed. MapLibre's `compact: true` still opens
81+
// the bubble once attributions populate (on styledata/sourcedata), so we strip the "show" class the
82+
// first time it appears. After that the control keeps `maplibregl-compact`, so MapLibre no longer
83+
// re-expands it and user clicks continue to toggle it normally.
84+
export function addCollapsedAttributionControl(map, position = 'bottom-right') {
85+
const control = new maplibregl.AttributionControl({ compact: true });
86+
map.addControl(control, position);
87+
const collapse = () => {
88+
const attrib = map.getContainer().querySelector('.maplibregl-ctrl-attrib.maplibregl-compact-show');
89+
if (attrib) {
90+
attrib.classList.remove('maplibregl-compact-show');
91+
map.off('styledata', collapse);
92+
map.off('sourcedata', collapse);
93+
map.off('idle', collapse);
94+
}
95+
};
96+
map.on('styledata', collapse);
97+
map.on('sourcedata', collapse);
98+
map.on('idle', collapse);
99+
return control;
100+
}
101+
80102
export function createRaceMap(containerId, options = {}) {
81103
const center = options.center || MARSEILLE_CENTER;
82104
const map = new maplibregl.Map({
@@ -85,9 +107,11 @@ export function createRaceMap(containerId, options = {}) {
85107
center: lngLat(center),
86108
zoom: toMapLibreZoom(options.zoom ?? 15),
87109
bearing: options.bearing ?? 0,
88-
pitch: 0
110+
pitch: 0,
111+
attributionControl: false
89112
});
90113
map.addControl(new maplibregl.NavigationControl({ visualizePitch: false }), 'top-right');
114+
addCollapsedAttributionControl(map, 'bottom-right');
91115
applyRaceStyle(map, options.seaMarksVisible);
92116
return map;
93117
}

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/shared/racemap/MapsLoader.java

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ public class MapsLoader {
4444
* The relative URL of the Google-Maps-compatibility facade ES module. The query parameter is a cache-busting
4545
* marker that is bumped whenever the facade changes. Package-private so {@link MapLibreProvider} can read it.
4646
*/
47-
final static String MAPS_COMPAT_MODULE_URL = "./js/maps/gwt-maps-maplibre-compat.js?v=race-map-feedback-17";
47+
final static String MAPS_COMPAT_MODULE_URL = "./js/maps/gwt-maps-maplibre-compat.js?v=race-map-feedback-18";
4848

4949
/**
5050
* The name of the {@code window} global through which both the Google Maps API and the compatibility ES module

0 commit comments

Comments
 (0)