Search Bar for Booster Creator

Search Bar for the Booster Creator on steam to make it easier to find the pack you are wanting to create

当前为 2025-05-09 提交的版本,查看 最新版本

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         Search Bar for Booster Creator
// @namespace    https://github.com/encumber
// @version      2025-03-12
// @description  Search Bar for the Booster Creator on steam to make it easier to find the pack you are wanting to create
// @author       Nitoned
// @match        https://steamcommunity.com/tradingcards/boostercreator/
// @icon         https://community.fastly.steamstatic.com/public/images/economy/tradingcards/boostercreator_art.png
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    (function() {
    // Find the target select element
    let select = document.getElementById("booster_game_selector");
    if (!select) {
        console.warn("Select element with ID 'booster_game_selector' not found.");
        return;
    }

    // Find the reference div
    let referenceDiv = document.querySelector(".booster_game_selector");
    if (!referenceDiv) {
        console.warn("Div with class 'booster_game_selector' not found.");
        return;
    }

    // Create the search input
    let searchInput = document.createElement("input");
    searchInput.type = "text";
    searchInput.placeholder = "Search...";
    searchInput.style.width = "100%";
    searchInput.style.marginBottom = "5px";
    searchInput.style.padding = "5px";

    // Insert search bar after the div but before the select
    referenceDiv.insertAdjacentElement("afterend", searchInput);

    // Store original options
    let options = Array.from(select.options);

    // Add search functionality
    searchInput.addEventListener("input", function() {
        let searchTerm = this.value.toLowerCase();
        select.innerHTML = ""; // Clear existing options

        // Filter and re-add options that match search term
        options.forEach(option => {
            if (option.text.toLowerCase().includes(searchTerm)) {
                select.appendChild(option);
            }
        });
    });
})();

})();