diff --git a/index.html b/index.html
index a667cd5..3cce286 100644
--- a/index.html
+++ b/index.html
@@ -1,4 +1,4 @@
-
+
@@ -62,6 +62,23 @@
['0:54323', { url: 'http://localhost:54323' }],
['0:54324', { url: 'http://localhost:54324' }],
]);
+
+ // Usage of suggestions with names
+
+ /* const COMMANDS = new Map([
+ [
+ 'g',
+ {
+ url: 'https://www.google.com/search?q={}',
+ searchTemplate: '/search?q={}',
+ suggestions: [
+ { name: 'Google Search', url: 'https://www.google.com' },
+ { name: 'Google Images', url: 'https://images.google.com' },
+ { name: 'Google Maps', url: 'https://maps.google.com' },
+ ],
+ },
+ ],
+ ]); */
@@ -152,15 +169,17 @@
const commands = clone.querySelector('.commands');
const commandTemplate = document.getElementById('command-template');
- for (const [key, { name, url }] of COMMANDS.entries()) {
- if (!name || !url) continue;
- const clone = commandTemplate.content.cloneNode(true);
- const command = clone.querySelector('.command');
- command.href = url;
- if (CONFIG.openLinksInNewTab) command.target = '_blank';
- clone.querySelector('.key').innerText = key;
- clone.querySelector('.name').innerText = name;
- commands.append(clone);
+ for (const [key, { suggestions }] of COMMANDS.entries()) {
+ if (!suggestions) continue;
+ for (const { name, url } of suggestions) {
+ const clone = commandTemplate.content.cloneNode(true);
+ const command = clone.querySelector('.command');
+ command.href = url;
+ if (CONFIG.openLinksInNewTab) command.target = '_blank';
+ clone.querySelector('.key').innerText = key;
+ clone.querySelector('.name').innerText = name;
+ commands.append(clone);
+ }
}
this.shadowRoot.append(clone);
@@ -324,7 +343,10 @@
for (const item of res) {
if (item.phrase === search.toLowerCase()) continue;
- suggestions.push(item.phrase);
+ suggestions.push({
+ name: item.phrase,
+ url: `https://duckduckgo.com/?q=${item.phrase}`,
+ });
}
resolve(suggestions);
@@ -430,7 +452,10 @@
suggestions = suggestions.concat(
oq.splitBy
- ? res.map((search) => `${oq.key}${oq.splitBy}${search}`)
+ ? res.map((search) => ({
+ name: `${oq.key}${oq.splitBy}${search}`,
+ url: `https://duckduckgo.com/?q=${search}`,
+ }))
: res
);
}
@@ -484,7 +509,7 @@
#onSuggestionClick = (e) => {
const ref = e.target.closest('.suggestion');
if (!ref) return;
- this.#execute(ref.dataset.suggestion);
+ this.#execute(ref.dataset.url);
};
#renderSuggestions(suggestions, query) {
@@ -496,24 +521,8 @@
const clone = template.content.cloneNode(true);
const ref = clone.querySelector('.suggestion');
ref.dataset.index = index;
- ref.dataset.suggestion = suggestion;
- const escapedQuery = Search.#escapeRegexCharacters(query);
- const matched = suggestion.match(new RegExp(escapedQuery, 'i'));
-
- if (matched) {
- const template = document.getElementById('match-template');
- const clone = template.content.cloneNode(true);
- const matchRef = clone.querySelector('.match');
- const pre = suggestion.slice(0, matched.index);
- const post = suggestion.slice(matched.index + matched[0].length);
- matchRef.innerText = matched[0];
- matchRef.insertAdjacentHTML('beforebegin', pre);
- matchRef.insertAdjacentHTML('afterend', post);
- ref.append(clone);
- } else {
- ref.innerText = suggestion;
- }
-
+ ref.dataset.url = suggestion.url;
+ ref.innerText = suggestion.name;
this.#suggestions.append(clone);
}
}