@next2d/media 1.18.11 → 2.0.0

package/src/Video.js

@@ -0,0 +1,428 @@
+import { SoundMixer } from "./SoundMixer";
+import { DisplayObject } from "@next2d/display";
+import { VideoEvent } from "@next2d/events";
+import { execute as videoCreateElementService } from "./Video/service/VideoCreateElementService";
+import { execute as videoRegisterEventUseCase } from "./Video/usecase/VideoRegisterEventUseCase";
+import { execute as videoPlayEventUseCase } from "./Video/usecase/VideoPlayEventUseCase";
+import { execute as videoBuildFromCharacterUseCase } from "./Video/usecase/VideoBuildFromCharacterUseCase";
+import { $clamp, $getPlayingVideos } from "./MediaUtil";
+/**
+ * @description サーバーまたはローカルに保存された録画済みビデオファイルを再生する Video オブジェクトです。
+ *              ビデオストリームを再生するには、attachNetStream() を使用して、ビデオを Video オブジェクトに関連付けます。
+ *              次に、addChild() を使用して、Video オブジェクトを表示リストに追加します。
+ *              A Video object that plays a recorded video file stored on a server or locally.
+ *              To play a video stream, use attachNetStream() to attach the video to the Video object.
+ *              Then, add the Video object to the display list using addChild().
+ *
+ * @class
+ * @memberOf next2d.media
+ * @extends  DisplayObject
+ */
+export class Video extends DisplayObject {
+    /**
+     * @param {number} [width = 0]
+     * @param {number} [height = 0]
+     *
+     * @constructor
+     * @public
+     */
+    constructor(width = 0, height = 0) {
+        super();
+        /**
+         * @description キーフレーム総数
+         *              Total number of keyframes
+         *
+         * @type {number}
+         * @default 0
+         * @public
+         */
+        Object.defineProperty(this, "duration", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @description ビデオを拡大 / 縮小する際にスムージング（補間）するかどうかを指定します。
+         *              Specifies whether the video should be smoothed (interpolated)
+         *              when it is scaled.
+         *
+         * @type {boolean}
+         * @default true
+         * @public
+         */
+        Object.defineProperty(this, "smoothing", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @description ビデオをループ生成するかどうかを指定します。
+         *              Specifies whether to generate a video loop.
+         *
+         * @type {boolean}
+         * @default false
+         * @public
+         */
+        Object.defineProperty(this, "loop", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @description ビデオの自動再生の設定。
+         *              Setting up automatic video playback.
+         *
+         * @type {boolean}
+         * @default true
+         * @public
+         */
+        Object.defineProperty(this, "autoPlay", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @description 現在のキーフレーム
+         *              Current keyframe
+         *
+         *
+         * @member {number}
+         * @public
+         */
+        Object.defineProperty(this, "currentTime", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @description ビデオの幅をピクセル単位で指定する整数です。
+         *              An integer specifying the width of the video, in pixels.
+         *
+         * @member {number}
+         * @default 0
+         * @public
+         */
+        Object.defineProperty(this, "videoWidth", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @description ビデオの高さをピクセル単位で指定する整数です。
+         *              An integer specifying the height of the video, in pixels.
+         *
+         * @member {number}
+         * @default 0
+         * @public
+         */
+        Object.defineProperty(this, "videoHeight", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @description ビデオが読み込まれているかどうかを返します。
+         *              Returns whether the video has been loaded.
+         *
+         * @type {boolean}
+         * @default false
+         * @public
+         */
+        Object.defineProperty(this, "loaded", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @description ビデオが終了したかどうかを返します。
+         *              Returns whether the video has ended.
+         *
+         * @type {boolean}
+         * @default false
+         * @public
+         */
+        Object.defineProperty(this, "ended", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @description Videoの機能を所持しているかを返却
+         *              Returns whether the display object has Video functionality.
+         *
+         * @type {boolean}
+         * @readonly
+         * @public
+         */
+        Object.defineProperty(this, "isVideo", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @type {HTMLVideoElement}
+         * @default null
+         * @public
+         */
+        Object.defineProperty(this, "$videoElement", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @type {OffscreenCanvas}
+         * @default null
+         * @public
+         */
+        Object.defineProperty(this, "$offscreenCanvas", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @type {OffscreenCanvasRenderingContext2D}
+         * @default null
+         * @public
+         */
+        Object.defineProperty(this, "$context", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @type {boolean}
+         * @default true
+         * @public
+         */
+        Object.defineProperty(this, "paused", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @type {number}
+         * @default -1
+         * @private
+         */
+        Object.defineProperty(this, "_$timerId", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @type {number}
+         * @default 1
+         * @private
+         */
+        Object.defineProperty(this, "_$volume", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * @type {string}
+         * @default ""
+         * @private
+         */
+        Object.defineProperty(this, "_$src", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        this.videoWidth = width;
+        this.videoHeight = height;
+        // public params
+        this.isVideo = true;
+        this.duration = 0;
+        this.smoothing = true;
+        this.loop = false;
+        this.loaded = false;
+        this.ended = false;
+        this.paused = true;
+        this.autoPlay = true;
+        this.currentTime = 0;
+        // private params
+        this._$src = "";
+        this._$timerId = -1;
+        this._$volume = 1;
+        // element
+        this.$videoElement = null;
+        this.$offscreenCanvas = null;
+        this.$context = null;
+    }
+    /**
+     * @description 指定されたクラスの空間名を返します。
+     *              Returns the space name of the specified class.
+     *
+     * @return {string}
+     * @const
+     * @static
+     */
+    static get namespace() {
+        return "next2d.media.Video";
+    }
+    /**
+     * @description 指定されたオブジェクトの空間名を返します。
+     *              Returns the space name of the specified object.
+     *
+     * @return {string}
+     * @const
+     * @public
+     */
+    get namespace() {
+        return "next2d.media.Video";
+    }
+    /**
+     * @description ビデオコンテンツへの URL を指定します。
+     *              Specifies the URL of the video content.
+     *
+     * @member {string}
+     * @default ""
+     * @public
+     */
+    get src() {
+        return this._$src;
+    }
+    set src(src) {
+        if (this._$src === src) {
+            return;
+        }
+        // reset
+        this.loaded = false;
+        this.currentTime = 0;
+        this.$videoElement = null;
+        this.$offscreenCanvas = null;
+        this.$context = null;
+        this.$videoElement = videoCreateElementService();
+        videoRegisterEventUseCase(this.$videoElement, this);
+        this._$src = this.$videoElement.src = src;
+        this.$videoElement.load();
+    }
+    /**
+     * @description ビデオがミュートされているかどうかを返します。
+     *              Returns whether the video is muted.
+     *
+     * @member {boolean}
+     * @default false
+     * @public
+     */
+    get muted() {
+        return this.$videoElement ? this.$videoElement.muted : false;
+    }
+    set muted(muted) {
+        if (!this.$videoElement) {
+            return;
+        }
+        this.$videoElement.muted = muted;
+    }
+    /**
+     * @description ボリュームです。範囲は 0（無音）～ 1（フルボリューム）です。
+     *              The volume, ranging from 0 (silent) to 1 (full volume).
+     *
+     * @member {number}
+     * @default 1
+     * @public
+     */
+    get volume() {
+        return this._$volume;
+    }
+    set volume(volume) {
+        this._$volume = $clamp(Math.min(SoundMixer.volume, volume), 0, 1, 1);
+        if (this.$videoElement) {
+            this.$videoElement.volume = this._$volume;
+        }
+    }
+    /**
+     * @description ビデオの再生を一時停止します。
+     *              Pauses the video playback.
+     *
+     * @return {void}
+     * @method
+     * @public
+     */
+    pause() {
+        if (!this.$videoElement || this.paused) {
+            return;
+        }
+        this.paused = true;
+        this.$videoElement.pause();
+        cancelAnimationFrame(this._$timerId);
+        if (this.willTrigger(VideoEvent.PAUSE)) {
+            this.dispatchEvent(new VideoEvent(VideoEvent.PAUSE));
+        }
+        const playingVideos = $getPlayingVideos();
+        const index = playingVideos.indexOf(this);
+        if (index > -1) {
+            playingVideos.splice(index, 1);
+        }
+    }
+    /**
+     * @description ビデオファイルを再生します。
+     *              Plays the video file.
+     *
+     * @returns {void}
+     * @method
+     * @public
+     */
+    async play() {
+        if (!this.$videoElement || !this.paused) {
+            return;
+        }
+        this.paused = false;
+        this.ended = false;
+        this.$videoElement.volume = this._$volume;
+        await this.$videoElement.play();
+        this._$timerId = videoPlayEventUseCase(this);
+    }
+    /**
+     * @description 指定された位置に最も近いキーフレームをシークします。
+     *              Seeks the keyframe closest to the specified location.
+     *
+     * @param  {number} offset
+     * @return {void}
+     * @method
+     * @public
+     */
+    seek(offset) {
+        if (!this.$videoElement) {
+            return;
+        }
+        this.currentTime = this.$videoElement.currentTime = Math.min(this.duration, offset);
+        if (this.willTrigger(VideoEvent.SEEK)) {
+            this.dispatchEvent(new VideoEvent(VideoEvent.SEEK));
+        }
+    }
+    /**
+     * @description character 情報を元に DisplayObject を構築
+     *              Build DisplayObject based on character
+     *
+     * @param  {ICharacter} character
+     * @param  {LoaderInfo} [loader_info=null]
+     * @return {void}
+     * @method
+     * @protected
+     */
+    $sync(character, loader_info = null) {
+        if (loader_info) {
+            super.$syncLoaderInfo(loader_info);
+        }
+        videoBuildFromCharacterUseCase(this, character);
+    }
+}

package/{dist → src}/index.d.ts

@@ -2,3 +2,4 @@ export * from "./Sound";
 export * from "./SoundMixer";
 export * from "./SoundTransform";
 export * from "./Video";
+export { $bootAudioContext, $getAudioContext, $getMutedVideos } from "./MediaUtil";

package/{dist → src}/index.js

@@ -2,3 +2,4 @@ export * from "./Sound";
 export * from "./SoundMixer";
 export * from "./SoundTransform";
 export * from "./Video";
+export { $bootAudioContext, $getAudioContext, $getMutedVideos } from "./MediaUtil";

package/src/interface/IAjaxEvent.d.ts

@@ -0,0 +1,5 @@
+export interface IAjaxEvent {
+    loadstart?: Function;
+    progress?: Function;
+    loadend?: Function;
+}

package/src/interface/IAjaxEvent.js

@@ -0,0 +1 @@
+export {};

package/src/interface/IAjaxOption.d.ts

@@ -0,0 +1,13 @@
+import type { IURLRequestMethod } from "./IURLRequestMethod";
+import type { IURLLoaderDataFormat } from "./IURLLoaderDataFormat";
+import type { IAjaxEvent } from "./IAjaxEvent";
+import type { IURLRequestHeader } from "./IURLRequestHeader";
+export interface IAjaxOption {
+    url: string;
+    format: IURLLoaderDataFormat;
+    method: IURLRequestMethod;
+    withCredentials: boolean;
+    headers: IURLRequestHeader[];
+    data?: any;
+    event?: IAjaxEvent;
+}

package/src/interface/IAjaxOption.js

@@ -0,0 +1 @@
+export {};

package/src/interface/IBlendMode.d.ts

@@ -0,0 +1 @@
+export type IBlendMode = "copy" | "add" | "alpha" | "darken" | "difference" | "erase" | "hardlight" | "invert" | "layer" | "lighten" | "multiply" | "normal" | "overlay" | "screen" | "subtract";

package/src/interface/IBlendMode.js

@@ -0,0 +1 @@
+export {};

package/src/interface/IBounds.d.ts

@@ -0,0 +1,6 @@
+export interface IBounds {
+    xMin: number;
+    xMax: number;
+    yMin: number;
+    yMax: number;
+}

package/src/interface/IBounds.js

@@ -0,0 +1 @@
+export {};

package/src/interface/ICharacter.d.ts

@@ -0,0 +1,5 @@
+import type { IMovieClipCharacter } from "./IMovieClipCharacter";
+import type { IVideoCharacter } from "./IVideoCharacter";
+import type { IShapeCharacter } from "./IShapeCharacter";
+import type { ITextFieldCharacter } from "./ITextFieldCharacter";
+export type ICharacter = IMovieClipCharacter | IVideoCharacter | IShapeCharacter | ITextFieldCharacter;

package/src/interface/ICharacter.js

@@ -0,0 +1 @@
+export {};

package/src/interface/IDictionaryTag.d.ts

@@ -0,0 +1,8 @@
+export interface IDictionaryTag {
+    characterId: number;
+    name: string;
+    startFrame: number;
+    endFrame: number;
+    depth: number;
+    clipDepth: number;
+}

package/src/interface/IDictionaryTag.js

@@ -0,0 +1 @@
+export {};

package/src/interface/IFilterArray.d.ts

@@ -0,0 +1,2 @@
+import type { BlurFilter, BevelFilter, ColorMatrixFilter, ConvolutionFilter, DisplacementMapFilter, DropShadowFilter, GlowFilter, GradientBevelFilter, GradientGlowFilter } from "@next2d/filters";
+export type IFilterArray = Array<BlurFilter | BevelFilter | ColorMatrixFilter | ConvolutionFilter | DisplacementMapFilter | DropShadowFilter | GlowFilter | GradientBevelFilter | GradientGlowFilter>;

package/src/interface/IFilterArray.js

@@ -0,0 +1 @@
+export {};

package/src/interface/IGrid.d.ts

@@ -0,0 +1,6 @@
+export interface IGrid {
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+}

package/src/interface/IGrid.js

@@ -0,0 +1 @@
+export {};

package/src/interface/ILoopConfig.d.ts

@@ -0,0 +1,8 @@
+import type { ILoopType } from "./ILoopType";
+export interface ILoopConfig {
+    type: ILoopType;
+    frame: number;
+    start: number;
+    end: number;
+    tweenFrame?: number;
+}

package/src/interface/ILoopConfig.js

@@ -0,0 +1 @@
+export {};

package/src/interface/ILoopType.d.ts

@@ -0,0 +1 @@
+export type ILoopType = 0 | 1 | 2 | 3 | 4;

package/src/interface/ILoopType.js

@@ -0,0 +1 @@
+export {};

package/src/interface/IMovieClipActionObject.d.ts

@@ -0,0 +1,5 @@
+export interface IMovieClipActionObject {
+    frame: number;
+    action: string;
+    script?: Function;
+}

package/src/interface/IMovieClipActionObject.js

@@ -0,0 +1 @@
+export {};

package/src/interface/IMovieClipCharacter.d.ts

@@ -0,0 +1,17 @@
+import type { IMovieClipSoundObject } from "./IMovieClipSoundObject";
+import type { IMovieClipActionObject } from "./IMovieClipActionObject";
+import type { IMovieClipLabelObject } from "./IMovieClipLabelObject";
+import type { IPlaceObject } from "./IPlaceObject";
+import type { IDictionaryTag } from "./IDictionaryTag";
+export interface IMovieClipCharacter {
+    symbol?: string;
+    extends: string;
+    totalFrame: number;
+    controller: Array<Array<number>>;
+    dictionary: IDictionaryTag[];
+    placeMap: Array<Array<number>>;
+    placeObjects: IPlaceObject[];
+    labels?: IMovieClipLabelObject[];
+    actions?: IMovieClipActionObject[];
+    sounds?: IMovieClipSoundObject[];
+}

package/src/interface/IMovieClipCharacter.js

@@ -0,0 +1 @@
+export {};

package/src/interface/IMovieClipLabelObject.d.ts

@@ -0,0 +1,4 @@
+export interface IMovieClipLabelObject {
+    name: string;
+    frame: number;
+}

package/src/interface/IMovieClipLabelObject.js

@@ -0,0 +1 @@
+export {};

package/src/interface/IMovieClipSoundObject.d.ts

@@ -0,0 +1,5 @@
+import type { ISoundTag } from "./ISoundTag";
+export interface IMovieClipSoundObject {
+    frame: number;
+    sound: ISoundTag[];
+}

package/src/interface/IMovieClipSoundObject.js

@@ -0,0 +1 @@
+export {};

package/src/interface/IPlaceObject.d.ts

@@ -0,0 +1,14 @@
+import type { ILoopConfig } from "./ILoopConfig";
+import type { ISurfaceFilter } from "./ISurfaceFilter";
+import type { IFilterArray } from "./IFilterArray";
+import type { IBlendMode } from "./IBlendMode";
+export interface IPlaceObject {
+    matrix?: number[];
+    typedMatrix?: Float32Array;
+    colorTransform?: number[];
+    typedColorTransform?: Float32Array;
+    blendMode?: IBlendMode;
+    surfaceFilterList?: ISurfaceFilter[];
+    filters?: IFilterArray;
+    loop?: ILoopConfig;
+}

package/src/interface/IPlaceObject.js

@@ -0,0 +1 @@
+export {};

package/src/interface/IShapeCharacter.d.ts

@@ -0,0 +1,14 @@
+import type { IGrid } from "./IGrid";
+import type { IBounds } from "./IBounds";
+export interface IShapeCharacter {
+    symbol?: string;
+    extends: string;
+    bounds: IBounds;
+    bitmapId: number;
+    inBitmap?: boolean;
+    grid?: IGrid | null;
+    recodes?: any[] | null;
+    buffer?: number[] | null;
+    imageBuffer?: Uint8Array;
+    recodeBuffer?: Float32Array;
+}

package/src/interface/IShapeCharacter.js

@@ -0,0 +1 @@
+export {};

package/src/interface/ISoundCharacter.d.ts

@@ -0,0 +1,4 @@
+export interface ISoundCharacter {
+    buffer: number[] | null;
+    audioBuffer: AudioBuffer | null;
+}

package/src/interface/ISoundCharacter.js

@@ -0,0 +1 @@
+export {};

package/src/interface/ISoundTag.d.ts

@@ -0,0 +1,6 @@
+export interface ISoundTag {
+    characterId: number;
+    volume: number;
+    autoPlay: boolean;
+    loopCount: number;
+}

package/src/interface/ISoundTag.js

@@ -0,0 +1 @@
+export {};

package/src/interface/ISurfaceFilter.d.ts

@@ -0,0 +1,6 @@
+type ClassName = "BevelFilter" | "BlurFilter" | "ColorMatrixFilter" | "ConvolutionFilter" | "DisplacementMapFilter" | "DropShadowFilter" | "GlowFilter" | "GradientBevelFilter" | "GradientGlowFilter";
+export interface ISurfaceFilter {
+    class: ClassName;
+    params: any[];
+}
+export {};

package/src/interface/ISurfaceFilter.js

@@ -0,0 +1 @@
+export {};