diff --git a/manifest.json b/manifest.json index 1ee0651..18da4ab 100644 --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { "manifest_version": 3, "name": "SGDB Button on Steam", - "version": "1.0.3", + "version": "1.0.4", "description": "Adds a button on Steam game pages to bring you to its SteamGridDB entry.", "icons": { "16": "icons/icon_16.png", @@ -25,7 +25,12 @@ }, "content_scripts": [ { - "matches": [ "*://store.steampowered.com/app/*", "*://steamcommunity.com/app/*" ], + "matches": [ + "*://store.steampowered.com/app/*", + "*://steamcommunity.com/app/*", + "*://steamcommunity.com/id/*", + "*://steamcommunity.com/profiles/*" + ], "js": [ "script.js" ] } ], diff --git a/readme.md b/readme.md index 7366ca3..99157ac 100644 --- a/readme.md +++ b/readme.md @@ -13,7 +13,7 @@ I'm still awaiting verification to publish on the Edge Add-ons site, and I don't ### Manual Install 1. Start by downloading the latest release from [here](https://gitea.goblincave.synology.me/Nes/SGDB-Extension/releases). 2. Unpack the ZIP archive in a location of your choosing. -3. `edge://extensions` in Edge, or `chrome://extensions` in Chrome +3. Go to `edge://extensions` in Edge, or `chrome://extensions` in Chrome 4. Enable "Developer mode" 5. Press "Load unpacked" and select the folder where you unzipped the extension. @@ -36,3 +36,5 @@ You can also add some custom SGDB buttons through Augmented Steam. - Name: `SteamGridDB` - URL: `steamgriddb.com/profile/[ID]` - Icon: `i.imgur.com/NYQSplq.png` + +If you find that user profiles are too crowded, I would recommend disabling the "Show a link to view SteamIDs" setting under Community > Profile in Augmented Steam. \ No newline at end of file diff --git a/script.js b/script.js index f47b58f..197f594 100644 --- a/script.js +++ b/script.js @@ -1,12 +1,18 @@ +if(typeof browser === "undefined") + var browser = chrome; + const url = window.location.href; -const appIDMatch = url.match(/\/app\/(\d+)/); -if(appIDMatch) { +var appID; +if(url.includes('/app/')) { + const appIDMatch = url.match(/\/app\/(\d+)/); + appID = appIDMatch[1]; +} + +if(appID) { const buttonContainer = document.querySelector(".apphub_OtherSiteInfo"); if(buttonContainer) { - - const appID = appIDMatch[1]; const sgdb_button = document.createElement('a'); sgdb_button.href = `https://steamgriddb.com/steam/${appID}`; @@ -19,12 +25,8 @@ if(appIDMatch) { const icon = document.createElement("img"); icon.className = "ico16"; - if(chrome) { - icon.src = chrome.runtime.getURL("icons/sgdb_16.png"); - } else { - icon.src = browser.runtime.getURL("icons/sgdb_16.png"); - } icon.style.backgroundImage = "none"; + icon.src = browser.runtime.getURL("icons/sgdb_16.png"); span.append(icon); sgdb_button.append(span); @@ -33,3 +35,71 @@ if(appIDMatch) { } } + +var userID; +if(url.includes('/profiles/')) { + const userIDMatch = url.match(/\/profiles\/(\d+)/); + if(userIDMatch) { + userID = userIDMatch[1]; + } +} else if(url.includes('/id/')) { + const div = document.getElementById('responsive_page_template_content'); + if(div) { + const scriptElements = div.getElementsByTagName('script'); + for(script of scriptElements) { + const content = script.textContent || script.innerText; + const userIDMatch = content.match(/"steamid":"(\d+)"/); + if(userIDMatch) { + userID = userIDMatch[1]; + break; + } + } + } +} + +if(userID) { + + const headerActions = document.querySelector(".profile_header_actions"); + if(headerActions) { + + const dropdown = document.getElementById("profile_action_dropdown"); + if(dropdown) { + + const popup_menu = dropdown.getElementsByClassName("popup_menu"); + + const dropdown_button = document.createElement('a'); + dropdown_button.href = `https://steamgriddb.com/profile/${userID}`; + dropdown_button.className = "popup_menu_item"; + + const icon = document.createElement("img"); + icon.src = browser.runtime.getURL("icons/sgdb_16.png"); + + dropdown_button.append(icon); + dropdown_button.append("\u00A0 SteamGridDB Profile"); + popup_menu[0].append(dropdown_button); + + } else { + + const profile_button = document.createElement('a'); + profile_button.href = `https://steamgriddb.com/profile/${userID}`; + profile_button.className = "btn_profile_action btn_medium"; + profile_button.style.marginRight = "3px"; + profile_button.style.marginLeft = "3px"; + + const span = document.createElement('span'); + span.setAttribute("data-tooltip-text", "View SteamGridDB profile"); + + const icon = document.createElement("img"); + icon.className = "ico16"; + icon.style.backgroundImage = "none"; + icon.src = browser.runtime.getURL("icons/sgdb_16.png"); + + span.append(icon); + profile_button.append(span); + headerActions.append(profile_button); + + } + + } + +}