☰

GameGIF

This replaces your profile picture on Game Jolt with a GIF

  1. // ==UserScript==
  2. // @name           GameGIF
  3. // @namespace      http://tampermonkey.net/
  4. // @version        1.3
  5. // @icon           https://s.gjcdn.net/img/favicon.png
  6. // @description    This replaces your profile picture on Game Jolt with a GIF
  7. // @author         LeashedSkies
  8. // @match          https://gamejolt.com/*
  9. // @match          https://*.gamejolt.com/*
  10. // @grant          none
  11. // @license        MIT
  12. // ==/UserScript==
  13.  
  14. (function() {
  15.     'use strict';
  16.  
  17.     // Define your current profile picture URL and the GIF URL
  18.     const currentProfilePicSrc = 'https://m.gjcdn.net/user-avatar/200/8034218-crop36_0_615_579-eiseypvx-v4.webp'; // Change this to your profile picture URL, you can use inspect element, or any other tool, might be hard to do on Mobile.
  19.     const gifUrl = 'https://c.tenor.com/OhUxPkhdcgAAAAAd/tenor.gif'; // Your GIF URL, Go to a GIF, Hold tap or Right click, click Copy Image Link, paste in, .GIF only.
  20.  
  21.     // Function to replace the profile picture on the profile page
  22.     function replaceProfilePicture() {
  23.         const avatarElement = document.querySelector(`img[src="${currentProfilePicSrc}"]`);
  24.         if (avatarElement) {
  25.             avatarElement.src = gifUrl;
  26.         }
  27.     }
  28.  
  29.     // Function to replace profile pictures in posts
  30.     function replacePostProfilePictures() {
  31.         const postLinks = document.querySelectorAll('a[href^="https://gamejolt.com/p/"]');
  32.         postLinks.forEach((link) => {
  33.             const postAvatarWrapper = link.querySelector('.user-avatar-img._img'); // Select the wrapper
  34.             if (postAvatarWrapper) {
  35.                 const postAvatar = postAvatarWrapper.querySelector('img');
  36.                 if (postAvatar && postAvatar.src === currentProfilePicSrc) {
  37.                     postAvatarWrapper.innerHTML = `
  38.                         <img src="${gifUrl}" class="img-responsive" style="border-radius: 50%; width: 50px; height: 50px; object-fit: cover;" alt="">
  39.                     `;
  40.                 }
  41.             }
  42.         });
  43.     }
  44.  
  45.     // Function to replace profile pictures in comments
  46.     function replaceCommentProfilePictures() {
  47.         const commentAvatars = document.querySelectorAll('.user-avatar-img img'); // Adjust this selector if needed
  48.         commentAvatars.forEach((avatarElement) => {
  49.             if (avatarElement.src === currentProfilePicSrc) {
  50.                 avatarElement.src = gifUrl;
  51.                 avatarElement.style.borderRadius = '100%'; // Circular
  52.                 avatarElement.style.width = '50px'; // Comment width
  53.                 avatarElement.style.height = '50px'; // Comment height
  54.                 avatarElement.style.objectFit = 'cover'; // Ensure proper fit
  55.             }
  56.         });
  57.     }
  58.  
  59.     // Function to replace the top right icon's profile picture
  60.     function replaceTopRightProfilePicture() {
  61.         const topRightAvatar = document.querySelector('.user-avatar-img._img img');
  62.         if (topRightAvatar && topRightAvatar.src === currentProfilePicSrc) {
  63.             topRightAvatar.src = gifUrl;
  64.             topRightAvatar.style.borderRadius = '50%'; // Circular
  65.             topRightAvatar.style.width = '100px'; // Adjust width to match requirements
  66.             topRightAvatar.style.height = '100px'; // Adjust height to match requirements
  67.             topRightAvatar.style.objectFit = 'cover'; // Ensure proper fit
  68.         }
  69.     }
  70.  
  71.     // Use MutationObserver to watch for changes in the DOM
  72.     const observer = new MutationObserver(() => {
  73.         replaceProfilePicture();
  74.         replacePostProfilePictures();
  75.         replaceCommentProfilePictures();
  76.         replaceTopRightProfilePicture(); // Add top right icon replacement
  77.     });
  78.  
  79.     // Start observing the body for changes
  80.     observer.observe(document.body, {
  81.         childList: true,
  82.         subtree: true
  83.     });
  84.  
  85.     // Initial calls to replace the profile pictures
  86.     replaceProfilePicture();
  87.     replacePostProfilePictures();
  88.     replaceCommentProfilePictures();
  89.     replaceTopRightProfilePicture(); // Initial call for top right icon replacement
  90. })();