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

tweaks and fixes

Browse Source
This commit is contained in:
tophf 2021-08-13 23:00:42 +03:00
parent 9da021b461
commit 389608204e
2 changed files with 29 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
popup/search.css
View File

@ -151,9 +151,13 @@ body.search-results-shown {
} }
.search-result-install, .search-result-install,
.search-result-uninstall, .search-result-uninstall,
.search-result:not([data-installed]) .search-result-customize,
.search-result:not([data-customizable]) .search-result-customize { .search-result:not([data-customizable]) .search-result-customize {
display: none; display: none;
} }
.search-result.not-matching .search-result-customize {
opacity: .5;
}
.search-result-meta { .search-result-meta {
background-color: hsla(0, 0%, 93%, 0.75); background-color: hsla(0, 0%, 93%, 0.75);

39
popup/search.js
View File

@ -10,7 +10,8 @@
(() => { (() => {
require(['/popup/search.css']); require(['/popup/search.css']);
const RESULT_ID_PREFIX = 'search-result-'; const RESULT_ID_PREFIX = t.template.searchResult.className + '-';
const RESULT_SEL = '.' + t.template.searchResult.className;
const INDEX_URL = URLS.usoArchiveRaw[0] + 'search-index.json'; const INDEX_URL = URLS.usoArchiveRaw[0] + 'search-index.json';
const USW_INDEX_URL = URLS.usw + 'api/index/uso-format'; const USW_INDEX_URL = URLS.usw + 'api/index/uso-format';
const USW_ICON = $create('img', { const USW_ICON = $create('img', {
@ -39,6 +40,11 @@
* @prop {string} an - authorName * @prop {string} an - authorName
* @prop {string} sn - screenshotName * @prop {string} sn - screenshotName
* @prop {boolean} sa - screenshotArchived * @prop {boolean} sa - screenshotArchived
* --------------------- Stylus' internally added extras
* @prop {boolean} isUsw
* @prop {boolean} installed
* @prop {number} installedStyleId
* @prop {number} pingbackTimer
*/ */
/** @type IndexEntry[] */ /** @type IndexEntry[] */
let results; let results;
@ -61,9 +67,14 @@
onload: () => (imgType = '.webp'), onload: () => (imgType = '.webp'),
}); });
const $class = sel => (sel instanceof Node ? sel : $(sel)).classList; /** @returns {{result: IndexEntry, entry: HTMLElement}} */
const show = sel => $class(sel).remove('hidden'); const $resultEntry = el => {
const hide = sel => $class(sel).add('hidden'); const entry = el.closest(RESULT_SEL);
return {entry, result: entry && entry._result};
};
const $classList = sel => (sel instanceof Node ? sel : $(sel)).classList;
const show = sel => $classList(sel).remove('hidden');
const hide = sel => $classList(sel).add('hidden');
Object.assign(Events, { Object.assign(Events, {
/** /**
@ -215,7 +226,7 @@
// keep rendered elements with ids in the range of interest // keep rendered elements with ids in the range of interest
while ( while (
plantAt < PAGE_LENGTH && plantAt < PAGE_LENGTH &&
slot && slot.id === 'search-result-' + (results[start] || {}).i slot && slot.id === RESULT_ID_PREFIX + (results[start] || {}).i
) { ) {
slot = slot.nextElementSibling; slot = slot.nextElementSibling;
plantAt++; plantAt++;
@ -390,7 +401,10 @@
}); });
$('.search-result-uninstall', entry).onclick = uninstall; $('.search-result-uninstall', entry).onclick = uninstall;
$('.search-result-install', entry).onclick = install; $('.search-result-install', entry).onclick = install;
$('.search-result-customize', entry).onclick = configure; Object.assign($('.search-result-customize', entry), {
onclick: configure,
disabled: notMatching,
});
toggleDataset(entry, 'installed', isInstalled); toggleDataset(entry, 'installed', isInstalled);
} }
@ -408,16 +422,13 @@
toggleDataset(entry, 'customizable', vars); toggleDataset(entry, 'customizable', vars);
} }
/** @this HTMLButtonElement */
function configure() { function configure() {
const el = $entry(this.closest('.search-result')._result.installedStyleId); const styleEntry = $entry($resultEntry(this).result.installedStyleId);
const btn = el && $('.configure', el); Events.configure.call(this, {target: styleEntry});
if (btn) btn.click();
} }
async function install() { async function install() {
const entry = this.closest('.search-result'); const {entry, result} = $resultEntry(this);
const result = /** @type IndexEntry */ entry._result;
const {i: id, isUsw} = result; const {i: id, isUsw} = result;
const installButton = $('.search-result-install', entry); const installButton = $('.search-result-install', entry);
@ -448,9 +459,9 @@
} }
function uninstall() { function uninstall() {
const entry = this.closest('.search-result'); const {entry, result} = $resultEntry(this);
saveScrollPosition(entry); saveScrollPosition(entry);
API.styles.delete(entry._result.installedStyleId); API.styles.delete(result.installedStyleId);
} }
function saveScrollPosition(entry) { function saveScrollPosition(entry) {