diff options
Diffstat (limited to 'userstuff/e621/Search their favorites!.user.js')
-rw-r--r-- | userstuff/e621/Search their favorites!.user.js | 152 |
1 files changed, 152 insertions, 0 deletions
diff --git a/userstuff/e621/Search their favorites!.user.js b/userstuff/e621/Search their favorites!.user.js new file mode 100644 index 0000000..e34f4ee --- /dev/null +++ b/userstuff/e621/Search their favorites!.user.js @@ -0,0 +1,152 @@ +// ==UserScript== +// @name Search their favorites! +// @description This is your new file, start writing code +// @match https://e621.net/posts/*/favorites +// ==/UserScript== + +const settings = { + normalHoverInfoDelay: 400, + fastHoveringInfoDelay: 150, + endFastHoveringDelay: 500, + + focusInfoDelay: 750, + + hideTooltipDelay: 500, +}; + +const state = { + hoverTimeout: null, + focusTimeout: null, + + fastHovering: false, + endFastHoveringTimeout: false, + + showing: false, + justHidden: false, + + row: null, +}; + +const thumb = document.querySelector('#a-index .thumbnail'); + +const container = document.createElement('div'); + +const tagLabel = document.createElement('label'); +const tagInput = document.createElement('input'); +tagLabel.appendChild(document.createTextNode('Search these tags: ')); +tagLabel.appendChild(tagInput); +container.appendChild(tagLabel); + +let hoverTimeout = null; +for (const a of document.querySelectorAll('#a-index td a[href^="/favorites"]')) { + a.addEventListener('mouseover', event => { + const hoverTimeoutDelay = + (state.fastHovering + ? settings.fastHoveringInfoDelay + : settings.normalHoverInfoDelay); + + state.hoverTimeout = setTimeout(() => { + state.hoverTimeout = null; + state.fastHovering = true; + show(a); + }, hoverTimeoutDelay); + + if (state.endFastHoveringTimeout) { + clearTimeout(state.endFastHoveringTimeout); + state.endFastHoveringTimeout = null; + } + + if (state.hideTimeout) { + clearTimeout(state.hideTimeout); + state.hideTimeout = null; + } + }); + + a.addEventListener('mouseleave', event => { + if (state.hoverTimeout) { + clearTimeout(state.hoverTimeout); + state.hoverTimeout = null; + } + + if (state.fastHovering && !state.endFastHoveringTimeout) { + state.endFastHoveringTimeout = setTimeout(() => { + state.endFastHoveringTimeout = null; + state.fastHovering = false; + }, settings.endFastHoveringDelay); + } + }); + + a.closest('tr').addEventListener('mouseleave', event => { + if (state.showing && !state.hideTimeout) { + state.hideTimeout = setTimeout(() => { + state.hideTimeout = null; + hide(); + }, settings.hideTooltipDelay); + } + }); + + a.addEventListener('focus', event => { + state.focusTimeout = setTimeout(() => { + state.focusTimeout = null; + show(a); + }, settings.focusInfoDelay); + + if (state.justHidden) { + clearTimeout(state.focusTimeout); + state.focusTimeout = null; + show(a); + } + }) +} + +function show(a) { + hide(); + + const tr = document.createElement('tr'); + const td = document.createElement('td'); + const aa = document.createElement('a'); + aa.href = '#'; + aa.appendChild(document.createTextNode('Hiya')); + td.appendChild(aa); + tr.appendChild(td); + + state.showing = true; + state.row = tr; + + tr.addEventListener('mouseenter', event => { + if (state.hideTimeout) { + clearTimeout(state.hideTimeout); + state.hideTimeout = null; + } + }); + + tr.addEventListener('focusin', event => { + if (state.hideTimeout) { + clearTimeout(state.hideTimeout); + state.hideTimeout = null; + } + }); + + tr.addEventListener('focusout', event => { + hide(); + }); + + a.closest('tr').after(tr); +} + +function hide() { + if (!state.showing) return; + if (!state.row) return; + + state.row.remove(); + + state.showing = false; + state.row = null; + + state.justHidden = true; + setTimeout(() => { + state.justHiden = false; + }); +} + +thumb.after(container); |