Tutorial: Timeline Spotlight-Fix + Karten-Marker pulsieren
Schritt 21: Spotlight+Bubble werden 300ms nach GridStack-Update neu positioniert. Kein falscher Rahmen mehr auf der Karte. Schritt 23: Alle Marker pulsieren kurz (scale 1.8x) bevor der Cursor sie besucht, damit Nutzer sieht was anklickbar ist.
Dieser Commit ist enthalten in:
@@ -927,8 +927,16 @@ const Tutorial = {
|
||||
LayoutManager._grid.compact();
|
||||
}
|
||||
}
|
||||
// Kachel in den sichtbaren Bereich scrollen
|
||||
// Nach GridStack-Update: Spotlight + Bubble neu positionieren
|
||||
Tutorial._stepTimeout(function() {
|
||||
if (tile) tile.scrollIntoView({ behavior: 'smooth', block: 'start' });
|
||||
var step = Tutorial._steps[Tutorial._currentStep];
|
||||
if (step && step.id === 'timeline') {
|
||||
Tutorial._spotlightElement(step.target);
|
||||
Tutorial._positionBubble(step);
|
||||
Tutorial._els.bubble.classList.add('visible');
|
||||
}
|
||||
}, 300);
|
||||
Tutorial._runDemo(Tutorial._simulateTimeline);
|
||||
},
|
||||
onExit: function() {
|
||||
@@ -1838,6 +1846,23 @@ const Tutorial = {
|
||||
if (!mapEl) { this._demoRunning = false; this._enableNavAfterDemo(); return; }
|
||||
var mapRect = mapEl.getBoundingClientRect();
|
||||
|
||||
// Marker kurz pulsieren lassen damit Nutzer sie sieht
|
||||
this._demoMapMarkers.forEach(function(m) {
|
||||
var icon = m._icon;
|
||||
if (icon) {
|
||||
icon.style.transition = 'transform 0.3s ease';
|
||||
icon.style.transform = 'scale(1.8)';
|
||||
}
|
||||
});
|
||||
await this._wait(600);
|
||||
this._demoMapMarkers.forEach(function(m) {
|
||||
var icon = m._icon;
|
||||
if (icon) {
|
||||
icon.style.transform = 'scale(1)';
|
||||
}
|
||||
});
|
||||
await this._wait(400);
|
||||
|
||||
// Alle 3 Marker nacheinander besuchen
|
||||
var names = ['Burchardkai Terminal (Hauptereignisort)', 'Hamburg Innenstadt (Erwähnt)', 'Elbe / Hafengebiet (Kontext)'];
|
||||
var prevX, prevY;
|
||||
|
||||
In neuem Issue referenzieren
Einen Benutzer sperren