90 lines
2.5 KiB
JavaScript
90 lines
2.5 KiB
JavaScript
|
const getVarElements = () => [
|
||
|
...getClassNameElementsArray('hl-variable'),
|
||
|
...getClassNameElementsArray('hl-def'),
|
||
|
...getClassNameElementsArray('hl-type')
|
||
|
]
|
||
|
|
||
|
let currentSelected
|
||
|
|
||
|
const selectVar = varName => {
|
||
|
if (!varName) {
|
||
|
return
|
||
|
}
|
||
|
// Clear existing colors
|
||
|
getClassNameElementsArray(selectedClass)
|
||
|
.forEach(e => e.classList.remove(selectedClass))
|
||
|
|
||
|
// Color vars with matching text
|
||
|
getVarElements()
|
||
|
.filter(e => e.innerText === varName)
|
||
|
.forEach(e => e.classList.add(selectedClass))
|
||
|
|
||
|
currentSelected = varName
|
||
|
}
|
||
|
|
||
|
const selectedClass = 'sages-selected-variable'
|
||
|
|
||
|
const getTagMatching = (name, matcher) => {
|
||
|
const elements = Object.values(document.getElementsByTagName(name)).filter(matcher)
|
||
|
return elements.length ? elements[0] : null
|
||
|
}
|
||
|
|
||
|
const addVariableClickers = skipExpandos => {
|
||
|
const getSearchButton = () => getTagMatching(
|
||
|
'button', e => e.dataset?.testid === 'search-action-button')
|
||
|
|
||
|
const getSearchBox = () => getTagMatching('input', e => e.name === 'changes-search-input')
|
||
|
|
||
|
if (!skipExpandos) {
|
||
|
getClassNameElementsArray('expand-context-button').forEach(e => {
|
||
|
const currentOnClick = e.onclick
|
||
|
e.onclick = (...args) => {
|
||
|
currentOnClick && currentOnClick(...args)
|
||
|
setTimeout(() => {
|
||
|
selectVar(currentSelected)
|
||
|
addVariableClickers(true)
|
||
|
}, CURRENT_PAGE_DELAY)
|
||
|
}
|
||
|
})
|
||
|
}
|
||
|
|
||
|
getVarElements()
|
||
|
.forEach(e => {
|
||
|
e.onclick = () => selectVar(e.innerText)
|
||
|
e.ondblclick = () => {
|
||
|
let searchBox = getSearchBox()
|
||
|
|
||
|
if (!searchBox) {
|
||
|
getSearchButton()?.click()
|
||
|
searchBox = getSearchBox()
|
||
|
}
|
||
|
|
||
|
searchBox.value = e.innerText
|
||
|
searchBox.dispatchEvent(new window.Event('change', { bubbles: true }))
|
||
|
}
|
||
|
})
|
||
|
|
||
|
}
|
||
|
|
||
|
|
||
|
addFix(() => {
|
||
|
const styleSheet = document.createElement('style')
|
||
|
styleSheet.innerText = `
|
||
|
.${selectedClass} {
|
||
|
background: rgb(255, 253, 170) !important;
|
||
|
border-radius: 3px;
|
||
|
padding: 2px !important;
|
||
|
margin: -2px !important;
|
||
|
/*
|
||
|
padding-left: 2px !important;
|
||
|
padding-right: 2px !important;
|
||
|
margin-left: -2px !important;
|
||
|
margin-right: -2px !important;
|
||
|
*/
|
||
|
}`
|
||
|
|
||
|
document.head.appendChild(styleSheet)
|
||
|
addVariableClickers()
|
||
|
selectVar(currentSelected)
|
||
|
})
|