2020-11-12 22:32:53 +00:00
|
|
|
import {
|
|
|
|
FLASH_MIMETYPE,
|
|
|
|
FUTURESPLASH_MIMETYPE,
|
|
|
|
FLASH7_AND_8_MIMETYPE,
|
|
|
|
FLASH_MOVIE_MIMETYPE,
|
2021-01-04 12:16:51 +00:00
|
|
|
isScriptAccessAllowed,
|
2020-11-16 21:54:35 +00:00
|
|
|
isSwfFilename,
|
2020-11-12 22:32:53 +00:00
|
|
|
RufflePlayer,
|
|
|
|
} from "./ruffle-player";
|
2020-11-17 19:54:58 +00:00
|
|
|
import { registerElement } from "./register-element";
|
2020-11-12 22:32:53 +00:00
|
|
|
|
2020-11-17 19:52:36 +00:00
|
|
|
/**
|
|
|
|
* A polyfill html element.
|
|
|
|
*
|
|
|
|
* This specific class tries to polyfill existing `<embed>` tags,
|
|
|
|
* and should not be used. Prefer [[RufflePlayer]] instead.
|
|
|
|
*
|
|
|
|
* @internal
|
|
|
|
*/
|
2020-11-12 22:32:53 +00:00
|
|
|
export class RuffleEmbed extends RufflePlayer {
|
2020-11-17 19:52:36 +00:00
|
|
|
/**
|
|
|
|
* Constructs a new Ruffle flash player for insertion onto the page.
|
|
|
|
*
|
|
|
|
* This specific class tries to polyfill existing `<embed>` tags,
|
|
|
|
* and should not be used. Prefer [[RufflePlayer]] instead.
|
|
|
|
*/
|
2020-11-12 22:32:53 +00:00
|
|
|
constructor() {
|
|
|
|
super();
|
|
|
|
}
|
|
|
|
|
2020-11-17 19:52:36 +00:00
|
|
|
/**
|
|
|
|
* @ignore
|
2020-11-17 22:53:17 +00:00
|
|
|
* @internal
|
2020-11-17 19:52:36 +00:00
|
|
|
*/
|
|
|
|
connectedCallback(): void {
|
2020-11-12 22:32:53 +00:00
|
|
|
super.connectedCallback();
|
|
|
|
const src = this.attributes.getNamedItem("src");
|
|
|
|
if (src) {
|
2021-01-13 08:54:23 +00:00
|
|
|
const allowScriptAccess =
|
|
|
|
this.attributes.getNamedItem("allowScriptAccess")?.value ??
|
|
|
|
null;
|
|
|
|
|
2021-01-31 00:59:58 +00:00
|
|
|
// Kick off the SWF download.
|
2021-01-13 08:54:23 +00:00
|
|
|
this.load({
|
|
|
|
url: src.value,
|
2021-01-31 00:59:58 +00:00
|
|
|
allowScriptAccess: isScriptAccessAllowed(
|
|
|
|
allowScriptAccess,
|
|
|
|
src.value
|
|
|
|
),
|
2021-01-13 08:54:23 +00:00
|
|
|
parameters: this.attributes.getNamedItem("flashvars")?.value,
|
|
|
|
backgroundColor: this.attributes.getNamedItem("bgcolor")?.value,
|
2021-08-08 20:38:55 +00:00
|
|
|
base: this.attributes.getNamedItem("base")?.value,
|
2021-01-13 08:54:23 +00:00
|
|
|
});
|
2020-11-12 22:32:53 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-11-17 19:52:36 +00:00
|
|
|
/**
|
|
|
|
* Polyfill of HTMLObjectElement.
|
|
|
|
*
|
|
|
|
* @ignore
|
2020-11-17 22:53:17 +00:00
|
|
|
* @internal
|
2020-11-17 19:52:36 +00:00
|
|
|
*/
|
|
|
|
get src(): string | undefined {
|
2020-11-12 22:32:53 +00:00
|
|
|
return this.attributes.getNamedItem("src")?.value;
|
|
|
|
}
|
|
|
|
|
2020-11-17 19:52:36 +00:00
|
|
|
/**
|
|
|
|
* Polyfill of HTMLObjectElement.
|
|
|
|
*
|
|
|
|
* @ignore
|
2020-11-17 22:53:17 +00:00
|
|
|
* @internal
|
2020-11-17 19:52:36 +00:00
|
|
|
*/
|
|
|
|
set src(srcval: string | undefined) {
|
2020-11-12 22:32:53 +00:00
|
|
|
if (srcval != undefined) {
|
|
|
|
const attr = document.createAttribute("src");
|
|
|
|
attr.value = srcval;
|
|
|
|
this.attributes.setNamedItem(attr);
|
|
|
|
} else {
|
|
|
|
this.attributes.removeNamedItem("src");
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-11-17 19:52:36 +00:00
|
|
|
/**
|
|
|
|
* @ignore
|
2020-11-17 22:53:17 +00:00
|
|
|
* @internal
|
2020-11-17 19:52:36 +00:00
|
|
|
*/
|
|
|
|
static get observedAttributes(): string[] {
|
2020-11-12 22:32:53 +00:00
|
|
|
return ["src", "width", "height"];
|
|
|
|
}
|
|
|
|
|
2020-11-17 19:52:36 +00:00
|
|
|
/**
|
|
|
|
* @ignore
|
2020-11-17 22:53:17 +00:00
|
|
|
* @internal
|
2020-11-17 19:52:36 +00:00
|
|
|
*/
|
2020-11-12 22:32:53 +00:00
|
|
|
attributeChangedCallback(
|
|
|
|
name: string,
|
|
|
|
oldValue: string | undefined,
|
|
|
|
newValue: string | undefined
|
2020-11-17 19:52:36 +00:00
|
|
|
): void {
|
2020-11-12 22:32:53 +00:00
|
|
|
super.attributeChangedCallback(name, oldValue, newValue);
|
|
|
|
if (this.isConnected && name === "src") {
|
2020-11-25 16:22:01 +00:00
|
|
|
let parameters;
|
2020-11-12 22:32:53 +00:00
|
|
|
const flashvars = this.attributes.getNamedItem("flashvars");
|
|
|
|
if (flashvars) {
|
|
|
|
parameters = flashvars.value;
|
|
|
|
}
|
|
|
|
const src = this.attributes.getNamedItem("src");
|
|
|
|
if (src) {
|
2021-08-08 20:38:55 +00:00
|
|
|
this.load({
|
|
|
|
url: src.value,
|
|
|
|
parameters,
|
|
|
|
base: this.attributes.getNamedItem("base")?.value,
|
|
|
|
});
|
2020-11-12 22:32:53 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-11-17 19:52:36 +00:00
|
|
|
/**
|
|
|
|
* Checks if the given element may be polyfilled with this one.
|
|
|
|
*
|
|
|
|
* @param elem Element to check.
|
2020-11-17 22:53:17 +00:00
|
|
|
* @returns True if the element looks like a flash embed.
|
2020-11-17 19:52:36 +00:00
|
|
|
*/
|
2020-11-17 19:53:08 +00:00
|
|
|
static isInterdictable(elem: HTMLElement): boolean {
|
2020-11-12 22:32:53 +00:00
|
|
|
if (!elem.getAttribute("src")) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
const type = elem.getAttribute("type")?.toLowerCase();
|
|
|
|
if (
|
|
|
|
type === FLASH_MIMETYPE.toLowerCase() ||
|
|
|
|
type === FUTURESPLASH_MIMETYPE.toLowerCase() ||
|
|
|
|
type === FLASH7_AND_8_MIMETYPE.toLowerCase() ||
|
|
|
|
type === FLASH_MOVIE_MIMETYPE.toLowerCase()
|
|
|
|
) {
|
|
|
|
return true;
|
|
|
|
} else if (type == null || type === "") {
|
2020-11-16 21:54:35 +00:00
|
|
|
return isSwfFilename(elem.getAttribute("src"));
|
2020-11-12 22:32:53 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
|
2020-11-17 19:52:36 +00:00
|
|
|
/**
|
|
|
|
* Creates a RuffleEmbed that will polyfill and replace the given element.
|
|
|
|
*
|
|
|
|
* @param elem Element to replace.
|
2020-11-17 22:53:17 +00:00
|
|
|
* @returns Created RuffleEmbed.
|
2020-11-17 19:52:36 +00:00
|
|
|
*/
|
2020-11-17 19:53:41 +00:00
|
|
|
static fromNativeEmbedElement(elem: HTMLElement): RuffleEmbed {
|
2020-11-17 19:54:58 +00:00
|
|
|
const externalName = registerElement("ruffle-embed", RuffleEmbed);
|
2020-11-17 19:54:24 +00:00
|
|
|
const ruffleObj = <RuffleEmbed>document.createElement(externalName);
|
|
|
|
ruffleObj.copyElement(elem);
|
2020-11-12 22:32:53 +00:00
|
|
|
|
2020-11-17 19:54:24 +00:00
|
|
|
return ruffleObj;
|
2020-11-12 22:32:53 +00:00
|
|
|
}
|
|
|
|
}
|