Is there any way to pause a video immediately after creating the element with PIXI.Texture.fromVideo or fromVideoUrl? It looks like it might be bugged currently, because under some circumstances the paused flag is set but the video doesn't actually pause. I noticed in the fromVideoUrl function it will call play() before returning, and at one point console.log'ing the baseTexture.source element showed instead of the HTML tag, an object with a pixi_id or something. I'm not sure if that is relevant, but I haven't been able to repeat that, so I'm not sure if it was just a one off (but it makes me suspicious if that object is somehow messing with my .pause() calls? Maybe during the transition .pause() calls don't work properly, so the video keeps playing? I'm not sure how that would work, but I'm not sure what's going on there either.)
This is the only code that I have been able to make that works, but I imagine it's fragile due to the bug? where sometimes .paused gets set to true even though the video is still playing. If the timeout is lower than 1000 it doesn't pause the video, but the paused flag gets set so it stops it's setTimeout loop. Also, it means the video plays for ~1 second before pausing which in my case is problematic.
var renderer, stage, video, sprite;$(function() { renderer = new PIXI.autoDetectRenderer(1920, 1080); $('body').append(renderer.view); stage = new PIXI.Container(); video = PIXI.Texture.fromVideoUrl('720p_test_web.mp4'); sprite = new PIXI.Sprite(video); stage.addChild(sprite); animate(); pauseVideo(video.baseTexture.source);});function animate() { requestAnimationFrame(animate); renderer.render(stage);}function pauseVideo(el) { console.log(el); if (!el.paused) { el.pause(); setTimeout(pauseVideo, 1000, el); }}
I tried passing the video element directly into PIXI.Texture.fromVideo() but the video still doesn't pause and just plays from load.
var renderer, stage, video, sprite;$(function() { renderer = new PIXI.autoDetectRenderer(1920, 1080); $('body').append(renderer.view); stage = new PIXI.Container(); video = PIXI.Texture.fromVideo(Util.fromVideoUrl('720p_test_web.mp4')); sprite = new PIXI.Sprite(video); stage.addChild(sprite); animate(); video.baseTexture.source.pause();});function animate() { requestAnimationFrame(animate); renderer.render(stage);}var Util = Util || {};Util.fromVideoUrl = function(src) { var video = document.createElement("video"); video.preload = "auto"; video.loop = true; video.src = src; video.pause(); return video;}
Any ideas?