static/js/map-list.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

var ul = document.getElementById('links');

function add_entry_to_list(name, marker) {
  // This is run by map foreach marker, to add each marker to list

  // Add image text to list
  var link = document.createElement('a');
  var pin = document.createElement('img');

  pin.classList.add('link-pin');
  pin.setAttribute('src', './static/icons/pin.svg');

  link.innerHTML = `${name}`;
  link.addEventListener('click', function(event) {
    // Scroll map into view on list click, for phone view
    map_element.scrollIntoView()

    focus_marker(marker);
    // Append open image name to url to allow user to link to a specific image
    history.pushState({}, null, `#${name}`);
  });

  var listItem = document.createElement('li');
  listItem.appendChild(link);
  ul.appendChild(listItem);
}