- // ==UserScript==
- // @name SteamDB Community Items Download
- // @author dougwritescode
- // @description Creates download links to mass download community-item-related media from steamdb.info
- // @version 2
- // @grant none
- // @include https://steamdb.info/app/*
- // @icon https://steamdb.info/static/logos/vector_prefers_schema.svg
- // @namespace dougwritescode
- // @license MIT
- // ==/UserScript==
-
- // Find tab-content element
- tab_content_elem = document.querySelector(".tab-content");
-
- // Get the title for this repo
- title_name = document.querySelector('h1[itemprop="name"]').innerText;
-
- // Download function stolen from here: https://bobbyhadz.com/blog/javascript-download-image#how-to-download-images-using-javascript
- // Creates an anchor element and duplicates the asset link therein, appends the element to the document body, assigning the download attribute.
- // It then clicks the element and removes then removes it.
- async function downloadAsset(
- imageSrc,
- nameOfDownload
- ) {
- const response = await fetch(imageSrc);
- const assetBlob = await response.blob();
- const href = URL.createObjectURL(assetBlob);
-
- const anchorElement = document.createElement('a');
- anchorElement.href = href;
- anchorElement.download = nameOfDownload;
- document.body.appendChild(anchorElement);
- anchorElement.click();
-
- document.body.removeChild(anchorElement);
- window.URL.revokeObjectURL(href);
- }
-
- // Generalized download button making
- function make_button(
- titleString,
- onClickFunc,
- classStr = "btn btn-info",
- styleStr = "margin-left: 15px; padding: 1px 5px;"
- ) {
- var new_button = document.createElement("input");
- new_button.type = "button";
- new_button.value = titleString;
- new_button.onclick = onClickFunc;
- new_button.setAttribute("class", classStr);
- new_button.setAttribute("style", styleStr);
- return new_button
- }
-
- // Function to add download button for badges
- function add_download_badges_button(headerObj, itemContainerObj) {
-
- async function downloadBadges() {
- let items = itemContainerObj.querySelectorAll(".community-item");
- for (let i in items) {
- const img_src = items[i].querySelector("img").src;
- const extension = img_src.split(".").pop();
- const badge_title = items[i].innerText
- const name = `${title_name} - badge ${parseInt(i) + 1} - ${badge_title}.${extension}`
- downloadAsset(img_src, name);
- }
- }
-
- var dl_button = make_button("Download All", downloadBadges);
- headerObj.querySelector(".panel-heading").children[0].appendChild(dl_button);
- }
-
- // Function to add download buttons for trading cards and card wallpapers
- function add_download_trading_cards_button(headerObj, itemContainerObj) {
-
- async function downloadTradingCards() {
- let items = itemContainerObj.querySelectorAll(".community-item");
- for (let i in items) {
- const img_src = items[i].querySelector("img").src;
- const extension = img_src.split(".").pop();
- const card_title = items[i].innerText
- const name = `${title_name} - card ${parseInt(i) + 1} - ${card_title}.${extension}`
- downloadAsset(img_src, name);
- }
- }
-
- async function downloadTradingCardWallpapers() {
- let items = itemContainerObj.querySelectorAll(".community-item");
- for (let i in items) {
- const img_src = items[i].querySelector("a").href;
- const extension = img_src.split(".").pop();
- const wall_title = items[i].innerText
- const name = `${title_name} - card wallpaper ${parseInt(i) + 1} - ${wall_title}.${extension}`
- downloadAsset(img_src, name);
- }
- }
-
- var dl_button = make_button("Download Cards", downloadTradingCards);
- headerObj.querySelector(".panel-heading").children[0].appendChild(dl_button);
-
- var dll_button = make_button("Download Wallpapers", downloadTradingCardWallpapers);
- headerObj.querySelector(".panel-heading").children[0].appendChild(dll_button);
- }
-
- // Function to add download button for profile backgrounds
- function add_download_profile_backgrounds_button(headerObj, itemContainerObj) {
-
- async function downloadProfileBackgrounds() {
- let items = itemContainerObj.querySelectorAll(".community-item");
- for (let i in items) {
- const img_src = items[i].querySelector(".view-profile-background").href;
- const extension = img_src.split(".").pop();
- const background_title = items[i].querySelector(".b").innerText;
- const name = `${title_name} - profile background ${parseInt(i) + 1} - ${background_title}.${extension}`
- downloadAsset(img_src, name);
- const webm_link = items[i].querySelector('a[href$=".webm"]')
- if (webm_link != null) {
- const webm_src = webm_link.href;
- const webm_name = `${title_name} - animated profile background ${parseInt(i) + 1} - ${background_title}.webm,`
- downloadAsset(webm_src, webm_name);
- }
- }
- }
-
- var dl_button = make_button("Download All", downloadProfileBackgrounds);
- headerObj.querySelector(".panel-heading").children[0].appendChild(dl_button);
- }
-
- // Function to add download buttons for emoticons
- function add_download_emoticons_button(headerObj, itemContainerObj) {
-
- async function downloadSmallEmoticons() {
- let items = itemContainerObj.querySelectorAll(".community-item");
- for (let i in items) {
- const img_src = items[i].querySelectorAll("img")[0].src;
- const extension = img_src.split(".").pop();
- const emoticon_title = items[i].querySelector(".b").innerText;
- const name = `${title_name} - small emoticon ${parseInt(i) + 1} - ${emoticon_title}.${extension}`
- downloadAsset(img_src, name);
- }
- }
-
- async function downloadLargeEmoticons() {
- let items = itemContainerObj.querySelectorAll(".community-item");
- for (let i in items) {
- const img_src = items[i].querySelectorAll("img")[1].src;
- const extension = img_src.split(".").pop();
- const emoticon_title = items[i].querySelector(".b").innerText;
- const name = `${title_name} - large emoticon ${parseInt(i) + 1} - ${emoticon_title}.${extension}`
- downloadAsset(img_src, name);
- }
- }
-
- var dl_button = make_button("Download Small Emoticons", downloadSmallEmoticons);
- headerObj.querySelector(".panel-heading").children[0].appendChild(dl_button);
-
- var dll_button = make_button("Download Large Emoticons", downloadLargeEmoticons);
- headerObj.querySelector(".panel-heading").children[0].appendChild(dll_button);
- }
-
- // Function to add download button for booster pack
- function add_download_booster_pack_image_button(headerObj, itemContainerObj) {
-
- async function downloadBoosterPack() {
- let items = itemContainerObj.querySelectorAll(".community-item");
- for (let i in items) {
- const img_src = items[i].querySelector("img").src;
- const extension = img_src.split(".").pop();
- const name = `${title_name} - Booster Pack.${extension}`
- downloadAsset(img_src, name);
- }
- }
-
- var dl_button = make_button("Download Pack", downloadBoosterPack);
- headerObj.querySelector(".panel-heading").children[0].appendChild(dl_button);
- }
-
- // Adds download button for chat stickers
- function add_download_chat_stickers_button(headerObj, itemContainerObj) {
-
- async function downloadChatStickers() {
- let items = itemContainerObj.querySelectorAll(".community-item");
- for (let i in items) {
- const img_src = items[i].querySelector("img").src;
- const extension = img_src.split(".").pop();
- const sticker_title = items[i].querySelector(".b").innerText;
- const name = `${title_name} - sticker ${parseInt(i) + 1} - ${sticker_title}.${extension}`
- downloadAsset(img_src, name);
- }
- }
-
- var dl_button = make_button("Download All", downloadChatStickers);
- headerObj.querySelector(".panel-heading").children[0].appendChild(dl_button);
- }
-
- // Adds download button for chat effects (So far, the only ones are from the Winter Sale Event 2019)
- function add_download_chat_effects_button(headerObj, itemContainerObj) {
-
- async function downloadChatEffects() {
- let items = itemContainerObj.querySelectorAll(".community-item");
- for (let i in items) {
- const img_src = items[i].querySelectorAll("img")[1].src;
- const extension = img_src.split(".").pop();
- const effect_title = items[i].querySelector(".b").innerText;
- const name = `${title_name} - chat effect icon ${parseInt(i) + 1} - ${effect_title}.${extension}`
- downloadAsset(img_src, name);
- }
- }
-
- var dl_button = make_button("Download All", downloadChatEffects);
- headerObj.querySelector(".panel-heading").children[0].appendChild(dl_button);
- }
-
- // Adds download button for mini profile backgrounds
- function add_download_mini_profile_backgrounds_button(headerObj, itemContainerObj) {
-
- async function downloadMiniProfileBackgrounds() {
- let items = itemContainerObj.querySelectorAll(".community-item");
- for (let i in items) {
- const img_src = items[i].querySelector('a[href$=".webm"]').href;
- const extension = img_src.split(".").pop();
- const mini_profile_title = items[i].querySelector(".b").innerText;
- const name = `${title_name} - mini profile background ${parseInt(i) + 1} - ${mini_profile_title}.${extension}`
- downloadAsset(img_src, name);
- }
- }
-
- var dl_button = make_button("Download All", downloadMiniProfileBackgrounds);
- headerObj.querySelector(".panel-heading").children[0].appendChild(dl_button);
- }
-
- // Adds download button for avatar frames
- function add_download_avatar_frames_button(headerObj, itemContainerObj) {
-
- async function downloadAvatarFrames() {
- let items = itemContainerObj.querySelectorAll(".community-item");
- for (let i in items) {
- const img_src = items[i].querySelector("img").src;
- const extension = img_src.split(".").pop();
- const avatar_frame_title = items[i].querySelector(".b").innerText;
- const name = `${title_name} - avatar frame ${parseInt(i) + 1} - ${avatar_frame_title}.${extension}`
- downloadAsset(img_src, name);
- }
- }
-
- var dl_button = make_button("Download All", downloadAvatarFrames);
- headerObj.querySelector(".panel-heading").children[0].appendChild(dl_button);
- }
-
- // Adds download button for animated avatars
- function add_download_animated_avatars_button(headerObj, itemContainerObj) {
-
- async function downloadAnimatedAvatars() {
- let items = itemContainerObj.querySelectorAll(".community-item");
- for (let i in items) {
- const img_src = items[i].querySelector("img").src;
- const extension = img_src.split(".").pop();
- const animated_avatar_title = items[i].querySelector(".b").innerText;
- const name = `${title_name} - animated avatar ${parseInt(i) + 1} - ${animated_avatar_title}.${extension}`
- downloadAsset(img_src, name);
- }
- }
-
- var dl_button = make_button("Download All", downloadAnimatedAvatars);
- headerObj.querySelector(".panel-heading").children[0].appendChild(dl_button);
- }
-
- // Adds all download buttons for which there are headers
- function add_buttons() {
-
- if (!document.querySelector(".community-items-header")) {
- return false;
- }
-
- // Locate all of the item header panel elements
- panel_headers = tab_content_elem.querySelectorAll(".community-items");
-
- if (panel_headers.length == 0) {
- return false;
- }
-
- for (let i in panel_headers) {
- var item_class_id = panel_headers[i].id;
- if (item_class_id == null) {
- continue;
- }
- var item_container = panel_headers[i].querySelector(".community-items-container");
- switch(item_class_id) {
- case "item-class-1": // Badges
- add_download_badges_button(panel_headers[i], item_container);
- break;
- case "item-class-2": // Trading cards
- add_download_trading_cards_button(panel_headers[i], item_container);
- break;
- case "item-class-3": // Profile backgrounds
- add_download_profile_backgrounds_button(panel_headers[i], item_container);
- break;
- case "item-class-4": // Emoticons
- add_download_emoticons_button(panel_headers[i], item_container);
- break;
- case "item-class-5": // Booster packs
- add_download_booster_pack_image_button(panel_headers[i], item_container);
- break;
- // item-class-6 is ?
- // item-class-7 is ?
- // item-class-8 is profile modifiers (collections of avatar + frame + profile background + mini profile background), nothing to download
- // item-class-9 is ?
- // item-class-10 is ?
- case "item-class-11": // Chat stickers
- add_download_chat_stickers_button(panel_headers[i], item_container);
- break;
- case "item-class-12": // Chat effects
- add_download_chat_effects_button(panel_headers[i], item_container);
- break;
- case "item-class-13": // Mini profile backgrounds
- add_download_mini_profile_backgrounds_button(panel_headers[i], item_container);
- break;
- case "item-class-14": // Avatar frames
- add_download_avatar_frames_button(panel_headers[i], item_container);
- break;
- case "item-class-15": // Animated avatars
- add_download_animated_avatars_button(panel_headers[i], item_container);
- break;
- // item-class-16 is Steam Deck keyboards (nothing to download)
- // item-class-17 is Steam Deck / Big Picture startup movies (direct links not provided on steamdb as of Feb 9, 2024)
- default:
- break;
- }
- }
- return true;
- }
-
- // Event listener for vanilla javascript to trigger adding buttons once the DOM has loaded
- document.addEventListener("DOMContentLoaded", () => {
- add_buttons()
- });
-
- // Mutation observer code to trigger adding buttons in the event of moving to the community items tab from another repo page
- const targetNode = tab_content_elem;
- const config = { childList: true };
- const callback = (mutationList, observer) => {
- for (const mutation of mutationList) {
- let added = add_buttons();
- if (added == true) {
- observer.disconnect();
- }
- }
- };
- const observer = new MutationObserver(callback);
- observer.observe(targetNode, config);
-