Skip to content

Audio Muting: Notes

Jump to bottom
Richard Frost edited this page Apr 24, 2022 · 2 revisions

ABC (GO)

abc.go.com

Example
<div class="akamai-caption-text" style="left: 39%; top: 306.222px; text-align: left; position: absolute; bottom: auto; display: inline; padding: 6px; width: auto; min-height: 0px;">
  <p style="margin: 0px; display: block; line-height: normal;">I got to get dressed<br>and go into work.</p>
</div>
Config
{
  "abc.go.com": {
    "mode": "element",
    "className": "akamai-caption-text",
    "tagName": "DIV"
  }
}

Amazon Video

www.amazon.com

Example
// Element Layout
<div class="f35bt6a" style="">
  <div class="fk87jrb"> <!-- This element persists (can use it for hiding/showing captions) -->
    <div class="f1iwgj00" dir="auto"> <!-- This element gets replaced periodically (Don't use it for hiding/showing) -->
      <div style="bottom: 30px; left: 0px; right: 0px; margin-left: auto; margin-right: auto; width: 80%; height: 15%; text-align: center; display: flex; align-items: flex-end; position: absolute;">
        <p style="width: 100%; margin: 0px;">
          <span class="fbhsa9" style="background-color: rgba(0, 0, 0, 0);">
            <span class="fg8afi5" style="background-color: rgba(0, 0, 0, 0.5); color: rgb(255, 255, 255); font-size: 2.66667vw;">T-BAG:<br>Lincolny-linc.</span>
          </span>
        </p>
      </div>
    </div>
  </div>
</div>
Notes
// This element persists (can use it for hiding/showing captions)
document.querySelector('div.webPlayerContainer div.f35bt6a')

// This element persists (can use it for hiding/showing captions)
document.querySelector('div.webPlayerContainer div.fk87jrb')

// This element gets replaced periodically (Don't use it for hiding/showing)
document.querySelector('div.webPlayerContainer div.f1iwgj00[dir="auto"]');
Config
{
  "www.amazon.com": {
    "mode": "watcher",
    "displayHide": "none",
    "displaySelector": "div.webPlayerContainer div.f35bt6a",
    "displayShow": "",
    "iframe": false,
    "parentSelector": "div.webPlayerContainer div p > span",
    "subtitleSelector": "div.webPlayerContainer div span > span",
    "videoSelector": "div.webPlayerElement video[src]"
  }
}

Dish Anywhere

www.dishanywhere.com

Example
<span id="bmpui-id-286" class="bmpui-ui-subtitle-label" style="left: 0%; top: 93.3333%; font-size: 28.2667px; letter-spacing: 4.29px;">
  AND YOU HUG YOURSELF
</span>

<div id="bmpui-id-286" class="bmpui-subtitle-position-default bmpui-subtitle-region-container">
  <div class="bmpui-container-wrapper">
    <span id="bmpui-id-285" class="bmpui-ui-subtitle-label" style="left: 21.875%; top: 80%; font-size: 34.2667px; letter-spacing: 15.5338px;">This is incredible.</span>
    <span id="bmpui-id-287" class="bmpui-ui-subtitle-label" style="left: 0%; top: 93.3333%; font-size: 34.2667px; letter-spacing: 15.5338px;">Where'd your atrium go?</span>
  </div>
</div>
Config
{
  "www.dishanywhere.com": [
    {
      "mode": "element",
      "className": "bmpui-ui-subtitle-label",
      "tagName": "SPAN"
    },
    {
      "mode": "element",
      "tagName": "div",
      "className": "bmpui-subtitle-region-container",
      "subtitleSelector": "div.bmpui-container-wrapper > span.bmpui-ui-subtitle-label"
    }
  ]
}

FOX

www.fox.com

Example
<div class="jw-text-track-container jw-reset" style="position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; margin: 1.5%;">
  <div class="jw-text-track-display jw-reset" style="text-align: center; white-space: pre-line; position: absolute; direction: ltr; writing-mode: horizontal-tb; unicode-bidi: plaintext; left: 0px; width: 484px; top: 208px; bottom: 35.6563px; height: auto;">
    <div class="jw-text-track-cue jw-reset" style="position: relative; padding-left: 0px; padding-right: 0px; left: 0px; top: 0px; bottom: 0px; display: inline; writing-mode: horizontal-tb; unicode-bidi: plaintext;">who wanted to make the world</div>
  </div>
  <div class="jw-text-track-display jw-reset" style="text-align: center; white-space: pre-line; position: absolute; direction: ltr; writing-mode: horizontal-tb; unicode-bidi: plaintext; left: 0px; width: 484px; top: 230px; bottom: 13.6563px; height: auto;">
    <div class="jw-text-track-cue jw-reset" style="position: relative; padding-left: 0px; padding-right: 0px; left: 0px; top: 0px; bottom: 0px; display: inline; writing-mode: horizontal-tb; unicode-bidi: plaintext;">a better place.</div>
  </div>
</div>
Config
{
  "www.fox.com": {
    "mode": "element",
    "className": "jw-text-track-container",
    "subtitleSelector": "div.jw-text-track-cue",
    "tagName": "DIV"
  }
}

Funimation

www.funimation.com

Example
<div class="vjs-text-track-display" aria-live="off" aria-atomic="true">
  <div style="position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; margin: 1.5%;">
    <div style="text-align: center; font: 25.87px sans-serif; white-space: pre-line; position: absolute; direction: ltr; writing-mode: horizontal-tb; left: 0px; width: 1021.44px; top: 445.438px; bottom: 14px; right: 0px; height: 58px; background-color: rgba(0, 0, 0, 0);">
      <div style="color: rgb(255, 255, 255); background-color: rgb(0, 0, 0); position: relative; left: 0px; right: 0px; top: 0px; bottom: 0px; display: inline; writing-mode: horizontal-tb; unicode-bidi: plaintext; font-family: sans-serif;">
        The story behind it all
        <br>
        is long and complicated
      </div>
    </div>
  </div>
</div>
Config
{
  "www.funimation.com": {
    "mode": "elementChild",
    "_displaySelector": "div.vjs-text-track-display > div > div > div",
    "_displayShow": "inline",
    "iframe": true,
    "parentSelector": "div.vjs-text-track-display",
    "simpleUnmute": true,
    "subtitleSelector": ":scope div > div",
    "tagName": "DIV"
  }
}

Hulu

www.hulu.com

Example
<div class="caption-text-box" style="color: rgb(255, 255, 255); font-family: Arial; font-size: 28px; text-shadow: rgba(0, 0, 0, 0.75) 2px 2px 3px; background-color: rgba(0, 0, 0, 0.5); overflow: visible;">
  <p>Hey, Ed, nice to meet you.<br>I'm Justin.<br>How are you?</p>
</div>
Config
{
  "www.hulu.com": {
    "mode": "element",
    "className": "caption-text-box",
    "subtitleSelector": "p",
    "tagName": "DIV"
  }
}

NBC

www.nbc.com

Example
<div class="ttr-line">
  <span class="ttr-cue ttr-left" style="line-height: 1.25em; display: inline-block; padding-left: 0.1em; padding-right: 0.1em;bottom:2.5em;" tabindex="0" aria-live="polite">It was the first deer</span>
  <span class="ttr-cue ttr-left" style="line-height: 1.25em; display: inline-block; padding-left: 0.1em; padding-right: 0.1em;bottom:1.25em;" tabindex="0" aria-live="polite">I've seen in a year.</span>
  <span class="ttr-cue ttr-left" style="line-height: 1.25em; display: inline-block; padding-left: 0.1em; padding-right: 0.1em;bottom:0em;" tabindex="0" aria-live="polite">Now I have nothing.</span>
</div>
Config
{
  "www.nbc.com": {
    "mode": "element",
    "className": "ttr-line",
    "subtitleSelector": "span.ttr-cue",
    "tagName": "DIV"
  }
}

Netflix

www.netflix.com

Example
<div class="player-timedtext-text-container" style="display: block; white-space: nowrap; text-align: left; position: absolute; left: 38%; bottom: 14%;">
  <span style="font-size:24px;line-height:normal;font-weight:normal;color:#ffffff;text-shadow:#000000 0px 0px 7px;font-family:Netflix Sans,Helvetica Nueue,Helvetica,Arial,sans-serif;font-weight:bolder">
    -I think this is yours, Rose!
  </span>
  <span style="font-size:24px;line-height:normal;font-weight:normal;color:#ffffff;text-shadow:#000000 0px 0px 7px;font-family:Netflix Sans,Helvetica Nueue,Helvetica,Arial,sans-serif;font-weight:bolder">
    <br>-Thanks, Marinette!
  </span>
</div>
Config
{
  "www.netflix.com": {
    "mode": "element",
    "className": "player-timedtext-text-container",
    "subtitleSelector": "span",
    "tagName": "DIV"
  }
}

Plex

app.plex.tv

Example
<div data-dialogue-id="22-285" style="margin: 32.569px 24.948px; min-width: 908.104px;">
  <span style="display: inline-block;">
    <span style="font: 45.314px/52.111px Arial, Arial, Helvetica, sans-serif, &quot;Segoe UI Symbol&quot;; letter-spacing: 0px; opacity: 1; color: rgb(255, 255, 255); text-shadow: rgb(0, 0, 0) 0px 0px 0px, rgb(0, 0, 0) 0px 1px 0px, rgb(0, 0, 0) 0px -1px 0px, rgb(0, 0, 0) 0px 2px 0px, rgb(0, 0, 0) 0px -2px 0px, rgb(0, 0, 0) 0px 3px 0px, rgb(0, 0, 0) 0px -3px 0px, rgb(0, 0, 0) 1px 0px 0px, rgb(0, 0, 0) -1px 0px 0px, rgb(0, 0, 0) 1px 1px 0px, rgb(0, 0, 0) -1px 1px 0px, rgb(0, 0, 0) 1px -1px 0px, rgb(0, 0, 0) -1px -1px 0px, rgb(0, 0, 0) 1px 2px 0px, rgb(0, 0, 0) -1px 2px 0px, rgb(0, 0, 0) 1px -2px 0px, rgb(0, 0, 0) -1px -2px 0px, rgb(0, 0, 0) 2px 0px 0px, rgb(0, 0, 0) -2px 0px 0px, rgb(0, 0, 0) 2px 1px 0px, rgb(0, 0, 0) -2px 1px 0px, rgb(0, 0, 0) 2px -1px 0px, rgb(0, 0, 0) -2px -1px 0px;">
      You have one hour.‌
    </span>
  </span>
  <br>
  <span style="display: inline-block;">
    <span style="font: 45.314px/52.111px Arial, Arial, Helvetica, sans-serif, &quot;Segoe UI Symbol&quot;; letter-spacing: 0px; opacity: 1; color: rgb(255, 255, 255); text-shadow: rgb(0, 0, 0) 0px 0px 0px, rgb(0, 0, 0) 0px 1px 0px, rgb(0, 0, 0) 0px -1px 0px, rgb(0, 0, 0) 0px 2px 0px, rgb(0, 0, 0) 0px -2px 0px, rgb(0, 0, 0) 0px 3px 0px, rgb(0, 0, 0) 0px -3px 0px, rgb(0, 0, 0) 1px 0px 0px, rgb(0, 0, 0) -1px 0px 0px, rgb(0, 0, 0) 1px 1px 0px, rgb(0, 0, 0) -1px 1px 0px, rgb(0, 0, 0) 1px -1px 0px, rgb(0, 0, 0) -1px -1px 0px, rgb(0, 0, 0) 1px 2px 0px, rgb(0, 0, 0) -1px 2px 0px, rgb(0, 0, 0) 1px -2px 0px, rgb(0, 0, 0) -1px -2px 0px, rgb(0, 0, 0) 2px 0px 0px, rgb(0, 0, 0) -2px 0px 0px, rgb(0, 0, 0) 2px 1px 0px, rgb(0, 0, 0) -2px 1px 0px, rgb(0, 0, 0) 2px -1px 0px, rgb(0, 0, 0) -2px -1px 0px;">
      I can't delay it any longer.‌
    </span>
  </span>
</div>

<!-- Or -->

<div class="layer layer0">
  <div class="an an2">
    <div data-dialogue-id="10-6471" style="margin: 29.097px 50px; min-width: 1820px;">
      <span style="display: inline-block;">
        <span style="font: 40.483px/46.556px Arial, Arial, Helvetica, sans-serif, &quot;Segoe UI Symbol&quot;; letter-spacing: 0px; opacity: 1; color: rgb(255, 255, 255); text-shadow: rgb(0, 0, 0) 0px 0px 0px, rgb(0, 0, 0) 0px 1px 0px, rgb(0, 0, 0) 0px -1px 0px, rgb(0, 0, 0) 0px 2px 0px, rgb(0, 0, 0) 0px -2px 0px, rgb(0, 0, 0) 1px 0px 0px, rgb(0, 0, 0) -1px 0px 0px, rgb(0, 0, 0) 1px 1px 0px, rgb(0, 0, 0) -1px 1px 0px, rgb(0, 0, 0) 1px -1px 0px, rgb(0, 0, 0) -1px -1px 0px, rgb(0, 0, 0) 1px 2px 0px, rgb(0, 0, 0) -1px 2px 0px, rgb(0, 0, 0) 1px -2px 0px, rgb(0, 0, 0) -1px -2px 0px, rgb(0, 0, 0) 2px 0px 0px, rgb(0, 0, 0) -2px 0px 0px, rgb(0, 0, 0) 2px 1px 0px, rgb(0, 0, 0) -2px 1px 0px, rgb(0, 0, 0) 2px -1px 0px, rgb(0, 0, 0) -2px -1px 0px, rgb(0, 0, 0) 2px 2px 0px, rgb(0, 0, 0) -2px 2px 0px, rgb(0, 0, 0) 2px -2px 0px, rgb(0, 0, 0) -2px -2px 0px, rgb(0, 0, 0) 3px 0px 0px, rgb(0, 0, 0) -3px 0px 0px, rgb(0, 0, 0) 3px 1px 0px, rgb(0, 0, 0) -3px 1px 0px, rgb(0, 0, 0) 3px -1px 0px, rgb(0, 0, 0) -3px -1px 0px, rgb(0, 0, 0) 3px 2px 0px, rgb(0, 0, 0) -3px 2px 0px, rgb(0, 0, 0) 3px -2px 0px, rgb(0, 0, 0) -3px -2px 0px, rgb(0, 0, 0) 4px 0px 0px, rgb(0, 0, 0) -4px 0px 0px, rgb(0, 0, 0) 4px 1px 0px, rgb(0, 0, 0) -4px 1px 0px, rgb(0, 0, 0) 4px -1px 0px, rgb(0, 0, 0) -4px -1px 0px, rgb(0, 0, 0) 5px 0px 0px, rgb(0, 0, 0) -5px 0px 0px;">
          Oh, my Gosh! Oh, my Gosh!‌
        </span>
      </span>
    </div>
  </div>
</div>
Config
{
  "app.plex.tv": {
    "mode": "element",
    "dataPropPresent": "dialogueId",
    "subtitleSelector": "span > span",
    "tagName": "DIV"
  }
}

Spectrum (On demand)

watch.spectrum.net

Example
<span id="bmpui-id-68" class="bmpui-ui-subtitle-label" style="left: 15.625%; top: 86.6667%; letter-spacing: normal;">store all the new inventory</span>
Config
{
  "watch.spectrum.net": {
    "description": "Only for on demand: /ondemand/play/",
    "mode": "element",
    "tagName": "span",
    "className": "bmpui-ui-subtitle-label"
  }
}

Sling TV

watch.sling.com

Example
<div class="bmpui-container-wrapper">
  <div id="bmpui-id-42" class="bmpui-subtitle-region-container bmpui-subtitle-position-default">
    <div class="bmpui-container-wrapper">
      <span id="bmpui-id-41" class="bmpui-ui-subtitle-label" style="left: 6.25%; top: 93.3333%; font-size: 79.7333px; letter-spacing: 65.7994px;">
        and but we were trying to get
      </span>
    </div>
  </div>
</div>
Config
{
  "watch.sling.com": [
    {
      "className": "bmpui-subtitle-region-container",
      "mode": "element",
      "subtitleSelector": "DIV.bmpui-container-wrapper > SPAN.bmpui-ui-subtitle-label",
      "tagName": "DIV"
    }
  ]
}

Stan

play.stan.com.au

Example
<div class="clpp-subtitles-inner" style="display: flex; justify-content: flex-end; padding-right: 23%;">
  <div class="clpp-subtitles" style="overflow-wrap: break-word; text-align: right;">
    COUGAR: <i>Mustang. Mustang,</i><br><i>this is Ghost Rider, 203.</i>
  </div>
</div>
Config
{
  "play.stan.com.au": {
    "mode": "element",
    "parentSelector": "div.clpp-subtitles"
  }
}

SyFy

www.syfy.com

Example
<div class="ttr-line">
  <span class="ttr-cue ttr-left" style="line-height: 1.25em; display: inline-block; padding-left: 0.1em; padding-right: 0.1em;bottom:0em;" tabindex="0" aria-live="polite">And one minute to mark.</span>
</div>
Config
{
   "www.syfy.com": {
    "mode": "element",
    "className": "ttr-line",
    "subtitleSelector": "span.ttr-cue",
    "tagName": "DIV"
  }
}

Tornado Movies

www4.tornadomovies.co

Example
<div class="jw-text-track-container jw-reset" style="position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; margin: 1.5%;">
  <div class="jw-text-track-display jw-reset" style="text-align: center; white-space: pre-line; position: absolute; direction: ltr; writing-mode: horizontal-tb; unicode-bidi: plaintext; left: 0px; width: 729px; top: 244.5px; bottom: 33px; height: auto;">
    <div class="jw-text-track-cue jw-reset" style="position: relative; padding-left: 0px; padding-right: 0px; left: 0px; top: 0px; bottom: 0px; display: inline; writing-mode: horizontal-tb; unicode-bidi: plaintext;">And now you dare intrude in my kingdom.</div>
  </div>
</div>
Config
{
  "www4.tornadomovies.co": [
    {
      "mode": "element",
      "className": "jw-text-track-container",
      "tagName": "DIV",
      "subtitleSelector": "div.jw-text-track-cue"
    }
  ]
}

Universal Kids

www.universalkids.com

Example
<div style="position: absolute; overflow: hidden; font-style: normal; font-weight: normal; font-family: Calibri, Helvetica, Arial; color: white; font-size: 17.589px; opacity: 1; text-align: left; width: 279px; height: 22px; left: 0px; top: 0px;">
  <div style="width: 100%; height: 100%; background-color: transparent; color: transparent;"></div>
  <div class="gwt-HTML" style="width: 279px; position: absolute; text-decoration: none; overflow-wrap: break-word; left: 0px; top: 0px; height: 22px; opacity: 1;"> this course.</div>
</div>
Config
{
  "www.universalkids.com": {
    "mode": "element",
    "subtitleSelector": "div.gwt-HTML",
    "tagName": "DIV"
  }
}

USA Network (Same as NBC)

www.usanetwork.com

Config
{
  "www.usanetwork.com": {
    "mode": "element",
    "className": "ttr-line",
    "subtitleSelector": "span.ttr-cue",
    "tagName": "DIV"
  }
}

Vudu

www.vudu.com

Example
<!-- Parent: div#subtitleContainer -->
<div style="position: absolute; white-space: pre; top: 83%; left: 10%; width: 90%; text-align: left;">
  <span class="subtitles" style="padding: 0.3vh; display: inline-block;">
    Isn't that... isn't that odd, now?
  </span>
</div>
Config
{
  "www.vudu.com": {
    "mode": "element",
    "subtitleSelector": "span.subtitles",
    "tagName": "DIV"
  }
}

YouTube

www.youtube.com

Example
<div class="caption-window ytp-caption-window-bottom" id="caption-window-_315" dir="ltr" tabindex="0" aria-live="assertive" lang="en" draggable="true" data-layer="4" style="touch-action: none; text-align: left; left: 50%; width: 276px; margin-left: -138px; bottom: 2%;">
  <span class="captions-text">
    <span style="background: rgba(8, 8, 8, 0.75); -webkit-box-decoration-break: clone; border-radius: 2.78889px; font-size: 22.3111px; color: rgb(255, 255, 255); fill: rgb(255, 255, 255); font-family: &quot;YouTube Noto&quot;, Roboto, &quot;Arial Unicode Ms&quot;, Arial, Helvetica, Verdana, &quot;PT Sans Caption&quot;, sans-serif;">
      &nbsp;
      <span class="caption-visual-line">I don't feel like parting with</span>
      &nbsp;<br>&nbsp;
      <span class="caption-visual-line">it.</span>
      &nbsp;
    </span>
  </span>
</div>
Config
{
  "www.youtube.com": {
    "mode": "element",
    "className": "caption-window",
    "subtitleSelector": "span.ytp-caption-segment",
    "tagName": "DIV"
  }
}
Clone this wiki locally