@vnejs/plugins.core.media 0.1.0 → 0.1.2

package/index.js

@@ -3,9 +3,8 @@ import { regPlugin } from "@vnejs/shared";
 import * as constants from "./const/const";
 import { SUBSCRIBE_EVENTS } from "./const/events";
 
-import { MediaGif } from "./modules/gif";
 import { MediaLoad } from "./modules/load";
 import { Media } from "./modules/media";
 import { MediaMemory } from "./modules/memory";
 
-regPlugin("MEDIA", { constants, events: SUBSCRIBE_EVENTS }, [MediaGif, MediaLoad, Media, MediaMemory]);
+regPlugin("MEDIA", { constants, events: SUBSCRIBE_EVENTS }, [MediaLoad, Media, MediaMemory]);

package/modules/load.js

@@ -18,7 +18,7 @@ export class MediaLoad extends Module {
     this.shared.mediaNoTimeoutSources = platform === this.CONST.PLATFORMS.WEB ? ["web"] : [];
   };
 
-  onMediaLoad = async ({ type, name, isConstant = false, isTmp = false, ...otherArgs } = {}) => {
+  onMediaLoad = async ({ type, name, isTmp = false, ...otherArgs } = {}) => {
     if (!this.isReady) await this.waitIsReady();
 
     const { mediaType, postfix, quality = "original", priority = this.CONST.MEDIA.PRIORITIES.BACKGROUND } = otherArgs;
@@ -35,12 +35,23 @@ export class MediaLoad extends Module {
     const oldMedia = await this.emitOne(this.EVENTS.MEDIA.LOAD_CHECK, { mediaId });
     if (oldMedia) return oldMedia;
 
-    await this.semaphore.push(mediaId, priority, this.getPromise(mediaId, type, src, priority, isConstant, isTmp));
+    const promiseFunc = async () => {
+      const oldMedia = await this.emitOne(this.EVENTS.MEDIA.LOAD_CHECK, { mediaId });
+      if (oldMedia) return oldMedia;
+
+      this.inProcess[mediaId] = this.loadMedia(mediaId, type, src, priority, isTmp);
+      const media = await this.inProcess[mediaId];
+      delete this.inProcess[mediaId];
+
+      return media;
+    };
+
+    await this.semaphore.push(mediaId, priority, promiseFunc);
 
     return this.emitOne(this.EVENTS.MEDIA.MEMORY_GET, { mediaId });
   };
 
-  onMediaLoadCheck = async (mediaId) => {
+  onMediaLoadCheck = async ({ mediaId } = {}) => {
     if (this.inProcess[mediaId]) return this.inProcess[mediaId];
 
     const oldMedia = await this.emitOne(this.EVENTS.MEDIA.MEMORY_GET, { mediaId });
@@ -49,43 +60,24 @@ export class MediaLoad extends Module {
     if (this.inProcess[mediaId]) return this.inProcess[mediaId];
   };
 
-  getPromise =
-    (mediaId, type, src, priority, isConstant = false, isTmp = false) =>
-    async () => {
-      const oldMedia = await this.emitOne(this.EVENTS.MEDIA.LOAD_CHECK, { mediaId });
-      if (oldMedia) return oldMedia;
-
-      this.inProcess[mediaId] = this.loadMedia(mediaId, type, src, priority, isConstant, isTmp);
-      const media = await this.inProcess[mediaId];
-      delete this.inProcess[mediaId];
-
-      return media;
-    };
-
-  loadMedia = async (mediaId, type, src, priority, isConstant = false, isTmp = false) => {
-    this.emit(this.EVENTS.LOGS.EMIT, { module: this.name, value: { action: "load start", mediaId, type, priority, isConstant, isTmp } });
+  loadMedia = async (mediaId, type, src, priority, isTmp = false) => {
+    this.emit(this.EVENTS.LOGS.EMIT, { module: this.name, value: { action: "load start", mediaId, type, priority, isTmp } });
 
     const ts = Math.round(new Date().getTime() / 1000 / 60 / 60);
-    const mediaSrc = `${src}?ts=${ts}&version=${this.options?.global?.version || 0}`;
-    const splitSrc = src.split(".");
-    const ext = splitSrc[splitSrc.length - 1];
-    const mediaRequest = await fetch(mediaSrc);
+    const mediaRequest = await fetch(`${src}?ts=${ts}&version=${this.options?.global?.version || 0}`);
     const media = type === this.CONST.MEDIA.TYPES.VIDEO ? document.createElement("video") : new this.CONST.MEDIA.CONSTRUCTORS[type]();
-    media.setAttribute("ext", ext);
+
     media.setAttribute("type", type);
-    // IOS - mediaSrc
-    media.src = URL.createObjectURL(await mediaRequest.clone().blob());
 
-    if (ext === "gif") {
-      const ab = await mediaRequest.clone().arrayBuffer();
-      await this.emit(this.EVENTS.MEDIA.GIF, { media, mediaId, ab, isConstant, isTmp });
-    }
+    if (type === this.CONST.MEDIA.TYPES.VIDEO) media.crossOrigin = "anonymous";
+
+    media.src = URL.createObjectURL(await mediaRequest.clone().blob());
 
-    await this.emit(this.EVENTS.MEDIA.SET, { media, mediaId, isConstant, isTmp });
+    await this.emit(this.EVENTS.MEDIA.SET, { media, mediaId, isTmp });
 
     if (priority && !this.shared.mediaNoTimeoutSources.length) await this.waitTimeout(Math.round(25 * priority * (Math.random() + 0.618)));
 
-    this.emit(this.EVENTS.LOGS.EMIT, { module: this.name, value: { action: "load end", mediaId, type, priority, isConstant, isTmp } });
+    this.emit(this.EVENTS.LOGS.EMIT, { module: this.name, value: { action: "load end", mediaId, type, priority, isTmp } });
 
     return media;
   };

package/modules/media.js

@@ -23,8 +23,7 @@ export class Media extends Module {
 
     return this.prepareMedia(media);
   };
-
-  onMediaSet = async ({ mediaId, media, isConstant, isTmp } = {}) => this.emit(this.EVENTS.MEDIA.MEMORY_SET, { mediaId, media, isConstant, isTmp });
+  onMediaSet = async ({ mediaId, media, isTmp } = {}) => this.emit(this.EVENTS.MEDIA.MEMORY_SET, { mediaId, media, isTmp });
 
   loadMedia = (type, name, mediaType, quality, postfix) => {
     const priority = this.CONST.MEDIA.PRIORITIES.HIGH;

package/modules/memory.js

@@ -37,10 +37,8 @@ export class MediaMemory extends Module {
   };
   onRestore = (key, memory, func) => Promise.all(this.getPromises(key, memory, func));
 
-  onMemorySet = async ({ media, mediaId, isConstant, isTmp } = {}) =>
-    this.emit(this.EVENTS.MEMORY.SET, { module: this.name, key: mediaId, value: media, isConstant, isTmp });
+  onMemorySet = async ({ media, mediaId, isTmp } = {}) => this.emit(this.EVENTS.MEMORY.SET, { module: this.name, key: mediaId, value: media, isTmp });
   onMemoryGet = ({ mediaId }) => this.emitOne(this.EVENTS.MEMORY.GET, { module: this.name, key: mediaId });
 
-  getPromises = (key, memory, func) =>
-    [...document.querySelectorAll(`[parentId="${key}"]`)].map((children) => func(memory, children.id));
+  getPromises = (key, memory, func) => [...document.querySelectorAll(`[parentId="${key}"]`)].map((children) => func(memory, children.id));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vnejs/plugins.core.media",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "main": "index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
@@ -16,10 +16,5 @@
   "description": "",
   "dependencies": {
     "decode-gif": "1.0.1"
-  },
-  "peerDependencies": {
-    "@vnejs/shared": "*",
-    "@vnejs/module": "*",
-    "@vnejs/semaphore": "*"
   }
 }

package/modules/gif.js

@@ -1,30 +0,0 @@
-import decodeGif from "decode-gif";
-
-import { Module } from "@vnejs/module";
-
-export class MediaGif extends Module {
-  name = "media.gif";
-
-  subscribe = () => {
-    this.on(this.EVENTS.MEDIA.GIF, this.onMediaGif);
-  };
-
-  onMediaGif = ({ media, mediaId, ab, isConstant, isTmp } = {}) => {
-    const { width, height, frames } = decodeGif(new Uint8Array(ab));
-
-    media.setAttribute("frames", frames.length);
-    media.setAttribute("delay", frames[1].timeCode);
-
-    return Promise.all(this.createFrameFunc(mediaId, width, height, isConstant, isTmp));
-  };
-
-  createFrameFunc = (mediaId, width, height, isConstant, isTmp) => (frame, i) => {
-    const media = document.createElement("canvas");
-    media.width = width;
-    media.height = height;
-    media.getContext("2d").putImageData(new ImageData(frame.data, width, height), 0, 0);
-    media.setAttribute("parentId", mediaId);
-
-    return this.emit(this.EVENTS.MEDIA.SET, { media, mediaId: `${mediaId}.frame.${i}`, isConstant, isTmp });
-  };
-}