// Headless-Proof für map-gl-markers.js: 4 Kategorien, ~490 Fake-Marker, Cluster,
// Phosphor-Icons, Danger-Radien, Sichtbarkeits-Toggle, Popups — alles ohne App/Auth.
(function () {
  'use strict';
  var st = document.getElementById('status');
  function set(t) { if (st) st.textContent = t; }

  var TYPES = {
    restaurant: { color: '#F97316', iconName: 'fork-knife' },
    freilauf:   { color: '#22C55E', iconName: 'dog' },
    tierarzt:   { color: '#EF4444', iconName: 'first-aid' },
    poison:     { color: '#DC2626', iconName: 'skull', danger: true },
  };
  var COUNTS = { restaurant: 250, freilauf: 150, tierarzt: 80, poison: 8 };

  function genPois(n, seedStart) {
    var feats = [], seed = seedStart;
    function rnd() { seed = (seed * 9301 + 49297) % 233280; return seed / 233280; }
    for (var i = 0; i < n; i++) {
      feats.push({ lat: 48.03 + rnd() * 0.24, lon: 11.40 + rnd() * 0.36, name: 'POI ' + i, source: 'osm' });
    }
    return feats;
  }

  try {
    var proto = new pmtiles.Protocol();
    maplibregl.addProtocol('pmtiles', proto.tile);
    var map = new maplibregl.Map({
      container: 'map', style: MapGLStyle.build({ dark: false }),
      center: [11.576, 48.137], zoom: 12, dragRotate: false,
    });
    map.addControl(new maplibregl.NavigationControl({ showCompass: false }), 'top-left');
    map.addControl(new maplibregl.ScaleControl());

    map.on('error', function (e) { set('⚠️ ' + (e && e.error ? e.error.message : 'Fehler')); if (e && e.error) console.error(e.error); });

    map.on('load', function () {
      MapGLMarkers.init(map, {
        types: TYPES, dangerKeys: ['poison'], dangerRadiusM: 100,
        popupHTML: function (p, key) { return '<b>' + (p.name || key) + '</b><br><small>' + key + '</small><br><button id="mp-x">OK</button>'; },
        popupWire: function (p, key, close) { document.getElementById('mp-x') && document.getElementById('mp-x').addEventListener('click', close); },
      }).then(function () {
        var seeds = { restaurant: 11, freilauf: 77, tierarzt: 123, poison: 200 };
        Object.keys(TYPES).forEach(function (k) { MapGLMarkers.setLayer(k, genPois(COUNTS[k], seeds[k])); });
        // Toggle-Buttons
        var box = document.getElementById('toggles');
        Object.keys(TYPES).forEach(function (k) {
          var b = document.createElement('button'); b.textContent = k; b.dataset.on = '1';
          b.style.borderColor = TYPES[k].color;
          b.addEventListener('click', function () {
            var on = b.dataset.on === '1' ? false : true;
            b.dataset.on = on ? '1' : '0'; b.classList.toggle('off', !on);
            MapGLMarkers.setVisible(k, on);
          });
          box.appendChild(b);
        });
        var total = COUNTS.restaurant + COUNTS.freilauf + COUNTS.tierarzt + COUNTS.poison;
        set('✅ ' + total + ' Marker (4 Kat.) — Cluster + Phosphor-Icons + Danger-Radius + Toggle + Popup');
      }).catch(function (e) { set('❌ init: ' + (e && e.message ? e.message : e)); console.error(e); });
    });
  } catch (e) {
    set('❌ ' + (e && e.message ? e.message : e));
  }
})();