//  window.gmap_simple = window.simpleMap("gmap-simple-id", [CYPRESS, GROUSE_SKI, SEYMOUR]);

const CYPRESS = {
  lat: 49.39659076296729,
  lng: -123.2044346158587,
  can_move: false,
  title_text: "  Cypress Mountain",
};
const GROUSE_SKI = {
  lat: 49.38013738002717,
  lng: -123.08255503822198,
  can_move: false,
  title_text: "  Grouse Mountain",
};
const SEYMOUR = {
  lat: 49.36750710612791,
  lng: -122.94865916419855,
  can_move: false,
  title_text: "  Mount Seymour",
};

import { GmapDragDrop } from "gmap-dragdrop-react";
const SKI_ICON_PATH =
  "m330.98799,85.17422c19.10273,0 47.26773,11.66465 47.26773,39.81121c0,28.14654 -18.0507,79.97311 -18.0507,79.97311c0,0 47.15701,30.87814 58.89549,40.34646c24.58439,19.78564 16.22349,37.54103 -16.6849,23.6431c-53.4323,-22.55414 -78.51501,-33.68358 -82.53859,-47.76607c-4.02358,-14.0825 -0.46143,-42.65355 -0.46143,-42.65355l-30.87814,12.82744l-130.6369,-96.01202c0,0 -11.99689,8.52702 -18.27218,8.52702c-6.31222,0 -13.84257,-4.61418 -13.84257,-4.61418l14.52546,-19.5088l-15.57751,-19.01045l21.6313,9.20993c-0.40605,0 13.38115,-18.06917 13.38115,-18.06917c0,0 7.14277,4.20813 8.82233,12.58751c1.67956,8.37937 -1.43963,16.46342 -1.43963,16.46342l56.23773,41.21392c0,0 33.18525,-36.96886 107.62132,-36.96886l-0.00003,-0.00002l0.00002,0.00002l0.00003,-0.00003zm-5.94307,244.34892c35.32621,-43.42874 1.79032,-72.73806 -12.31065,-83.81211c-14.0825,-11.05559 -119.93198,-85.10407 -119.93198,-85.10407c-29.2355,39.99578 -1.55037,77.68446 16.13119,89.97667c17.8846,12.42141 38.09473,24.15989 49.99934,33.07451c12.2922,9.22838 15.17144,19.19502 6.12763,31.26574c-9.06227,12.08919 -38.42031,47.94768 -38.42031,47.94768l-184.12805,-105.54401c-2.65961,-1.57288 -5.67157,-2.4529 -8.75977,-2.5594c-19.41984,-0.70357 -26.60153,25.21505 -9.58883,34.60641l365.06163,209.36877c0.53855,0.30399 1.09189,0.58065 1.65816,0.82908c0,0 14.46622,6.60918 33.09239,7.85851c18.62599,1.24934 44.82886,-3.85081 61.75076,-26.85605c14.63325,-19.83363 -15.15927,-41.7538 -29.73991,-21.8814c-8.23466,11.19513 -18.26258,12.65376 -29.5596,11.8961c-11.09933,-0.74454 -19.80134,-4.51636 -20.11489,-4.65035l-130.85837,-75.06619c0,0 15.00331,-18.82552 49.59126,-61.34987l0.00002,-0.00002l-0.00002,-0.00002l0,0.00003zm48.7185,-281.86027c0,56.58858 84.88297,56.58858 84.88297,0c0,-56.58858 -84.88297,-56.58858 -84.88297,0";

function simpleMap(div_id, ski_locations) {
  let gmap_simple = ReactDOM.render(
    <GmapDragDrop
      google_map_key={GLOBAL_WEBPACK.GOOG_MAP_API}
      map_locations={ski_locations}
      map_options={{
        pin_svg: SKI_ICON_PATH,
        gestureHandling: "none",
      }}
    />,
    document.getElementById(div_id)
  );

  function dumpToDiv(the_div) {
    var json_ski = gmap_simple.locationsGetAll();
    var json_string = JSON.stringify(json_ski, null, 2);
    document.getElementById(the_div).value = json_string;
  }

  gmap_simple.dumpToDiv = dumpToDiv;
  return gmap_simple;
}

window.simpleMap = simpleMap;
export default simpleMap;