blob: 39d28e4342b4b842eb5ee913f55c160067151caf [file] [log] [blame]
Christophe Dervieuxe1893ae2021-10-07 17:09:02 +02001/*****************************************************************
2** Author: Asvin Goel, goel@telematique.eu
3**
4** A plugin replacing the default controls by custom controls.
5**
Marc Kupietz09b75752023-10-07 09:32:19 +02006** Version: 2.0.1
Christophe Dervieuxe1893ae2021-10-07 17:09:02 +02007**
8** License: MIT license (see LICENSE.md)
9**
10******************************************************************/
11window.RevealCustomControls = window.RevealCustomControls || {
12 id: 'RevealCustomControls',
13 init: function(deck) {
14 initCustomControls(deck);
15 }
16};
17
18const initCustomControls = function(Reveal){
19 var config = Reveal.getConfig().customcontrols || {};
20
Marc Kupietz09b75752023-10-07 09:32:19 +020021 if (Reveal.isSpeakerNotes() && new URLSearchParams(location.search).get('controls') == 'false') return;
22 if (!config?.controls?.length) return this;
23
Christophe Dervieuxe1893ae2021-10-07 17:09:02 +020024 var collapseIcon = config.collapseIcon || '<i class="fa fa-chevron-down"></i>';
25 var expandIcon = config.expandIcon || '<i class="fa fa-chevron-up"></i>';
26 var tooltip = config.tooltip || 'Show/hide controls';
27
28 var div = document.createElement( 'div' );
29 div.id = 'customcontrols';
30
31 var toggleButton = document.createElement( 'button' );
32 toggleButton.title = tooltip;
33 toggleButton.innerHTML = '<span id="collapse-customcontrols">' + collapseIcon + '</span>' + '<span id="expand-customcontrols">' + expandIcon + '</span>';
34
35 toggleButton.addEventListener('click', function( event ) {
36 var div = document.querySelector("div#customcontrols");
37 if ( div.classList.contains('collapsed') ) {
38 div.classList.remove('collapsed');
39 }
40 else {
41 div.classList.add('collapsed');
42 }
Marc Kupietz09b75752023-10-07 09:32:19 +020043 toggleButton.blur(); // unfocus button
Christophe Dervieuxe1893ae2021-10-07 17:09:02 +020044 });
45
46 div.appendChild(toggleButton);
47
48 var controls = document.createElement( 'ul' );
49 for (var i = 0; i < config.controls.length; i++ ) {
50 var control = document.createElement( 'li' );
51 if ( config.controls[i].id ) {
52 control.id = config.controls[i].id;
53 }
54 control.innerHTML = '<button ' + ( config.controls[i].title ? 'title="' + config.controls[i].title + '" ': '' ) + 'onclick="' + config.controls[i].action + '">' + config.controls[i].icon + '</button>';
55 controls.appendChild( control );
56 }
57 div.appendChild( controls );
58
59
60 document.querySelector(".reveal").appendChild( div );
61
62 document.addEventListener( 'resize', function( event ) {
63 // expand controls to make sure they are visible
64 var div = document.querySelector("div#customcontrols.collapsed");
65 if ( div ) {
66 div.classList.remove('collapsed');
67 }
68 } );
69
70 return this;
71
72};
73