web: Rename player elements to *Element

This commit is contained in:
Nathan Adams 2024-08-05 01:22:43 +02:00
parent c1ed00e6c8
commit fd9e7ff452
5 changed files with 36 additions and 26 deletions

View File

@ -1,4 +1,4 @@
import { copyElement, RufflePlayer } from "./ruffle-player"; import { copyElement, RufflePlayerElement } from "./ruffle-player-element";
import { import {
getPolyfillOptions, getPolyfillOptions,
isFallbackElement, isFallbackElement,
@ -16,7 +16,7 @@ import { isSwf } from "../../swf-utils";
* *
* @internal * @internal
*/ */
export class RuffleEmbed extends RufflePlayer { export class RuffleEmbedElement extends RufflePlayerElement {
/** /**
* @ignore * @ignore
* @internal * @internal
@ -136,9 +136,14 @@ export class RuffleEmbed extends RufflePlayer {
* @param elem Element to replace. * @param elem Element to replace.
* @returns Created RuffleEmbed. * @returns Created RuffleEmbed.
*/ */
static fromNativeEmbedElement(elem: Element): RuffleEmbed { static fromNativeEmbedElement(elem: Element): RuffleEmbedElement {
const externalName = registerElement("ruffle-embed", RuffleEmbed); const externalName = registerElement(
const ruffleObj = document.createElement(externalName) as RuffleEmbed; "ruffle-embed",
RuffleEmbedElement,
);
const ruffleObj = document.createElement(
externalName,
) as RuffleEmbedElement;
copyElement(elem, ruffleObj); copyElement(elem, ruffleObj);
return ruffleObj; return ruffleObj;

View File

@ -1,4 +1,4 @@
import { copyElement, RufflePlayer } from "./ruffle-player"; import { copyElement, RufflePlayerElement } from "./ruffle-player-element";
import { import {
getPolyfillOptions, getPolyfillOptions,
isFallbackElement, isFallbackElement,
@ -7,7 +7,7 @@ import {
} from "./inner"; } from "./inner";
import { FLASH_ACTIVEX_CLASSID } from "../../flash-identifiers"; import { FLASH_ACTIVEX_CLASSID } from "../../flash-identifiers";
import { registerElement } from "../register-element"; import { registerElement } from "../register-element";
import { RuffleEmbed } from "./ruffle-embed"; import { RuffleEmbedElement } from "./ruffle-embed-element";
import { isSwf } from "../../swf-utils"; import { isSwf } from "../../swf-utils";
/** /**
@ -63,7 +63,7 @@ function paramsOf(elem: Element): Record<string, string> {
* *
* @internal * @internal
*/ */
export class RuffleObject extends RufflePlayer { export class RuffleObjectElement extends RufflePlayerElement {
private params: Record<string, string> = {}; private params: Record<string, string> = {};
/** /**
@ -232,10 +232,10 @@ export class RuffleObject extends RufflePlayer {
// another <object> that would be supported on modern browsers. // another <object> that would be supported on modern browsers.
return ( return (
!Array.from(elem.getElementsByTagName("object")).some( !Array.from(elem.getElementsByTagName("object")).some(
RuffleObject.isInterdictable, RuffleObjectElement.isInterdictable,
) && ) &&
!Array.from(elem.getElementsByTagName("embed")).some( !Array.from(elem.getElementsByTagName("embed")).some(
RuffleEmbed.isInterdictable, RuffleEmbedElement.isInterdictable,
) )
); );
} else if (classid) { } else if (classid) {
@ -252,17 +252,20 @@ export class RuffleObject extends RufflePlayer {
* @param elem Element to replace. * @param elem Element to replace.
* @returns Created RuffleObject. * @returns Created RuffleObject.
*/ */
static fromNativeObjectElement(elem: Element): RuffleObject { static fromNativeObjectElement(elem: Element): RuffleObjectElement {
const externalName = registerElement("ruffle-object", RuffleObject); const externalName = registerElement(
const ruffleObj: RuffleObject = document.createElement( "ruffle-object",
RuffleObjectElement,
);
const ruffleObj: RuffleObjectElement = document.createElement(
externalName, externalName,
) as RuffleObject; ) as RuffleObjectElement;
// Avoid copying embeds-inside-objects to avoid double polyfilling. // Avoid copying embeds-inside-objects to avoid double polyfilling.
for (const embedElem of Array.from( for (const embedElem of Array.from(
elem.getElementsByTagName("embed"), elem.getElementsByTagName("embed"),
)) { )) {
if (RuffleEmbed.isInterdictable(embedElem)) { if (RuffleEmbedElement.isInterdictable(embedElem)) {
embedElem.remove(); embedElem.remove();
} }
} }
@ -272,7 +275,7 @@ export class RuffleObject extends RufflePlayer {
for (const objectElem of Array.from( for (const objectElem of Array.from(
elem.getElementsByTagName("object"), elem.getElementsByTagName("object"),
)) { )) {
if (RuffleObject.isInterdictable(objectElem)) { if (RuffleObjectElement.isInterdictable(objectElem)) {
objectElem.remove(); objectElem.remove();
} }
} }

View File

@ -8,7 +8,7 @@ import { Player } from "../../public/player";
* *
* This element will represent the rendered and intractable flash movie. * This element will represent the rendered and intractable flash movie.
*/ */
export class RufflePlayer extends HTMLElement implements Player { export class RufflePlayerElement extends HTMLElement implements Player {
#inner: InnerPlayer; #inner: InnerPlayer;
get onFSCommand(): ((command: string, args: string) => boolean) | null { get onFSCommand(): ((command: string, args: string) => boolean) | null {

View File

@ -1,5 +1,5 @@
import { RuffleObject } from "./internal/player/ruffle-object"; import { RuffleObjectElement } from "./internal/player/ruffle-object-element";
import { RuffleEmbed } from "./internal/player/ruffle-embed"; import { RuffleEmbedElement } from "./internal/player/ruffle-embed-element";
import { installPlugin, FLASH_PLUGIN } from "./plugin-polyfill"; import { installPlugin, FLASH_PLUGIN } from "./plugin-polyfill";
import { publicPath } from "./public-path"; import { publicPath } from "./public-path";
import type { DataLoadOptions, URLLoadOptions } from "./load-options"; import type { DataLoadOptions, URLLoadOptions } from "./load-options";
@ -48,14 +48,16 @@ function polyfillFlashInstances(): void {
// Replace <object> first, because <object> often wraps <embed>. // Replace <object> first, because <object> often wraps <embed>.
for (const elem of Array.from(objects)) { for (const elem of Array.from(objects)) {
if (RuffleObject.isInterdictable(elem)) { if (RuffleObjectElement.isInterdictable(elem)) {
const ruffleObject = RuffleObject.fromNativeObjectElement(elem); const ruffleObject =
RuffleObjectElement.fromNativeObjectElement(elem);
elem.replaceWith(ruffleObject); elem.replaceWith(ruffleObject);
} }
} }
for (const elem of Array.from(embeds)) { for (const elem of Array.from(embeds)) {
if (RuffleEmbed.isInterdictable(elem)) { if (RuffleEmbedElement.isInterdictable(elem)) {
const ruffleEmbed = RuffleEmbed.fromNativeEmbedElement(elem); const ruffleEmbed =
RuffleEmbedElement.fromNativeEmbedElement(elem);
elem.replaceWith(ruffleEmbed); elem.replaceWith(ruffleEmbed);
} }
} }

View File

@ -1,6 +1,6 @@
import { pluginPolyfill, polyfill } from "./polyfills"; import { pluginPolyfill, polyfill } from "./polyfills";
import { registerElement } from "./internal/register-element"; import { registerElement } from "./internal/register-element";
import { RufflePlayer } from "./internal/player/ruffle-player"; import { RufflePlayerElement } from "./internal/player/ruffle-player-element";
import { buildInfo } from "./build-info"; import { buildInfo } from "./build-info";
import { InstallationOptions } from "./install"; import { InstallationOptions } from "./install";
import { Player } from "./public/player"; import { Player } from "./public/player";
@ -78,8 +78,8 @@ export const internalSourceApi = {
* into the current page as you wish. * into the current page as you wish.
*/ */
createPlayer(): Player { createPlayer(): Player {
const name = registerElement("ruffle-player", RufflePlayer); const name = registerElement("ruffle-player", RufflePlayerElement);
return document.createElement(name) as RufflePlayer; return document.createElement(name) as RufflePlayerElement;
}, },
/** /**