This commit is contained in:
David Ralph
2021-08-25 13:55:20 +01:00
parent 10f27d24b0
commit e5f8cf3e66
12 changed files with 81 additions and 11 deletions

View File

@@ -78,6 +78,7 @@ export default class SearchSettings extends PureComponent {
{(navigator.userAgent.includes('Chrome') && typeof InstallTrigger === 'undefined') ?
<Checkbox name='voiceSearch' text={search.voice_search} category='search'/>
: null}
<Checkbox name='searchDropdown' text={search.dropdown} category='search' element='.other'/>
<Dropdown label={search.search_engine} name='searchEngine' onChange={(value) => this.setSearchEngine(value)}>
{searchEngines.map((engine) => (
<option key={engine.name} value={engine.settingsName}>{engine.name}</option>

View File

@@ -21,7 +21,8 @@ export default class Search extends PureComponent {
autocompleteQuery: '',
autocompleteCallback: '',
microphone: null,
suggestions: []
suggestions: [],
searchDropdown: 'none'
};
this.language = window.language.widgets.search;
}
@@ -112,7 +113,40 @@ export default class Search extends PureComponent {
autocompleteURL: autocompleteURL,
autocompleteQuery: autocompleteQuery,
autocompleteCallback: autocompleteCallback,
microphone: microphone
microphone: microphone,
currentSearch: info.name
});
}
toggleDropdown() {
if (this.state.searchDropdown === 'none') {
this.setState({
searchDropdown: 'block'
});
} else {
this.setState({
searchDropdown: 'none'
});
}
}
setSearch(name) {
let url;
let query = 'q';
const info = searchEngines.find((i) => i.name === name);
if (info !== undefined) {
url = info.url;
if (info.query) {
query = info.query;
}
}
this.setState({
url: url,
query: query,
currentSearch: name,
searchDropdown: 'none'
});
}
@@ -133,6 +167,23 @@ export default class Search extends PureComponent {
render() {
return (
<form onSubmit={this.searchButton} className='searchBar'>
{localStorage.getItem('searchDropdown') === 'true' ?
<div className='searchDropdown'>
<span className='searchSelected' onClick={() => this.toggleDropdown()}>{this.state.currentSearch}</span>
<div className='searchOptions' style={{ display: this.state.searchDropdown }}>
{searchEngines.map((engine) => {
if (engine.name === this.state.currentSearch) {
return null;
}
return (
<>
<span className='searchSelected' onClick={() => this.setSearch(engine.name)}>{engine.name}</span>
<br/>
</>
);
})}
</div>
</div> : null}
{this.state.microphone}
<SearchIcon onClick={this.searchButton}/>
<AutocompleteInput placeholder={this.language} id='searchtext' suggestions={this.state.suggestions} onChange={(e) => this.getSuggestions(e)} onClick={this.searchButton}/>

View File

@@ -49,6 +49,15 @@
}
}
.searchDropdown {
display: inline-block;
font-size: calc(5px + 1.2vmin);
.searchSelected {
cursor: pointer;
}
}
.micIcon {
margin-right: 10px;
position: relative !important;

View File

@@ -193,7 +193,8 @@
"custom": "Abfrage-URL",
"autocomplete": "Autocomplete",
"autocomplete_provider": "Autocomplete Provider",
"voice_search": "Sprachsuche"
"voice_search": "Sprachsuche",
"dropdown": "Search dropdown"
},
"weather": {
"title": "Wetter",

View File

@@ -193,7 +193,8 @@
"custom": "Custom search URL",
"autocomplete": "Autocomplete",
"autocomplete_provider": "Autocomplete Provider",
"voice_search": "Voice search"
"voice_search": "Voice search",
"dropdown": "Search dropdown"
},
"weather": {
"title": "Weather",

View File

@@ -193,7 +193,8 @@
"custom": "Custom search URL",
"autocomplete": "Autocomplete",
"autocomplete_provider": "Autocomplete Provider",
"voice_search": "Voice search"
"voice_search": "Voice search",
"dropdown": "Search dropdown"
},
"weather": {
"title": "Weather",

View File

@@ -193,7 +193,8 @@
"custom": "URL de búsqueda personalizada",
"autocomplete": "Autocompletado",
"autocomplete_provider": "Proveedor del autocompletado",
"voice_search": "Búsqueda por voz"
"voice_search": "Búsqueda por voz",
"dropdown": "Search dropdown"
},
"weather": {
"title": "Clima",

View File

@@ -193,7 +193,8 @@
"custom": "URL de recherche personnalisée",
"autocomplete": "Autocomplete",
"autocomplete_provider": "Autocomplete Provider",
"voice_search": "Recherche vocale"
"voice_search": "Recherche vocale",
"dropdown": "Search dropdown"
},
"weather": {
"title": "Météo",

View File

@@ -193,7 +193,8 @@
"custom": "Aangepaste zoekmachine-url",
"autocomplete": "Autocomplete",
"autocomplete_provider": "Autocomplete Provider",
"voice_search": "Spraakgestuurd zoeken gebruiken"
"voice_search": "Spraakgestuurd zoeken gebruiken",
"dropdown": "Search dropdown"
},
"weather": {
"title": "Weather",

View File

@@ -193,7 +193,8 @@
"custom": "Custom search URL",
"autocomplete": "Autocomplete",
"autocomplete_provider": "Autocomplete Provider",
"voice_search": "Voice search"
"voice_search": "Voice search",
"dropdown": "Search dropdown"
},
"weather": {
"title": "Weather",

View File

@@ -193,7 +193,8 @@
"custom": "Пользовательский поисковый движок",
"autocomplete": "Autocomplete",
"autocomplete_provider": "Autocomplete Provider",
"voice_search": "Поиск голосом"
"voice_search": "Поиск голосом",
"dropdown": "Search dropdown"
},
"weather": {
"title": "Weather",

View File

@@ -193,7 +193,8 @@
"custom": "自定义搜索链接",
"autocomplete": "Autocomplete",
"autocomplete_provider": "Autocomplete Provider",
"voice_search": "语音搜索"
"voice_search": "语音搜索",
"dropdown": "Search dropdown"
},
"weather": {
"title": "天气",