reset search on sounds nav button

reset search on escape key
This commit is contained in:
Erhard 2017-08-03 19:39:02 +02:00
parent 4c34d4ac0e
commit 6758be0396
2 changed files with 28 additions and 9 deletions

View File

@ -30,6 +30,7 @@ ready(function() {
var searchfield = document.querySelector("#search"); var searchfield = document.querySelector("#search");
searchfield.addEventListener("keyup", function() { searchfield.addEventListener("keyup", function() {
var buttons = document.querySelectorAll(".sound"); var buttons = document.querySelectorAll(".sound");
buttons.forEach(function(item) { buttons.forEach(function(item) {
@ -46,17 +47,33 @@ ready(function() {
}); });
var reset = document.querySelector("#reset"); var reset = document.querySelector("#reset");
var sounds_nav = document.querySelector("#sounds-nav");
reset.addEventListener("click", function() { reset.addEventListener("click", resetSearch, false);
sounds_nav.addEventListener("click", resetSearch, false);
document.onkeydown = function(evt) {
evt = evt || window.event;
if (evt.keyCode == 27) {
resetSearch();
}
};
});
function resetSearch() {
var searchfield = document.querySelector("#search");
var buttons = document.querySelectorAll(".sound"); var buttons = document.querySelectorAll(".sound");
searchfield.blur();
buttons.forEach(function(item) { buttons.forEach(function(item) {
item.style.display = "inline-block"; item.style.display = "inline-block";
}); });
searchfield.value = ""; searchfield.value = "";
}); }
});
function hideSections() { function hideSections() {
var sections = document.querySelectorAll("section"); var sections = document.querySelectorAll("section");
@ -78,3 +95,4 @@ function ajaxRequest(filename){
return false; return false;
} }
} }

View File

@ -30,7 +30,7 @@
</head> </head>
<body> <body>
<nav> <nav>
<a href="#sounds" id="reset">Sounds</a> <a href="#sounds" id="sounds-nav">Sounds</a>
<a href="#youtube">YouTube</a> <a href="#youtube">YouTube</a>
<a href="#voice">Voice</a> <a href="#voice">Voice</a>
</nav> </nav>
@ -67,3 +67,4 @@
<script src="/static/main.js"></script> <script src="/static/main.js"></script>
</body> </body>
</html> </html>