dbawel Posted December 10, 2015 Share Posted December 10, 2015 Hello, I am using video textures in BJS, and can certainly control their HTML5 video functions for play and pause, however, I need to control time such as adding ff and rewind. In HTML5 I would simply do the following: <script type="text/javascript">function vidplay() {var video = document.getElementById("Video1");var button = document.getElementById("play");if (video.paused) {video.play();button.textContent = "||";} else {video.pause();button.textContent = ">";}}function restart() {var video = document.getElementById("Video1");video.currentTime = 0;}function skip(value) {var video = document.getElementById("Video1");video.currentTime += value;}</script></head><body><video id="Video1" >// Replace these with your own video files.<source src="demo.mp4" type="video/mp4" /><source src="demo.ogv" type="video/ogg" />HTML5 Video is required for this example.<a href="demo.mp4">Download the video</a> file.</video><div id="buttonbar"><button id="restart" onclick="restart();">[]</button><button id="rew" onclick="skip(-10)"><<</button><button id="play" onclick="vidplay()">></button><button id="fastFwd" onclick="skip(10)">>></button></div> But I've tried accessing the currentTime and other function on the videoTextures and I get a console response that in the case of: video.currentTime I receive a console error of : Uncaught ReferenceError: video is not defined I would like to have all HTML5 video function available, and also be able to identify operations on multiple or individual video textures. If anyone knows the proper usage that I must be overlooking, please let me know. Thanks, DB Quote Link to comment Share on other sites More sharing options...
RaananW Posted December 10, 2015 Share Posted December 10, 2015 Hey DB - the video element is located at the texture. You can use it like this: http://www.babylonjs-playground.com/#1X8NRY (click after the video was loaded) Quote Link to comment Share on other sites More sharing options...
dbawel Posted December 10, 2015 Author Share Posted December 10, 2015 @RaananW - Play and pause functions work fine, however, I haven't been able to get other operations such as video.currentTime() to work on a video texture. Otherwise, I can play and stop(pause) without any problem. I require more controls such as specific time controls, and canot find any usage to do this using a video tesxture. Thanks. Quote Link to comment Share on other sites More sharing options...
Wingnut Posted December 10, 2015 Share Posted December 10, 2015 http://www.babylonjs-playground.com/#1X8NRY#1 Click once or twice, of course. Upon click, video runs at triple speed (ff) via playbackRate, and currentTime is also working, starting 10 secs into the video. (rw). Fast response, eh? I just finished the tests when your post came in. Party on. dbawel and RaananW 2 Quote Link to comment Share on other sites More sharing options...
RaananW Posted December 10, 2015 Share Posted December 10, 2015 currentTime is a property, not a function - http://www.babylonjs-playground.com/#1X8NRY#2 I find this website very helpful for understanding how it all works - http://www.w3.org/2010/05/video/mediaevents.html . you can see the events, properties, functions, everything is listed. the video element is a standard video element. whatever any player can do, so can you. dbawel and jerome 2 Quote Link to comment Share on other sites More sharing options...
dbawel Posted December 10, 2015 Author Share Posted December 10, 2015 @Wingnut - amazing, record time! I knew it was a usage issue on my part. Thanks much, as now I should be able to add all of the video playback functions into my video player using multiple video textures. And putting the time into a playground scene is valuable for all - especially since we have a search engine for the playground. Do you ever rest? @RaananW - you're help has been invaluable as well - especially for the last link showing most every function I might build for video texture playback in a working example. What I was missing was the simple usage to assign these operations to a variable all the way back representing the material itself - which Wingnut kindly demonstrated. I don't think that this is obvious usage for most people, and would be great to add this to the documentation. If no one else does so, I should do the time on this since you guys did the work. Also, thank you for responding so quickly, as I couldn't finish any work without this forum, and getting quick responses is everything to my producing work. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
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.