Integriert Apple Lookaround direkt in den Waze Map Editor
// ==UserScript==
// @name WME Lookaround
// @namespace https://greasyfork.org/de/users/863740-horst-wittlich
// @version 2025.06.01
// @description Integriert Apple Lookaround direkt in den Waze Map Editor
// @author Hiwi234
// @match https://www.waze.com/editor*
// @match https://www.waze.com/*/editor*
// @match https://beta.waze.com/editor*
// @match https://beta.waze.com/*/editor*
// @grant none
// @license MIT
// ==/UserScript==
(function() {
'use strict';
const SCRIPT_ID = 'wme-lookaround-integration';
const SCRIPT_NAME = 'WME Lookaround';
let tabLabel, tabPane;
let currentLat = null;
let currentLon = null;
let mapClickHandler = null;
let overlayWindow = null;
let crosshairStyleElement = null;
// Koordinaten-Transformation (Web Mercator zu WGS84) - Verbesserte Version
function webMercatorToWGS84(x, y) {
// Korrigierte Transformation für WME-Koordinaten
const lon = (x * 180) / 20037508.342789244;
let lat = (y * 180) / 20037508.342789244;
// Korrekte Mercator-Umkehrung
lat = (Math.atan(Math.exp(lat * (Math.PI / 180))) * 360) / Math.PI - 90;
return { lat: lat, lon: lon };
}
// Apple Lookaround Coverage Overlay - Mit echten Coverage-Daten
function createLookaroundOverlay() {
if (coverageLayer) {
// Toggle: Wenn bereits aktiv, entfernen
W.map.removeLayer(coverageLayer);
coverageLayer = null;
console.log('Lookaround coverage overlay removed');
return false;
}
try {
console.log('Creating Lookaround coverage overlay with real data...');
// Erstelle Vector Layer mit Styling
coverageLayer = new OpenLayers.Layer.Vector("Apple Lookaround Coverage", {
displayInLayerSwitcher: false,
styleMap: new OpenLayers.StyleMap({
"default": new OpenLayers.Style({
fillColor: "#1E90FF", // Blaue Füllung für Lookaround
fillOpacity: 0.25,
strokeColor: "#0066CC",
strokeWidth: 1,
strokeOpacity: 0.8
})
})
});
// Lade echte Coverage-Daten
loadRealCoverageData();
return true;
} catch (error) {
console.log('Error creating Lookaround overlay:', error);
return false;
}
}
// Lade echte Apple Lookaround Coverage-Daten
function loadRealCoverageData() {
// URL zu den echten Coverage-Daten (basierend auf sk-zk Projekt)
const coverageDataUrl = 'https://raw.githubusercontent.com/sk-zk/lookaround-map/main/coverage-data/coverage.json';
try {
fetch(coverageDataUrl)
.then(response => {
if (!response.ok) {
throw new Error('Coverage data not available, using fallback');
}
return response.json();
})
.then(data => {
console.log('Real coverage data loaded:', data);
processCoverageData(data);
})
.catch(error => {
console.log('Could not load real coverage data:', error);
// Fallback zu bekannten Städten mit echten Lookaround-Daten
loadKnownLookaroundCities();
});
} catch (fetchError) {
console.log('Fetch not available, using fallback data');
loadKnownLookaroundCities();
}
}
// Verarbeite echte Coverage-Daten
function processCoverageData(data) {
if (data.features) {
data.features.forEach(feature => {
try {
const geometry = feature.geometry;
if (geometry.type === 'Polygon' || geometry.type === 'MultiPolygon') {
const olFeature = createFeatureFromGeoJSON(geometry);
if (olFeature) {
coverageLayer.addFeatures([olFeature]);
}
}
} catch (featureError) {
console.log('Error processing feature:', featureError);
}
});
}
W.map.addLayer(coverageLayer);
console.log('Real coverage data overlay created');
}
// Konvertiere GeoJSON zu OpenLayers Feature
function createFeatureFromGeoJSON(geometry) {
try {
const format = new OpenLayers.Format.GeoJSON();
const feature = format.read({
type: "Feature",
geometry: geometry
});
if (feature && feature[0]) {
// Transformiere Koordinaten
feature[0].geometry.transform(
new OpenLayers.Projection("EPSG:4326"),
W.map.getProjectionObject()
);
return feature[0];
}
} catch (conversionError) {
console.log('Error converting GeoJSON:', conversionError);
}
return null;
}
// Fallback: Bekannte Städte mit echter Lookaround-Abdeckung
function loadKnownLookaroundCities() {
console.log('Loading known Lookaround cities...');
// Echte Städte mit bestätigter Lookaround-Abdeckung (kleinere, präzisere Gebiete)
const confirmedCities = [
// Deutschland
{ name: "Berlin Mitte", lat: 52.520, lon: 13.405, radius: 0.02 },
{ name: "München Zentrum", lat: 48.137, lon: 11.575, radius: 0.015 },
{ name: "Hamburg Zentrum", lat: 53.550, lon: 9.993, radius: 0.015 },
{ name: "Köln Zentrum", lat: 50.937, lon: 6.960, radius: 0.012 },
{ name: "Frankfurt Zentrum", lat: 50.110, lon: 8.682, radius: 0.010 },
{ name: "Düsseldorf", lat: 51.225, lon: 6.776, radius: 0.010 },
{ name: "Stuttgart", lat: 48.775, lon: 9.182, radius: 0.010 },
// USA (bestätigte Gebiete)
{ name: "San Francisco", lat: 37.774, lon: -122.419, radius: 0.025 },
{ name: "Los Angeles", lat: 34.052, lon: -118.244, radius: 0.030 },
{ name: "New York Manhattan", lat: 40.758, lon: -73.985, radius: 0.020 },
{ name: "Chicago", lat: 41.878, lon: -87.630, radius: 0.015 },
{ name: "Seattle", lat: 47.606, lon: -122.332, radius: 0.015 },
// International
{ name: "London", lat: 51.507, lon: -0.127, radius: 0.020 },
{ name: "Paris", lat: 48.856, lon: 2.352, radius: 0.015 },
{ name: "Tokyo", lat: 35.676, lon: 139.650, radius: 0.020 },
{ name: "Sydney", lat: -33.868, lon: 151.207, radius: 0.015 }
];
confirmedCities.forEach(city => {
try {
// Erstelle Kreis um jede Stadt
const center = new OpenLayers.LonLat(city.lon, city.lat).transform(
new OpenLayers.Projection("EPSG:4326"),
W.map.getProjectionObject()
);
// Approximiere Kreis mit Polygon (16 Punkte)
const points = [];
const numPoints = 16;
const radius = city.radius * 111320; // Grad zu Meter (ungefähr)
for (let i = 0; i < numPoints; i++) {
const angle = (i / numPoints) * 2 * Math.PI;
const x = center.lon + Math.cos(angle) * radius;
const y = center.lat + Math.sin(angle) * radius;
points.push(new OpenLayers.Geometry.Point(x, y));
}
points.push(points[0]); // Schließe den Kreis
const linearRing = new OpenLayers.Geometry.LinearRing(points);
const polygon = new OpenLayers.Geometry.Polygon([linearRing]);
const feature = new OpenLayers.Feature.Vector(polygon);
feature.attributes = { name: city.name };
coverageLayer.addFeatures([feature]);
} catch (cityError) {
console.log('Error creating city coverage:', city.name, cityError);
}
});
W.map.addLayer(coverageLayer);
console.log('Known cities coverage overlay created with', confirmedCities.length, 'cities');
}
function generateAppleLookAroundLink(lat, lon, callback) {
// Versuche Adresse über Nominatim zu ermitteln (falls CSP erlaubt)
const nominatimUrl = `https://nominatim.openstreetmap.org/reverse?format=json&lat=${lat}&lon=${lon}&addressdetails=1&accept-language=de`;
// Fallback Link
const basicLink = `https://maps.apple.com/look-around?z=17&coordinate=${lat}%2C${lon}`;
try {
fetch(nominatimUrl)
.then(response => response.json())
.then(data => {
if (data && data.address) {
const address = data.address;
let addressString = '';
let nameString = '';
// Adresse zusammenbauen
if (address.house_number && address.road) {
addressString = `${address.road} ${address.house_number}`;
nameString = `${address.road} ${address.house_number}`;
} else if (address.road) {
addressString = address.road;
nameString = address.road;
} else if (address.neighbourhood || address.suburb) {
addressString = address.neighbourhood || address.suburb;
nameString = address.neighbourhood || address.suburb;
}
if (address.suburb && addressString !== address.suburb) {
addressString += `, ${address.suburb}`;
}
if (address.postcode) {
addressString += `, ${address.postcode}`;
}
if (address.city || address.town || address.village) {
addressString += ` ${address.city || address.town || address.village}`;
}
if (address.country) {
addressString += `, ${address.country}`;
}
// URL-encode die Adresse
const encodedAddress = encodeURIComponent(addressString);
const encodedName = encodeURIComponent(nameString);
// Generiere _mvs Parameter (Base64-kodierte Koordinaten)
const mvsCoords = btoa(`${lat},${lon},17`);
const fullLink = `https://maps.apple.com/look-around?z=17&address=${encodedAddress}&coordinate=${lat}%2C${lon}&name=${encodedName}&_mvs=${mvsCoords}`;
console.log('Generated Apple Look Around link with address:', fullLink);
callback(fullLink);
} else {
console.log('No address data, using basic link');
callback(basicLink);
}
})
.catch(error => {
console.log('Geocoding failed, using basic link:', error);
callback(basicLink);
});
} catch (error) {
console.log('Fetch not available, using basic link:', error);
callback(basicLink);
}
}
function isLookaroundRegion(lat, lon) {
const supportedRegions = [
{ minLat: 24, maxLat: 49, minLon: -125, maxLon: -66 }, // USA
{ minLat: 41, maxLat: 70, minLon: -141, maxLon: -52 }, // Kanada
{ minLat: 49, maxLat: 61, minLon: -11, maxLon: 2 }, // UK & Irland
{ minLat: 47, maxLat: 55, minLon: 5, maxLon: 15 }, // Deutschland & Zentraleuropa
{ minLat: 24, maxLat: 46, minLon: 129, maxLon: 146 }, // Japan
{ minLat: -38, maxLat: -10, minLon: 113, maxLon: 154 } // Australien
];
return supportedRegions.some(region =>
lat >= region.minLat && lat <= region.maxLat &&
lon >= region.minLon && lon <= region.maxLon
);
}
// Aktuelle Position aus WME abrufen - Verbesserte Version
function getCurrentMapPosition() {
try {
if (W && W.map && W.map.getCenter) {
const center = W.map.getCenter();
// Debug-Ausgabe für Fehlersuche
console.log('WME map center (Web Mercator):', center.lon, center.lat);
const coords = webMercatorToWGS84(center.lon, center.lat);
// Debug-Ausgabe für transformierte Koordinaten
console.log('Transformed center (WGS84):', coords.lat, coords.lon);
return coords;
}
} catch (error) {
console.log('Error getting map position:', error);
}
return null;
}
// Automatische Position beim Start ermitteln
function autoUpdatePosition() {
const position = getCurrentMapPosition();
if (position) {
currentLat = position.lat;
currentLon = position.lon;
updateCoordinatesDisplay();
console.log('Auto-detected position:', currentLat.toFixed(6), currentLon.toFixed(6));
}
}
// Position bei Kartenänderungen aktualisieren
function setupMapListeners() {
if (W && W.map) {
W.map.events.register('moveend', W.map, autoUpdatePosition);
W.map.events.register('zoomend', W.map, autoUpdatePosition);
}
}
// Map Click Handler - Mit automatischem Fenster öffnen
function handleMapClick(event) {
if (!event.xy) return;
try {
// WME's getLonLatFromPixel gibt bereits WGS84-Koordinaten zurück!
const mapCoords = W.map.getLonLatFromPixel(event.xy);
// Debug-Ausgabe für Fehlersuche
console.log('Map click coords (already WGS84):', mapCoords.lon, mapCoords.lat);
// Keine Transformation nötig - sind bereits WGS84!
currentLat = mapCoords.lat;
currentLon = mapCoords.lon;
// Debug-Ausgabe für finale Koordinaten
console.log('Final coords for Lookmap:', currentLat, currentLon);
updateCoordinatesDisplay();
toggleMapClick(); // Automatisch deaktivieren nach Auswahl
// Automatisch Lookmap öffnen nach Position-Auswahl
setTimeout(() => {
openLookmap();
}, 200); // Kurze Verzögerung damit der Nutzer das Update sieht
} catch (error) {
console.log('Error handling map click:', error);
}
}
// CSS-Styles für Crosshair-Cursor injizieren
function injectCrosshairCSS() {
if (crosshairStyleElement) return;
crosshairStyleElement = document.createElement('style');
crosshairStyleElement.id = 'wme-lookaround-crosshair';
crosshairStyleElement.textContent = `
.wme-lookaround-crosshair-mode * {
cursor: crosshair !important;
}
.wme-lookaround-crosshair-mode #map,
.wme-lookaround-crosshair-mode #map *,
.wme-lookaround-crosshair-mode .olMapViewport,
.wme-lookaround-crosshair-mode .olMapViewport *,
.wme-lookaround-crosshair-mode .OpenLayers_Map,
.wme-lookaround-crosshair-mode .OpenLayers_Map * {
cursor: crosshair !important;
}
`;
document.head.appendChild(crosshairStyleElement);
}
// CSS-Styles für Crosshair-Cursor entfernen
function removeCrosshairCSS() {
if (crosshairStyleElement) {
crosshairStyleElement.remove();
crosshairStyleElement = null;
}
}
// Toggle Map Click Mode - Verbesserte Version
function toggleMapClick() {
const button = document.getElementById('map-click-toggle');
if (!button) return;
if (mapClickHandler) {
// Deaktivieren
W.map.events.unregister('click', W.map, mapClickHandler);
mapClickHandler = null;
button.textContent = '🎯 Karte anklicken: AUS';
button.style.background = '#FF9500';
// CSS-Klasse entfernen und Styles zurücksetzen
document.body.classList.remove('wme-lookaround-crosshair-mode');
removeCrosshairCSS();
console.log('Map click mode deactivated');
} else {
// Aktivieren
mapClickHandler = handleMapClick;
W.map.events.register('click', W.map, mapClickHandler);
button.textContent = '🎯 Karte anklicken: EIN';
button.style.background = '#FF3B30';
// CSS injizieren und Klasse setzen
injectCrosshairCSS();
document.body.classList.add('wme-lookaround-crosshair-mode');
console.log('Map click mode activated - crosshair should be visible everywhere');
}
}
// Koordinaten-Anzeige aktualisieren
function updateCoordinatesDisplay() {
const statusEl = document.getElementById('lookaround-status');
const coordsEl = document.getElementById('lookaround-coords');
if (currentLat && currentLon && coordsEl && statusEl) {
coordsEl.textContent = 'Position: ' + currentLat.toFixed(6) + ', ' + currentLon.toFixed(6);
if (isLookaroundRegion(currentLat, currentLon)) {
statusEl.textContent = '✅ Region wird unterstützt';
statusEl.style.color = '#34C759';
} else {
statusEl.textContent = '⚠️ Region möglicherweise nicht verfügbar';
statusEl.style.color = '#FF9500';
}
}
}
// Position manuell aktualisieren
function updateCurrentPosition() {
const statusEl = document.getElementById('lookaround-status');
if (statusEl) {
statusEl.textContent = '🔄 Position wird aktualisiert...';
statusEl.style.color = '#007AFF';
}
const position = getCurrentMapPosition();
if (!position) {
if (statusEl) {
statusEl.textContent = '❌ Fehler beim Abrufen der Position';
statusEl.style.color = '#FF3B30';
}
return;
}
currentLat = position.lat;
currentLon = position.lon;
updateCoordinatesDisplay();
}
// Lookaround-Services öffnen
function openLookaroundService(serviceIndex) {
if (!currentLat || !currentLon) {
alert('Bitte wähle zuerst eine Position!');
return;
}
// Nur noch Lookmap.eu
if (serviceIndex === 0) {
const url = 'https://lookmap.eu.pythonanywhere.com/#c=17/' + currentLat + '/' + currentLon + '&p=' + currentLat + '/' + currentLon + '&a=0.00/0.00';
const windowFeatures = 'width=800,height=600,scrollbars=yes,resizable=yes,toolbar=no,menubar=no,location=yes,status=no,left=' + (screen.width - 800 - 20) + ',top=' + (screen.height - 600 - 100);
window.open(url, 'lookaround_Lookmap_eu', windowFeatures);
}
}
// Lookmap öffnen
function openLookmap() {
if (!currentLat || !currentLon) {
alert('Bitte wähle zuerst eine Position!');
return;
}
const url = 'https://lookmap.eu.pythonanywhere.com/#c=17/' + currentLat + '/' + currentLon + '&p=' + currentLat + '/' + currentLon + '&a=0.00/0.00';
const windowFeatures = 'width=800,height=600,scrollbars=yes,resizable=yes,toolbar=no,menubar=no,location=yes,status=no,left=' + (screen.width - 800 - 20) + ',top=' + (screen.height - 600 - 100);
window.open(url, 'lookaround_Lookmap_eu', windowFeatures);
}
// Einfaches Overlay-Fenster erstellen
function createSimpleOverlay() {
if (overlayWindow) {
overlayWindow.remove();
}
overlayWindow = document.createElement('div');
overlayWindow.style.cssText = 'position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,0.8);z-index:10000;display:flex;align-items:center;justify-content:center;font-family:Arial,sans-serif;';
const container = document.createElement('div');
container.style.cssText = 'background:white;border-radius:12px;padding:30px;max-width:400px;text-align:center;';
const title = document.createElement('h2');
title.textContent = '🎯 Lookmap.eu';
title.style.cssText = 'margin:0 0 20px 0;color:#34C759;';
const positionInfo = document.createElement('div');
positionInfo.textContent = 'Position: ' + (currentLat ? currentLat.toFixed(6) + ', ' + currentLon.toFixed(6) : 'Nicht verfügbar');
positionInfo.style.cssText = 'margin-bottom:20px;color:#666;';
const lookmapButton = document.createElement('button');
lookmapButton.textContent = '🎯 Lookmap.eu öffnen';
lookmapButton.style.cssText = 'padding:15px 20px;background:#34C759;color:white;border:none;border-radius:8px;cursor:pointer;font-size:16px;font-weight:bold;margin:10px;transition:all 0.3s ease;transform:scale(1);';
lookmapButton.addEventListener('click', () => {
openLookmap();
closeOverlay();
});
// Hover-Effekte für Overlay-Lookmap-Button
lookmapButton.addEventListener('mouseenter', () => {
lookmapButton.style.transform = 'scale(1.08)';
lookmapButton.style.background = '#4ADA69';
lookmapButton.style.boxShadow = '0 6px 20px rgba(52, 199, 89, 0.5)';
});
lookmapButton.addEventListener('mouseleave', () => {
lookmapButton.style.transform = 'scale(1)';
lookmapButton.style.background = '#34C759';
lookmapButton.style.boxShadow = 'none';
});
const closeButton = document.createElement('button');
closeButton.textContent = '✕ Schließen';
closeButton.style.cssText = 'padding:10px 20px;background:#ccc;color:#333;border:none;border-radius:8px;cursor:pointer;margin-top:15px;transition:all 0.3s ease;transform:scale(1);';
closeButton.addEventListener('click', closeOverlay);
// Hover-Effekte für Schließen-Button
closeButton.addEventListener('mouseenter', () => {
closeButton.style.transform = 'scale(1.05)';
closeButton.style.background = '#e0e0e0';
closeButton.style.boxShadow = '0 4px 12px rgba(204, 204, 204, 0.4)';
closeButton.style.color = '#000';
});
closeButton.addEventListener('mouseleave', () => {
closeButton.style.transform = 'scale(1)';
closeButton.style.background = '#ccc';
closeButton.style.boxShadow = 'none';
closeButton.style.color = '#333';
});
container.appendChild(title);
container.appendChild(positionInfo);
container.appendChild(lookmapButton);
container.appendChild(closeButton);
overlayWindow.appendChild(container);
document.body.appendChild(overlayWindow);
// ESC-Taste zum Schließen
document.addEventListener('keydown', function escapeHandler(e) {
if (e.key === 'Escape' && overlayWindow) {
closeOverlay();
document.removeEventListener('keydown', escapeHandler);
}
});
overlayWindow.addEventListener('click', (e) => {
if (e.target === overlayWindow) {
closeOverlay();
}
});
}
// Overlay schließen
function closeOverlay() {
if (overlayWindow) {
overlayWindow.remove();
overlayWindow = null;
}
}
// Sidebar-Interface erstellen
function createSidebarInterface() {
const container = document.createElement('div');
container.style.cssText = 'padding:15px;font-family:Arial,sans-serif;';
const title = document.createElement('h4');
title.textContent = '🎯 WME Look Around';
title.style.cssText = `
margin: 0 0 15px 0;
color: #0099FF;
text-align: center;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
`;
const coordsDisplay = document.createElement('div');
coordsDisplay.id = 'lookaround-coords';
coordsDisplay.textContent = 'Position: Wird geladen...';
coordsDisplay.style.cssText = 'font-size:12px;color:#666;margin-bottom:8px;';
const statusDisplay = document.createElement('div');
statusDisplay.id = 'lookaround-status';
statusDisplay.textContent = 'Bereit';
statusDisplay.style.cssText = 'font-size:12px;color:#666;margin-bottom:15px;';
// Map-Click-Button wieder hinzufügen
const mapClickButton = document.createElement('button');
mapClickButton.id = 'map-click-toggle';
mapClickButton.textContent = '🎯 Karte anklicken: AUS';
mapClickButton.style.cssText = 'padding:10px;background:#FF9500;color:white;border:none;border-radius:6px;cursor:pointer;font-size:12px;width:100%;margin-bottom:15px;transition:all 0.3s ease;transform:scale(1);';
mapClickButton.addEventListener('click', toggleMapClick);
// Hover-Effekte für Map-Click-Button
mapClickButton.addEventListener('mouseenter', () => {
mapClickButton.style.transform = 'scale(1.05)';
mapClickButton.style.boxShadow = '0 4px 12px rgba(255, 149, 0, 0.4)';
if (mapClickHandler) {
mapClickButton.style.background = '#FF1A1A'; // Helleres Rot beim Hover wenn aktiv
} else {
mapClickButton.style.background = '#FFB84D'; // Helleres Orange beim Hover wenn inaktiv
}
});
mapClickButton.addEventListener('mouseleave', () => {
mapClickButton.style.transform = 'scale(1)';
mapClickButton.style.boxShadow = 'none';
if (mapClickHandler) {
mapClickButton.style.background = '#FF3B30'; // Original Rot
} else {
mapClickButton.style.background = '#FF9500'; // Original Orange
}
});
// Schnellzugriff-Button
const quickContainer = document.createElement('div');
quickContainer.style.cssText = 'margin-top:15px;';
const quickTitle = document.createElement('div');
quickTitle.textContent = 'Schnellzugriff:';
quickTitle.style.cssText = 'font-size:12px;font-weight:bold;margin-bottom:8px;';
const directButton = document.createElement('button');
directButton.textContent = 'Direkt öffnen';
directButton.style.cssText = 'padding:8px 12px;background:#34C759;color:white;border:none;border-radius:4px;cursor:pointer;font-size:11px;width:100%;transition:all 0.3s ease;transform:scale(1);';
directButton.addEventListener('click', openLookmap);
// Hover-Effekte für Direkt-öffnen-Button
directButton.addEventListener('mouseenter', () => {
directButton.style.transform = 'scale(1.05)';
directButton.style.background = '#4ADA69'; // Helleres Grün
directButton.style.boxShadow = '0 4px 12px rgba(52, 199, 89, 0.4)';
});
directButton.addEventListener('mouseleave', () => {
directButton.style.transform = 'scale(1)';
directButton.style.background = '#34C759'; // Original Grün
directButton.style.boxShadow = 'none';
});
quickContainer.appendChild(quickTitle);
quickContainer.appendChild(directButton);
container.appendChild(title);
container.appendChild(coordsDisplay);
container.appendChild(statusDisplay);
container.appendChild(mapClickButton);
container.appendChild(quickContainer);
return container;
}
// Cleanup map click handler - Verbesserte Version
function cleanupMapClick() {
if (mapClickHandler && W && W.map) {
try {
W.map.events.unregister('click', W.map, mapClickHandler);
mapClickHandler = null;
// CSS-Klasse und Styles entfernen
document.body.classList.remove('wme-lookaround-crosshair-mode');
removeCrosshairCSS();
} catch (error) {
console.log('Error cleaning up map click handler:', error);
}
}
}
// Script initialisieren
function initializeScript() {
try {
console.log('Initializing WME Lookaround Integration...');
const result = W.userscripts.registerSidebarTab(SCRIPT_ID);
tabLabel = result.tabLabel;
tabPane = result.tabPane;
tabLabel.textContent = 'LA';
tabLabel.title = SCRIPT_NAME;
tabLabel.style.cssText = 'background:linear-gradient(135deg,#007AFF,#34C759);color:white;font-weight:bold;border-radius:3px;text-align:center;';
const sidebarInterface = createSidebarInterface();
tabPane.appendChild(sidebarInterface);
setTimeout(() => {
autoUpdatePosition();
setupMapListeners();
}, 1000);
console.log('WME Lookaround Integration initialized successfully');
} catch (error) {
console.error('Error initializing WME Lookaround Integration:', error);
}
}
// Cleanup function
function cleanup() {
try {
cleanupMapClick();
closeOverlay();
if (W && W.map) {
W.map.events.unregister('moveend', W.map, autoUpdatePosition);
W.map.events.unregister('zoomend', W.map, autoUpdatePosition);
}
if (W.userscripts && W.userscripts.removeSidebarTab) {
W.userscripts.removeSidebarTab(SCRIPT_ID);
}
} catch (error) {
console.error('Error during cleanup:', error);
}
}
window.addEventListener('beforeunload', cleanup);
if (W?.userscripts?.state?.isReady) {
initializeScript();
} else {
document.addEventListener('wme-ready', initializeScript, { once: true });
}
console.log('WME Lookaround Integration userscript loaded');
})();