I’m trying to play a video using Pixi.js but the video doesn’t play and I don’t get any error message in the console this time so I have no clue if I do it wrong or it maybe a problem with GD or with the Pixi version GD is using or with my browser or codecs used in the video
This is the code I’m using:
[code]//object in scene editor used to set position and size of video
var vidObject = objects[0];
// create a texture from a video
var texture = PIXI.Texture.fromVideo(‘video.mp4’);
// create a sprite using the texture
var vidSprite = new PIXI.Sprite(texture);
// set video sprite position
vidSprite.position.x = vidObject.getX();
vidSprite.position.y = vidObject.getY();
// set video height and width
vidSprite.width = vidObject.getWidth();
vidSprite.height = vidObject.getHeight();
// get pixi container
var container = runtimeScene.getPIXIContainer();
// add sprite to the container
container.addChild(vidSprite);[/code]
Yes I know, in preview the actual video file not get copied so I’m exporting the project and I copy the video file manually in to the folder.
Anybody could help?
Thanks.
EDIT:// Seems like it was a problem with the video, to be honest not sure what. I have downloaded an mp4 video from the web and that one works but it using the same codecs
Anyway, at least I know the code works in Firefox and Google Chrome on Windows and Ubuntu.
I couldn’t get it to work in IE11, Chromium and Android
I would like to know, does it return a static texture from a specific time in the video, or this object can update the texture automatically to play the video? That would be awesome!
Thanks, webm works also in Chromium and NW.js but I couldn’t get it to work on Android using CocoonJS Canvas+ and WebView… It may works with IntelXDK though and on newer version of Android.
Yeah just few lines I wish everything would be so simple
I guess it updates the texture automatically as I don’t tell it to play any kind of animation or to update it self, but I’m only guessing
In this project I pick the object into variable from the scene using Javascript…
var vidObject = runtimeScene.getObjects("videoPosition");
Remember that, preview is not going to work, you need to export the project to test.
When you export the project to HTML5, don’t forget to copy the video file “video.webm” into the the export folder.
Also, remember that on my side it works only in Firefox, Google Chrome and NW.js.
You could copy the video in the preview temporary folder, but you should do it in each preview. The PIXI loader seems to be able to load videos, I haven’t tried to access the loaded resource, but it’s enough to force GD to add the video to the preview folder adding the video as an image without getting errors
So, if you add the video as an image in GD, it will copy it to the preview folder to test your video code fastly. I’m not sure if the video could finally be loaded twice (PIXI resource and HTML5 element ‘src’ if you create a video element as I do), so I would remove the video from the image sources before compiling
Do you mean, you are creating a video element manually and play video that way? If so, is it any good, any better?
Well, I’m not creating a video element myself I’m using only the above code to make texture from the video and I have no trouble compiling the project with the video in the image bank.
Everything seems and sounds normal
Anyway, it a good proof of that, technically could be possible and could be useful to have a resource bank dedicated to add any kind of resource (files) to our project so they gonna be copied when running preview and compiling
Not sure if you can do it with just a texture, but with a video element you can modify every option a video object has: play, pause, autoloop, set at specific time, etc.
