@zcomponent/three-video-player 2.0.0-alpha.3 → 2.0.0-alpha.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -10,6 +10,7 @@ export declare const VideoTransparencyType: {
10
10
  };
11
11
  export type VideoTransparencyTypeValue = ValueOf<typeof VideoTransparencyType>;
12
12
  export interface BaseVideoConstructorProps {
13
+ /** @zignore */
13
14
  geometry?: THREE.BufferGeometry;
14
15
  /**
15
16
  * Support videos with transparency
@@ -33,22 +34,45 @@ export interface BaseVideoConstructorProps {
33
34
  * Supports various video transparency types, including chroma key and side-by-side transparency.
34
35
  *
35
36
  * Root element: [THREE.Group](https://threejs.org/docs/index.html#api/en/objects/Group)
36
- * @zstream
37
37
  */
38
38
  export declare abstract class BaseVideo extends Object3D implements Stream {
39
39
  protected constructorProps: BaseVideoConstructorProps;
40
+ /**
41
+ * @zui
42
+ */
40
43
  onEnded: Event<[BaseVideo]>;
44
+ /**
45
+ * @zui
46
+ */
41
47
  onPause: Event<[BaseVideo]>;
48
+ /**
49
+ * @zui
50
+ */
42
51
  onPlay: Event<[BaseVideo]>;
52
+ /**
53
+ * @zui
54
+ */
43
55
  onPlaying: Event<[BaseVideo]>;
56
+ /**
57
+ * @zui
58
+ */
44
59
  onWaiting: Event<[BaseVideo]>;
60
+ /**
61
+ * @zui
62
+ */
45
63
  onError: Event<[BaseVideo]>;
46
64
  element: THREE.Group;
47
65
  geometry: THREE.BufferGeometry;
48
66
  material: THREE.MeshBasicMaterial | MeshChromaKeyMaterial | MeshSideBySideAlphaMaterial;
49
67
  mesh: THREE.Mesh;
50
68
  texture: THREE.VideoTexture;
69
+ /**
70
+ * @zignore
71
+ */
51
72
  transparent: VideoTransparencyTypeValue;
73
+ /**
74
+ * @zignore
75
+ */
52
76
  videoElement: HTMLVideoElement;
53
77
  protected _gain: GainNode;
54
78
  /**
@@ -68,11 +92,13 @@ export declare abstract class BaseVideo extends Object3D implements Stream {
68
92
  /**
69
93
  * Whether the video is muted.
70
94
  * @default false
95
+ * @zui
71
96
  */
72
97
  muted: boolean;
73
98
  /**
74
99
  * Whether the video should loop when it reaches the end.
75
100
  * @default false
101
+ * @zui
76
102
  */
77
103
  loop: boolean;
78
104
  /**
@@ -95,7 +121,13 @@ export declare abstract class BaseVideo extends Object3D implements Stream {
95
121
  * @zui
96
122
  */
97
123
  seek(t: number): void;
124
+ /**
125
+ * @zignore
126
+ */
98
127
  length(): number | undefined;
128
+ /**
129
+ * @zignore
130
+ */
99
131
  isStalled(): boolean;
100
132
  /**
101
133
  * The chroma key similarity value, from 0 to 1.
@@ -147,5 +179,8 @@ export declare abstract class BaseVideo extends Object3D implements Stream {
147
179
  * @zgroup Side By Side Transparency
148
180
  */
149
181
  alphaFirst: boolean;
182
+ /**
183
+ * @zignore
184
+ */
150
185
  dispose(): never;
151
186
  }
@@ -32,7 +32,7 @@ var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn,
32
32
  if (target) Object.defineProperty(target, contextIn.name, descriptor);
33
33
  done = true;
34
34
  };
35
- import { AudioContextContext, Event, isDesignTime, nextUserEvent, registerLoadable, started, useOnBeforeRender, zObserve, zUI } from '@zcomponent/core';
35
+ import { AudioContextContext, Event, isDesignTime, nextUserEvent, registerLoadable, started, useOnBeforeRender, zIgnore, zObserve, zUI } from '@zcomponent/core';
36
36
  import { Object3D } from '@zcomponent/three/components/Object3D';
37
37
  import { MeshChromaKeyMaterial } from '@zcomponent/three/internal/MeshChromaKeyMaterial';
38
38
  import { MeshSideBySideAlphaMaterial, SideBySideDirection } from '@zcomponent/three/internal/MeshSideBySideAlphaMaterial';
@@ -48,11 +48,34 @@ Object.freeze(VideoTransparencyType);
48
48
  * Supports various video transparency types, including chroma key and side-by-side transparency.
49
49
  *
50
50
  * Root element: [THREE.Group](https://threejs.org/docs/index.html#api/en/objects/Group)
51
- * @zstream
52
51
  */
53
52
  let BaseVideo = (() => {
54
53
  let _classSuper = Object3D;
55
54
  let _instanceExtraInitializers = [];
55
+ let _onEnded_decorators;
56
+ let _onEnded_initializers = [];
57
+ let _onEnded_extraInitializers = [];
58
+ let _onPause_decorators;
59
+ let _onPause_initializers = [];
60
+ let _onPause_extraInitializers = [];
61
+ let _onPlay_decorators;
62
+ let _onPlay_initializers = [];
63
+ let _onPlay_extraInitializers = [];
64
+ let _onPlaying_decorators;
65
+ let _onPlaying_initializers = [];
66
+ let _onPlaying_extraInitializers = [];
67
+ let _onWaiting_decorators;
68
+ let _onWaiting_initializers = [];
69
+ let _onWaiting_extraInitializers = [];
70
+ let _onError_decorators;
71
+ let _onError_initializers = [];
72
+ let _onError_extraInitializers = [];
73
+ let _transparent_decorators;
74
+ let _transparent_initializers = [];
75
+ let _transparent_extraInitializers = [];
76
+ let _videoElement_decorators;
77
+ let _videoElement_initializers = [];
78
+ let _videoElement_extraInitializers = [];
56
79
  let _volume_decorators;
57
80
  let _volume_initializers = [];
58
81
  let _volume_extraInitializers = [];
@@ -66,6 +89,8 @@ let BaseVideo = (() => {
66
89
  let _pause_decorators;
67
90
  let _stop_decorators;
68
91
  let _seek_decorators;
92
+ let _length_decorators;
93
+ let _isStalled_decorators;
69
94
  let _similarity_decorators;
70
95
  let _similarity_initializers = [];
71
96
  let _similarity_extraInitializers = [];
@@ -84,9 +109,18 @@ let BaseVideo = (() => {
84
109
  let _alphaFirst_decorators;
85
110
  let _alphaFirst_initializers = [];
86
111
  let _alphaFirst_extraInitializers = [];
112
+ let _dispose_decorators;
87
113
  return class BaseVideo extends _classSuper {
88
114
  static {
89
115
  const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
116
+ _onEnded_decorators = [zUI()];
117
+ _onPause_decorators = [zUI()];
118
+ _onPlay_decorators = [zUI()];
119
+ _onPlaying_decorators = [zUI()];
120
+ _onWaiting_decorators = [zUI()];
121
+ _onError_decorators = [zUI()];
122
+ _transparent_decorators = [zIgnore()];
123
+ _videoElement_decorators = [zIgnore()];
90
124
  _volume_decorators = [zUI({ type: 'proportion' }), zObserve((v, instance) => {
91
125
  instance._gain.gain.value = v;
92
126
  })];
@@ -98,16 +132,30 @@ let BaseVideo = (() => {
98
132
  _pause_decorators = [zUI()];
99
133
  _stop_decorators = [zUI()];
100
134
  _seek_decorators = [zUI({ type: 'time-milliseconds' })];
135
+ _length_decorators = [zIgnore()];
136
+ _isStalled_decorators = [zIgnore()];
101
137
  _similarity_decorators = [zUI({ group: 'Chroma Key Transparency', type: 'proportion' })];
102
138
  _smoothness_decorators = [zUI({ group: 'Chroma Key Transparency', type: 'proportion' })];
103
139
  _spill_decorators = [zUI({ group: 'Chroma Key Transparency', type: 'proportion' })];
104
140
  _keyColor_decorators = [zUI({ group: 'Chroma Key Transparency', type: 'color-norm-rgb-linear' })];
105
141
  _direction_decorators = [zUI({ group: 'Side By Side Transparency' })];
106
142
  _alphaFirst_decorators = [zUI({ group: 'Side By Side Transparency' })];
143
+ _dispose_decorators = [zIgnore()];
107
144
  __esDecorate(this, null, _play_decorators, { kind: "method", name: "play", static: false, private: false, access: { has: obj => "play" in obj, get: obj => obj.play }, metadata: _metadata }, null, _instanceExtraInitializers);
108
145
  __esDecorate(this, null, _pause_decorators, { kind: "method", name: "pause", static: false, private: false, access: { has: obj => "pause" in obj, get: obj => obj.pause }, metadata: _metadata }, null, _instanceExtraInitializers);
109
146
  __esDecorate(this, null, _stop_decorators, { kind: "method", name: "stop", static: false, private: false, access: { has: obj => "stop" in obj, get: obj => obj.stop }, metadata: _metadata }, null, _instanceExtraInitializers);
110
147
  __esDecorate(this, null, _seek_decorators, { kind: "method", name: "seek", static: false, private: false, access: { has: obj => "seek" in obj, get: obj => obj.seek }, metadata: _metadata }, null, _instanceExtraInitializers);
148
+ __esDecorate(this, null, _length_decorators, { kind: "method", name: "length", static: false, private: false, access: { has: obj => "length" in obj, get: obj => obj.length }, metadata: _metadata }, null, _instanceExtraInitializers);
149
+ __esDecorate(this, null, _isStalled_decorators, { kind: "method", name: "isStalled", static: false, private: false, access: { has: obj => "isStalled" in obj, get: obj => obj.isStalled }, metadata: _metadata }, null, _instanceExtraInitializers);
150
+ __esDecorate(this, null, _dispose_decorators, { kind: "method", name: "dispose", static: false, private: false, access: { has: obj => "dispose" in obj, get: obj => obj.dispose }, metadata: _metadata }, null, _instanceExtraInitializers);
151
+ __esDecorate(null, null, _onEnded_decorators, { kind: "field", name: "onEnded", static: false, private: false, access: { has: obj => "onEnded" in obj, get: obj => obj.onEnded, set: (obj, value) => { obj.onEnded = value; } }, metadata: _metadata }, _onEnded_initializers, _onEnded_extraInitializers);
152
+ __esDecorate(null, null, _onPause_decorators, { kind: "field", name: "onPause", static: false, private: false, access: { has: obj => "onPause" in obj, get: obj => obj.onPause, set: (obj, value) => { obj.onPause = value; } }, metadata: _metadata }, _onPause_initializers, _onPause_extraInitializers);
153
+ __esDecorate(null, null, _onPlay_decorators, { kind: "field", name: "onPlay", static: false, private: false, access: { has: obj => "onPlay" in obj, get: obj => obj.onPlay, set: (obj, value) => { obj.onPlay = value; } }, metadata: _metadata }, _onPlay_initializers, _onPlay_extraInitializers);
154
+ __esDecorate(null, null, _onPlaying_decorators, { kind: "field", name: "onPlaying", static: false, private: false, access: { has: obj => "onPlaying" in obj, get: obj => obj.onPlaying, set: (obj, value) => { obj.onPlaying = value; } }, metadata: _metadata }, _onPlaying_initializers, _onPlaying_extraInitializers);
155
+ __esDecorate(null, null, _onWaiting_decorators, { kind: "field", name: "onWaiting", static: false, private: false, access: { has: obj => "onWaiting" in obj, get: obj => obj.onWaiting, set: (obj, value) => { obj.onWaiting = value; } }, metadata: _metadata }, _onWaiting_initializers, _onWaiting_extraInitializers);
156
+ __esDecorate(null, null, _onError_decorators, { kind: "field", name: "onError", static: false, private: false, access: { has: obj => "onError" in obj, get: obj => obj.onError, set: (obj, value) => { obj.onError = value; } }, metadata: _metadata }, _onError_initializers, _onError_extraInitializers);
157
+ __esDecorate(null, null, _transparent_decorators, { kind: "field", name: "transparent", static: false, private: false, access: { has: obj => "transparent" in obj, get: obj => obj.transparent, set: (obj, value) => { obj.transparent = value; } }, metadata: _metadata }, _transparent_initializers, _transparent_extraInitializers);
158
+ __esDecorate(null, null, _videoElement_decorators, { kind: "field", name: "videoElement", static: false, private: false, access: { has: obj => "videoElement" in obj, get: obj => obj.videoElement, set: (obj, value) => { obj.videoElement = value; } }, metadata: _metadata }, _videoElement_initializers, _videoElement_extraInitializers);
111
159
  __esDecorate(null, null, _volume_decorators, { kind: "field", name: "volume", static: false, private: false, access: { has: obj => "volume" in obj, get: obj => obj.volume, set: (obj, value) => { obj.volume = value; } }, metadata: _metadata }, _volume_initializers, _volume_extraInitializers);
112
160
  __esDecorate(null, null, _muted_decorators, { kind: "field", name: "muted", static: false, private: false, access: { has: obj => "muted" in obj, get: obj => obj.muted, set: (obj, value) => { obj.muted = value; } }, metadata: _metadata }, _muted_initializers, _muted_extraInitializers);
113
161
  __esDecorate(null, null, _loop_decorators, { kind: "field", name: "loop", static: false, private: false, access: { has: obj => "loop" in obj, get: obj => obj.loop, set: (obj, value) => { obj.loop = value; } }, metadata: _metadata }, _loop_initializers, _loop_extraInitializers);
@@ -120,19 +168,43 @@ let BaseVideo = (() => {
120
168
  if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
121
169
  }
122
170
  constructorProps = __runInitializers(this, _instanceExtraInitializers);
123
- onEnded = new Event();
124
- onPause = new Event();
125
- onPlay = new Event();
126
- onPlaying = new Event();
127
- onWaiting = new Event();
128
- onError = new Event();
129
- geometry;
171
+ /**
172
+ * @zui
173
+ */
174
+ onEnded = __runInitializers(this, _onEnded_initializers, new Event());
175
+ /**
176
+ * @zui
177
+ */
178
+ onPause = (__runInitializers(this, _onEnded_extraInitializers), __runInitializers(this, _onPause_initializers, new Event()));
179
+ /**
180
+ * @zui
181
+ */
182
+ onPlay = (__runInitializers(this, _onPause_extraInitializers), __runInitializers(this, _onPlay_initializers, new Event()));
183
+ /**
184
+ * @zui
185
+ */
186
+ onPlaying = (__runInitializers(this, _onPlay_extraInitializers), __runInitializers(this, _onPlaying_initializers, new Event()));
187
+ /**
188
+ * @zui
189
+ */
190
+ onWaiting = (__runInitializers(this, _onPlaying_extraInitializers), __runInitializers(this, _onWaiting_initializers, new Event()));
191
+ /**
192
+ * @zui
193
+ */
194
+ onError = (__runInitializers(this, _onWaiting_extraInitializers), __runInitializers(this, _onError_initializers, new Event()));
195
+ geometry = __runInitializers(this, _onError_extraInitializers);
130
196
  material;
131
197
  mesh;
132
198
  texture;
133
- transparent;
134
- videoElement;
135
- _gain;
199
+ /**
200
+ * @zignore
201
+ */
202
+ transparent = __runInitializers(this, _transparent_initializers, void 0);
203
+ /**
204
+ * @zignore
205
+ */
206
+ videoElement = (__runInitializers(this, _transparent_extraInitializers), __runInitializers(this, _videoElement_initializers, void 0));
207
+ _gain = __runInitializers(this, _videoElement_extraInitializers);
136
208
  /**
137
209
  * @default false
138
210
  */
@@ -241,11 +313,13 @@ let BaseVideo = (() => {
241
313
  /**
242
314
  * Whether the video is muted.
243
315
  * @default false
316
+ * @zui
244
317
  */
245
318
  muted = (__runInitializers(this, _volume_extraInitializers), __runInitializers(this, _muted_initializers, false));
246
319
  /**
247
320
  * Whether the video should loop when it reaches the end.
248
321
  * @default false
322
+ * @zui
249
323
  */
250
324
  loop = (__runInitializers(this, _muted_extraInitializers), __runInitializers(this, _loop_initializers, false));
251
325
  /**
@@ -278,9 +352,15 @@ let BaseVideo = (() => {
278
352
  seek(t) {
279
353
  this.videoElement.currentTime = t / 1000;
280
354
  }
355
+ /**
356
+ * @zignore
357
+ */
281
358
  length() {
282
359
  return isNaN(this.videoElement.duration) ? undefined : this.videoElement.duration * 1000;
283
360
  }
361
+ /**
362
+ * @zignore
363
+ */
284
364
  isStalled() {
285
365
  return this.videoElement.readyState <= 2;
286
366
  }
@@ -330,6 +410,9 @@ let BaseVideo = (() => {
330
410
  * @zgroup Side By Side Transparency
331
411
  */
332
412
  alphaFirst = (__runInitializers(this, _direction_extraInitializers), __runInitializers(this, _alphaFirst_initializers, false));
413
+ /**
414
+ * @zignore
415
+ */
333
416
  dispose() {
334
417
  this.geometry.dispose();
335
418
  this.material.map?.dispose();
@@ -20,6 +20,7 @@ export interface VideoConstructorProps extends BaseVideoConstructorProps {
20
20
  * @zgroup Media
21
21
  * @ztag three/Object3D/Video
22
22
  * @zparents three/Object3D/Group/**
23
+ * @zstream
23
24
  */
24
25
  export declare class VideoPlayer extends BaseVideo {
25
26
  protected constructorProps: VideoConstructorProps;
@@ -28,8 +29,14 @@ export declare class VideoPlayer extends BaseVideo {
28
29
  */
29
30
  private hls;
30
31
  constructor(ctx: ContextManager, constructorProps: VideoConstructorProps);
32
+ /**
33
+ * @zignore
34
+ */
31
35
  load(): Promise<void>;
32
36
  private _loadHlsVideo;
33
37
  private _loadMp4Video;
38
+ /**
39
+ * @zignore
40
+ */
34
41
  dispose(): never;
35
42
  }
@@ -1,3 +1,10 @@
1
+ var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
2
+ var useValue = arguments.length > 2;
3
+ for (var i = 0; i < initializers.length; i++) {
4
+ value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
5
+ }
6
+ return useValue ? value : void 0;
7
+ };
1
8
  var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
2
9
  function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
3
10
  var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
@@ -25,15 +32,8 @@ var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn,
25
32
  if (target) Object.defineProperty(target, contextIn.name, descriptor);
26
33
  done = true;
27
34
  };
28
- var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
29
- var useValue = arguments.length > 2;
30
- for (var i = 0; i < initializers.length; i++) {
31
- value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
32
- }
33
- return useValue ? value : void 0;
34
- };
35
35
  // TODO- import type and dynamic import later
36
- import { registerLoadable, zComponent } from '@zcomponent/core';
36
+ import { registerLoadable, zComponent, zIgnore } from '@zcomponent/core';
37
37
  import Hls from 'hls.js';
38
38
  import { BaseVideo } from './basevideo';
39
39
  /**
@@ -51,6 +51,7 @@ import { BaseVideo } from './basevideo';
51
51
  * @zgroup Media
52
52
  * @ztag three/Object3D/Video
53
53
  * @zparents three/Object3D/Group/**
54
+ * @zstream
54
55
  */
55
56
  let VideoPlayer = (() => {
56
57
  let _classDecorators = [zComponent({
@@ -63,16 +64,23 @@ let VideoPlayer = (() => {
63
64
  let _classExtraInitializers = [];
64
65
  let _classThis;
65
66
  let _classSuper = BaseVideo;
67
+ let _instanceExtraInitializers = [];
68
+ let _load_decorators;
69
+ let _dispose_decorators;
66
70
  var VideoPlayer = class extends _classSuper {
67
71
  static { _classThis = this; }
68
72
  static {
69
73
  const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
74
+ _load_decorators = [zIgnore()];
75
+ _dispose_decorators = [zIgnore()];
76
+ __esDecorate(this, null, _load_decorators, { kind: "method", name: "load", static: false, private: false, access: { has: obj => "load" in obj, get: obj => obj.load }, metadata: _metadata }, null, _instanceExtraInitializers);
77
+ __esDecorate(this, null, _dispose_decorators, { kind: "method", name: "dispose", static: false, private: false, access: { has: obj => "dispose" in obj, get: obj => obj.dispose }, metadata: _metadata }, null, _instanceExtraInitializers);
70
78
  __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
71
79
  VideoPlayer = _classThis = _classDescriptor.value;
72
80
  if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
73
81
  __runInitializers(_classThis, _classExtraInitializers);
74
82
  }
75
- constructorProps;
83
+ constructorProps = __runInitializers(this, _instanceExtraInitializers);
76
84
  /**
77
85
  * @default null
78
86
  */
@@ -82,6 +90,9 @@ let VideoPlayer = (() => {
82
90
  this.constructorProps = constructorProps;
83
91
  registerLoadable(this.contextManager, this.load());
84
92
  }
93
+ /**
94
+ * @zignore
95
+ */
85
96
  async load() {
86
97
  const isHls = this.constructorProps.source.endsWith('.m3u8');
87
98
  if (isHls && !isIOS())
@@ -144,6 +155,9 @@ let VideoPlayer = (() => {
144
155
  this.videoElement.load();
145
156
  });
146
157
  }
158
+ /**
159
+ * @zignore
160
+ */
147
161
  dispose() {
148
162
  if (this.hls) {
149
163
  this.hls.destroy();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zcomponent/three-video-player",
3
- "version": "2.0.0-alpha.3",
3
+ "version": "2.0.0-alpha.4",
4
4
  "description": "HLS & MP4 Player for Mattercraft",
5
5
  "author": "Zappar Limited",
6
6
  "license": "Proprietary",
@@ -46,7 +46,7 @@
46
46
  "hls.js": "1.5.x"
47
47
  },
48
48
  "devDependencies": {
49
- "@zcomponent/three": "2.0.0-alpha.4"
49
+ "@zcomponent/three": "2.0.0-alpha.5"
50
50
  },
51
51
  "peerDependencies": {
52
52
  "@zcomponent/three": "*",