@hopecloud/jetstream-player 1.1.3 → 1.1.5

package/dist/{@types/iframe-builder-src.d.ts → iframe-builder-src.d.ts}

@@ -2,7 +2,6 @@ import { type IFrameBuilderSrcOpt } from './player.type';
 export declare class IFrameBuilderSrc {
     private options;
     origin: string;
-    baseURL: URL;
     constructor(options: IFrameBuilderSrcOpt);
     getRegionBasedOrigin(): string;
     appendPath(path: string, builtUrl: string): string;

package/dist/{@types/iframe-pip-plugin.d.ts → iframe-pip-plugin.d.ts}

@@ -2,7 +2,11 @@ export declare class IFramePiPPlugin {
     containerSelector: string;
     iframe: HTMLIFrameElement;
     private observer;
+    private originalParentHeight;
+    private originalIframeStyle;
+    private parent;
     constructor(containerSelector: string, iframe: HTMLIFrameElement);
     init(): void;
+    destroy(): void;
     destory(): void;
 }

package/dist/index.js

@@ -1,2 +1,278 @@
-const e=["ready","timeupdate","play","pause","loadedmetadata","ended","volumechange","error"];class t{options;iframe=null;constructor(e){this.options=e,this.iframe=this.generateIframe()}generateIframe(){const e=document.createElement("iframe");return e.allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",e.allowFullscreen=!0,e.frameBorder="0",e.src=this.options.src,e.width=this.options.width||"480px",e.height=this.options.height||"270px",e.classList.add("jet-stream-iframe-player"),e}insertIframe(e){const t=document.querySelector(this.options.selector);t?t.appendChild(e):console.error(`Div with id "${this.options.selector}" not found.`)}}class i{options;origin="https://jstre.am";baseURL=new URL(this.origin);constructor(e){if(""===e.mediaId)throw new Error("mediaId not provided!");this.options=e}getRegionBasedOrigin(){const e=this.baseURL,t=e.hostname.split(".");return this.options.region&&"eu"===this.options.region&&(t.length>2?t.splice(1,0,"eu"):t.splice(0,0,"eu")),e.hostname=t.join("."),e.origin}appendPath(e,t){const i=String(e).trim();return 0===i.indexOf("/")?t+=i:t+=`/${i}`,t}buildSrc(){const e=new URL(`${this.getRegionBasedOrigin()}/embed/${this.options.mediaId}`);return this.options.playerId&&(e.href=this.appendPath(this.options.playerId,e.href)),"eu"===this.options.region&&e.searchParams.append("region","eu"),this.options.lang&&e.searchParams.append("lang",this.options.lang.toLowerCase()),e.href}}const s="fixed",r="20px",n="20px",o="330px",a="180px";class h{containerSelector;iframe;observer=null;constructor(e,t){this.containerSelector=e,this.iframe=t,this.containerSelector=e,this.iframe=t,this.init()}init(){if(!this.iframe||!this.containerSelector)return;const e=document.querySelector(this.containerSelector);if(!e)throw new Error("Selector of iframe not found");this.observer=new IntersectionObserver((([{isIntersecting:t}])=>{if(t)e.style.height="auto",this.iframe.removeAttribute("style");else{const t=e.getBoundingClientRect().height;e.style.height=`${t}px`,this.iframe.style.position=s,this.iframe.style.bottom=r,this.iframe.style.right=n,this.iframe.style.width=o,this.iframe.style.height=a}}),{root:null,rootMargin:"0px",threshold:.1}),this.observer.observe(e)}destory(){this.observer&&(this.observer.disconnect(),this.observer=null)}}const d=e=>JSON.parse(e.data),c=e=>JSON.stringify(e),p=e=>{if("string"!=typeof e)return!1;try{return JSON.parse(e),!0}catch(e){return console.log("Error parsing JSON",e),!1}};class m{iframe=null;options;registeredEvents={};iFramePiP=null;constructor(e,s){this.options=s;const r=new i({mediaId:s.mediaId,playerId:s.playerId,region:s.region}).buildSrc(),n=new t({selector:e,src:r,width:this.options.width,height:this.options.height});this.iframe=n.iframe,this.iframe&&(n.insertIframe(this.iframe),this.iframe.addEventListener("load",(()=>{this.registerEvents(),this.subscribeToRegisteredEvents()}),{once:!0}),void 0!==this.options.sticky&&this.options.sticky&&(this.iFramePiP=new h(e,this.iframe)))}registerEvents(){!this.options.events||this.options.events&&Object.keys(this.options.events).length<0||Object.entries(this.options.events).forEach((([e,t])=>{e in this.registeredEvents||(this.registeredEvents[e]=t)}))}subscribeEventHandler(e){if(e.source!==this.iframe.contentWindow)return;const t=d(e),i=t.type;i in this.registeredEvents&&this.registeredEvents[i](t.value)}subscribeToRegisteredEvents(){window.addEventListener("message",this.subscribeEventHandler.bind(this))}dispatch(e){if(!this.iframe||!this.iframe.contentWindow)throw new Error("iframe is not provided or parent window not found!");this.iframe.contentWindow.postMessage(c(e),"*")}getterDispatch(e){return new Promise((t=>{this.dispatch(e),window.addEventListener("message",(i=>{const s=d(i);s.type===e.name&&t(s.value)}),{once:!0})}))}play(){this.dispatch({name:"play"})}pause(){this.dispatch({name:"pause"})}mute(){this.dispatch({name:"mute"})}unmute(){this.dispatch({name:"unmute"})}seekTo(e){this.dispatch({name:"seekTo",params:e})}playNext(){this.dispatch({name:"play-next"})}playPrev(){this.dispatch({name:"play-prev"})}isMuted(){return this.getterDispatch({name:"is-muted"})}isPaused(){return this.getterDispatch({name:"is-paused"})}getVideoCurrentTime(){return this.getterDispatch({name:"get-video-current-time"})}getDuration(){return this.getterDispatch({name:"get-duration"})}dispose(){window.removeEventListener("message",this.subscribeEventHandler.bind(this)),this.registeredEvents={},this.iFramePiP?.destory()}}export{m as JetstreamPlayer,c as denormalizeEventData,p as isValidEventData,d as normalizeEventData,e as playerListenEvents};
-//# sourceMappingURL=index.js.map
+//#region src/iframe-builder.ts
+var IFrameBuilder = class {
+	options;
+	iframe = null;
+	constructor(options) {
+		this.options = options;
+		this.iframe = this.generateIframe();
+	}
+	generateIframe() {
+		const iframe = document.createElement("iframe");
+		iframe.allow = "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture";
+		iframe.allowFullscreen = true;
+		iframe.frameBorder = "0";
+		iframe.title = "Jetstream player";
+		iframe.src = this.options.src;
+		iframe.width = this.options.width || "480px";
+		iframe.height = this.options.height || "270px";
+		iframe.classList.add("jet-stream-iframe-player");
+		return iframe;
+	}
+	insertIframe(iframe) {
+		const parent = document.querySelector(this.options.selector);
+		if (parent) parent.appendChild(iframe);
+		else console.error(`Element matching selector "${this.options.selector}" not found.`);
+	}
+};
+
+//#endregion
+//#region src/iframe-builder-src.ts
+var IFrameBuilderSrc = class {
+	options;
+	origin = "https://jstre.am";
+	constructor(options) {
+		if (options.mediaId === "") throw new Error("mediaId not provided!");
+		if (!options.mediaId.startsWith("jsv:")) throw new Error("mediaId must start with \"jsv:\"");
+		if (typeof options.playerId !== "undefined") {
+			if (options.playerId === "") throw new Error("playerId not provided!");
+			if (!options.playerId.startsWith("jsp:")) throw new Error("playerId must start with \"jsp:\"");
+		}
+		this.options = options;
+	}
+	getRegionBasedOrigin() {
+		const url = new URL(this.origin);
+		const urlParts = url.hostname.split(".");
+		if (this.options.region && this.options.region === "eu") if (urlParts.length > 2) urlParts.splice(1, 0, "eu");
+		else urlParts.splice(0, 0, "eu");
+		url.hostname = urlParts.join(".");
+		return url.origin;
+	}
+	appendPath(path, builtUrl) {
+		const pathString = String(path).trim();
+		if (pathString.indexOf("/") === 0) builtUrl += pathString;
+		else builtUrl += `/${pathString}`;
+		return builtUrl;
+	}
+	buildSrc() {
+		const url = new URL(`${this.getRegionBasedOrigin()}/embed/${this.options.mediaId}`);
+		if (this.options.playerId) url.href = this.appendPath(this.options.playerId, url.href);
+		if (this.options.region === "eu") url.searchParams.append("region", "eu");
+		if (this.options.audioLang) url.searchParams.append("audioLang", this.options.audioLang.toLowerCase());
+		if (this.options.subtitleLang) url.searchParams.append("subtitleLang", this.options.subtitleLang.toLowerCase());
+		return url.href;
+	}
+};
+
+//#endregion
+//#region src/iframe-pip-plugin.ts
+const PiP_STYLES = {
+	position: "fixed",
+	bottom: "20px",
+	right: "20px",
+	width: "330px",
+	height: "180px"
+};
+var IFramePiPPlugin = class {
+	observer = null;
+	originalParentHeight = null;
+	originalIframeStyle = null;
+	parent = null;
+	constructor(containerSelector, iframe) {
+		this.containerSelector = containerSelector;
+		this.iframe = iframe;
+		this.containerSelector = containerSelector;
+		this.iframe = iframe;
+		this.init();
+	}
+	init() {
+		if (!this.iframe || !this.containerSelector) return;
+		const parent = document.querySelector(this.containerSelector);
+		if (!parent) throw new Error("Selector of iframe not found");
+		this.parent = parent;
+		this.originalParentHeight = parent.style.height || null;
+		this.originalIframeStyle = this.iframe.getAttribute("style");
+		this.observer = new IntersectionObserver(([{ isIntersecting }]) => {
+			if (!isIntersecting) {
+				const height = parent.getBoundingClientRect().height;
+				parent.style.height = `${height}px`;
+				this.iframe.style.position = PiP_STYLES.position;
+				this.iframe.style.bottom = PiP_STYLES.bottom;
+				this.iframe.style.right = PiP_STYLES.right;
+				this.iframe.style.width = PiP_STYLES.width;
+				this.iframe.style.height = PiP_STYLES.height;
+			} else {
+				parent.style.height = this.originalParentHeight ?? "";
+				if (this.originalIframeStyle) this.iframe.setAttribute("style", this.originalIframeStyle);
+				else this.iframe.removeAttribute("style");
+			}
+		}, {
+			root: null,
+			rootMargin: "0px",
+			threshold: .1
+		});
+		this.observer.observe(parent);
+	}
+	destroy() {
+		if (this.observer) {
+			this.observer.disconnect();
+			this.observer = null;
+		}
+		if (this.parent) this.parent.style.height = this.originalParentHeight ?? "";
+		if (this.iframe) if (this.originalIframeStyle) this.iframe.setAttribute("style", this.originalIframeStyle);
+		else this.iframe.removeAttribute("style");
+	}
+	destory() {
+		this.destroy();
+	}
+};
+
+//#endregion
+//#region src/utils.ts
+const normalizeEventData = (event) => {
+	return JSON.parse(event.data);
+};
+const denormalizeEventData = (data) => {
+	return JSON.stringify(data);
+};
+const isValidEventData = (rawData) => {
+	if (typeof rawData !== "string") return false;
+	try {
+		JSON.parse(rawData);
+		return true;
+	} catch (error) {
+		console.log("Error parsing JSON", error);
+		return false;
+	}
+};
+
+//#endregion
+//#region src/player.ts
+var JetstreamPlayer = class {
+	iframe = null;
+	options;
+	registeredEvents = {};
+	iFramePiP = null;
+	targetOrigin = "*";
+	boundSubscribeEventHandler;
+	constructor(el, options) {
+		this.options = options;
+		const src = new IFrameBuilderSrc({
+			mediaId: options.mediaId,
+			playerId: options.playerId,
+			region: options.region
+		}).buildSrc();
+		try {
+			this.targetOrigin = new URL(src).origin;
+		} catch {
+			this.targetOrigin = "*";
+		}
+		const iframeBuilder = new IFrameBuilder({
+			selector: el,
+			src,
+			width: this.options.width,
+			height: this.options.height
+		});
+		this.iframe = iframeBuilder.iframe;
+		this.boundSubscribeEventHandler = this.subscribeEventHandler.bind(this);
+		if (this.iframe) {
+			iframeBuilder.insertIframe(this.iframe);
+			this.iframe.addEventListener("load", () => {
+				this.registerEvents();
+				this.subscribeToRegisteredEvents();
+			}, { once: true });
+			if (typeof this.options.sticky !== "undefined" && this.options.sticky) this.iFramePiP = new IFramePiPPlugin(el, this.iframe);
+		}
+	}
+	registerEvents() {
+		if (!this.options.events || this.options.events && Object.keys(this.options.events).length === 0) return;
+		Object.entries(this.options.events).forEach(([eventName, cb]) => {
+			if (!(eventName in this.registeredEvents)) this.registeredEvents[eventName] = cb;
+		});
+	}
+	subscribeEventHandler(event) {
+		if (!this.iframe?.contentWindow) return;
+		if (event.source !== this.iframe.contentWindow) return;
+		if (this.targetOrigin !== "*" && event.origin !== this.targetOrigin) return;
+		if (!isValidEventData(event.data)) return;
+		const data = normalizeEventData(event);
+		const eventType = data.type;
+		const handler = this.registeredEvents[eventType];
+		if (handler) handler(data.value);
+	}
+	subscribeToRegisteredEvents() {
+		window.addEventListener("message", this.boundSubscribeEventHandler);
+	}
+	dispatch(event) {
+		if (!this.iframe || !this.iframe.contentWindow) throw new Error("iframe is not provided or parent window not found!");
+		this.iframe.contentWindow.postMessage(denormalizeEventData(event), this.targetOrigin);
+	}
+	getterDispatch(getterEvent) {
+		return new Promise((resolve) => {
+			this.dispatch(getterEvent);
+			window.addEventListener("message", (event) => {
+				if (event.source !== this.iframe?.contentWindow) return;
+				if (this.targetOrigin !== "*" && event.origin !== this.targetOrigin) return;
+				if (!isValidEventData(event.data)) return;
+				const data = normalizeEventData(event);
+				if (data.type === getterEvent.name) resolve(data.value);
+			}, { once: true });
+		});
+	}
+	play() {
+		this.dispatch({ name: "play" });
+	}
+	pause() {
+		this.dispatch({ name: "pause" });
+	}
+	mute() {
+		this.dispatch({ name: "mute" });
+	}
+	unmute() {
+		this.dispatch({ name: "unmute" });
+	}
+	seekTo(seconds) {
+		this.dispatch({
+			name: "seekTo",
+			params: seconds
+		});
+	}
+	playNext() {
+		this.dispatch({ name: "play-next" });
+	}
+	playPrev() {
+		this.dispatch({ name: "play-prev" });
+	}
+	isMuted() {
+		return this.getterDispatch({ name: "is-muted" });
+	}
+	isPaused() {
+		return this.getterDispatch({ name: "is-paused" });
+	}
+	getVideoCurrentTime() {
+		return this.getterDispatch({ name: "get-video-current-time" });
+	}
+	getDuration() {
+		return this.getterDispatch({ name: "get-duration" });
+	}
+	dispose() {
+		window.removeEventListener("message", this.boundSubscribeEventHandler);
+		this.registeredEvents = {};
+		this.iFramePiP?.destroy();
+	}
+};
+
+//#endregion
+//#region src/player.type.ts
+const playerListenEvents = [
+	"ready",
+	"timeupdate",
+	"play",
+	"pause",
+	"loadedmetadata",
+	"ended",
+	"volumechange",
+	"error"
+];
+
+//#endregion
+export { JetstreamPlayer, denormalizeEventData, isValidEventData, normalizeEventData, playerListenEvents };

package/dist/{@types/player.d.ts → player.d.ts}

@@ -4,6 +4,8 @@ export declare class JetstreamPlayer {
     private options;
     private registeredEvents;
     private iFramePiP;
+    private targetOrigin;
+    private boundSubscribeEventHandler;
     constructor(el: string, options: JetstreamPlayerOptions);
     private registerEvents;
     private subscribeEventHandler;

package/dist/{@types/player.type.d.ts → player.type.d.ts}

@@ -1,27 +1,28 @@
 export declare const playerListenEvents: readonly ["ready", "timeupdate", "play", "pause", "loadedmetadata", "ended", "volumechange", "error"];
 export type PlayerEvents = 'ready' | 'timeupdate' | 'play' | 'pause' | 'loadedmetadata' | 'ended' | 'volumechange' | 'error';
 export type PlayerGetterEvents = 'is-muted' | 'get-video-current-time' | 'get-duration' | 'is-paused';
-export type PlayerEvent = {
+export interface PlayerEvent {
     type: PlayerEvents | PlayerGetterEvents;
     value?: unknown;
-};
+}
 export type PlayerCommandEvent = 'play' | 'pause' | 'mute' | 'unmute' | 'seekTo' | 'play-next' | 'play-prev';
-export type PlayerCommand = {
+export interface PlayerCommand {
     name: PlayerCommandEvent | PlayerGetterEvents;
     params?: unknown;
-};
-export type IFrameBuilderOpt = {
+}
+export interface IFrameBuilderOpt {
     selector: string;
     src: string;
     width?: string;
     height?: string;
-};
-export type IFrameBuilderSrcOpt = {
+}
+export interface IFrameBuilderSrcOpt {
     mediaId: string;
     playerId?: string;
     region?: 'eu';
-    lang?: string;
-};
+    audioLang?: string;
+    subtitleLang?: string;
+}
 export type JetstreamPlayerOptions = {
     sticky?: boolean;
     events?: Partial<Record<PlayerEvents, (value?: unknown) => void>>;

package/package.json

@@ -1,59 +1,47 @@
 {
   "name": "@hopecloud/jetstream-player",
-  "version": "1.1.3",
-  "description": "Jetstream Embed Player API",
+  "version": "1.1.5",
+  "description": "Jetstream Embed Player SDK",
   "type": "module",
+  "main": "dist/index.js",
+  "files": [
+    "dist"
+  ],
+  "engines": {
+    "node": "24"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
   "author": {
-    "email": "code@deepvision.team",
-    "name": "DeepVision Code"
+    "email": "code@deepvision.software",
+    "name": "DV Software"
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/deeepvision/hcc-jetstream-player.git"
+    "url": "https://github.com/hopechannel/jetstream-player"
   },
-  "main": "dist/index.js",
-  "module": "dist/index.js",
-  "types": "dist/@types/index.d.ts",
-  "exports": {
-    ".": {
-      "import": {
-        "types": "./dist/@types/index.d.ts",
-        "default": "./dist/index.js"
-      }
-    }
+  "devDependencies": {
+    "@deepvision/eslint-plugin": "2.0.0-rc.10",
+    "@types/node": "^24.10.9",
+    "happy-dom": "^20.4.0",
+    "rolldown": "^1.0.0-beta.53",
+    "typescript": "^5.9.3",
+    "vitepress": "1.6.4",
+    "vitest": "^4.0.18"
   },
-  "files": [
-    "dist"
-  ],
   "scripts": {
-    "build": "rollup -c",
-    "pack": "npm run build && npm pack",
-    "publish:patch": "npm version patch -m \"release: %s\"",
-    "publish:minor": "npm version minor -m \"release: %s\"",
-    "postpublish:patch": "git push origin && git push origin --tags",
-    "postpublish:minor": "git push origin && git push origin --tags",
+    "build": "rolldown --config && tsc --emitDeclarationOnly",
     "docs:dev": "vitepress dev docs",
     "docs:build": "vitepress build docs",
     "docs:preview": "vitepress preview docs",
     "lint": "eslint",
     "lint:fix": "eslint --fix",
-    "typecheck": "tsc --noEmit"
-  },
-  "devDependencies": {
-    "@eslint/eslintrc": "^3.2.0",
-    "@eslint/js": "^9.17.0",
-    "@rollup/plugin-terser": "^0.4.4",
-    "@typescript-eslint/eslint-plugin": "^8.19.1",
-    "@typescript-eslint/parser": "^8.19.1",
-    "eslint": "^9.17.0",
-    "eslint-config-prettier": "^9.1.0",
-    "globals": "^15.14.0",
-    "prettier": "3.4.2",
-    "rimraf": "^6.0.1",
-    "rollup": "^4.30.1",
-    "rollup-plugin-delete": "^2.1.0",
-    "rollup-plugin-typescript2": "^0.36.0",
-    "typescript": "^5.7.3",
-    "vitepress": "1.5.0"
+    "typecheck": "tsc --noEmit",
+    "test": "vitest",
+    "test:run": "vitest run"
   }
-}
+}

package/dist/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}