rx-player 3.33.0 → 3.33.1

package/src/parsers/texttracks/webvtt/html/__tests__/parse_webvtt_to_div.test.ts

@@ -1,181 +0,0 @@
-/**
- * Copyright 2015 CANAL+ Group
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/* eslint-disable @typescript-eslint/no-unsafe-assignment */
-/* eslint-disable @typescript-eslint/no-unsafe-member-access */
-/* eslint-disable @typescript-eslint/no-var-requires */
-/* eslint-disable @typescript-eslint/no-unsafe-call */
-/* eslint-disable @typescript-eslint/no-unsafe-assignment */
-/* eslint-disable @typescript-eslint/no-unsafe-return */
-
-describe("parsers - webvtt - parseWebVTT", () => {
-  beforeEach(() => {
-    jest.resetModules();
-  });
-
-  it("should throw if text is empty", () => {
-    const parseWebVTT = jest.requireActual("../parse_webvtt_to_div").default;
-    expect(() => parseWebVTT("", 0))
-      .toThrowError("Can't parse WebVTT: Invalid File.");
-  });
-
-  it("should throw if file seems to be invalid", () => {
-    const parseWebVTT = jest.requireActual("../parse_webvtt_to_div").default;
-    expect(() => parseWebVTT("WEBWTT\n", 0))
-      .toThrowError("Can't parse WebVTT: Invalid File.");
-  });
-
-  it("should return cues if inner contains right cues", () => {
-    const spyGetStyleBlock = jest.fn(() => [
-      ["STYLE", ""],
-      ["STYLE", ""],
-    ]);
-    jest.mock("../../get_style_blocks", () => ({
-      __esModule: true as const,
-      default: spyGetStyleBlock,
-    }));
-
-    const spyGetCueBlock = jest.fn(() => [
-      ["CUE", ""],
-      ["CUE", ""],
-    ]);
-    jest.mock("../../get_cue_blocks", () => ({
-      __esModule: true as const,
-      default: spyGetCueBlock,
-    }));
-
-    const spyParseCueBlock = jest.fn(() => ({
-      start: 0,
-      end: 100,
-      payload: "<b>Test</b>Bonjour",
-      header: "b",
-      settings: {},
-    }));
-    jest.mock("../../parse_cue_block", () => ({
-      __esModule: true as const,
-      default: spyParseCueBlock,
-    }));
-
-    const spyParseStyleBlock = jest.fn(() => ({
-      b: {
-        styleContent: "color:blue;",
-      },
-    }));
-    jest.mock("../parse_style_block", () => ({
-      __esModule: true as const,
-      default: spyParseStyleBlock,
-    }));
-
-    const spyToHTML = jest.fn(() => ({
-      start: 0,
-      end: 100,
-      element: document.createElement("div"),
-    }));
-    jest.mock("../to_html", () => ({
-      __esModule: true as const,
-      default: spyToHTML,
-    }));
-
-    const spyGetFirstLineAfterHeader = jest.fn(() => 1);
-    jest.mock("../../utils", () => ({
-      __esModule: true as const,
-      getFirstLineAfterHeader: spyGetFirstLineAfterHeader,
-    }));
-
-    const parseWebVTT = jest.requireActual("../parse_webvtt_to_div").default;
-    expect(parseWebVTT("WEBVTT\n", 0)).toEqual(
-      [
-        {
-          element: document.createElement("div"),
-          end: 100,
-          start: 0,
-        },
-        {
-          element: document.createElement("div"),
-          end: 100,
-          start: 0,
-        },
-      ]
-    );
-    expect(spyGetFirstLineAfterHeader).toHaveBeenCalledTimes(1);
-    expect(spyGetStyleBlock).toHaveBeenCalledTimes(1);
-    expect(spyGetCueBlock).toHaveBeenCalledTimes(1);
-    expect(spyParseStyleBlock).toHaveBeenCalledTimes(1);
-    expect(spyParseCueBlock).toHaveBeenCalledTimes(2);
-    expect(spyToHTML).toHaveBeenCalledTimes(2);
-  });
-
-  it("should return empty array if cue blocks can't be parsed", () => {
-    const spyGetStyleBlock = jest.fn(() => [
-      ["STYLE", ""],
-      ["STYLE", ""],
-    ]);
-    jest.mock("../../get_style_blocks", () => ({
-      __esModule: true as const,
-      default: spyGetStyleBlock,
-    }));
-
-    const spyGetCueBlock = jest.fn(() => [
-      ["CUE", ""],
-      ["CUE", ""],
-    ]);
-    jest.mock("../../get_cue_blocks", () => ({
-      __esModule: true as const,
-      default: spyGetCueBlock,
-    }));
-
-    const spyParseCueBlock = jest.fn(() => undefined);
-    jest.mock("../../parse_cue_block", () => ({
-      __esModule: true as const,
-      default: spyParseCueBlock,
-    }));
-
-    const spyParseStyleBlock = jest.fn(() => ({
-      b: {
-        styleContent: "color:blue;",
-      },
-    }));
-    jest.mock("../parse_style_block", () => ({
-      __esModule: true as const,
-      default: spyParseStyleBlock,
-    }));
-
-    const spyToHTML = jest.fn(() => ({
-      start: 0,
-      end: 100,
-      element: document.createElement("div"),
-    }));
-    jest.mock("../to_html", () => ({
-      __esModule: true as const,
-      default: spyToHTML,
-    }));
-
-    const spyGetFirstLineAfterHeader = jest.fn(() => 1);
-    jest.mock("../../utils", () => ({
-      __esModule: true as const,
-      getFirstLineAfterHeader: spyGetFirstLineAfterHeader,
-    }));
-
-    const parseWebVTT = jest.requireActual("../parse_webvtt_to_div").default;
-    expect(parseWebVTT("WEBVTT\n", 0)).toEqual([]);
-    expect(spyGetFirstLineAfterHeader).toHaveBeenCalledTimes(1);
-    expect(spyGetStyleBlock).toHaveBeenCalledTimes(1);
-    expect(spyGetCueBlock).toHaveBeenCalledTimes(1);
-    expect(spyParseStyleBlock).toHaveBeenCalledTimes(1);
-    expect(spyParseCueBlock).toHaveBeenCalledTimes(2);
-    expect(spyToHTML).not.toHaveBeenCalled();
-  });
-});

package/src/parsers/texttracks/webvtt/html/__tests__/to_html.test.ts

@@ -1,234 +0,0 @@
-/**
- * Copyright 2015 CANAL+ Group
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/* eslint-disable @typescript-eslint/no-unsafe-assignment */
-/* eslint-disable @typescript-eslint/no-unsafe-member-access */
-/* eslint-disable @typescript-eslint/no-var-requires */
-/* eslint-disable @typescript-eslint/no-unsafe-call */
-/* eslint-disable @typescript-eslint/no-unsafe-assignment */
-/* eslint-disable @typescript-eslint/no-unsafe-return */
-
-import { IStyleElements } from "../parse_style_block";
-
-describe("parsers - webvtt - toHTML", () => {
-  beforeEach(() => {
-    jest.resetModules();
-  });
-
-  it("should include payload HTML", () => {
-    jest.mock("../convert_payload_to_html", () => ({
-      __esModule: true as const,
-      default: () => {
-        return [
-          document.createElement("b"),
-          document.createTextNode("Hello"),
-        ];
-      },
-    }));
-
-    const toHTML = jest.requireActual("../to_html").default;
-    const cueObject = {
-      start: 0,
-      end: 100,
-      header: "b",
-      payload: ["<body><b></b><p>Hello<p><body>"],
-    };
-
-    const classes : IStyleElements = {};
-
-    const { element, start, end } = toHTML(cueObject, { classes  });
-    expect(start).toBe(0);
-    expect(end).toBe(100);
-    expect(element.outerHTML).toBe(
-      "<div style=" +
-        "\"width:100%;" +
-        "height:100%;" +
-        "display:flex;" +
-        "flex-direction:column;" +
-        "justify-content:flex-end;" +
-        "align-items:center;\">" +
-        "<p style=\"text-align:center\">" +
-          "<span style=\"background-color:rgba(0,0,0,0.8);color:white;\">" +
-            "<b></b>" +
-            "Hello" +
-          "</span>" +
-        "</p>" +
-      "</div>");
-  });
-
-  it("should include payload HTML and apply correclty style class element", () => {
-    jest.mock("../convert_payload_to_html", () => ({
-      __esModule: true as const,
-      default: () => {
-        return [
-          document.createElement("b"),
-          document.createTextNode("Hello"),
-        ];
-      },
-    }));
-
-    const toHTML = jest.requireActual("../to_html").default;
-    const cueObject = {
-      start: 0,
-      end: 100,
-      header: "b",
-      payload: ["<body><b></b><p>Hello<p><body>"],
-    };
-
-    const classes : IStyleElements = {
-      b: "color:yellow;",
-    };
-
-    const { element, start, end } = toHTML(cueObject, { classes  });
-    expect(start).toBe(0);
-    expect(end).toBe(100);
-    expect(element.outerHTML).toBe(
-      "<div style=" +
-        "\"width:100%;" +
-        "height:100%;" +
-        "display:flex;" +
-        "flex-direction:column;" +
-        "justify-content:flex-end;" +
-        "align-items:center;\">" +
-        "<p style=\"text-align:center\">" +
-          "<span style=\"background-color:rgba(0,0,0,0.8);color:white;color:yellow;\">" +
-            "<b></b>" +
-            "Hello" +
-          "</span>" +
-        "</p>" +
-      "</div>");
-  });
-
-  it("should include payload HTML and apply correctly global style element", () => {
-    jest.mock("../convert_payload_to_html", () => ({
-      __esModule: true as const,
-      default: () => {
-        return [
-          document.createElement("b"),
-          document.createTextNode("Hello"),
-        ];
-      },
-    }));
-
-    const toHTML = jest.requireActual("../to_html").default;
-    const cueObject = {
-      start: 0,
-      end: 100,
-      header: "b",
-      payload: ["<body><b></b><p>Hello<p><body>"],
-    };
-
-    const classes : IStyleElements = {};
-    const global = "color:yellow;";
-
-    const { element, start, end } = toHTML(cueObject, { classes , global });
-    expect(start).toBe(0);
-    expect(end).toBe(100);
-    expect(element.outerHTML).toBe(
-      "<div style=" +
-        "\"width:100%;" +
-        "height:100%;" +
-        "display:flex;" +
-        "flex-direction:column;" +
-        "justify-content:flex-end;" +
-        "align-items:center;\">" +
-        "<p style=\"text-align:center\">" +
-          "<span style=\"background-color:rgba(0,0,0,0.8);color:white;color:yellow;\">" +
-            "<b></b>" +
-            "Hello" +
-          "</span>" +
-        "</p>" +
-      "</div>");
-  });
-
-  it("should apply both the global style element and a given class", () => {
-    jest.mock("../convert_payload_to_html", () => ({
-      __esModule: true as const,
-      default: () => {
-        return [
-          document.createElement("b"),
-          document.createTextNode("Hello"),
-        ];
-      },
-    }));
-
-    const toHTML = jest.requireActual("../to_html").default;
-    const cueObject = {
-      start: 0,
-      end: 100,
-      header: "b",
-      payload: ["<body><b></b><p>Hello<p><body>"],
-    };
-
-    const classes : IStyleElements = { b: "bar: baz;" };
-    const global = "color:yellow;";
-
-    const { element, start, end } = toHTML(cueObject, { classes , global });
-    expect(start).toBe(0);
-    expect(end).toBe(100);
-    expect(element.outerHTML).toBe(
-      "<div style=" +
-        "\"width:100%;" +
-        "height:100%;" +
-        "display:flex;" +
-        "flex-direction:column;" +
-        "justify-content:flex-end;" +
-        "align-items:center;\">" +
-        "<p style=\"text-align:center\">" +
-          "<span style=\"background-color:rgba(0,0,0,0.8);color:white;" +
-            "color:yellow;bar: baz;\">" +
-            "<b></b>" +
-            "Hello" +
-          "</span>" +
-        "</p>" +
-      "</div>");
-  });
-
-  it("should return default element if no payload", () => {
-    jest.mock("../convert_payload_to_html", () => ({
-      __esModule: true as const,
-      default: () => {
-        return [];
-      },
-    }));
-
-    const toHTML = jest.requireActual("../to_html").default;
-    const cueObject = {
-      start: 0,
-      end: 100,
-      payload: [],
-    };
-
-    const classes : IStyleElements = {};
-
-    const { element, start, end } = toHTML(cueObject, { classes  });
-    expect(start).toBe(0);
-    expect(end).toBe(100);
-    expect(element.outerHTML).toBe(
-      "<div style=" +
-        "\"width:100%;" +
-        "height:100%;" +
-        "display:flex;" +
-        "flex-direction:column;" +
-        "justify-content:flex-end;" +
-        "align-items:center;\">" +
-        "<p style=\"text-align:center\">" +
-          "<span style=\"background-color:rgba(0,0,0,0.8);color:white;\">" +
-          "</span>" +
-        "</p>" +
-      "</div>");
-  });
-});

package/src/parsers/texttracks/webvtt/html/convert_payload_to_html.ts

@@ -1,46 +0,0 @@
-/**
- * Copyright 2015 CANAL+ Group
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import createStyledElement from "./create_styled_element";
-import { IStyleElements } from "./parse_style_block";
-
-/**
- * @param {string} text
- * @param {Array.<Object>} styleElements
- * @returns {Array.<HTMLElement>}
- */
-export default function convertPayloadToHTML(
-  text : string,
-  styleElements : IStyleElements
-) : HTMLElement[] {
-  const filteredText = text
-    // Remove timestamp tags
-    .replace(/<[0-9]{2}:[0-9]{2}.[0-9]{3}>/, "")
-    // Remove tag content or attributes (e.g. <b dfgfdg> => <b>)
-    .replace(/<([u,i,b,c])(\..*?)?(?: .*?)?>(.*?)<\/\1>/g,
-             "<$1$2>$3</$1$2>");
-
-  const parsedWebVTT = new DOMParser().parseFromString(filteredText, "text/html");
-  const nodes = parsedWebVTT.body.childNodes;
-
-  const styledElements : HTMLElement[] = [];
-  for (let i = 0; i < nodes.length; i++) {
-    styledElements.push(
-      createStyledElement(nodes[i], styleElements)
-    );
-  }
-  return styledElements;
-}

package/src/parsers/texttracks/webvtt/html/create_default_style_elements.ts

@@ -1,26 +0,0 @@
-import { IStyleElements } from "./parse_style_block";
-
-/**
- * Creates default classes defined in the W3 specification
- *
- * https://www.w3.org/TR/webvtt1/#default-classes
- */
-
-const colorMap: { [colorName: string]: string } = {
-  white: "#ffffff",
-  lime: "#00ff00",
-  cyan: "#00ffff",
-  red: "#ff0000",
-  yellow: "#ffff00",
-  magenta: "#ff00ff",
-  blue: "#0000ff",
-  black: "#000000",
-};
-
-export default function createDefaultStyleElements(): IStyleElements {
-  return Object.keys(colorMap).reduce<IStyleElements>((result, key) => {
-    result[key] = `color: ${colorMap[key]};`;
-    result[`bg_${key}`] = `background-color: ${colorMap[key]};`;
-    return result;
-  }, {});
-}

package/src/parsers/texttracks/webvtt/html/create_style_attribute.ts

@@ -1,222 +0,0 @@
-/**
- * Copyright 2015 CANAL+ Group
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import objectValues from "../../../../utils/object_values";
-
-/**
- * Construct a DOM attribute reflecting given cue settings
- * @param {Partial<Record<string, string>>} settings
- * @returns {Attr}
- */
-export default function createStyleAttribute (
-  settings : Partial<Record<string, string>>
-) : Attr {
-  const pAttr = document.createAttribute("style");
-  pAttr.value = getAttrValue(settings);
-  return pAttr;
-}
-
-const getAttrValue = (settings: Partial<Record<string, string>>) => {
-  const hasSettings = settings !== undefined && objectValues(settings).length !== 0;
-  if (!hasSettings) {
-    return "text-align:center";
-  }
-
-  const xPositioning = getPositioningX(settings);
-  const yPositioning = getPositioningY(settings);
-
-  return (
-    "position: absolute;" +
-    "margin: 0;" +
-    `transform: translate(${xPositioning.offset}%,${yPositioning.offset}%);` +
-    `width: ${getSizePercentage(settings.size)}%;` +
-    `left: ${xPositioning.position}%;` +
-    `top: ${yPositioning.position !== null ? `${yPositioning.position}%` : "auto"};` +
-    `text-align: ${getAlignValue(settings.align)};`
-  );
-};
-
-enum PositionAlignment {
-  LINE_LEFT = "line-left",
-  CENTER = "center",
-  LINE_RIGHT = "line-right",
-}
-
-enum Align {
-  LEFT = "left",
-  CENTER = "center",
-  RIGHT = "right",
-}
-
-enum LineAlignment {
-  START = "start",
-  CENTER = "center",
-  END = "end",
-}
-
-interface IXPosition {
-  position: number;
-  offset: number;
-}
-
-const getPositioningX = (settings: Partial<Record<string, string>>): IXPosition => {
-  return {
-    position: getXPositionPercentage(settings),
-    offset: getXOffsetPercentage(settings),
-  };
-};
-
-const getXPositionPercentage = (settings: Partial<Record<string, string>>): number => {
-  const positionPercentage = getPercentageValue(settings.position);
-  if (positionPercentage !== null) {
-    return positionPercentage;
-  }
-
-  const align = getAlignValue(settings.align);
-  const alignMap = {
-    [Align.LEFT]: 0,
-    [Align.CENTER]: 50,
-    [Align.RIGHT]: 100,
-  };
-
-  return alignMap[align];
-};
-
-const getXOffsetPercentage = (settings: Partial<Record<string, string>>): number => {
-  const getPositionAlignment = (positionSetting: string): PositionAlignment | null => {
-    const positionRegex = /,(line-left|line-right|center)/;
-    const matches = positionRegex.exec(positionSetting);
-
-    if (!Array.isArray(matches) || matches.length < 2) {
-      return null;
-    }
-
-    return matches[1] as PositionAlignment;
-  };
-
-  const positionAlignmentMap = {
-    [PositionAlignment.LINE_LEFT]: 0,
-    [PositionAlignment.CENTER]: -50,
-    [PositionAlignment.LINE_RIGHT]: -100,
-  };
-
-  const positionAlignment = settings.position !== undefined ?
-    getPositionAlignment(settings.position) :
-    null;
-
-  if (positionAlignment !== null) {
-    return positionAlignmentMap[positionAlignment];
-  }
-
-  const alignMap = {
-    [Align.LEFT]: 0,
-    [Align.CENTER]: -50,
-    [Align.RIGHT]: -100,
-  };
-
-  const align = settings.align !== undefined ?
-    getAlignValue(settings.align)
-    : Align.CENTER;
-
-  return alignMap[align];
-};
-
-interface IYPosition {
-  position: number | null;
-  offset: number;
-}
-
-const getPositioningY = (settings: Partial<Record<string, string>>): IYPosition => {
-  return {
-    position: getYPositionPercentage(settings.line),
-    offset: getYOffsetPercentage(settings.line),
-  };
-};
-
-const getYPositionPercentage = (lineSetting: string | undefined): number | null => {
-  return getPercentageValue(lineSetting);
-};
-
-const getYOffsetPercentage = (lineSetting: string | undefined) => {
-  const getLineAlignment = (line: string): LineAlignment | null => {
-    const positionRegex = /,(start|center|end)/;
-    const matches = positionRegex.exec(line);
-
-    if (!Array.isArray(matches) || matches.length < 2) {
-      return null;
-    }
-
-    return matches[1] as LineAlignment;
-  };
-
-  const lineAlignmentMap = {
-    [LineAlignment.START]: 0,
-    [LineAlignment.CENTER]: -50,
-    [LineAlignment.END]: -100,
-  };
-
-  if (lineSetting === undefined) {
-    return lineAlignmentMap[LineAlignment.START];
-  }
-
-  const lineAlignment = getLineAlignment(lineSetting);
-
-  return lineAlignment !== null ?
-    lineAlignmentMap[lineAlignment] :
-    lineAlignmentMap[LineAlignment.START];
-};
-
-const getAlignValue = (alignSetting: string | undefined): Align => {
-  switch (alignSetting) {
-    case "left":
-    case "start":
-      return "left" as Align;
-    case "right":
-    case "end":
-      return "right" as Align;
-    default:
-      return "center" as Align;
-  }
-};
-
-const getSizePercentage = (sizeSetting: string | undefined) => {
-  const defaultSize = 100;
-  return getPercentageValueOrDefault(sizeSetting, defaultSize);
-};
-
-const getPercentageValueOrDefault = (
-  percentageString: string | undefined, defaultValue: number
-): number => {
-  const value = getPercentageValue(percentageString);
-
-  return value !== null ?
-    value :
-    defaultValue;
-};
-
-const getPercentageValue = (percentageString: string | undefined): number | null => {
-  if (percentageString === undefined) {
-    return null;
-  }
-
-  const percentageValueRegex = /^([\d.]+)%/;
-  const matches = percentageValueRegex.exec(percentageString);
-  if (!Array.isArray(matches) || matches.length < 2) {
-    return null;
-  }
-
-  return parseInt(matches[1], 10);
-};