Huguet57 | ae6d974 | 2018-07-23 01:07:26 +0200 | [diff] [blame] | 1 | // Get the box
|
| 2 | var searchBox = document.getElementById('searchBox');
|
| 3 |
|
| 4 | // Get the button that opens the box
|
| 5 | var searchButton = document.getElementById("searchButton");
|
| 6 |
|
| 7 | // Get the <span> element that closes the box
|
| 8 | var closeBox = document.getElementsByClassName("closeBox")[0];
|
| 9 |
|
| 10 | // When the user clicks the button, open the box
|
| 11 | searchButton.onclick = function() {
|
Huguet57 | ac6d0c5 | 2018-07-23 18:37:16 +0200 | [diff] [blame] | 12 | dialog.close();
|
Huguet57 | ae6d974 | 2018-07-23 01:07:26 +0200 | [diff] [blame] | 13 | searchBox.style.display = "block";
|
Huguet57 | 004b155 | 2018-07-23 03:29:12 +0200 | [diff] [blame] | 14 | // Focus on the search input bar
|
| 15 | document.getElementById("searchInput").focus();
|
Huguet57 | ae6d974 | 2018-07-23 01:07:26 +0200 | [diff] [blame] | 16 | }
|
| 17 |
|
| 18 | // When the user clicks on <span> (x), close the box
|
| 19 | closeBox.onclick = function() {
|
| 20 | searchBox.style.display = "none";
|
Huguet57 | 004b155 | 2018-07-23 03:29:12 +0200 | [diff] [blame] | 21 | // Empty the input bar
|
| 22 | var searchInput = document.getElementById('searchInput');
|
| 23 | searchInput.value = "";
|
Huguet57 | ae6d974 | 2018-07-23 01:07:26 +0200 | [diff] [blame] | 24 | }
|
| 25 |
|
| 26 | // When the user clicks anywhere outside of the box, close it
|
| 27 | window.onclick = function(event) {
|
| 28 | if (event.target == searchBox) {
|
| 29 | searchBox.style.display = "none";
|
Huguet57 | 004b155 | 2018-07-23 03:29:12 +0200 | [diff] [blame] | 30 | // Empty the input bar
|
| 31 | var searchInput = document.getElementById('searchInput');
|
| 32 | searchInput.value = "";
|
Huguet57 | ae6d974 | 2018-07-23 01:07:26 +0200 | [diff] [blame] | 33 | }
|
| 34 | } |