Jump to content

Video Texture and controlling playback.


biscuitcleaver
 Share

Recommended Posts

Hi all,

 

I know the Video Texture is brand new - but is there an easy way to make videos play and pause? It looks like it's creating a video element in html, but when I try to pause that video element using the onPlayStart()/onPlayStop()  functions, my video will pause - but the audio is still playing. I think I'm stopping the video texture rendering, but not the actual video itself - does that seem correct? Is there a way to do this?

 

Thanks!

Link to comment
Share on other sites

  • 5 months later...

there is a property "source" that is the video element itself. Use that to play/pause.

Can you write some simple example, please?

 

I've tryed this code:

function getTextPlane() {	var texture = PIXI.Texture.fromVideo('../img/sintel.mp4');	texture.source.pause();		var plane = new PIXI.Sprite(texture);	plane.alpha = 0.5;	plane.width = 370;	plane.height = 165;		return plane;}

It s get error: Uncaught TypeError: Cannot read property 'pause' of undefined

 

And this too:

function getTextPlane() {	var texture = PIXI.Texture.fromVideo('../img/sintel.mp4');		var plane = new PIXI.Sprite(texture);	plane.alpha = 0.5;	plane.width = 370;	plane.height = 165;			plane.texture.source.pause();		return plane;}

I can't understand where i need to search 'soruce' property.

Link to comment
Share on other sites

 

Source is a property of the base texture, not the texture:

texture.baseTexture.source.pause();

Ye, thx, this works.

 

Let me ask another question. How I can stop my video in the begginig scene render?

I wont say, what this code (i mean pause()) work in some actions (example by click on some oject), but if i write this before «animate();», or after this not work - video continiue playing.

 

See:

// start animatingtextPlane.texture.baseTexture.source.pause();	// not workinganimate();textPlane.texture.baseTexture.source.pause();	// not working too

But this code is working:

setTimeout(function() {	textPlane.texture.baseTexture.source.pause();}, 2000);

..but i'm understand, what this wrong to do, i mean that it is not best way to do it.

 

P.S. I'm trying set autostar="false" for «textPlane.texture.baseTexture.source» and it's notworking for me.

P.P.S. How i can set video to autloop playing? It's way as «textPlane.texture.baseTexture.source.loop = true» or another?

Link to comment
Share on other sites

If you don't want it in the scene then remove the sprite that is in the scene. You should probably also pause the texture so it doesn't keep playing.

No, I need this in the scene, but with first frame and by mouse on  - play video and mouse out  - set video pause.

I success used events mouseon and mouseleave - this work, but I can't stop my video with start scene.

Link to comment
Share on other sites

No, I need this in the scene, but with first frame and by mouse on  - play video and mouse out  - set video pause.

I success used events mouseon and mouseleave - this work, but I can't stop my video with start scene.

 

So you are trying to stop the video, before it has fully loaded? What you will see happen is that when it has fully loaded, pixi will auto play it for you. You can listen for the 'load' event on the VideoBaseTexture and pause in that callback.

Link to comment
Share on other sites

So you are trying to stop the video, before it has fully loaded? What you will see happen is that when it has fully loaded, pixi will auto play it for you. You can listen for the 'load' event on the VideoBaseTexture and pause in that callback.

Yes, I tried this too, but not sure what it's was right.

Please, see this code:

function getTextPlane() {	var texture = PIXI.Texture.fromVideo('../img/sintel.mp4');	var plane = new PIXI.Sprite(texture);	plane.alpha = 0.5;	plane.width = 370;	plane.height = 165;	texture.baseTexture.addEventListener('onload', function() {		console.log('onload complete');	});	return plane;}

Chrome dev tools show error: 'Uncaught TypeError: texture.baseTexture.addEventListener is not a function'.

 

Or I need use VideoBaseTexture instead 'PIXI.Texture.fromVideo('../img/sintel.mp4');'?

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...