☰

Iflix Subtitles Fix for Firefox

Subtitles fix for Firefox

  1. // ==UserScript==
  2. // @name         Iflix Subtitles Fix for Firefox
  3. // @icon         https://piay.iflix.com/app/favicon.ico
  4. // @namespace    https://github.com/tkhquang
  5. // @version      2.33
  6. // @description  Subtitles fix for Firefox
  7. // @author       Quang Trinh
  8. // @license      MIT; https://raw.githubusercontent.com/tkhquang/userscripts/master/LICENSE
  9. // @homepage     https://greasyfork.org/en/scripts/367324-iflix-subtitles-fix-for-firefox
  10. // @match        http*://piay.iflix.com/*
  11. // @run-at       document-start
  12. // @require      https://greasyfork.org/scripts/21927-arrive-js/code/arrivejs.js
  13. // @grant        GM_addStyle
  14. // @noframes
  15. // ==/UserScript==
  16.  
  17. /* global GM_addStyle */
  18.  
  19. /*
  20.  * arrive.js
  21.  * v2.4.1
  22.  * https://github.com/uzairfarooq/arrive
  23.  * MIT licensed
  24.  *
  25.  * Copyright (c) 2014-2017 Uzair Farooq
  26.  */
  27.  
  28. /*==================*
  29.  * Reference: http://ronallo.com/demos/webvtt-cue-settings/
  30.  * You can change the below variables to suite your needs.
  31.  *==================*/
  32.  
  33. // ==Configuration==
  34. const lineVTT = 14; //See reference
  35. const minfontSize = "12px"; //Subtitles font-size won't scale smaller than this value
  36. const fontSize = "3vmin"; //font-size = minfontSize + this value
  37. const lineHeight = "150%"; //Better leave this as is - "normal" with lineVTT = 16
  38. // ==Configuration==
  39.  
  40. // ==Codes
  41. function styleSub() {
  42.   "use strict";
  43.  
  44.   const css = `video::cue {
  45. font-size: calc(${minfontSize} + ${fontSize}) !important;
  46. line-height: ${lineHeight} !important;
  47. }`;
  48.   if (typeof GM_addStyle !== "undefined") {
  49.     GM_addStyle(css);
  50.   } else {
  51.     const node = document.createElement("style");
  52.     node.type = "text/css";
  53.     node.appendChild(document.createTextNode(css));
  54.     const heads = document.getElementsByTagName("head");
  55.     if (heads.length > 0) {
  56.       heads[0].appendChild(node);
  57.     } else {
  58.       document.documentElement.appendChild(node);
  59.     }
  60.   }
  61.   console.log("iSFix - Styling Done!");
  62. }
  63.  
  64. function alterSub(activeSub) {
  65.   "use strict";
  66.  
  67.   let activeCues = activeSub.cues;
  68.   function lineCheck() {
  69.     return Boolean(activeCues !== null && activeCues[0] !== undefined && activeCues[0].line === lineVTT);
  70.   }
  71.   if (activeCues !== null && activeCues[0].line !== lineVTT) {
  72.     Object.keys(activeCues).forEach(function (i) {
  73.       activeCues[i].line = lineVTT;
  74.     });
  75.     console.log("iSFix - Done setting lines!");
  76.   }
  77.   if (!lineCheck()) {
  78.     console.log("iSFix - Current line value: " + activeCues[0].line);
  79.     console.warn("iSFix - Unmodified lines => Try changing line value...");
  80.     setTimeout(function () {
  81.       alterSub(activeSub);
  82.     }, 5000);
  83.     return;
  84.   }
  85.   console.log("iSFix - Current line value: " + activeCues[0].line);
  86.   console.log("iSFix - Passed!!!");
  87. }
  88.  
  89. function getSubList(vidPlayer) {
  90.   "use strict";
  91.  
  92.   const subList = vidPlayer[0].textTracks;
  93.   function getSub() {
  94.     return (function () {
  95.       for (let sub of subList) {
  96.         if (sub.mode === "showing") {
  97.           return sub;
  98.         }
  99.       }
  100.       return false;
  101.     }());
  102.   }
  103.   subList.onchange = function () {
  104.     console.log("iSFix - Subtitles onchange action");
  105.     if (getSub()) {
  106.       alterSub(getSub());
  107.     }
  108.   };
  109.   setTimeout(function () {
  110.     if (getSub()) {
  111.       alterSub(getSub());
  112.     }
  113.   }, 10000);
  114. }
  115.  
  116. function getVidState(vidPlayer) {
  117.   "use strict";
  118.   if (!(/^\/play/).test(window.location.pathname)) {
  119.     return;
  120.   }
  121.   if (vidPlayer.length === 0 || vidPlayer[0] === undefined) {
  122.     console.warn("iSFix - No video? Try getting it after 5s...");
  123.     setTimeout(function () {
  124.       getVidState(vidPlayer);
  125.     }, 5000);
  126.     return;
  127.   }
  128.   styleSub();
  129.   getSubList(vidPlayer);
  130. }
  131.  
  132. (function () {
  133.   "use strict";
  134.  
  135.   document.arrive(".vimond-player-video", function () {
  136.     console.log("iSFix - Video element available");
  137.     setTimeout(function () {
  138.       getVidState(document.getElementsByClassName("vimond-player-video"));
  139.     }, 1000);
  140.   });
  141. }());