console.log("hello from map.js")
var hotelxy=[-19.8,47.5]

var maxZoomLevel = 6
var tileSize = 256

var maxLenght = Math.pow(2, maxZoomLevel) * tileSize

var mapNE = [maxLenght, 0]
var mapSW = [0, maxLenght]

var map = L.map('map', {
  attributionControl: false,
  zoomControl: false,
}).setView(hotelxy,1);

L.control.zoom({
    position: 'bottomright'
}).addTo(map);


L.tileLayer('asset/tiles/{z}/{x}/{y}.png', {
  minZoom: 1,
  maxZoom: maxZoomLevel,
  continuousWorld: false,
  noWrap: true,
  crs: L.CRS.Simple,
  }).addTo(map);

map.setMaxBounds(new L.LatLngBounds(
  map.unproject(mapSW, map.getMaxZoom()),
  map.unproject(mapNE, map.getMaxZoom())
))

console.log("getMaxZoom:")
console.log(map.getMaxZoom())


var markPointerIcon = L.icon({
    iconUrl: 'asset/markers/pointer.png',
    iconSize: [22, 32],
    iconAnchor: [11, 32],
    popupAnchor: [0, -38],
});

var markRestoIcon = L.icon({
    iconUrl: 'asset/markers/resto-42x56.png',
    iconSize: [41, 32],
    iconAnchor: [20.5, 32],
    popupAnchor: [0, -38],
});

var markParkingIcon = L.icon({
    iconUrl: 'asset/markers/parking-32x27.png',
    iconSize: [27, 32],
    iconAnchor: [13.5, 32],
    popupAnchor: [0, -38],
});


var marker = L.marker(hotelxy, {
  icon: markPointerIcon,
  draggable : true,
}).addTo(map);

marker.bindPopup("check");

marker.on('click', function(e) {
  console.log(marker.getLatLng())
})

console.log("looping resto from map.js")

var layzl3 = L.layerGroup()
var layzl3 = L.layerGroup()
var layzl3 = L.layerGroup()
var layResto = L.layerGroup()

let resto = jdb.data.db.resto.sub

Object.entries(resto).forEach(item => {
  console.log(item)
  console.log(item[1]['sub'])
  Object.entries(item[1]['sub']).forEach(r => {
    console.log(r[1]['name'])
    console.log(r[1]['xy'])
    if (typeof r[1]['xy'] !== "undefined") {
      r[1]['marker'] = L.marker(r[1]['xy'], {
        icon: markRestoIcon,
      }).addTo(layResto);
      r[1]['marker'].bindPopup(r[1]['name'])
      r[1]['marker'].on('click', function(e) {
        console.log("hello")
        jdb.data.db.resto.isActive = true
        item[1]['isActive'] = true
        let target = document.getElementById(r[1]['id'])
        target.scrollIntoView({ behavior: 'smooth' })
      })

    }
  })
})

layResto.addTo(map)
/*
min/max = 163
map.setView([-163,-163],2)
*/