Warning: include_once(/home/kenv/kenvillines.com/wp-content/plugins/wordpress-support/wordpress-support.php): failed to open stream: Permission denied in /home/kenv/kenvillines.com/wp-settings.php on line 213

Warning: include_once(): Failed opening '/home/kenv/kenvillines.com/wp-content/plugins/wordpress-support/wordpress-support.php' for inclusion (include_path='.:/usr/local/lib/php:/usr/local/php5/lib/pear') in /home/kenv/kenvillines.com/wp-settings.php on line 213
» Quicktime Javascript Examples Ken Villines 1.0

Quicktime Javascript Examples

I had a request to post some examples of Javascript controls for Quicktime movies. Here are the code samples.

This is the Javascript that controls to use:

<script language="JavaScript">
<!--
/* a javascript function that takes a QT movie and calls its "Play" method */
function PlayIt(anObj)
{
anObj.Play();
}
/* a javascript function that takes a QT movie and calls its "Stop" method */
function StopIt(anObj)
{
anObj.Stop();
}
/* a javascript function that takes a QT movie and calls its "Rewind" method */
function StartIt(anObj)
{
anObj.Rewind();
}
/* a javascript function that takes a QT movie and calls its "Reverse" method */
function ReverseIt(anObj)
{
anObj.Step(-1);
}
/* a javascript function that takes a QT movie and calls its "Reverse" method */
function ForwardIt(anObj)
{
anObj.Step(1);
}
//-->

</script>

This is the QuickTime embedding sample:

<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"
 codebase="http://www.apple.com/qtactivex/qtplugin.cab" id="movie1" height="240" width="320"> 
<param name="src" value="../movies/ax.mov">
<param name="AUTOPLAY" value="false">
<param name="CONTROLLER" value="false">
<embed src="../movies/ax.mov" name="movie1" enablejavascript="true" controller="false" autoplay="false" height="240" width="320">
</object>

This is a sample form containing all play buttons:

<form name="theform">
<input name="reverse" value="Rwd" onclick="javascript:ReverseIt(document.movie1);" type="button">
<input name="play" value="Play" onclick="document.movie1.Play();" type="button">
<input name="stop" value="Stop" onclick="document.movie1.Stop();" type="button">
<input name="forward" value="Fwd" onclick="javascript:ForwardIt(document.movie1);" type="button">
<input name="begin" value="Start Over" onclick="javascript:StartIt(document.movie1);" type="button">
</form>

27 Responses to “Quicktime Javascript Examples”

  1. David Says:

    Hi Ken

    Thats exactly what I am looking for. I have looked all over the web, this is the first example of quicktime working with Mozilla (1.5) I have found!

    Excellent!

  2. Christian Newton Says:

    Thank you for the demo. They’re few and far between. I’m working on a similar system that uses javascript controls to skip to chapter stops. Do you have any tips on that? Right now some chapter links work, some don’t. I suspect that Quicktime may be picky about the time code formatting.

  3. Ken Villines Says:

    Sorry I haven’t already gotten back to you. You should look at the chapter descriptors for any syntax problems. Also take a look at the tutorial below because it mentions that chapters don’t work well with streaming or downloading media. The media has to be fully downloaded to the client so all chapters can be accessed through QuickTime controls.

    Chapter Tracks Tutorial

    I am going to research this more.

  4. zee Says:

    how do i get this thinger to go to fullscreen using an input button? Anyone know?

  5. Chad Brantly Says:

    Hi,

    I am trying to get javascript controls (specifically the SetTime control) to work with my movies. It works with no problems if I embed the movie directly in the page. However, when I use a reference movie (to determine the users connection speed) the javascript control no longer works. Any ideas how I can get around this problem?

  6. Ken Villines Says:

    You can still EMBED the QT player and reference the movie. Use src=”smallref.mov” and then qtsrc = “therealmovie.mov” inside the EMBED tags. I think this will allow you to EMBED and still use the SetTime() function while detecting connection speed.

    Let me know how it goes
    -Ken

  7. Chad Brantly Says:

    Hi Ken,

    I guess I don’t really understand. Let me see if I can do a better job asking the question.

    I have embedded a reference movie in the page (SY17_ref.mov). This movie determines the users connection speed and replaces itself with either a high-speed or low-speed movie (SY17_href_high.mov or SY17_href_low.mov). When I run the SetTime script it doesn’t seem to behave correctly…it acts like it is playing in fastforward or something.

    You can see an example of what I am talking about here:
    http://www.ewavegroup.com/webshare/CMSA_2004/SY17/SY17_stream2.html
    Click the “Jump” link at the bottom of the page to run the javascript. I have used this same method on a CD (that had the movie embedded directly in the page with no reference movie) and it worked flawlessly.

    Also, another question that I hope you can help me with. These movies use MP4 compression for both audio and video. I hinted them using QT 6.5.1. The movies play fine on my local machine, but when they are playing from the streaming server the audio and video get out of sync about 25 minutes in. The separation gets larger the further you go in the movie…by the end (the movie is over an hour long) the audio is about 4 or 5 seconds off from the video.

    Thanks for any help you can offer!

  8. Ken Villines Says:

    If I were doing this, I wouldn’t use reference movies but build a javascript QT detection page that acts as a redirection page. The redirection page would redirect to the appropriate page containing the embedded QT that matches the connection speed that was detected. The SetTime() calls will be done in the second page. If SetTime()works differently with each movie then this could be a bug in the compression scheme. The out of sync issue is probably a bug too.

    I would try to test the sync issue between two machines on the same intranet and see if it could be a speed problem. If you are on local servers then things should be faster then streaming from an external server.

    I would also try compressing these movies with a different CODEC and see if the same problems persist. I haven’t seen these problems with Sorenson. I haven’t really used MP4 with long format stuff so I am only making recommendations. Does this help at all?

    Good luck!

  9. Chad Brantly Says:

    I will try the javascript QT detection that you recommended and post back here.

    In regards to the sync issue…

    I have tried it with different CODECs and have the same problem. It is running on a darwin streaming server. I think it must be a problem with the hint track, but I haven’t been able to determine for sure whether it is a bug in the hint track or a bug in the way the server interprets the hint track. Any suggestion on how I can trace this problem?

  10. Rod Beaton Says:

    Chad,

    I’ve been having the same sync problem with MP4 videos.

    In my case, the problem is definitely with the encoder. The files play fine locally, but if I open them in QT Pro and look at the length of the individual tracks, the hinted video track is longer then the other tracks by about 2-3 seconds. So when the streaming server sends out the file, it sends out the hinted video track just as it is supposed to, which puts the sudio and video out of sync.

    Unfortunately, I’ve had no luck finding a solution to this. My two thoughts are to try to find out what is causing this problem in the hinting phase, or to try to find a program that will allow me to change the length of the inividual tracks (including the hinted tracks) within the mp4 file.

    QT Pro will allow you to export and reimport a specific track, and will even let you stretch a smaller track to match the length of a longer one. Unfortuately, after doing this, the file needs to be rehinted for streaming (won’t stream if you don’t), and this screws up the hinted track length again.

    If you’ve found any solutions since you’ve posted this, I’d love to hear them.

    -rod

  11. maimoon Says:

    I am having some problems with controlling QT movies in webpages. I am developing a language teaching website. We have QT movies which draw letters of an asian language stroke by stroke till the complete letter is draw. Now what I want is that when the movie loads it shows the last frame i.e. the complete letter. And when I click the play button it plays the movie from the beginning. There are a couple of hundred movies and I would not like to edit all of them to add the last frame to the beginning aswell. Please let me know how to do it? You help will be greatly appreciated.

  12. tripp Says:

    i’m trying to use setTime() as well. can’t find much info about it, but what i did find suggested that the time to skip to is determined by framerate times second. yet the only way i can make it sync up correctly is by multiplying the seconds by 600 – completely arbitrary.

    does anyone know of better/more/different ways of doing this? i dont understand where the 600-ish range comes from (and after about 20 minutes, the sync starts slipping, so 600 isnt even the exact number i need to plugin anyway).

  13. Ezentyr Says:

    This finally provided the missing piece I needed… Not for movies, but for embedded mp3′s that I needed to control via javascript. Nothing I tried would work for Quicktime, despite it working if Windows Media Player handled it in IE.

    And of course, Firefox etc required QT also, so this was fantastic. Now my sound clips are playing on mouseover no matter what!

    Thankyou for this solution.

    Ez

  14. john Says:

    hi ken- i currently have a four movies, playing one after another using qtnext. do you know of a way to insert a ‘previous’ and ‘next’ button to let the user skip forward or back between movies?

    many thanks!

  15. Greg Jellin Says:

    Hey Ken,

    Great help! I’ve tested this on many browsers and the only ones that it doesn’t seem to work on are Mac/ie5.2 (no biggie, few users) and Mac/Safari. Safari has a few more users. Any ideas?

    Thanks!!!
    Greg

  16. Gerben Schmidt Says:

    Works in Safari (2.0.1) too!

  17. jj Says:

    ken or anyone …..this guy asked a very good question i have been wanting to do for years now…on windows you can put a link for windows media player to expand the embedded video to full screen while its playing is there a way to do the same link or button with quicktime?

    here is the question on your site i found via google but i don’t see a response

    how do i get this thinger to go to fullscreen using an input button? Anyone know?

    Posted by zee at July 7, 2004 08:57 PM

    thanks! can you please email me

  18. Ken Villines Says:

    @ Zee & JJ

    Sorry for not seeing this comment until JJ commented. The QT Scripting API doesn’t have a function call to support fullscreen. The way you get fullscreen with QuickTime is to save a QuickTime SMIL file with a directive of Fullscreen. When the Quicktime plugin reads the movie (smil) it will read the directive and open the movie reference (fullscreen) into the player. I will post an example ASAP.

    -Ken

  19. FilI Says:

    hi is it also possible to point to a live qt stream

    a rtsp with sdp file?

    thx

  20. John Spady Says:

    Ken Villines gave a link for CHAPTER TRACKS TUTORIAL on March 16, 2004 that was unfortunately incorrect… I think I have the correct link which I will place here in my URL link to this post.

    http://www.apple.com/quicktime/tutorials/chaptertracks.html

  21. Jean-Pierre Berchtold Says:

    Hi,

    Nice code, but it doesn’t solve my problem….I’m trying to find out the callbacks that are automatically fired by QuickTime so I can get the size (width and heigth) of the movie. To take a comparison, WMP is firing PlayStateChange(NewState); and RealPlayer is firing OnPreFetchComplete();

    I could not get this info from Apple doc or site :-(

    Many thanks
    Jean-Pierre

  22. Rangi Says:

    Hi,

    This code seems to have stopped working in the latest versions of Firefox (2.0.0.1) and Quicktime (7.1.5) – June 2007. This is a shame because it was working really nicely before. Now I’m getting the “Bad NPObject as private data!” error after a few call successful calls to the quicktime object. Restarting the browser can get it to work for a few more calls but then this errors comes back… If anyone knows a way around this, please let me know. My email address is rangi.robinson@framestore-cfc.com

    Thanks!
    Rangi

  23. Linc Kesler Says:

    Hi Rangi,

    I am experiencing some difficulty with QuickTime javascript controls too. At the moment, everything is working well in Firefox, but Safari does not seem to process SetTime calls at all (it reverts to the start of the movie. Apple seems to break things with some regularity, and that is annoying for me, as I have based several year’s work around a QuickTime/javascripted application. This, however, is nothing like the disaster they caused for me by suddenly disabling the javascript call capability of HREF tracks this spring. No lead time on that, and suddenly nothing works! Very embarrassing in front of a room full of people. My only suggestion at the moment is to recommend Firefox to people who use my app. I hope this will not happen again anytime soon, but it seems like a regular feature. Should we all be switching to another media handler? I sure hope not, as I like many other aspects of the Apple video world, but for those of us oriented to the web, this inconsistency is a real problem.

    Linc Kesler

  24. rakejava Says:

    Hi Ken,

    I am working on a on demand video streaming project the player which we are using is quick time and darwin streaming server.problem is we need to display movie in full screen (from normal mode, it shud be synchronized) that to embedded in the browser.
    If the movie plays for about 10 mins and user clicks on full screen the movie must start from 10th min in full screen.
    can u give any suggestion or sample code for this

    Thanks,
    rake.

  25. Srinivas Says:

    If we say Stop in Quick Time it is functioning like pause and when ever we say start after pressing stop the Quick time is not playing from the Begining . can any one help like How i can play the media after pressing stop from the Beggining. ( using JavaScript same code mentioned above)

  26. Srinivas Says:

    Hi Ken,
    If we say Stop in Quick Time it is functioning like pause and when ever we say start after pressing stop the Quick time is not playing from the Begining . can any one help like How i can play the media after pressing stop from the Beggining. ( using JavaScript same code mentioned above)

    regards,
    srinivas

  27. Walter Says:

    To stop and play again from the beginning, you would need to do something like this:

    function RePlay(mov){
    mov.Stop();
    mov.Rewind();
    mov.Play();
    }

    Walter

Leave a Reply