summaryrefslogtreecommitdiff
path: root/html/slideshow.js
blob: ea265e4d7158bb741ca4e5e7592d5f01a106fe4b (plain)
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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
selection = []
visited = []
current = 0
playing = 1

document.addEventListener('keyup', function(event) {
  if(event.keyCode == 37) { prev() } // left
  else if(event.keyCode == 39) { next() } // right
  else if(event.keyCode == 32) {
    toggle_play()
  } // space
  else if(event.keyCode == 13) { new_selection() } // enter
});

function new_selection() {
  images = Object.keys(distances)
  start = images[Math.floor(Math.random()*images.length)]
  sortable = []
  for (file in distances[start]) {
    if (visited.indexOf(file) == -1) { // not in visited
      sortable.push([file,distances[start][file]]) // objects cannot be sorted in js, use array instead
    }
  }
  n = 6
  selection = []
  sorted = sortable.sort(function(a, b) { return a[1] - b[1]; }).slice(0,n); // sort by distance, get first n elements
  sorted.forEach(function(img,index) { 
    selection.push(img[0])
    visited.push(img[0])
  }) 
  selection = selection.sort(() => Math.random() - 0.5); // shuffle
  current = 0
  update()
}

function src(id,path) { document.getElementById(id).src = path }
function onclick(id,fun) { document.getElementById(id).onclick = fun }

function hide_controls() {
  document.getElementById("prev").style.display = "none"
  document.getElementById("next").style.display = "none"
}

function show_controls() {
  document.getElementById("prev").style.display = "block"
  document.getElementById("next").style.display = "block"
}

function toggle_play() { playing == 1 ? stop() : play() }

function play() {
  playing = 1
  interval = setInterval(function () { next() }, 3000);
  document.getElementById("play-indicator").title = "Pause slideshow"
  document.getElementById("play-indicator").className = "fa fa-pause"
  hide_controls()
}

function stop() {
  playing = 0
  clearInterval(interval)
  document.getElementById("play-indicator").title = "Play slideshow"
  document.getElementById("play-indicator").className = "fa fa-play"
  show_controls()
}

function prev() {
  current = (current-1+selection.length) % selection.length // js % cannot handle negative values
  update()
}

function next() {
  current = (current+1) % selection.length
  update()
}

function update() {
  src('image',"https://media.pdp8.info/pictures/"+selection[current])
}