Do you know how you can leave a comment on a YouTube video specifying a certain time in the video (i.e. 16:59) and when the comment is submitted, the time specified turns into a link, and when clicked, will take you to that time in the video?
Well, I'd like to implement that functionality except with mp3s.
I want to have some kind of mp3 player with links below the player of say, chapters, that will help me navigate to certain parts of an mp3.
What kind of Web technology will help me get this functionality?
The Web technology that you'll need:
fragment identifiers
I would recommend using some library for HTML5 audio with Flash fallback, like this:
MediaElement.js
If you're using jQuery then those plugins might help you:
BBQ plugin
Hashchange plugin
Related
Question:
How can I control the sound output of this embedded video without overly complicating things?
Possible Solution (Complex)
I've looked into the youtube javascript control API, and, correct me if I'm wrong, but that will force me to incorporate a lot of complication into the setup to accomplish what appears to be a very simple task.
Note:
This is all only tested for webkit at this stage
Setup:
I've created an element that simulates an iphone controlling the channel of a tv by swapping youtube videos like so:
var channel1 = "http://www.youtube.com/embed/dFU6Cy4Hd5A?autoplay=1&rel=0&controls=0&showinfo=0&disablekb=1&iv_load_policy=3&modestbranding=1";
$("#channel-1").click(function(){
$("#tv").attr("src", channel1);
});
where the #channel-1 id is connected to a specific button on the remote, and the tv id is connected to the video player.
It looks like this:
Edit:
If the API is the only to accomplish this, please include a link to a comprehensive tutorial teaching the youtube web API, because I've looked, and found nothing. The only thing I've found so far is the official API page, and that's like trying to learn PHP from the manual.
For loading videos you would use loadVideoById rather than the rather odd snippet you have in your question and to play without audio you simply mute the player using player.mute() (where player is a reference retrieved from the youtube player element itself like described here). And one last thing, don't forget to add enablejsapi=1 to the url of the player as described here.
I would use
event.target.mute();
I work on a website that embeds videos from many different websites, the number of sources run into the thousands. For YouTube, their JavaScript API allows a way to detect when the video ends and one can execute any function he wants at that time. But this will only work for the youtube videos. What about all the others?
So is there a global all applicable way to detect when the Flash video on a page has stopped playing using either javascript or action script? And by "stopped playing" I mean stopped playing when it reached the end and not just been paused half way.
P.S. There will always be one embedded video inside a <div> with the id video on the page.
Just like YouTube provides an API, those players from those external websites have to provide their own APIs as well. There isn't an easy one-size-fits-all solution that you can implement in JavaScript.
In order to view an embedded video on a web-page, is it absolutely necessary to have javascript
enabled - assuming the web page is not in the latest HTML5 format and hence has none of
the newer type tags?
I have noticed that YouTube does not work with JS disabled and I was wondering
whether it was a conscious decision on YouTube's part to work only with JS enabled or
did they really have no choice.
The embed code for YouTube is basically an iframe that links to a normal HTML page that uses JavaScript to load in the video you want to see.
In general, you can view video without JavaScript enabled. Most videos are played through Flash, which you can include directly into your page with either an object tag or an embed tag.
There are libraries, such as SWFObject that will put those players into your page for you, but do so through the use of JavaScript. If you want to use a library like that, you will need JavaScript enabled.
Also, if your browser does support HTML5, you can load video directly into the page with the video tag, without the need of JavaScript.
Youtube wants you to have Javascript enabled to deliver advertising.
The player you want to use to embedd the video will tell you if Javascript has to be enabled or not.
Most of the Flash based players work without Javascript enabled, some other don't.
If you are going to embedd a QuickTime video, you don't need to have Javascript enabled to play it
How can I get the current playing time from an embedded video on a webpage? Is there simply an attribute that can be obtained using JavaScript from one of the common embedded video players? Or do I need to do a work-around like make my own pause and play buttons and keep track of time manually while feeding the play/pause commands to the video using JavaScript? The latter is much more ugly in my opinion. Other solutions?
The html5 video tag provides some decent support for this kind of thing.
The following page gives some decent ideas:
http://www.broken-links.com/2009/10/06/building-html5-video-controls-with-javascript/
How would I go about seeking or pausing an embedded video (not necessarily a swf) from javascript? I am looking for something like Google's SWFObject's API, but for Windows Media Player, Real Player, Quicktime.
I would check out camen design, that is for backup (in case HTML 5 is not available), then broken links (set the src attribute of the video tag to something else, ironic enough that link to the video is broken), you can easily play/ pause, access volume control, etc using Javascript.
Like ItzWarty said, not many video formats are supported, but you can certainly work it out.