-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathslide.js
86 lines (81 loc) · 3.37 KB
/
slide.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
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
81
82
83
84
85
86
// courtesy https://html-online.com/articles/get-url-parameters-javascript/
function getUrlVars() {
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
return vars;
}
//See: http://www.css-101.org/articles/ken-burns_effect/css-transition.php
function slide(section) {
// todo fix tricky hack to pass json list via section
if (section.indexOf(".json") > 0) {
getjsonf(section, function(data2){
if (data2)
Object.entries(data2).forEach((entry) => {
const [key2, value2] = entry;
imageurl[key2] = value2;
});
});
};
// parse json image url
Object.entries(imageurl).forEach((entry) => {
const [key, value] = entry;
if (value.private === false && (value.name == section || section == 'all') || section.indexOf(".json") > 0) {
var image = new Image();
image.src = value.href;
image.alt = value.name;
document.getElementById("slideshowcanvas").appendChild(image);
};
});
document.getElementById('slideshow').getElementsByTagName('img')[0].className = "fx";
// this calls the kenBurns function every 4 seconds
// you can increase or decrease this value to get different effects
window.setInterval(kenBurns, 6000);
var images = document.getElementById('slideshow').getElementsByTagName('img'),
numberOfImages = images.length,
i = 1;
function kenBurns() {
// hide spinner
document.getElementsByClassName('spinner')[0].style.visibility = 'hidden';
if(i==numberOfImages){ i = 0;}
images[i].className = "fx";
//document.getElementById("date").innerHTML = document.getElementById("date").innerHTML + " - " + images[i].alt;
// we can't remove the class from the previous element or we'd get a bouncing effect so we clean up the one before last
// (there must be a smarter way to do this though)
if(i===0){ images[numberOfImages-2].className = "";}
if(i===1){ images[numberOfImages-1].className = "";}
if(i>1){ images[i-2].className = "";}
i++;
}
//window.alert(section);
};
slide(getUrlVars()["section"])
// toggle fullscreen
var elem = document.documentElement;
function togglefullscreen() {
var isFullScreen = document.fullScreen ||
document.mozFullScreen ||
document.webkitIsFullScreen || (document.msFullscreenElement != null);
if (isFullScreen) {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitExitFullscreen) {/* Safari */
document.webkitExitFullscreen();
} else if (document.msExitFullscreen) {/* IE11 */
document.msExitFullscreen();
} else if (document.mozCancelFullScreen) {/* IE11 */
document.mozCancelFullScreen();
}
} else {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen) {/* Safari */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) {/* IE11 */
elem.msRequestFullscreen();
} else if (elem.mozRequestFullScreen) {/* seamonkey */
elem.mozRequestFullScreen();
}
}
}