open.source/stylus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

avoid scrollbar due to incremental search + subsequent filter

Browse Source
This commit is contained in:
tophf 2020-10-25 16:29:17 +03:00
parent 2c674bdc0c
commit 2a6850c02e
1 changed files with 8 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
manage/incremental-search.js
View File

@ -15,10 +15,11 @@ onDOMready().then(() => {
position: 'absolute', position: 'absolute',
color: 'transparent', color: 'transparent',
border: '1px solid hsla(180, 100%, 100%, .5)', border: '1px solid hsla(180, 100%, 100%, .5)',
top: '-1000px', margin: '-1px -2px',
overflow: 'hidden', overflow: 'hidden',
resize: 'none', resize: 'none',
'background-color': 'hsla(180, 100%, 100%, .2)', 'background-color': 'hsla(180, 100%, 100%, .2)',
'box-sizing': 'content-box',
'pointer-events': 'none', 'pointer-events': 'none',
}); });
document.body.appendChild(input); document.body.appendChild(input);
@ -48,6 +49,7 @@ onDOMready().then(() => {
} }
let found; let found;
for (const entry of rotated || entries) { for (const entry of rotated || entries) {
if (entry.classList.contains('hidden')) continue;
const name = entry.styleNameLowerCase; const name = entry.styleNameLowerCase;
const pos = name.indexOf(text); const pos = name.indexOf(text);
if (pos === 0) { if (pos === 0) {
@ -67,7 +69,11 @@ onDOMready().then(() => {
focusedName = found.styleNameLowerCase; focusedName = found.styleNameLowerCase;
scrollElementIntoView(found, {invalidMarginRatio: .25}); scrollElementIntoView(found, {invalidMarginRatio: .25});
animateElement(found, {className: 'highlight-quick'}); animateElement(found, {className: 'highlight-quick'});
resizeTo(focusedLink); replaceInlineStyle({
width: focusedLink.offsetWidth + 'px',
height: focusedLink.offsetHeight + 'px',
});
focusedLink.prepend(input);
return true; return true;
} }
} }
@ -111,17 +117,6 @@ onDOMready().then(() => {
} }
} }
function resizeTo(el) {
const bounds = el.getBoundingClientRect();
const base = document.scrollingElement;
replaceInlineStyle({
left: bounds.left - 2 + base.scrollLeft + 'px',
top: bounds.top - 1 + base.scrollTop + 'px',
width: bounds.width + 4 + 'px',
height: bounds.height + 2 + 'px',
});
}
function replaceInlineStyle(css) { function replaceInlineStyle(css) {
for (const prop in css) { for (const prop in css) {
input.style.setProperty(prop, css[prop], 'important'); input.style.setProperty(prop, css[prop], 'important');