Install this Userscript/Addon to improve your browsing experience on TheColi... view more embeds.

boogers

cats rule, dogs drool
Supporter
Joined
Mar 11, 2022
Messages
9,849
Reputation
4,526
Daps
28,363
Reppin
#catset
did you write the greasemonkey script or did you use chatGPT to do it?

i used chatGPT to throw together some Perl a while back and it was worthless. by the time i cleaned it up enough to actually run correctly i already realized a better solution
 

bnew

Veteran
Joined
Nov 1, 2015
Messages
62,891
Reputation
9,559
Daps
172,234
did you write the greasemonkey script or did you use chatGPT to do it?

i used chatGPT to throw together some Perl a while back and it was worthless. by the time i cleaned it up enough to actually run correctly i already realized a better solution

i used LLama LLM by meta and deepseek coder, I started of with Llama 3 70b then updated recently with Llama-3.1-sonar-large-128k-chat.

I just realized the recent update is buggy in that it's no longer creating the x.com embeds/iframes or converting twitter.com links into iframes, none of the embed iframes are being created, so i'm testing scripts to see which one last worked and where a mistake was made.

edit
i just made a minor edit to the scipt and uncommented out this this line addMirrorLinks(document); which was at the very bottom, when i did a initial test in just one browser it created two sets of links. i realized 30 minutes later that because it the adding youtube mirrors code was originally part standalone userscript and i just copied and pasted to the end of my existing userscript, i never disabled the other userscript and incorrectly attributed the duplicate links to that one line. turns out I had uncommenting that one line effectively disabled the insertion of youtube mirror links.

i'm still troubleshooting the embed issue.
 
Last edited:

Blessings

Superstar
Supporter
Joined
Feb 25, 2013
Messages
16,753
Reputation
2,843
Daps
48,122
Reppin
NULL
Its sad we have to do all of this for not an enhanced UX but just a basic one…
 

bnew

Veteran
Joined
Nov 1, 2015
Messages
62,891
Reputation
9,559
Daps
172,234
updated the userscript to use a different type of method to display bluesky embeds.



this version isn't on the first page.

LLM served by Perplexity Labs

Summary of the Bookmarklet​

This bookmarklet is a powerful tool designed to enhance the user experience on specific forums, particularly those using the Xenforo platform. Here’s a detailed breakdown of what it does:

1. Embed Social Media Posts

The bookmarklet can embed posts from various social media platforms directly into forum threads. It supports:
  • X (Twitter): Embeds tweets from both x.com and twitter.com.
  • Threads.net: Embeds posts from Threads.net.
  • Mastodon: Embeds posts from Mastodon instances.
  • Bluesky: Embeds posts from Bluesky.

2. Dynamic Height Adjustment

For each embedded post, the bookmarklet uses a technique called MessageChannel to dynamically adjust the height of the iframe to fit the content perfectly. This ensures that users do not have to scroll within the iframe to view the entire post.

3. URL Matching and Replacement

The script uses regular expressions to match URLs of different social media platforms and replace them with iframes that embed the content.

Example:​

  • If a user posts a link to a tweet, the script will replace that link with an iframe containing the tweet.
  • Similarly, links to Threads.net, Mastodon, or Bluesky posts are replaced with iframes embedding those posts.

4. Handling Dynamic Content

The script uses a MutationObserver to monitor changes in the document body. This allows it to handle dynamic content loading, ensuring that newly added links are also processed and embedded correctly.

5. Additional Features for Twitter

For Twitter embeds, the script adds additional links below the embedded tweet:
  • Twstalker Links: Links to Twstalker, Archive.org, Archive.is, Nitter, Xcancel, and other archiving services.
  • URL Replacement: Automatically replaces x.com URLs with twitter.com URLs in text input fields and editable areas.

6. YouTube Mirror Links

The script also adds mirror links for YouTube videos embedded on the page. It checks for YouTube iframes and links and adds additional links to alternative YouTube mirrors such as Yewtu.be, Invidious, etc.

7. Image URL Handling

It adjusts image URLs from Twitter and Reddit to ensure they are displayed correctly:
  • For Twitter images, it removes unnecessary query parameters.
  • For Reddit preview images, it converts them to direct image links.

8. Cursor Position Management

When replacing URLs in text input fields or editable areas, the script saves and restores the cursor position to maintain user convenience.

9. Throttling and Periodic Adjustments

To optimize performance, certain functions like adjusting iframe heights are throttled to run at most once every few seconds.

How It Works​

  1. Initialization:
    • The script initializes by setting up event listeners for page load, keydown, and input events.
    • It defines regular expressions to match URLs from different social media platforms.
  2. Link Replacement:
    • It iterates through all links on the page and checks if they match any of the defined regular expressions.
    • If a match is found, it replaces the link with an iframe embedding the corresponding social media post.
  3. Dynamic Height Adjustment:
    • Each iframe is set up with a MessageChannel to communicate with the embedded content.
    • When the embedded content sends a message indicating its height, the script adjusts the iframe's height accordingly.
  4. Additional Links and Features:
    • For Twitter embeds, it adds Twstalker links and other archiving service links.
    • For YouTube embeds, it adds mirror links to alternative YouTube services.
  5. Continuous Monitoring:
    • The MutationObserver continuously monitors changes in the document body to handle dynamically loaded content.

Simple Summary​

This bookmarklet is like a magic button that makes social media links on forums come alive by turning them into interactive embeds. Here’s what it does in simple terms:
  • Embeds Social Media Posts: Turns links to tweets, Threads.net posts, Mastodon posts, and Bluesky posts into interactive iframes.
  • Adjusts Height Automatically: Makes sure the iframes are the right size so you don't have to scroll inside them.
  • Adds Extra Links for Twitter: Gives you quick access to archive services like Twstalker and others for tweets.
  • Handles YouTube Videos: Adds links to alternative YouTube mirrors for videos embedded on the page.
  • Fixes Image Links: Ensures images from Twitter and Reddit display correctly.
  • Monitors Page Changes: Continuously checks for new content and applies these changes automatically.
By using this bookmarklet, you can enhance your browsing experience on forums by making social media content more interactive and accessible.
 

bnew

Veteran
Joined
Nov 1, 2015
Messages
62,891
Reputation
9,559
Daps
172,234
just leaving this here for future reference.

To account for any domain and any subdomain, not just bsky.app, you can adjust the regular expression to match any valid domain. Here's the updated regular expression:

JavaScript:
const blueskyRegex = /https:\/\/(?:[a-zA-Z0-9-]+\.)?[a-zA-Z0-9-]+\.[a-z]{2,6}\/profile\/(?:did:plc:[^\/]+|[^\/]+)\/post\/[^\/]+/;


Explanation of changes:​


  • (?:[a-zA-Z0-9-]+\.)?: This part still allows for any subdomain (optional). It will match a structure like subdomain.example.com or just example.com if there is no subdomain.
  • [a-zA-Z0-9-]+\.[a-z]{2,6}: This matches the main domain and top-level domain (TLD):
    • [a-zA-Z0-9-]+: Matches the domain name itself (e.g., bsky, example, myservice).
    • \.[a-z]{2,6}: Matches the TLD (e.g., .com, .org, .app, .io, .co, etc.).
  • /profile/: The rest of the regex is unchanged and matches the profile path in the URL.

How it works:​



Examples of URLs that will match:​



This regex is now more generalized and will work with any Bluesky AT Protocol-based domain, regardless of the subdomain or the main domain.
 

bnew

Veteran
Joined
Nov 1, 2015
Messages
62,891
Reputation
9,559
Daps
172,234
made a small change; added "&hl=en-US" so youtube mirrors webpages are in english.

JavaScript:
    function createMirrorLinks(videoId) {
        log(`Creating mirror links for video ID: ${videoId}`);

        const links = mirrorDomains.map(domain => {
            return `<a href="https://${domain}/watch?v=${videoId}&hl=en-US" target="_blank" style="text-decoration: underline;">${domain}</a>`;
        }).join(' | ');

        log(`Generated mirror links: ${links}`);

        return links;
    }

 

bnew

Veteran
Joined
Nov 1, 2015
Messages
62,891
Reputation
9,559
Daps
172,234
watch youtube videos on the coli wthout messing up your algorithm. this script replaces youtube embeds with a embed from a invidious instance. the embed uses less ram/memory too.

The userscript, when installed in a userscript manager like Tampermonkey on a XenForo-compatible forum, automatically finds any YouTube video embeds or YouTube links in forum threads and replaces them with privacy-friendly Invidious embeds and links.

What does the userscript do, step by step?​

  • Detection:
    The script scans each forum page (or any newly-added content) for:
    • Embedded YouTube videos (in <span> or <iframe> elements)
    • Direct YouTube links (youtube.com/watch... or youtu.be/...)
  • Video ID Extraction:
    It extracts each YouTube video’s unique ID from the embed/link URL using pattern matching.
  • Invidious Replacement & Embedding:
    For each found video, it:
    • Removes the original YouTube embed or link from the post.
    • Inserts an Invidious embed in its place—a privacy-friendly alternative player that does not track users.
    • Embeds are fully responsive and styled to fit the forum layout.
  • Title Fetching:
    The script attempts to fetch the video's title from the Invidious API. If it can, the video title is displayed above the player. If the title can't be fetched, it simply skips showing the title without any errors or ugly gaps.
  • YouTube Link Display:
    Under each Invidious video, it adds an underlined link to the original YouTube page for that video. Users can always access the actual YouTube page if they wish.
  • Prevents duplicate embeds:
    The script marks each processed element so it only replaces each video once—even if the forum dynamically loads or changes content (like when new posts load without refreshing the whole page).
  • Handles Dynamically Loaded Content:
    On XenForo forums, new content (like when you scroll or new replies are loaded) can be added without reloading the whole page. The script watches for these updates and will replace any new YouTube embeds or links as they appear.
  • Graceful & Non-Intrusive:
    • The change to Invidious is seamless; users just see the new player, not the underlying technical swap.
    • If anything fails (for example, if the Invidious API is slow or the title fetch breaks), the video still embeds and displays the YouTube link—users do not see any errors.

Simple, real-world summary:​

  • You paste a YouTube link or video in a XenForo forum post.
  • Instead of loading the video from YouTube directly, the forum—on your browser—automatically swaps it for a privacy-respecting Invidious embed.
  • You see a familiar video player, optionally a video title, and always a link to the original YouTube video underneath.
  • It works everywhere in forum threads, including new posts and edits, and doesn't break if the forum loads new posts dynamically.
  • You do not have to take any extra steps after installing the userscript; it runs automatically whenever you browse forum threads.
Why is this useful?
  • Prevents YouTube from tracking you while browsing and watching forum-embedded videos.
  • Bypasses region or age restrictions and provides a cleaner, faster player.
  • Keeps a direct link to YouTube in case you want to watch or interact there.
In short:
The script transparently replaces all embedded or linked YouTube videos on XenForo forums with Invidious players, enhancing privacy and user control, while keeping the YouTube link handy underneath each embed.135


pastebin.com/DYza17gK
old code
4/26/2025

pastebin.com/3mqkCcvW
 
Last edited:
Top