blob: ae6582e75d9e8d1c5efa696711980b5779f3082a [file] [log] [blame]
JJ Allaireefa6ad42016-01-30 13:12:05 -05001/*
2 * Handles finding a text string anywhere in the slides and showing the next occurrence to the user
3 * by navigatating to that slide and highlighting it.
4 *
5 * By Jon Snyder <snyder.jon@gmail.com>, February 2013
6 */
7
8var RevealSearch = (function() {
9
10 var matchedSlides;
11 var currentMatchedIndex;
12 var searchboxDirty;
13 var myHilitor;
14
15// Original JavaScript code by Chirp Internet: www.chirp.com.au
16// Please acknowledge use of this code by including this header.
17// 2/2013 jon: modified regex to display any match, not restricted to word boundaries.
18
19function Hilitor(id, tag)
20{
21
22 var targetNode = document.getElementById(id) || document.body;
23 var hiliteTag = tag || "EM";
24 var skipTags = new RegExp("^(?:" + hiliteTag + "|SCRIPT|FORM|SPAN)$");
25 var colors = ["#ff6", "#a0ffff", "#9f9", "#f99", "#f6f"];
26 var wordColor = [];
27 var colorIdx = 0;
28 var matchRegex = "";
29 var matchingSlides = [];
30
31 this.setRegex = function(input)
32 {
33 input = input.replace(/^[^\w]+|[^\w]+$/g, "").replace(/[^\w'-]+/g, "|");
34 matchRegex = new RegExp("(" + input + ")","i");
35 }
36
37 this.getRegex = function()
38 {
39 return matchRegex.toString().replace(/^\/\\b\(|\)\\b\/i$/g, "").replace(/\|/g, " ");
40 }
41
42 // recursively apply word highlighting
43 this.hiliteWords = function(node)
44 {
45 if(node == undefined || !node) return;
46 if(!matchRegex) return;
47 if(skipTags.test(node.nodeName)) return;
48
49 if(node.hasChildNodes()) {
50 for(var i=0; i < node.childNodes.length; i++)
51 this.hiliteWords(node.childNodes[i]);
52 }
53 if(node.nodeType == 3) { // NODE_TEXT
54 if((nv = node.nodeValue) && (regs = matchRegex.exec(nv))) {
55 //find the slide's section element and save it in our list of matching slides
56 var secnode = node.parentNode;
57 while (secnode.nodeName != 'SECTION') {
58 secnode = secnode.parentNode;
59 }
60
61 var slideIndex = Reveal.getIndices(secnode);
62 var slidelen = matchingSlides.length;
63 var alreadyAdded = false;
64 for (var i=0; i < slidelen; i++) {
65 if ( (matchingSlides[i].h === slideIndex.h) && (matchingSlides[i].v === slideIndex.v) ) {
66 alreadyAdded = true;
67 }
68 }
69 if (! alreadyAdded) {
70 matchingSlides.push(slideIndex);
71 }
72
73 if(!wordColor[regs[0].toLowerCase()]) {
74 wordColor[regs[0].toLowerCase()] = colors[colorIdx++ % colors.length];
75 }
76
77 var match = document.createElement(hiliteTag);
78 match.appendChild(document.createTextNode(regs[0]));
79 match.style.backgroundColor = wordColor[regs[0].toLowerCase()];
80 match.style.fontStyle = "inherit";
81 match.style.color = "#000";
82
83 var after = node.splitText(regs.index);
84 after.nodeValue = after.nodeValue.substring(regs[0].length);
85 node.parentNode.insertBefore(match, after);
86 }
87 }
88 };
89
90 // remove highlighting
91 this.remove = function()
92 {
93 var arr = document.getElementsByTagName(hiliteTag);
94 while(arr.length && (el = arr[0])) {
95 el.parentNode.replaceChild(el.firstChild, el);
96 }
97 };
98
99 // start highlighting at target node
100 this.apply = function(input)
101 {
102 if(input == undefined || !input) return;
103 this.remove();
104 this.setRegex(input);
105 this.hiliteWords(targetNode);
106 return matchingSlides;
107 };
108
109}
110
111 function openSearch() {
112 //ensure the search term input dialog is visible and has focus:
113 var inputbox = document.getElementById("searchinput");
114 inputbox.style.display = "inline";
115 inputbox.focus();
116 inputbox.select();
117 }
118
119 function toggleSearch() {
120 var inputbox = document.getElementById("searchinput");
121 if (inputbox.style.display !== "inline") {
122 openSearch();
123 }
124 else {
125 inputbox.style.display = "none";
126 myHilitor.remove();
127 }
128 }
129
130 function doSearch() {
131 //if there's been a change in the search term, perform a new search:
132 if (searchboxDirty) {
133 var searchstring = document.getElementById("searchinput").value;
134
135 //find the keyword amongst the slides
136 myHilitor = new Hilitor("slidecontent");
137 matchedSlides = myHilitor.apply(searchstring);
138 currentMatchedIndex = 0;
139 }
140
141 //navigate to the next slide that has the keyword, wrapping to the first if necessary
142 if (matchedSlides.length && (matchedSlides.length <= currentMatchedIndex)) {
143 currentMatchedIndex = 0;
144 }
145 if (matchedSlides.length > currentMatchedIndex) {
146 Reveal.slide(matchedSlides[currentMatchedIndex].h, matchedSlides[currentMatchedIndex].v);
147 currentMatchedIndex++;
148 }
149 }
150
151 var dom = {};
152 dom.wrapper = document.querySelector( '.reveal' );
153
154 if( !dom.wrapper.querySelector( '.searchbox' ) ) {
155 var searchElement = document.createElement( 'div' );
156 searchElement.id = "searchinputdiv";
157 searchElement.classList.add( 'searchdiv' );
158 searchElement.style.position = 'absolute';
159 searchElement.style.top = '10px';
160 searchElement.style.left = '10px';
161 //embedded base64 search icon Designed by Sketchdock - http://www.sketchdock.com/:
162 searchElement.innerHTML = '<span><input type="search" id="searchinput" class="searchinput" style="vertical-align: top;"/><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAJiSURBVHjatFZNaxNBGH5md+Mmu92NVdKDRipSAyqCghgQD4L4cRe86UUtAQ+eFCxoa4/25EXBFi8eBE+eRPoDhB6KgiiixdAPCEkx2pjvTXadd9yNsflwuyUDD/O+u8PzzDPvzOwyx3EwyCZhwG3gAkp7MnpjgbopjsltcD4gjuXZZKeAR348MYLYTm3LzOs/y3j3JTfZxgXWXmTuwPHIc4VmoOmv5IrI53+AO2DdHLjkDWQ3GoEEVFXtXQOvkSnPWcyUceviLhwbDYv8/XIVj97kse7TodLvZXxYxrPUHkQ1ufXs3FEdybEIxucySOesoNvUgWU1cP3MkCBfTFdw9fGaAMVmRELq7LBw2Q3/FaAxxWIRpw+ZIr/7IouPqzUBiqmdHAv7EuhRAwf1er2Vy4x1jW3b2d5Jfvu5IPp7l2LYbcgCFFNb+FoJ7oBqEAqFMPNqFcmEgVMJDfMT+1tvN0pNjERlMS6QA5pFOKxiKVPFhakPeL3It+WGJUDxt2wFR+JhzI7v5ctkd8DXOZAkCYYxhO+lKm4+Xfqz/rIixBuNBl7eOYzkQQNzqX249mRl6zUgEcYkaJrGhUwBinVdh6IouPzwE6/DL5w4oLkH8y981aDf+uq6hlKpJESiUdNfDZi7/ehG9K6KfiA3pml0PLcsq+cSMTj2NL9ukc4UOmz7AZ3+crkC4mHujFvXNaMFB3bEr8xPS6p5O+jXxq4VZtaen7/PwzrntjcLUE0iHPS1Ud1cdiEJl/8WivZk0wXd7zWOMkeF8s0CcAmkNrC2nvXZDbbbN73ccYnZoH9bfgswAFzAe9/h3dbKAAAAAElFTkSuQmCC" id="searchbutton" class="searchicon" style="vertical-align: top; margin-top: -1px;"/></span>';
163 dom.wrapper.appendChild( searchElement );
164 }
165
166 document.getElementById("searchbutton").addEventListener( 'click', function(event) {
167 doSearch();
168 }, false );
169
170 document.getElementById("searchinput").addEventListener( 'keyup', function( event ) {
171 switch (event.keyCode) {
172 case 13:
173 event.preventDefault();
174 doSearch();
175 searchboxDirty = false;
176 break;
177 default:
178 searchboxDirty = true;
179 }
180 }, false );
181
182 // Open the search when the 's' key is hit (yes, this conflicts with the notes plugin, disabling for now)
183 /*
184 document.addEventListener( 'keydown', function( event ) {
185 // Disregard the event if the target is editable or a
186 // modifier is present
187 if ( document.querySelector( ':focus' ) !== null || event.shiftKey || event.altKey || event.ctrlKey || event.metaKey ) return;
188
189 if( event.keyCode === 83 ) {
190 event.preventDefault();
191 openSearch();
192 }
193 }, false );
194*/
195 return { open: openSearch };
196})();