一个基于油猴的booth网页小工具

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
// ==UserScript==
// @name         Booth2Ripper
// @namespace    http://tampermonkey.net/
// @version      0.0.5
// @description  Add custom "Ripper" and "鱼" buttons, and handle placement based on page content.
// @author       You
// @match        *://booth.pm/*/items/*
// @match        *://*.booth.pm/items/*
// @icon         data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @grant        none
// ==/UserScript==
 
(function() {
    'use strict';
 
    // 创建按钮的HTML代码
    var ripperButtonHtml = `<button id="ripper" style="width: 65px;height:48px;color: rgb(255, 255, 255); background: rgb(127, 127, 127); border-radius: 8px; font-size: 14px; margin-left: 10px;">Ripper</button>`;
    var fishButtonHtml = `<button id="fish" style="width: 48px;height:48px;color: rgb(0, 0, 0); background: rgb(251, 226, 58); border-radius: 8px; font-size: 14px; margin-left: 10px;">鱼</button>`;
    var ripperFixedButtonHtml = `<button id="ripper" style="z-index:999;width: 55px;height:25px;color: rgb(255, 255, 255); background: rgb(127, 127, 127); font-size: 14px;top:52px;left:0px;position:fixed;">Ripper</button>`;
    var fishFixedButtonHtml = `<button id="fish" style="z-index:999;width: 48px;height:48px;color: rgb(0, 0, 0); background: rgb(251, 226, 58); font-size: 14px;top:52px;left:65px;position:fixed;">鱼</button>`;
 
    // 定义一个函数来放置按钮
    function placeButton() {
        // 尝试找到class为 "grid gap-4 justify-start" 的容器
        var targetGrid = document.querySelector('.grid.gap-4.justify-start');
 
        if (targetGrid) {
            // 找到并在 class 为 "flex" 的 div 中添加按钮
            var targetFlex = targetGrid.querySelector('.flex');
            if (targetFlex) {
                targetFlex.appendChild($(ripperButtonHtml)[0]);
                targetFlex.appendChild($(fishButtonHtml)[0]);
            }
        } else {
            // 如果没有找到目标容器, 则在原来的位置添加按钮
            $("body").append(ripperFixedButtonHtml);
            $("body").append(fishFixedButtonHtml);
        }
 
        // 添加Ripper按钮点击事件
        $("#ripper").on("click", function() {
            // 获取当前页面的URL
            var currentUrl = window.location.href;
 
            // 从URL中提取item ID
            var itemIdMatch = currentUrl.match(/\/items\/(\d+)/);
            if (itemIdMatch && itemIdMatch[1]) {
                var itemId = itemIdMatch[1];
                // 构造新的URL
                var newUrl = "https://forum.ripper.store/search?in=titlesposts&term=" + itemId;
                // 在新标签页中打开新的URL
                window.open(newUrl, '_blank');
            } else {
                alert("无法提取商品ID");
            }
        });
 
        // 添加鱼按钮点击事件
        $("#fish").on("click", function() {
            // 获取当前页面的URL
            var currentUrl = window.location.href;
 
            // 从URL中提取item ID
            var itemIdMatch = currentUrl.match(/\/items\/(\d+)/);
            if (itemIdMatch && itemIdMatch[1]) {
                var itemId = itemIdMatch[1];
                // 构造新的URL
                var newUrl = "https://www.goofish.com/search?q=" + itemId;
                // 在新标签页中打开新的URL
                window.open(newUrl, '_blank');
            } else {
                alert("无法提取商品ID");
            }
        });
    }
 
    // 使用MutationObserver来监控DOM变化
    var observer = new MutationObserver(function(mutations, observer) {
        var targetGrid = document.querySelector('.grid.gap-4.justify-start');
        if (targetGrid) {
            placeButton();
            observer.disconnect(); // 找到后停止观察
        }
    });
 
    // 配置MutationObserver
    observer.observe(document.body, {
        childList: true,
        subtree: true
    });
 
    // 如果在指定时间内还未找到目标容器，则使用原始位置
    setTimeout(function() {
        if (!document.querySelector('#ripper') && !document.querySelector('#fish')) {
            placeButton();
            observer.disconnect(); // 停止观察
        }
    }, 5000); // 5秒后超时
})();