|
@@ -1,4 +1,4 @@
|
|
-module BABYLON {
|
|
|
|
|
|
+module BABYLON {
|
|
export class VideoTexture extends Texture {
|
|
export class VideoTexture extends Texture {
|
|
public video: HTMLVideoElement;
|
|
public video: HTMLVideoElement;
|
|
|
|
|
|
@@ -6,14 +6,14 @@
|
|
private _lastUpdate: number;
|
|
private _lastUpdate: number;
|
|
|
|
|
|
/**
|
|
/**
|
|
- * Creates a video texture.
|
|
|
|
- * Sample : https://doc.babylonjs.com/tutorials/01._Advanced_Texturing
|
|
|
|
- * @param {Array} urlsOrVideo can be used to provide an array of urls or an already setup HTML video element.
|
|
|
|
- * @param {BABYLON.Scene} scene is obviously the current scene.
|
|
|
|
- * @param {boolean} generateMipMaps can be used to turn on mipmaps (Can be expensive for videoTextures because they are often updated).
|
|
|
|
- * @param {boolean} invertY is false by default but can be used to invert video on Y axis
|
|
|
|
- * @param {number} samplingMode controls the sampling method and is set to TRILINEAR_SAMPLINGMODE by default
|
|
|
|
- */
|
|
|
|
|
|
+ * Creates a video texture.
|
|
|
|
+ * Sample : https://doc.babylonjs.com/tutorials/01._Advanced_Texturing
|
|
|
|
+ * @param {Array} urlsOrVideo can be used to provide an array of urls or an already setup HTML video element.
|
|
|
|
+ * @param {BABYLON.Scene} scene is obviously the current scene.
|
|
|
|
+ * @param {boolean} generateMipMaps can be used to turn on mipmaps (Can be expensive for videoTextures because they are often updated).
|
|
|
|
+ * @param {boolean} invertY is false by default but can be used to invert video on Y axis
|
|
|
|
+ * @param {number} samplingMode controls the sampling method and is set to TRILINEAR_SAMPLINGMODE by default
|
|
|
|
+ */
|
|
constructor(name: string, urlsOrVideo: string[] | HTMLVideoElement, scene: Scene, generateMipMaps = false, invertY = false, samplingMode: number = Texture.TRILINEAR_SAMPLINGMODE) {
|
|
constructor(name: string, urlsOrVideo: string[] | HTMLVideoElement, scene: Scene, generateMipMaps = false, invertY = false, samplingMode: number = Texture.TRILINEAR_SAMPLINGMODE) {
|
|
super(null, scene, !generateMipMaps, invertY);
|
|
super(null, scene, !generateMipMaps, invertY);
|
|
|
|
|
|
@@ -30,29 +30,33 @@
|
|
this.video.loop = true;
|
|
this.video.loop = true;
|
|
}
|
|
}
|
|
|
|
|
|
- this.video.addEventListener("canplaythrough", () => {
|
|
|
|
- if (Tools.IsExponentOfTwo(this.video.videoWidth) && Tools.IsExponentOfTwo(this.video.videoHeight)) {
|
|
|
|
- this.wrapU = Texture.WRAP_ADDRESSMODE;
|
|
|
|
- this.wrapV = Texture.WRAP_ADDRESSMODE;
|
|
|
|
- } else {
|
|
|
|
- this.wrapU = Texture.CLAMP_ADDRESSMODE;
|
|
|
|
- this.wrapV = Texture.CLAMP_ADDRESSMODE;
|
|
|
|
- generateMipMaps = false;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- this._texture = scene.getEngine().createDynamicTexture(this.video.videoWidth, this.video.videoHeight, generateMipMaps, samplingMode, false);
|
|
|
|
- this._texture.isReady = true;
|
|
|
|
- });
|
|
|
|
|
|
+ if (Tools.IsExponentOfTwo(this.video.videoWidth) && Tools.IsExponentOfTwo(this.video.videoHeight)) {
|
|
|
|
+ this.wrapU = Texture.WRAP_ADDRESSMODE;
|
|
|
|
+ this.wrapV = Texture.WRAP_ADDRESSMODE;
|
|
|
|
+ } else {
|
|
|
|
+ this.wrapU = Texture.CLAMP_ADDRESSMODE;
|
|
|
|
+ this.wrapV = Texture.CLAMP_ADDRESSMODE;
|
|
|
|
+ generateMipMaps = false;
|
|
|
|
+ }
|
|
|
|
|
|
if (urls) {
|
|
if (urls) {
|
|
|
|
+ this.video.addEventListener("canplaythrough", () => {
|
|
|
|
+ this._texture = scene.getEngine().createDynamicTexture(this.video.videoWidth, this.video.videoHeight, generateMipMaps, samplingMode, false);
|
|
|
|
+ this._texture.isReady = true;
|
|
|
|
+ });
|
|
urls.forEach(url => {
|
|
urls.forEach(url => {
|
|
var source = document.createElement("source");
|
|
var source = document.createElement("source");
|
|
source.src = url;
|
|
source.src = url;
|
|
this.video.appendChild(source);
|
|
this.video.appendChild(source);
|
|
});
|
|
});
|
|
|
|
+ } else {
|
|
|
|
+
|
|
|
|
+ this._texture = scene.getEngine().createDynamicTexture(this.video.videoWidth, this.video.videoHeight, generateMipMaps, samplingMode, false);
|
|
|
|
+ this._texture.isReady = true;
|
|
}
|
|
}
|
|
|
|
|
|
this._lastUpdate = Tools.Now;
|
|
this._lastUpdate = Tools.Now;
|
|
|
|
+
|
|
}
|
|
}
|
|
|
|
|
|
public update(): boolean {
|
|
public update(): boolean {
|
|
@@ -64,7 +68,7 @@
|
|
var now = Tools.Now;
|
|
var now = Tools.Now;
|
|
|
|
|
|
if (now - this._lastUpdate < 15 || this.video.readyState !== this.video.HAVE_ENOUGH_DATA) {
|
|
if (now - this._lastUpdate < 15 || this.video.readyState !== this.video.HAVE_ENOUGH_DATA) {
|
|
- return false;
|
|
|
|
|
|
+ return false;
|
|
}
|
|
}
|
|
|
|
|
|
this._lastUpdate = now;
|
|
this._lastUpdate = now;
|
|
@@ -72,4 +76,4 @@
|
|
return true;
|
|
return true;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
-}
|
|
|
|
|
|
+}
|