search results functionality

This commit is contained in:
Robin Scholtes 2023-08-03 16:57:08 +12:00
parent 4ba31236e9
commit 85fff21068
9 changed files with 105 additions and 115 deletions

View file

@ -50,7 +50,7 @@ export class COperationLi extends HTMLElement {
}
/**
* @fires OperationsWaiter#operationDblclick on double click
* Handle double click
* @param {Event} e
*/
handleDoubleClick(e) {
@ -72,7 +72,6 @@ export class COperationLi extends HTMLElement {
}
}
/**
* Disable or enable popover for an element
*
@ -252,6 +251,57 @@ export class COperationLi extends HTMLElement {
const { app, name, icon, includeStarIcon } = this;
return new COperationLi( app, name, icon, includeStarIcon );
}
/**
* Highlights searched strings in the name and description of the operation.
*
* @param {[[number]]} nameIdxs - Indexes of the search strings in the operation name [[start, length]]
* @param {[[number]]} descIdxs - Indexes of the search strings in the operation description [[start, length]]
*/
highlightSearchStrings(nameIdxs, descIdxs) {
if (nameIdxs.length && typeof nameIdxs[0][0] === "number") {
let opName = "",
pos = 0;
nameIdxs.forEach(idxs => {
const [start, length] = idxs;
if (typeof start !== "number") return;
opName += this.name.slice(pos, start) + "<b>" +
this.name.slice(start, start + length) + "</b>";
pos = start + length;
});
opName += this.name.slice(pos, this.name.length);
this.name = opName;
}
if (this.description && descIdxs.length && descIdxs[0][0] >= 0) {
// Find HTML tag offsets
const re = /<[^>]+>/g;
let match;
while ((match = re.exec(this.description))) {
// If the search string occurs within an HTML tag, return without highlighting it.
const inHTMLTag = descIdxs.reduce((acc, idxs) => {
const start = idxs[0];
return start >= match.index && start <= (match.index + match[0].length);
}, false);
if (inHTMLTag) return;
}
let desc = "",
pos = 0;
descIdxs.forEach(idxs => {
const [start, length] = idxs;
desc += this.description.slice(pos, start) + "<b><u>" +
this.description.slice(start, start + length) + "</u></b>";
pos = start + length;
});
desc += this.description.slice(pos, this.description.length);
this.description = desc;
}
}
}