blob: e3cc342ea193c1e404d0d939f04cb932544383d3 (
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
|
// page
const fullscreen = document.getElementById('fullscreen');
const fullscreenIcon = document.getElementById('fullscreen-icon');
const smallscreenIcon = document.getElementById('smallscreen-icon');
const elem = document.documentElement;
// Functions
function toggleFullscreen(event) {
// check if the event is a keydown event or a click event
if (event.type === 'keydown') {
// check if the key pressed is '/' key
if (event.key !== '/') return;
}
if (document.fullscreenElement) {
closeFullscreen();
} else {
openFullscreen();
}
}
function openFullscreen() {
smallscreenIcon.classList.toggle('hide');
fullscreenIcon.classList.toggle('hide');
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen) { /* Safari */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE11 */
elem.msRequestFullscreen();
}
}
function closeFullscreen() {
smallscreenIcon.classList.toggle('hide');
fullscreenIcon.classList.toggle('hide');
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitExitFullscreen) { /* Safari */
document.webkitExitFullscreen();
} else if (document.msExitFullscreen) { /* IE11 */
document.msExitFullscreen();
}
}
// Listeners
fullscreen.addEventListener('click', toggleFullscreen);
document.addEventListener('keydown', toggleFullscreen);
|