Mercurial > gemma
comparison client/src/application/Topbar.vue @ 965:ac2e51d5bc40
feat: autofocus when search expands
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Wed, 17 Oct 2018 15:33:59 +0200 |
parents | ec9c3a111bb7 |
children | 6114c512508b |
comparison
equal
deleted
inserted
replaced
964:1e2dce348cfb | 965:ac2e51d5bc40 |
---|---|
105 | 105 |
106 import { displayError } from "../application/lib/errors.js"; | 106 import { displayError } from "../application/lib/errors.js"; |
107 import { HTTP } from "../application/lib/http"; | 107 import { HTTP } from "../application/lib/http"; |
108 import Identify from "../layers/Identify"; | 108 import Identify from "../layers/Identify"; |
109 import Layers from "../layers/Layers"; | 109 import Layers from "../layers/Layers"; |
110 | |
111 const setFocus = () => document.querySelector("#search").focus(); | |
110 | 112 |
111 export default { | 113 export default { |
112 name: "topbar", | 114 name: "topbar", |
113 components: { | 115 components: { |
114 Identify: Identify, | 116 Identify: Identify, |
208 } | 210 } |
209 // this.searchQuery = ""; // clear search query again | 211 // this.searchQuery = ""; // clear search query again |
210 this.toggleSearchbar(); | 212 this.toggleSearchbar(); |
211 }, | 213 }, |
212 toggleSearchbar() { | 214 toggleSearchbar() { |
215 if (this.searchbarCollapsed) { | |
216 setTimeout(setFocus, 300); | |
217 } | |
213 this.searchbarCollapsed = !this.searchbarCollapsed; | 218 this.searchbarCollapsed = !this.searchbarCollapsed; |
214 }, | 219 }, |
215 toggleSidebar() { | 220 toggleSidebar() { |
216 this.$store.commit("application/toggleSidebar"); | 221 this.$store.commit("application/toggleSidebar"); |
217 }, | 222 }, |