forked from edward/owl-map
		
	Code formatting with prettier
This commit is contained in:
		
							parent
							
								
									5cad18c393
								
							
						
					
					
						commit
						2bed4b86a3
					
				
							
								
								
									
										340
									
								
								static/js/map.js
									
									
									
									
									
								
							
							
						
						
									
										340
									
								
								static/js/map.js
									
									
									
									
									
								
							| 
						 | 
				
			
			@ -1,9 +1,9 @@
 | 
			
		|||
'use strict';
 | 
			
		||||
"use strict";
 | 
			
		||||
 | 
			
		||||
var options = {};
 | 
			
		||||
if (start_lat || start_lng) {
 | 
			
		||||
    start_lat = start_lat.toFixed(5);
 | 
			
		||||
    start_lng = start_lng.toFixed(5);
 | 
			
		||||
  start_lat = start_lat.toFixed(5);
 | 
			
		||||
  start_lng = start_lng.toFixed(5);
 | 
			
		||||
  options = {
 | 
			
		||||
    center: [start_lat, start_lng],
 | 
			
		||||
    zoom: zoom,
 | 
			
		||||
| 
						 | 
				
			
			@ -24,133 +24,134 @@ var isa_card = document.getElementById("isa-card");
 | 
			
		|||
var isa_labels = {};
 | 
			
		||||
var connections = {};
 | 
			
		||||
map.addLayer(group);
 | 
			
		||||
map.zoomControl.setPosition('topright');
 | 
			
		||||
map.zoomControl.setPosition("topright");
 | 
			
		||||
 | 
			
		||||
var blueMarker = L.ExtraMarkers.icon({
 | 
			
		||||
  icon: 'fa-wikidata',
 | 
			
		||||
  markerColor: 'blue',
 | 
			
		||||
  shape: 'circle',
 | 
			
		||||
  prefix: 'fa',
 | 
			
		||||
  icon: "fa-wikidata",
 | 
			
		||||
  markerColor: "blue",
 | 
			
		||||
  shape: "circle",
 | 
			
		||||
  prefix: "fa",
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
var greenMarker = L.ExtraMarkers.icon({
 | 
			
		||||
  icon: 'fa-wikidata',
 | 
			
		||||
  markerColor: 'green',
 | 
			
		||||
  shape: 'circle',
 | 
			
		||||
  prefix: 'fa',
 | 
			
		||||
  icon: "fa-wikidata",
 | 
			
		||||
  markerColor: "green",
 | 
			
		||||
  shape: "circle",
 | 
			
		||||
  prefix: "fa",
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
var redMarker = L.ExtraMarkers.icon({
 | 
			
		||||
  icon: 'fa-wikidata',
 | 
			
		||||
  markerColor: 'red',
 | 
			
		||||
  shape: 'circle',
 | 
			
		||||
  prefix: 'fa',
 | 
			
		||||
  icon: "fa-wikidata",
 | 
			
		||||
  markerColor: "red",
 | 
			
		||||
  shape: "circle",
 | 
			
		||||
  prefix: "fa",
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
var osmYellowMarker = L.ExtraMarkers.icon({
 | 
			
		||||
  icon: 'fa-map',
 | 
			
		||||
  markerColor: 'yellow',
 | 
			
		||||
  shape: 'square',
 | 
			
		||||
  prefix: 'fa',
 | 
			
		||||
  icon: "fa-map",
 | 
			
		||||
  markerColor: "yellow",
 | 
			
		||||
  shape: "square",
 | 
			
		||||
  prefix: "fa",
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
var osmOrangeMarker = L.ExtraMarkers.icon({
 | 
			
		||||
  icon: 'fa-map',
 | 
			
		||||
  markerColor: 'orange',
 | 
			
		||||
  shape: 'square',
 | 
			
		||||
  prefix: 'fa',
 | 
			
		||||
  icon: "fa-map",
 | 
			
		||||
  markerColor: "orange",
 | 
			
		||||
  shape: "square",
 | 
			
		||||
  prefix: "fa",
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
if (!start_lat || !start_lng) {
 | 
			
		||||
  map.fitBounds([[49.85,-10.5], [58.75, 1.9]]);
 | 
			
		||||
  map.fitBounds([
 | 
			
		||||
    [49.85, -10.5],
 | 
			
		||||
    [58.75, 1.9],
 | 
			
		||||
  ]);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// Add OpenStreetMap layer
 | 
			
		||||
var osm = L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", { maxZoom: 19 });
 | 
			
		||||
var osm = L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
 | 
			
		||||
  maxZoom: 19,
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
osm.addTo(map);
 | 
			
		||||
 | 
			
		||||
function check_items(items) {
 | 
			
		||||
  if (items.length === 0)
 | 
			
		||||
    return;
 | 
			
		||||
  if (items.length === 0) return;
 | 
			
		||||
 | 
			
		||||
  var item = items.shift();
 | 
			
		||||
  var qid = item.qid;
 | 
			
		||||
 | 
			
		||||
  var markers_url = `/api/1/item/${qid}`;
 | 
			
		||||
  axios.get(markers_url).then(response => {
 | 
			
		||||
  axios.get(markers_url).then((response) => {
 | 
			
		||||
    // console.log(response.data, item);
 | 
			
		||||
    response.data.info.forEach(osm => {
 | 
			
		||||
    response.data.info.forEach((osm) => {
 | 
			
		||||
      var icon = osmYellowMarker;
 | 
			
		||||
      var marker = L.marker(osm.centroid, {title: osm.name, icon: icon});
 | 
			
		||||
      var marker = L.marker(osm.centroid, { title: osm.name, icon: icon });
 | 
			
		||||
      var popup = `
 | 
			
		||||
      <p>
 | 
			
		||||
        <a href="${osm.url}" target="_blank">${osm.identifier}</a>: ${osm.name}
 | 
			
		||||
      </p>`
 | 
			
		||||
      </p>`;
 | 
			
		||||
      marker.bindPopup(popup);
 | 
			
		||||
      marker.addTo(group);
 | 
			
		||||
 | 
			
		||||
    });
 | 
			
		||||
    item.markers.forEach(marker_data => {
 | 
			
		||||
    item.markers.forEach((marker_data) => {
 | 
			
		||||
      var marker = marker_data.marker;
 | 
			
		||||
      var icon = response.data.tagged ? greenMarker : redMarker;
 | 
			
		||||
      marker.setIcon(icon);
 | 
			
		||||
 | 
			
		||||
      response.data.info.forEach(osm => {
 | 
			
		||||
      response.data.info.forEach((osm) => {
 | 
			
		||||
        var path = [osm.centroid, marker_data];
 | 
			
		||||
        var polyline = L.polyline(path, {color: 'green'}).addTo(map);
 | 
			
		||||
        var polyline = L.polyline(path, { color: "green" }).addTo(map);
 | 
			
		||||
      });
 | 
			
		||||
 | 
			
		||||
    });
 | 
			
		||||
    if (items.length)
 | 
			
		||||
      check_items(items);
 | 
			
		||||
    if (items.length) check_items(items);
 | 
			
		||||
  });
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function update_wikidata() {
 | 
			
		||||
  if (Object.keys(wikidata_items).length === 0 || Object.keys(osm_objects).length === 0) {
 | 
			
		||||
  if (
 | 
			
		||||
    Object.keys(wikidata_items).length === 0 ||
 | 
			
		||||
    Object.keys(osm_objects).length === 0
 | 
			
		||||
  ) {
 | 
			
		||||
    if (wikidata_loaded && osm_loaded) {
 | 
			
		||||
        loading.classList.add("visually-hidden");
 | 
			
		||||
        load_text.classList.remove("visually-hidden");
 | 
			
		||||
      loading.classList.add("visually-hidden");
 | 
			
		||||
      load_text.classList.remove("visually-hidden");
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    return;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  for (const qid in osm_objects) {
 | 
			
		||||
      var osm_list = osm_objects[qid];
 | 
			
		||||
    var osm_list = osm_objects[qid];
 | 
			
		||||
 | 
			
		||||
      var item = wikidata_items[qid];
 | 
			
		||||
      if (!item) {
 | 
			
		||||
          osm_list.forEach(osm => {
 | 
			
		||||
            osm.marker.setIcon(osmOrangeMarker);
 | 
			
		||||
          });
 | 
			
		||||
          continue;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      if (item.lines === undefined)
 | 
			
		||||
        item.lines = [];
 | 
			
		||||
      item.markers.forEach(marker_data => {
 | 
			
		||||
        marker_data.marker.setIcon(greenMarker);
 | 
			
		||||
        osm_list.forEach(osm => {
 | 
			
		||||
          var path = [osm.centroid, marker_data];
 | 
			
		||||
          var polyline = L.polyline(path, {color: 'green'}).addTo(group);
 | 
			
		||||
          item.lines.push(polyline);
 | 
			
		||||
        });
 | 
			
		||||
    var item = wikidata_items[qid];
 | 
			
		||||
    if (!item) {
 | 
			
		||||
      osm_list.forEach((osm) => {
 | 
			
		||||
        osm.marker.setIcon(osmOrangeMarker);
 | 
			
		||||
      });
 | 
			
		||||
      continue;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    if (item.lines === undefined) item.lines = [];
 | 
			
		||||
    item.markers.forEach((marker_data) => {
 | 
			
		||||
      marker_data.marker.setIcon(greenMarker);
 | 
			
		||||
      osm_list.forEach((osm) => {
 | 
			
		||||
        var path = [osm.centroid, marker_data];
 | 
			
		||||
        var polyline = L.polyline(path, { color: "green" }).addTo(group);
 | 
			
		||||
        item.lines.push(polyline);
 | 
			
		||||
      });
 | 
			
		||||
    });
 | 
			
		||||
  }
 | 
			
		||||
  for (const qid in wikidata_items) {
 | 
			
		||||
      if (osm_objects[qid])
 | 
			
		||||
          continue;
 | 
			
		||||
      var item = wikidata_items[qid];
 | 
			
		||||
      item.markers.forEach(marker_data => {
 | 
			
		||||
          marker_data.marker.setIcon(redMarker);
 | 
			
		||||
      });
 | 
			
		||||
    if (osm_objects[qid]) continue;
 | 
			
		||||
    var item = wikidata_items[qid];
 | 
			
		||||
    item.markers.forEach((marker_data) => {
 | 
			
		||||
      marker_data.marker.setIcon(redMarker);
 | 
			
		||||
    });
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
    loading.classList.add("visually-hidden");
 | 
			
		||||
    load_text.classList.remove("visually-hidden");
 | 
			
		||||
  loading.classList.add("visually-hidden");
 | 
			
		||||
  load_text.classList.remove("visually-hidden");
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function isa_only(e) {
 | 
			
		||||
| 
						 | 
				
			
			@ -158,7 +159,7 @@ function isa_only(e) {
 | 
			
		|||
 | 
			
		||||
  var this_id = e.target.parentNode.childNodes[0].id;
 | 
			
		||||
 | 
			
		||||
  var checkbox_list = document.getElementsByClassName('isa-checkbox');
 | 
			
		||||
  var checkbox_list = document.getElementsByClassName("isa-checkbox");
 | 
			
		||||
 | 
			
		||||
  for (const checkbox of checkbox_list) {
 | 
			
		||||
    checkbox.checked = checkbox.id == this_id;
 | 
			
		||||
| 
						 | 
				
			
			@ -169,7 +170,7 @@ function isa_only(e) {
 | 
			
		|||
 | 
			
		||||
function show_all_isa(e) {
 | 
			
		||||
  e.preventDefault();
 | 
			
		||||
  var checkbox_list = document.getElementsByClassName('isa-checkbox');
 | 
			
		||||
  var checkbox_list = document.getElementsByClassName("isa-checkbox");
 | 
			
		||||
  for (const checkbox of checkbox_list) {
 | 
			
		||||
    checkbox.checked = true;
 | 
			
		||||
  }
 | 
			
		||||
| 
						 | 
				
			
			@ -178,20 +179,22 @@ function show_all_isa(e) {
 | 
			
		|||
}
 | 
			
		||||
 | 
			
		||||
function checkbox_change() {
 | 
			
		||||
  var checkbox_list = document.getElementsByClassName('isa-checkbox');
 | 
			
		||||
  var checkbox_list = document.getElementsByClassName("isa-checkbox");
 | 
			
		||||
  var ticked = [];
 | 
			
		||||
  for (const checkbox of checkbox_list) {
 | 
			
		||||
      if (checkbox.checked) {
 | 
			
		||||
        ticked.push(checkbox.id.substr(4));
 | 
			
		||||
      }
 | 
			
		||||
    if (checkbox.checked) {
 | 
			
		||||
      ticked.push(checkbox.id.substr(4));
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  for (const qid in wikidata_items) {
 | 
			
		||||
    var item = wikidata_items[qid];
 | 
			
		||||
    const item_isa_list = wikidata_items[qid]['isa_list'];
 | 
			
		||||
    const intersection = ticked.filter(isa_qid => item_isa_list.includes(isa_qid));
 | 
			
		||||
    const item_isa_list = wikidata_items[qid]["isa_list"];
 | 
			
		||||
    const intersection = ticked.filter((isa_qid) =>
 | 
			
		||||
      item_isa_list.includes(isa_qid)
 | 
			
		||||
    );
 | 
			
		||||
    if (item.lines) {
 | 
			
		||||
      item.lines.forEach(line => {
 | 
			
		||||
      item.lines.forEach((line) => {
 | 
			
		||||
        if (intersection.length) {
 | 
			
		||||
          line.addTo(group);
 | 
			
		||||
        } else {
 | 
			
		||||
| 
						 | 
				
			
			@ -200,7 +203,7 @@ function checkbox_change() {
 | 
			
		|||
      });
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    item.markers.forEach(marker_data => {
 | 
			
		||||
    item.markers.forEach((marker_data) => {
 | 
			
		||||
      var marker = marker_data.marker;
 | 
			
		||||
      if (intersection.length) {
 | 
			
		||||
        marker.addTo(group);
 | 
			
		||||
| 
						 | 
				
			
			@ -209,8 +212,8 @@ function checkbox_change() {
 | 
			
		|||
      }
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    if(osm_objects[qid]) {
 | 
			
		||||
      osm_objects[qid].forEach(osm => {
 | 
			
		||||
    if (osm_objects[qid]) {
 | 
			
		||||
      osm_objects[qid].forEach((osm) => {
 | 
			
		||||
        if (intersection.length) {
 | 
			
		||||
          osm.marker.addTo(group);
 | 
			
		||||
        } else {
 | 
			
		||||
| 
						 | 
				
			
			@ -219,8 +222,8 @@ function checkbox_change() {
 | 
			
		|||
      });
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    if(items[qid]) {
 | 
			
		||||
      items[qid].geojson.forEach(geojson => {
 | 
			
		||||
    if (items[qid]) {
 | 
			
		||||
      items[qid].geojson.forEach((geojson) => {
 | 
			
		||||
        if (intersection.length) {
 | 
			
		||||
          geojson.addTo(map);
 | 
			
		||||
        } else {
 | 
			
		||||
| 
						 | 
				
			
			@ -234,34 +237,36 @@ function checkbox_change() {
 | 
			
		|||
function set_isa_list(isa_count) {
 | 
			
		||||
  isa_card.classList.remove("visually-hidden");
 | 
			
		||||
  var isa_list = document.getElementById("isa-list");
 | 
			
		||||
  isa_list.innerHTML = '';
 | 
			
		||||
  isa_count.forEach(isa => {
 | 
			
		||||
  isa_list.innerHTML = "";
 | 
			
		||||
  isa_count.forEach((isa) => {
 | 
			
		||||
    isa_labels[isa.qid] = isa.label;
 | 
			
		||||
    var isa_id = `isa-${isa.qid}`;
 | 
			
		||||
    var e = document.createElement('div');
 | 
			
		||||
    e.setAttribute('class', 'isa-item');
 | 
			
		||||
    var e = document.createElement("div");
 | 
			
		||||
    e.setAttribute("class", "isa-item");
 | 
			
		||||
 | 
			
		||||
    var checkbox = document.createElement('input');
 | 
			
		||||
    checkbox.setAttribute('type', 'checkbox');
 | 
			
		||||
    checkbox.setAttribute('checked', 'checked');
 | 
			
		||||
    checkbox.setAttribute('id', isa_id);
 | 
			
		||||
    checkbox.setAttribute('class', 'isa-checkbox');
 | 
			
		||||
    var checkbox = document.createElement("input");
 | 
			
		||||
    checkbox.setAttribute("type", "checkbox");
 | 
			
		||||
    checkbox.setAttribute("checked", "checked");
 | 
			
		||||
    checkbox.setAttribute("id", isa_id);
 | 
			
		||||
    checkbox.setAttribute("class", "isa-checkbox");
 | 
			
		||||
    checkbox.onchange = checkbox_change;
 | 
			
		||||
    e.appendChild(checkbox);
 | 
			
		||||
 | 
			
		||||
    e.appendChild(document.createTextNode(' '));
 | 
			
		||||
    e.appendChild(document.createTextNode(" "));
 | 
			
		||||
 | 
			
		||||
    var label = document.createElement('label');
 | 
			
		||||
    label.setAttribute('for', isa_id);
 | 
			
		||||
    var label_text = document.createTextNode(` ${isa.label} (${isa.qid}): ${isa.count} `);
 | 
			
		||||
    var label = document.createElement("label");
 | 
			
		||||
    label.setAttribute("for", isa_id);
 | 
			
		||||
    var label_text = document.createTextNode(
 | 
			
		||||
      ` ${isa.label} (${isa.qid}): ${isa.count} `
 | 
			
		||||
    );
 | 
			
		||||
    label.appendChild(label_text);
 | 
			
		||||
 | 
			
		||||
    e.appendChild(label);
 | 
			
		||||
    e.appendChild(document.createTextNode(' '));
 | 
			
		||||
    e.appendChild(document.createTextNode(" "));
 | 
			
		||||
 | 
			
		||||
    var only = document.createElement('a');
 | 
			
		||||
    only.setAttribute('href', '#');
 | 
			
		||||
    var only_text = document.createTextNode('only');
 | 
			
		||||
    var only = document.createElement("a");
 | 
			
		||||
    only.setAttribute("href", "#");
 | 
			
		||||
    var only_text = document.createTextNode("only");
 | 
			
		||||
    only.appendChild(only_text);
 | 
			
		||||
    only.onclick = isa_only;
 | 
			
		||||
    e.appendChild(only);
 | 
			
		||||
| 
						 | 
				
			
			@ -271,38 +276,37 @@ function set_isa_list(isa_count) {
 | 
			
		|||
}
 | 
			
		||||
 | 
			
		||||
function add_wikidata_marker(item, marker_data) {
 | 
			
		||||
    var icon = blueMarker;
 | 
			
		||||
    var label = `${item.label} (${item.qid})`
 | 
			
		||||
    var marker = L.marker(marker_data, {icon: icon});
 | 
			
		||||
    // var tooltip = marker.bindTooltip(item.qid, {permanent: true, direction: 'bottom', opacity: 0.5});
 | 
			
		||||
    var wd_url = 'https://www.wikidata.org/wiki/' + item.qid;
 | 
			
		||||
    var popup = '<p><strong>Wikidata item</strong><br>'
 | 
			
		||||
    popup += `<a href="${wd_url}" target="_blank">${item.label}</a> (${item.qid})`
 | 
			
		||||
    if (item.description) {
 | 
			
		||||
      popup += `<br>description: ${item.description}`
 | 
			
		||||
  var icon = blueMarker;
 | 
			
		||||
  var label = `${item.label} (${item.qid})`;
 | 
			
		||||
  var marker = L.marker(marker_data, { icon: icon });
 | 
			
		||||
  // var tooltip = marker.bindTooltip(item.qid, {permanent: true, direction: 'bottom', opacity: 0.5});
 | 
			
		||||
  var wd_url = "https://www.wikidata.org/wiki/" + item.qid;
 | 
			
		||||
  var popup = "<p><strong>Wikidata item</strong><br>";
 | 
			
		||||
  popup += `<a href="${wd_url}" target="_blank">${item.label}</a> (${item.qid})`;
 | 
			
		||||
  if (item.description) {
 | 
			
		||||
    popup += `<br>description: ${item.description}`;
 | 
			
		||||
  }
 | 
			
		||||
  if (item.isa_list && item.isa_list.length) {
 | 
			
		||||
    popup += "<br><strong>item type</strong>";
 | 
			
		||||
    for (const [index, isa_qid] of item.isa_list.entries()) {
 | 
			
		||||
      var isa_url = "https://www.wikidata.org/wiki/" + isa_qid;
 | 
			
		||||
      var isa_label = isa_labels[isa_qid];
 | 
			
		||||
      popup += `<br><a href="${isa_url}" target="_blank">${isa_label}</a> (${isa_qid})`;
 | 
			
		||||
    }
 | 
			
		||||
    if (item.isa_list && item.isa_list.length) {
 | 
			
		||||
      popup += '<br><strong>item type</strong>'
 | 
			
		||||
      for (const [index, isa_qid] of item.isa_list.entries()) {
 | 
			
		||||
        var isa_url = 'https://www.wikidata.org/wiki/' + isa_qid;
 | 
			
		||||
        var isa_label = isa_labels[isa_qid];
 | 
			
		||||
        popup += `<br><a href="${isa_url}" target="_blank">${isa_label}</a> (${isa_qid})`;
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
    if (item.image_list && item.image_list.length) {
 | 
			
		||||
      popup += `<br><img src="/commons/${item.image_list[0]}">`;
 | 
			
		||||
    }
 | 
			
		||||
    popup += '</p>';
 | 
			
		||||
    marker.bindPopup(popup);
 | 
			
		||||
    marker.addTo(group);
 | 
			
		||||
    marker_data.marker = marker;
 | 
			
		||||
  }
 | 
			
		||||
  if (item.image_list && item.image_list.length) {
 | 
			
		||||
    popup += `<br><img src="/commons/${item.image_list[0]}">`;
 | 
			
		||||
  }
 | 
			
		||||
  popup += "</p>";
 | 
			
		||||
  marker.bindPopup(popup);
 | 
			
		||||
  marker.addTo(group);
 | 
			
		||||
  marker_data.marker = marker;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function load_wikidata_items() {
 | 
			
		||||
  var checkbox_list = document.getElementsByClassName('isa-checkbox');
 | 
			
		||||
  var checkbox_list = document.getElementsByClassName("isa-checkbox");
 | 
			
		||||
 | 
			
		||||
  for (const checkbox of checkbox_list)
 | 
			
		||||
      checkbox.checked = true;
 | 
			
		||||
  for (const checkbox of checkbox_list) checkbox.checked = true;
 | 
			
		||||
 | 
			
		||||
  checkbox_change();
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -312,18 +316,18 @@ function load_wikidata_items() {
 | 
			
		|||
  var bounds = map.getBounds();
 | 
			
		||||
  console.log("map moved", bounds.toBBoxString());
 | 
			
		||||
 | 
			
		||||
  var params = {bounds: bounds.toBBoxString()};
 | 
			
		||||
  var params = { bounds: bounds.toBBoxString() };
 | 
			
		||||
  var items_url = "/api/1/items";
 | 
			
		||||
 | 
			
		||||
  axios.get(items_url, {params: params}).then(response => {
 | 
			
		||||
  axios.get(items_url, { params: params }).then((response) => {
 | 
			
		||||
    set_isa_list(response.data.isa_count);
 | 
			
		||||
    var items = response.data.items;
 | 
			
		||||
    items.forEach(item => {
 | 
			
		||||
        if (item.qid in wikidata_items)
 | 
			
		||||
            return;
 | 
			
		||||
        item.markers.forEach(marker_data => add_wikidata_marker(item, marker_data));
 | 
			
		||||
        wikidata_items[item.qid] = item;
 | 
			
		||||
 | 
			
		||||
    items.forEach((item) => {
 | 
			
		||||
      if (item.qid in wikidata_items) return;
 | 
			
		||||
      item.markers.forEach((marker_data) =>
 | 
			
		||||
        add_wikidata_marker(item, marker_data)
 | 
			
		||||
      );
 | 
			
		||||
      wikidata_items[item.qid] = item;
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    wikidata_loaded = true;
 | 
			
		||||
| 
						 | 
				
			
			@ -331,38 +335,35 @@ function load_wikidata_items() {
 | 
			
		|||
    update_wikidata();
 | 
			
		||||
  });
 | 
			
		||||
  var osm_objects_url = "/api/1/osm";
 | 
			
		||||
  axios.get(osm_objects_url, {params: params}).then(response => {
 | 
			
		||||
  axios.get(osm_objects_url, { params: params }).then((response) => {
 | 
			
		||||
    console.log(`${response.data.duration} seconds`);
 | 
			
		||||
    response.data.objects.forEach(osm => {
 | 
			
		||||
    response.data.objects.forEach((osm) => {
 | 
			
		||||
      var qid = osm.wikidata;
 | 
			
		||||
      if (osm_objects[qid] === undefined)
 | 
			
		||||
          osm_objects[qid] = [];
 | 
			
		||||
      if (osm_objects[qid] === undefined) osm_objects[qid] = [];
 | 
			
		||||
      osm_objects[qid].push(osm);
 | 
			
		||||
 | 
			
		||||
      var icon = osmYellowMarker;
 | 
			
		||||
      var marker = L.marker(osm.centroid, {title: osm.name, icon: icon});
 | 
			
		||||
      var marker = L.marker(osm.centroid, { title: osm.name, icon: icon });
 | 
			
		||||
      osm.marker = marker;
 | 
			
		||||
      var wd_url = 'https://www.wikidata.org/wiki/' + qid;
 | 
			
		||||
      var wd_url = "https://www.wikidata.org/wiki/" + qid;
 | 
			
		||||
      var popup = `
 | 
			
		||||
      <p>
 | 
			
		||||
        ${osm.name}:
 | 
			
		||||
        <a href="${osm.url}" target="_blank">${osm.identifier}</a>
 | 
			
		||||
        <br>
 | 
			
		||||
        Wikidata tag: <a href="${wd_url}" target="_blank">${qid}</a>
 | 
			
		||||
      </p>`
 | 
			
		||||
      </p>`;
 | 
			
		||||
      marker.bindPopup(popup);
 | 
			
		||||
      marker.addTo(group);
 | 
			
		||||
 | 
			
		||||
      if (osm.type != 'node' && osm.geojson) {
 | 
			
		||||
        var mapStyle = {fillOpacity: 0};
 | 
			
		||||
        var geojson = L.geoJSON(null, {style: mapStyle});
 | 
			
		||||
      if (osm.type != "node" && osm.geojson) {
 | 
			
		||||
        var mapStyle = { fillOpacity: 0 };
 | 
			
		||||
        var geojson = L.geoJSON(null, { style: mapStyle });
 | 
			
		||||
        geojson.addTo(map);
 | 
			
		||||
        geojson.addData(osm.geojson);
 | 
			
		||||
 | 
			
		||||
        if (items[qid] === undefined)
 | 
			
		||||
          items[qid] = {};
 | 
			
		||||
        if (items[qid].geojson === undefined)
 | 
			
		||||
          items[qid].geojson = [];
 | 
			
		||||
        if (items[qid] === undefined) items[qid] = {};
 | 
			
		||||
        if (items[qid].geojson === undefined) items[qid].geojson = [];
 | 
			
		||||
 | 
			
		||||
        items[qid].geojson.push(geojson);
 | 
			
		||||
      }
 | 
			
		||||
| 
						 | 
				
			
			@ -371,35 +372,32 @@ function load_wikidata_items() {
 | 
			
		|||
    osm_loaded = true;
 | 
			
		||||
    update_wikidata();
 | 
			
		||||
  });
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
document.getElementById("show-all-isa").onclick = show_all_isa;
 | 
			
		||||
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
document.getElementById('show-all-isa').onclick = show_all_isa;
 | 
			
		||||
 | 
			
		||||
var load_btn = document.getElementById('load-btn');
 | 
			
		||||
var load_btn = document.getElementById("load-btn");
 | 
			
		||||
load_btn.onclick = load_wikidata_items;
 | 
			
		||||
 | 
			
		||||
var search_btn = document.getElementById('search-btn');
 | 
			
		||||
var search_form = document.getElementById('search-form');
 | 
			
		||||
search_form.onsubmit = function(e) {
 | 
			
		||||
var search_btn = document.getElementById("search-btn");
 | 
			
		||||
var search_form = document.getElementById("search-form");
 | 
			
		||||
search_form.onsubmit = function (e) {
 | 
			
		||||
  e.preventDefault();
 | 
			
		||||
  var search_text = document.getElementById('search-text').value.trim();
 | 
			
		||||
  if (!search_text)
 | 
			
		||||
    return;
 | 
			
		||||
  var params = {q: search_text};
 | 
			
		||||
  var search_text = document.getElementById("search-text").value.trim();
 | 
			
		||||
  if (!search_text) return;
 | 
			
		||||
  var params = { q: search_text };
 | 
			
		||||
  var search_url = "/api/1/search";
 | 
			
		||||
  var search_results = document.getElementById('search-results');
 | 
			
		||||
  axios.get(search_url, {params: params}).then(response => {
 | 
			
		||||
    search_results.innerHTML = '';
 | 
			
		||||
    response.data.hits.forEach(hit => {
 | 
			
		||||
      var e = document.createElement('div');
 | 
			
		||||
      var category = document.createTextNode(hit.category + ' ');
 | 
			
		||||
  var search_results = document.getElementById("search-results");
 | 
			
		||||
  axios.get(search_url, { params: params }).then((response) => {
 | 
			
		||||
    search_results.innerHTML = "";
 | 
			
		||||
    response.data.hits.forEach((hit) => {
 | 
			
		||||
      var e = document.createElement("div");
 | 
			
		||||
      var category = document.createTextNode(hit.category + " ");
 | 
			
		||||
      e.appendChild(category);
 | 
			
		||||
      var a = document.createElement('a');
 | 
			
		||||
      var a = document.createElement("a");
 | 
			
		||||
      var lat = parseFloat(hit.lat).toFixed(5);
 | 
			
		||||
      var lon = parseFloat(hit.lon).toFixed(5);
 | 
			
		||||
      a.setAttribute('href', `/map/15/${lat}/${lon}`);
 | 
			
		||||
      a.setAttribute("href", `/map/15/${lat}/${lon}`);
 | 
			
		||||
      var link_text = document.createTextNode(hit.name);
 | 
			
		||||
      a.appendChild(link_text);
 | 
			
		||||
      e.appendChild(a);
 | 
			
		||||
| 
						 | 
				
			
			@ -407,9 +405,9 @@ search_form.onsubmit = function(e) {
 | 
			
		|||
    });
 | 
			
		||||
    console.log(response.data);
 | 
			
		||||
  });
 | 
			
		||||
}
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
map.on('moveend', function (e) {
 | 
			
		||||
map.on("moveend", function (e) {
 | 
			
		||||
  var zoom = map.getZoom();
 | 
			
		||||
  var c = map.getCenter();
 | 
			
		||||
  var lat = c.lat.toFixed(5);
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
		Reference in a new issue