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

fix show-more in old UI and simplify generation of targets

Browse Source
This commit is contained in:
tophf 2018-08-24 14:02:31 +03:00
parent 74d9a0d8ba
commit 918debe110
1 changed files with 20 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
manage/manage.js
View File

@ -153,17 +153,16 @@ function showStyles(styles = [], matchUrlIds) {
filterAndAppend({container: renderBin}).then(sorter.updateStripes); filterAndAppend({container: renderBin}).then(sorter.updateStripes);
if (index < sorted.length) { if (index < sorted.length) {
requestAnimationFrame(renderStyles); requestAnimationFrame(renderStyles);
if (firstRun) setTimeout(recreateStyleTargets, 0, {styles, iconsOnly: true}); if (firstRun) setTimeout(getFaviconImgSrc);
firstRun = false; firstRun = false;
return; return;
} }
if (newUI.enabled && newUI.favicons) { setTimeout(getFaviconImgSrc);
setTimeout(recreateStyleTargets, 0, {iconsOnly: true}); if (sessionStorage.justEditedStyleId) {
} highlightEditedStyle();
if ('scrollY' in (history.state || {}) && !sessionStorage.justEditedStyleId) { } else if ('scrollY' in (history.state || {})) {
setTimeout(window.scrollTo, 0, 0, history.state.scrollY); setTimeout(window.scrollTo, 0, 0, history.state.scrollY);
} }
highlightEditedStyle();
} }
} }
@ -238,10 +237,10 @@ function createStyleElement({style, name}) {
} }
function createStyleTargetsElement({entry, style, iconsOnly}) { function createStyleTargetsElement({entry, style}) {
const parts = createStyleElement.parts; const parts = createStyleElement.parts;
const entryTargets = $('.targets', entry); const entryTargets = $('.targets', entry);
const targets = iconsOnly ? entryTargets : parts.targets.cloneNode(true); const targets = parts.targets.cloneNode(true);
let container = targets; let container = targets;
let numTargets = 0; let numTargets = 0;
const displayed = new Set(); const displayed = new Set();
@ -252,15 +251,14 @@ function createStyleTargetsElement({entry, style, iconsOnly}) {
continue; continue;
} }
displayed.add(targetValue); displayed.add(targetValue);
const element = iconsOnly ? targets.children[numTargets] : template.appliesToTarget.cloneNode(true); const element = template.appliesToTarget.cloneNode(true);
if (!newUI.enabled) { if (!newUI.enabled) {
if (numTargets === 10) { if (numTargets === 10) {
container = container.appendChild(template.extraAppliesTo.cloneNode(true)); container = container.appendChild(template.extraAppliesTo.cloneNode(true));
} else if (numTargets > 1) { } else if (numTargets > 0) {
container.appendChild(template.appliesToSeparator.cloneNode(true)); container.appendChild(template.appliesToSeparator.cloneNode(true));
} }
} }
if (!iconsOnly) {
element.dataset.type = type; element.dataset.type = type;
element.appendChild( element.appendChild(
document.createTextNode( document.createTextNode(
@ -268,7 +266,6 @@ function createStyleTargetsElement({entry, style, iconsOnly}) {
targetValue + targetValue +
(parts.decorations[type + 'After'] || ''))); (parts.decorations[type + 'After'] || '')));
container.appendChild(element); container.appendChild(element);
}
numTargets++; numTargets++;
} }
} }
@ -279,9 +276,7 @@ function createStyleTargetsElement({entry, style, iconsOnly}) {
} }
} }
if (numTargets) { if (numTargets) {
if (!iconsOnly) {
entryTargets.parentElement.replaceChild(targets, entryTargets); entryTargets.parentElement.replaceChild(targets, entryTargets);
}
} else if (!entry.classList.contains('global') || } else if (!entry.classList.contains('global') ||
!entryTargets.firstElementChild) { !entryTargets.firstElementChild) {
if (entryTargets.firstElementChild) { if (entryTargets.firstElementChild) {
@ -293,25 +288,8 @@ function createStyleTargetsElement({entry, style, iconsOnly}) {
} }
function recreateStyleTargets({styles, iconsOnly = false} = {}) {
Promise.resolve(styles || API.getStyles()).then(styles => {
for (const style of styles) {
const entry = $(ENTRY_ID_PREFIX + style.id);
if (entry) {
createStyleTargetsElement({
entry,
style,
iconsOnly,
});
}
}
if (newUI.enabled && newUI.favicons) {
debounce(getFaviconImgSrc);
}
});
}
function getFaviconImgSrc(container = installed) { function getFaviconImgSrc(container = installed) {
if (!newUI.enabled || !newUI.favicons) return;
const regexpRemoveNegativeLookAhead = /(\?!([^)]+\))|\(\?![\w(]+[^)]+[\w|)]+)/g; const regexpRemoveNegativeLookAhead = /(\?!([^)]+\))|\(\?![\w(]+[^)]+[\w|)]+)/g;
// replace extra characters & all but the first group entry "(abc|def|ghi)xyz" => abcxyz // replace extra characters & all but the first group entry "(abc|def|ghi)xyz" => abcxyz
const regexpReplaceExtraCharacters = /[\\(]|((\|\w+)+\))/g; const regexpReplaceExtraCharacters = /[\\(]|((\|\w+)+\))/g;
@ -557,9 +535,7 @@ function handleUpdate(style, {reason, method} = {}) {
animateElement(entry); animateElement(entry);
requestAnimationFrame(() => scrollElementIntoView(entry)); requestAnimationFrame(() => scrollElementIntoView(entry));
} }
if (newUI.enabled && newUI.favicons) {
getFaviconImgSrc(entry); getFaviconImgSrc(entry);
}
function handleToggledOrCodeOnly() { function handleToggledOrCodeOnly() {
const newStyleMeta = getStyleWithNoCode(style); const newStyleMeta = getStyleWithNoCode(style);
@ -673,7 +649,7 @@ function switchUI({styleOnly} = {}) {
return; return;
} }
if (missingFavicons) { if (missingFavicons) {
recreateStyleTargets(); debounce(getFaviconImgSrc);
return; return;
} }
} }