Steam Community modals as links

Converts pseudo-links from Steam Community into real anchor tags. Instead of opening them as iframes inside modal dialogs, they now open as a full page, they can be opened in another tab, and their URLs can be copied.

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name            Steam Community modals as links
// @namespace       https://denilson.sa.nom.br/
// @author          Denilson Sá Maia
// @version         1.0
// @description     Converts pseudo-links from Steam Community into real anchor tags. Instead of opening them as iframes inside modal dialogs, they now open as a full page, they can be opened in another tab, and their URLs can be copied.
// @match           *://steamcommunity.com/*
// @run-at          document-end
// @icon            https://steamcommunity.com/favicon.ico
// @license         MIT
// ==/UserScript==

(function () {
	"use strict";

	//////////////////////////////////////////////////
	// Convenience functions

	// Returns a new function that will call the callback without arguments
	// after timeout milliseconds of quietness.
	function debounce(callback, timeout = 500) {
		let id = null;
		return function() {
			clearTimeout(id);
			id = setTimeout(callback, timeout);
		};
	}

	const active_mutation_observers = [];

	// Returns a new MutationObserver that observes a specific node.
	// The observer will be immediately active.
	function debouncedMutationObserver(rootNode, callback, timeout = 500) {
		const func = debounce(callback, timeout);
		func();
		const observer = new MutationObserver(func);
		observer.observe(rootNode, {
			subtree: true,
			childList: true,
			attributes: false,
		});
		active_mutation_observers.push(observer);
		return observer;
	}

	// Adds a MutationObserver to each root node matched by the CSS selector.
	function debouncedMutationObserverSelectorAll(rootSelector, callback, timeout = 500) {
		for (const root of document.querySelectorAll(rootSelector)) {
			debouncedMutationObserver(root, callback, timeout);
		}
	}

	function stopAllMutationObservers() {
		for (const mo of active_mutation_observers) {
			mo.disconnect();
		}
		active_mutation_observers.length = 0;
	}

	//////////////////////////////////////////////////

	function main() {
			debouncedMutationObserverSelectorAll("#AppHubContent", function() {
				for (const card of document.querySelectorAll(".apphub_Card.modalContentLink[data-modal-content-url]")) {
					const a = document.createElement("a");
					a.href = card.dataset.modalContentUrl;
					a.append(...card.childNodes);
					card.append(a);
					card.classList.remove('modalContentLink');
				}
			});
	}

	main();

})();