How to Create a JavaScript Bookmarklet for Automatically Setting German Audio and Subtitles on Netflix

How to ?
1

Hello everyone,

Today, I want to share a useful tool for anyone trying to watch shows on Netflix in German with German audio and automatically generated subtitles. This is particularly helpful for those using the Language Reactor extension to learn languages. Below, I’ll guide you through creating a JavaScript bookmarklet that you can simply click to switch the audio and subtitles to German whenever you’re watching Netflix.

What is a Bookmarklet?

A bookmarklet is a small JavaScript program stored as a URL within a bookmark in a web browser. Bookmarklets can perform various tasks such as modifying a web page, querying a search engine, or controlling video playback.

Step 1: Writing the JavaScript Code

First, we need to craft a script that:

  • Ensures a video is loaded.
  • Checks if the correct audio and subtitle tracks are set.
  • Waits for the subtitles to successfully load.
  • Handles playback control to ensure the settings apply correctly.

Here is the JavaScript code tailored for this purpose:

(function() {
  function setTracks() {
    let video = document.querySelector('video');
    if (!video || !window.lln || !window.lln.vidMan) return;

    let isGoodTrack = (
      window.lln.setMan.sourceLanguageCode === "de" &&
      window.lln.setMan.translationLanguageCode === "en"
    );

    if (!isGoodTrack) {
      window.lln.vidMan.setAudioTrack("A:2:1;2;de;0;0;");
      window.lln.vidMan.setSubtitleTrack("ASR_A:2:1;2;de;0;0;");
      video.pause();
      return;
    }

    let subsContent = document.querySelector("#lln-subs-content");
    if (subsContent && subsContent.textContent.trim() === "- Loading subtitles, please wait... -") {
      if (!video.paused) video.pause();
      setTimeout(setTracks, 1000);
      return;
    }

    if (video.paused) video.play();
  }

  function waitForLLN(tries = 0) {
    if (document.querySelector('video') && window.lln && window.lln.vidMan) {
      setTracks();
      return;
    }

    if (tries > 30) {
      console.error("Custom language connector failed.");
      return;
    }

    setTimeout(function() { waitForLLN(tries + 1); }, 500);
  }

  waitForLLN();
})();

Step 2: Minifying the JavaScript Code

For the bookmarklet to work efficiently and be easy to manage, we need to minify our JavaScript. You can use online tools like JSCompress (jscompress.com) to minify the code.

Step 3: Creating the Bookmarklet

Once your JavaScript code is minified:

  • Right-click on your browser’s bookmark bar and select “Add page” or “Bookmark this page.”
  • Name your bookmark, e.g., “German Netflix Setup.”
  • In the URL field, prepend your minified code with javascript: (This is crucial as it tells the browser to execute the code).

Step 4: Using the Bookmarklet

Whenever you’re watching a show on Netflix and you want to switch to German audio and subtitles:

  • Simply click on the bookmarklet.
  • The script will execute, adjusting the audio and subtitles settings as needed.

Caution

Bookmarklets execute JavaScript directly on your current page, which can pose security risks if misused. Always ensure your scripts do not contain sensitive data or harmful code.

Feel free to try this out and share your experiences! If you have any questions or need further assistance, I’m here to help. Enjoy your language learning journey with Netflix!

Edit: This would be the final bookmarklet for loading German subtitles