<video> - change URL

[Graveto]

Hi,

I'm trying to change the source and the poster of a html5 video onClick().

This is what I have. But the chage of the URL doesn't work?!


JS:

Code: Select all

function loadAnotherVideo(oggURL, posterURL) {

  var video = document.getElementsByTagName('video')[0];
  var sources = video.getElementsByTagName('source');

  video.poster = posterURL;
  sources[0].src = oggURL;

}

HTML

Code: Select all

<video width="622" height="366" controls poster="bla.jpg" >
    <source src="big_buck_bunny_480p_stereo.ogg"  type='video/ogg; codecs="theora, vorbis"'>
</video>
<a href="#" onclick="loadAnotherVideo('video2.ogv', 'bla.jpg')">Video 1</a>


All files are in the directory.
Any Ideas?

Thank You!

[zcorpan]

You need to call video.load() after changing source.src. (If you use video.src then it's reloaded automatically.)

[Graveto]

I tried this before. Dosn't help...

Code: Select all

video.poster = posterURL;
sources[0].src = oggURL;
video.load();

[/quote]

[JAB Creations]

A couple things that work exceptionally well for me...

1.) I use the base element which in a multi-domain web software environment works absolutely beautiful (which a little help from serverside scripting of course).

2.) Check your access logs presuming of course that you're running a local web server. If the browser you're using attempts to load the video file and can not find it then like everything else it will be logged in Apache's access log.

[Graveto]

I'm working localy at the moment. Anyway I tried the Base Element.
No sucess...

[JAB Creations]

It's raining, tried an umbrella, no success.

That's what I read.

You did not follow up on looking up your access log or even confirming that you're running a web server locally, for all I know you just right-clicked on the desktop, make a new text document, and plopped down some HTML. We can't learn or do the work for you though I can tell you what people helping you on a forum will come to expect if they invest a couple minutes of their time to help.

In the very least if you're not running a web server you should take a serious look at XAMPP which works pretty well out of the box. While the installer takes some time it requires very minimal configuration changes for testing locally. Once you have it running open the access log (the file is named "access.log" by default). I recommend using tail32 to watch the log file update in real time...
http://sourceforge.net/projects/tailforwin32/

Following those directions will get you exactly what you want with minimal effort, all that is left is for you to make that effort.

[Graveto]

I'm working with XAMPP.

Here is my Acces.log. There is no indication of the video url.

Code: Select all

127.0.0.1 - - [06/Jul/2010:18:22:26 +0200] "GET /html5/ HTTP/1.1" 200 913
127.0.0.1 - - [06/Jul/2010:18:22:26 +0200] "GET /html5/bla.jpg HTTP/1.1" 200 41148
127.0.0.1 - - [06/Jul/2010:18:22:50 +0200] "GET /html5/bla2.jpg HTTP/1.1" 200 7890


After clicking the link to change the url I can see that Firefox recives data form the requested URL.

But it stops after a few seconds. I just don't no why.
I tried it whith local videos before. Same problem.



The value of sources[0].src is http://nofatclips.com/02010/06/29/boivin/AT%20AT%20Day%20Afternoon.ogv (withhin the loadAnotherVideo function, after the click)

That seems correct.

It is hard for me to explain this in english. I hope you understand it...

Thank you for your help.

[zcorpan]

I tried this before. Dosn't help...

Code: Select all

video.poster = posterURL;
sources[0].src = oggURL;
video.load();

Which browser? Works for me in Opera.

[Graveto]

Firefox

[zcorpan]

See https://bugzilla.mozilla.org/show_bug.cgi?id=534571

[JAB Creations]

Test it in multiple browsers and make sure that the browsers you're testing with support the codec. Offhand I'm not sure if a browser will avoid loading a file simply based off of it's file extension.

[Graveto]

It is the reported bug:

https://bugzilla.mozilla.org/show_bug.cgi?id=534571

It works in opera and chrome. (Theora+Vorbis+Ogg)

[JAB Creations]

I test in Firefox by default and usually have Opera open for a strong second opinion whenever I'm doing R&D. In the case of something new in terms of feature support I'd have as many different rendering engines open as I could find that apparently support the given spec.