babylon.videoTexture.ts 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. module BABYLON {
  2. export class VideoTexture extends Texture {
  3. public video: HTMLVideoElement;
  4. private _autoLaunch = true;
  5. private _lastUpdate: number;
  6. constructor(name: string, urls: string[], size: any, scene: Scene, generateMipMaps: boolean, invertY: boolean, samplingMode: number = Texture.TRILINEAR_SAMPLINGMODE) {
  7. super(null, scene, !generateMipMaps, invertY);
  8. this.name = name;
  9. this.wrapU = BABYLON.Texture.WRAP_ADDRESSMODE;
  10. this.wrapV = BABYLON.Texture.WRAP_ADDRESSMODE;
  11. var requiredWidth = size.width || size;
  12. var requiredHeight = size.height || size;
  13. this._texture = scene.getEngine().createDynamicTexture(requiredWidth, requiredHeight, generateMipMaps, samplingMode);
  14. var textureSize = this.getSize();
  15. this.video = document.createElement("video");
  16. this.video.width = textureSize.width;
  17. this.video.height = textureSize.height;
  18. this.video.autoplay = false;
  19. this.video.loop = true;
  20. this.video.addEventListener("canplaythrough", () => {
  21. if (this._texture) {
  22. this._texture.isReady = true;
  23. }
  24. });
  25. urls.forEach(url => {
  26. //Backwards-compatibility for typescript 1. from 1.3 it should say "SOURCE". see here - https://github.com/Microsoft/TypeScript/issues/1850
  27. var source = <HTMLSourceElement> document.createElement("source");
  28. source.src = url;
  29. this.video.appendChild(source);
  30. });
  31. this._lastUpdate = Tools.Now;
  32. }
  33. public update(): boolean {
  34. if (this._autoLaunch) {
  35. this._autoLaunch = false;
  36. this.video.play();
  37. }
  38. var now = Tools.Now;
  39. if (now - this._lastUpdate < 15) {
  40. return false;
  41. }
  42. this._lastUpdate = now;
  43. this.getScene().getEngine().updateVideoTexture(this._texture, this.video, this._invertY);
  44. return true;
  45. }
  46. }
  47. }