Search Bar for the Booster Creator on steam to make it easier to find the pack you are wanting to create
// ==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);
}
});
});
})();
})();