diff options
| -rw-r--r-- | ext/bg/js/backend.js | 6 | ||||
| -rw-r--r-- | ext/bg/js/search.js | 37 | ||||
| -rw-r--r-- | ext/bg/search.html | 34 | ||||
| -rw-r--r-- | ext/mixed/css/display.css | 4 |
4 files changed, 44 insertions, 37 deletions
diff --git a/ext/bg/js/backend.js b/ext/bg/js/backend.js index a9f2385b..bdb8a76a 100644 --- a/ext/bg/js/backend.js +++ b/ext/bg/js/backend.js @@ -603,8 +603,10 @@ class Backend { const {popupWidth, popupHeight} = options.general; const baseUrl = chrome.runtime.getURL('/bg/search.html'); - const queryString = (query && query.length > 0) ? `?query=${encodeURIComponent(query)}` : ''; - const url = baseUrl + queryString; + const queryParams = {mode}; + if (query && query.length > 0) { queryParams.query = query; } + const queryString = new URLSearchParams(queryParams).toString(); + const url = `${baseUrl}?${queryString}`; switch (mode) { case 'sameTab': diff --git a/ext/bg/js/search.js b/ext/bg/js/search.js index e32ba46e..ea4ab235 100644 --- a/ext/bg/js/search.js +++ b/ext/bg/js/search.js @@ -53,6 +53,8 @@ class DisplaySearch extends Display { this.search.addEventListener('click', (e) => this.onSearch(e), false); } if (this.query !== null) { + const {query='', mode=''} = DisplaySearch.parseQueryStringFromLocation(window.location.href); + document.documentElement.dataset.searchMode = mode; this.query.addEventListener('input', () => this.onSearchInput(), false); if (this.wanakanaEnable !== null) { @@ -63,7 +65,6 @@ class DisplaySearch extends Display { this.wanakanaEnable.checked = false; } this.wanakanaEnable.addEventListener('change', (e) => { - const query = DisplaySearch.getSearchQueryFromLocation(window.location.href) || ''; if (e.target.checked) { window.wanakana.bind(this.query); this.setQuery(window.wanakana.toKana(query)); @@ -77,15 +78,12 @@ class DisplaySearch extends Display { }); } - const query = DisplaySearch.getSearchQueryFromLocation(window.location.href); - if (query !== null) { - if (this.isWanakanaEnabled()) { - this.setQuery(window.wanakana.toKana(query)); - } else { - this.setQuery(query); - } - this.onSearchQueryUpdated(this.query.value, false); + if (this.isWanakanaEnabled()) { + this.setQuery(window.wanakana.toKana(query)); + } else { + this.setQuery(query); } + this.onSearchQueryUpdated(this.query.value, false); } if (this.clipboardMonitorEnable !== null) { if (this.options.general.enableClipboardMonitor === true) { @@ -162,13 +160,12 @@ class DisplaySearch extends Display { } onPopState() { - const query = DisplaySearch.getSearchQueryFromLocation(window.location.href) || ''; - if (this.query !== null) { - if (this.isWanakanaEnabled()) { - this.setQuery(window.wanakana.toKana(query)); - } else { - this.setQuery(query); - } + const {query='', mode=''} = DisplaySearch.parseQueryStringFromLocation(window.location.href); + document.documentElement.dataset.searchMode = mode; + if (this.isWanakanaEnabled()) { + this.setQuery(window.wanakana.toKana(query)); + } else { + this.setQuery(query); } this.onSearchQueryUpdated(this.query.value, false); @@ -334,9 +331,11 @@ class DisplaySearch extends Display { } } - static getSearchQueryFromLocation(url) { - const match = /^[^?#]*\?(?:[^&#]*&)?query=([^&#]*)/.exec(url); - return match !== null ? decodeURIComponent(match[1]) : null; + static parseQueryStringFromLocation(url) { + const parsedUrl = new URL(url); + const parsedSearch = new URLSearchParams(parsedUrl.search); + return Array.from(parsedSearch.entries()) + .reduce((a, [k, v]) => Object.assign({}, a, {[k]: v}), {}); } } diff --git a/ext/bg/search.html b/ext/bg/search.html index bb555e92..10e5aa8e 100644 --- a/ext/bg/search.html +++ b/ext/bg/search.html @@ -25,23 +25,25 @@ <p style="margin-bottom: 0;">Search your installed dictionaries by entering a Japanese expression into the field below.</p> </div> - <div class="input-group" style="padding-top: 20px;"> - <span title="Enable kana input method" class="input-group-text"> - <input type="checkbox" id="wanakana-enable" class="icon-checkbox" /> - <label for="wanakana-enable" class="scan-disable">あ</label> - </span> - <span title="Enable clipboard monitor" class="input-group-text"> - <input type="checkbox" id="clipboard-monitor-enable" class="icon-checkbox" /> - <label for="clipboard-monitor-enable"><span class="glyphicon glyphicon-paste"></span></label> - </span> - </div> + <div class="search-input"> + <div class="input-group" style="padding-top: 20px;"> + <span title="Enable kana input method" class="input-group-text"> + <input type="checkbox" id="wanakana-enable" class="icon-checkbox" /> + <label for="wanakana-enable" class="scan-disable">あ</label> + </span> + <span title="Enable clipboard monitor" class="input-group-text"> + <input type="checkbox" id="clipboard-monitor-enable" class="icon-checkbox" /> + <label for="clipboard-monitor-enable"><span class="glyphicon glyphicon-paste"></span></label> + </span> + </div> - <form class="input-group"> - <input type="text" class="form-control" placeholder="Search for..." id="query" autofocus> - <span class="input-group-btn"> - <input type="submit" class="btn btn-default form-control" id="search" value="Search"> - </span> - </form> + <form class="input-group"> + <input type="text" class="form-control" placeholder="Search for..." id="query" autofocus> + <span class="input-group-btn"> + <input type="submit" class="btn btn-default form-control" id="search" value="Search"> + </span> + </form> + </div> <div id="spinner" hidden><img src="/mixed/img/spinner.gif"></div> diff --git a/ext/mixed/css/display.css b/ext/mixed/css/display.css index 3a66cec3..62e62243 100644 --- a/ext/mixed/css/display.css +++ b/ext/mixed/css/display.css @@ -136,6 +136,10 @@ html:root[data-yomichan-page=float] .navigation-header:not([hidden])~.navigation margin-right: 0.2em; } +html:root[data-yomichan-page=search][data-search-mode=popup] .search-input { + display: none; +} + /* * Entries |