Please help me put video in a project in the simplest way with a step-by-step instruction

[takashi_aiman]

Someone please help me, anyone.

I’ve tried every single thing, read every thread, the basic texture video tutorial (with the orange tv falling), tried on my own but it seems like im very stupid to understand a damn thing and cant work this thing myself.

I’ve tried it all, but like i said, im so dumb that i cant do things correctly. ITS JUST TOO COMPLICATED!

Last time i used hubs mozilla, all we need to do is upload an mp4 file, then drag and drop the file into the scene, then done! But hubs mozilla ended. And with this platform im trying, its just so complicated to put a simple video file.

I want to make a simple exhibition gallery. where players can go to the video (in paused mode), click the play symbol to play the video. Then when its finished, it paused at the last frame, and showed the play symbol again to play the video again from the start. This feature is available in hubs mozilla and its super simple to be done.

Can someone please, i beg u, anyone, show me a step-by-step, in numbers, on how do i put an mp4 file video into a scene? And i want that video only to be played by pressing a play button, not automatically played.

Like i said, i’ve tried referring to this project - PlayCanvas | HTML5 Game Engine
but i just cant get it correctly.

if someone is kind enough, can u do a simple project for me featuring this video - brian.mp4 - Google Drive
i swear its not a virus. its from my own google drive. its a video named “brian.mp4”. simply put, i just want to put this video on a perfect square plane/box. Thats it.

lastly, thank u so much to everyone who read this and willing to help me. god bless. please help me, this project is important to me.

[Codeknight999]

Hey @takashi_aiman ! I think you can use HTML for this. You can make html in playcanvas, you just need to add a video tag and add the source as your video and then use this tutorial: HTML/CSS UI | PlayCanvas Developer Site
to add html to the actual world.

I believe there is a way to get an asset link and use that as your video for your url.

Here is some stuff about the video tag: HTML video Tag
If you have any questions let me know!

God bless you as well!

[takashi_aiman]

yes but how do i include this -

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

into the .js files (the “tvScreen” and “videoTexture” ?

I can see that from the link u gave me ( HTML/CSS UI | PlayCanvas Developer Site ) can put an entity with UI tag/script and then drag and drop the HTML and CSS. But how do i link all that into a video and the .js files??

this is getting more difficult

[takashi_aiman]

Currently im trying copying this - PlayCanvas 3D HTML5 Game Engine

So all i need is to make a UI button, and then copy paste-attach the FireEventOnEntityClick.js file

I attached the FireEventOnEntityClick.js into the same plane that plays my video. then it shows this -

Seems like theres a code error here -

And this is my current progress/project

What did i do wrong? As show in this project - PlayCanvas 3D HTML5 Game Engine , i dont want a seperate entity/button outside of my video. I want my video/plane to be able to push the play/pause button on the video/plane itself.

Tagging yaustar
Steven Yau please help me

Thank you so much and god bless!!

[takashi_aiman]

Also, to add, I want to put multiple videos in 1 scene too so if anyone can help, please do.

this is my project file if anyone willing to help PlayCanvas | HTML5 Game Engine

Thank you so much kind people of earth

[Syzyjeez]

There is no button component on your Brian entity so it gives that error. You need to add one for it to work. Not sure if you need the element comoonent as well. You could instead try having a seperate element button that is transparent.

[Syzyjeez]

You could probably just copy and paste the entites.

[takashi_aiman]

I’ve tried. but now it became like this. and the clicks doesnt pause/play the video at all -

you can see all my tags, entities, script and all are as the original but it doesnt work… T_T

why is this so hard… playcanvas shud make this a super easy function/feature considering this platform can do so many other difficult stuff but why is it so hard to put a simple video… and i have almost zero knowledge of codings but now i gotta learn stuff…

[Syzyjeez]

I just realized that your event name for FireEventOnEntityClick script doesn’t match the other scripts. I presume they should all be the same.

Honestly, mostly anything simple you want to make requires a basic understanding of JavaScript and the engine. It’s better to start learning than be stuck and give up.