Greasy Fork

Greasy Fork is available in English.

GGn Corner Button

Add buttons to group content's top corners

当前为 2025-07-01 提交的版本,查看 最新版本

此脚本不应直接安装。它是供其他脚本使用的外部库,要使用该库请加入元指令 // @require https://update.greasyfork.icu/scripts/541342/1617251/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/
// ==/UserScript==
/**
 * @typedef {('left' | 'left-vertical' | 'right' | 'right-vertical')} Position
 */

/**
 * @private
 * @param {Position} position
 */
function createContainer(position) {
    const groupDetails = document.getElementById('content')
    if (!groupDetails) 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 = groupDetails.offsetLeft + container.offsetWidth - container.scrollWidth
            topPos = groupDetails.offsetTop - container.offsetHeight
            break
        case 'left-vertical':
            leftPos = groupDetails.offsetLeft - container.offsetWidth
            topPos = groupDetails.offsetTop
            break
        case 'right':
            leftPos = groupDetails.offsetLeft + groupDetails.offsetWidth - container.scrollWidth
            topPos = groupDetails.offsetTop - container.offsetHeight
            break
        case 'right-vertical':
            leftPos = groupDetails.offsetLeft + groupDetails.offsetWidth
            topPos = groupDetails.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'
        if (position.includes('left')) {
            button.style.rotate = 'z 180deg'
        }
    }
    button.style.padding = '2px'
    button.onclick = e => onclick(e)
    container.append(button)
}