Add buttons to group content's top corners
当前为
此脚本不应直接安装。它是供其他脚本使用的外部库,要使用该库请加入元指令 // @require https://update.cn-greasyfork.org/scripts/541342/1617302/GGn%20Corner%20Button.js
// ==UserScript==
// @name GGn Corner Button
// @version 1
// @description Add buttons to group content's top corners
// @author ingts
// @match https://gazellegames.net/
// @grant none
// ==/UserScript==
/**
* @typedef {('left' | 'left-vertical' | 'right' | 'right-vertical')} Position
*/
/**
* @type HTMLDivElement
*/
const groupContentEl = document.getElementById('content')
/**
* @private
* @param {Position} position
*/
function createContainer(position) {
if (!groupContentEl) return
const elementId = `${position}-corner-container`
let container = document.getElementById(elementId)
if (container) return container
container = document.createElement('div')
container.id = elementId
container.style.position = 'absolute'
container.style.display = 'flex'
if (position.includes('vertical')) {
container.style.flexDirection = 'column'
}
let leftPos = 0
let topPos = 0
switch (position) {
case 'left':
leftPos = groupContentEl.offsetLeft + container.offsetWidth - container.scrollWidth
topPos = groupContentEl.offsetTop - container.offsetHeight
break
case 'left-vertical':
leftPos = groupContentEl.offsetLeft - container.offsetWidth
topPos = groupContentEl.offsetTop
break
case 'right':
leftPos = groupContentEl.offsetLeft + groupContentEl.offsetWidth - container.scrollWidth
topPos = groupContentEl.offsetTop - container.offsetHeight
break
case 'right-vertical':
leftPos = groupContentEl.offsetLeft + groupContentEl.offsetWidth
topPos = groupContentEl.offsetTop
}
// need to set twice or use requestAnimationFrame for proper position
container.style.left = '0px'
container.style.top = '0px'
container.style.left = leftPos + 'px'
container.style.top = topPos + 'px'
document.body.append(container)
return container
}
/**
* @param {Position} position
* @param {string} text
* @param {(e: MouseEvent) => void} onclick
*/
function createCornerButton(position, text, onclick) {
const container = createContainer(position)
if (!container) return
const button = document.createElement('button')
button.textContent = text
button.type = 'button'
if (position.includes('vertical')) {
button.style.writingMode = 'vertical-lr'
button.style.height = 'unset'
if (position.includes('left')) {
button.style.rotate = 'z 180deg'
}
}
button.style.padding = '2px'
button.onclick = e => onclick(e)
container.append(button)
}