Steam 影片上傳遊戲篩選框

在Steam平台上傳youtube影片時，可以透過篩選框快速尋找對應的遊戲

目前為 2023-03-31 提交的版本，檢視最新版本。

安裝腳本 ?

Wrap lines

// ==UserScript==
// @name         Steam Game Selector for Uploading Videos
// @name:zh-TW   Steam 影片上傳遊戲篩選框
// @namespace    https://steamcommunity.com/id/ani20168/
// @version      1.0
// @description  When uploading a YouTube video on the Steam platform, you can quickly find the corresponding game by using the filtering option.
// @description:zh-tw 在Steam平台上傳youtube影片時，可以透過篩選框快速尋找對應的遊戲
// @author       ani20168
// @include      https://steamcommunity.com/id/*/videos/add*
// @include      https://steamcommunity.com/profiles/*/videos/add*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=steamcommunity.com
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    var select = document.querySelector('#app_assoc_select');
    var options = select.querySelectorAll('option');

    var input = document.createElement('input');
    input.style.marginBottom = '10px';
    input.style.backgroundColor = '#1B1B1B'; // 設置背景顏色為灰色
    input.style.color = '#6F6F6F'; // 設置字體顏色為 #6F6F6F
    input.placeholder = 'The game name';
    input.addEventListener('input', filterOptions);
    select.parentNode.insertBefore(input, select);

    function filterOptions() {
        var filter = input.value.trim().toLowerCase();
        var regex = new RegExp(filter, 'i');
        var visibleCount = 0;

        Array.prototype.forEach.call(options, function(option) {
            var text = option.text.trim().toLowerCase();
            var match = text.match(regex);
            option.style.display = match ? '' : 'none';
            if (match) visibleCount++;
        });

        // 如果可見選項少於 15，則將 select 元素的大小設置為可見選項的數量
        if (visibleCount < 15) {
            select.size = visibleCount;
        } else {
            select.size = '';
        }
    }
})();

欢迎访问Greasy Fork镜像