html5 video replay button

1var VideotextureBtn = pc.createScript('videotextureBtn');
2
3
4VideotextureBtn.attributes.add('materials', {
5    type: 'asset',
6    assetType: 'material',
7    array: true
8});
9
10VideotextureBtn.attributes.add('video', {
11    type: 'asset'
12});
13
14// initialize code called once per entity
15VideotextureBtn.prototype.initialize = function() {
16    var app = this.app;
17
18    // Create a texture to hold the video frame data            
19    var videoTexture = new pc.Texture(app.graphicsDevice, {
20        format: pc.PIXELFORMAT_R5_G6_B5,
21        autoMipmap: false
22    });
23    videoTexture.minFilter = pc.FILTER_LINEAR;
24    videoTexture.magFilter = pc.FILTER_LINEAR;
25    videoTexture.addressU = pc.ADDRESS_CLAMP_TO_EDGE;
26    videoTexture.addressV = pc.ADDRESS_CLAMP_TO_EDGE;
27
28    // Create HTML Video Element to play the video
29    var video = document.createElement('video');
30    video.addEventListener('canplay', function (e) {
31        videoTexture.setSource(video);
32    });
33    video.src = this.video.getFileUrl();
34    video.crossOrigin = 'anonymous';
35    video.loop = true;
36    //video.paused = true;
37    video.muted = true; // This line allows video to play without prior interaction from the user
38    video.play();
39
40    // Get the material that we want to play the video on and assign the new video
41    // texture to it.
42    for (var i = 0; i < this.materials.length; i++) {
43        var material = this.materials[i].resource;
44        material.emissiveMap = videoTexture;
45        material.update();
46    }
47
48    this.videoTexture = videoTexture;
49    this.videoDom = video;
50    
51    this.upload = true;
52 
53};
54
55
56VideotextureBtn.prototype.postInitialize = function() {    
57    this.app.fire('video:playing');
58    this.videoDom.pause();
59    this.app.fire('video:paused');  
60    
61    // Add pause/play controls event listeners
62    this.app.on('video:play-pause-toggle', function () {
63        if (this.videoDom.paused) {
64            this.videoDom.play();
65            this.app.fire('video:playing');
66        } else {
67            this.videoDom.pause();
68            this.app.fire('video:paused');
69        }
70    }, this);
71};
72
73
74// update code called every frame
75VideotextureBtn.prototype.update = function(dt) {
76    // Upload the video data to the texture every other frame
77    this.upload = !this.upload;
78    if (this.upload) {
79        this.videoTexture.upload();
80    }
81};
82
83