TrackSeek
An example of the finished product is being used on this site
This is my 2nd installment to the Yahoo Media Player.
You can find other extensions here.
TrackResume.
TrackShuffle.
TrackLoop.
TrackFocus.
After posting to a few forums I realized people were also looking for a way to control the seek position in the player. So here it is.
Step 1) grab these files and drop them on your host
Both of these files need to be included after the Yahoo Media Player. The file ‘ef.ymp.utilities.js’ is needed for manipulating cookies, setting styles, and using MD5 hashes to store UIDs for the tracks.
<script src="http://github.com/oxchronxo/YMP/raw/master/ef.ymp.utilities.js" type="text/javascript"</script> <script src="http://github.com/oxchronxo/YMP/raw/master/ef.ymp.trackSeek.js" type="text/javascript"></script>
2009-01-06
Moved the slider into the main meta panel. Thanks to Stephen Garcia for a little insight into the future state.
Also changed the default color of the slider to a muted grey which matches the playlist and added a highlight color which matches the other greens.
Tag cloud
Recent Comments
oxchronxo: I don’t have the raw source anymore.
Stephen: Hi Eric, I’m about to start making some skins for the yahoo media player. I thought I’d ask if...
fehmi: hey update pls
Cho Sung-min: Thank you very very very muchhhhh~~~ i just follow this post then works fine!!
Shreyas: Thanks a lot!! Really appreciate the effort.
Recent Trackbacks
- chronx: Playlist.com + YQL + PHP = true XSPF
- chronx: I went the medibuntu route to get w32codecs and all that but that didn't help. BTW… the medibunti...
- The Fehrenbacher’s: Playlist.com + YQL + PHP = true XSPF
- 4 Free Audio Players to Add Audio to Your Site by ClintLalonde.net: Eric has written a number of...
Blogroll
Coding
- Bash Comparison Operators
- Bash Docs
- Bash File Operators
- Code Conventions
- E4X @ MDC
- E4X @ Yahoo
- ECMA Script
- Git
- Git CheatSheet
- Git Docs
- GitHub
- Javascript Beautify
- Javascript Docs
- Javascript Lint
- jQuery
- JSON
- JSON Beautify
- JSON Lint
- JSON View
- MooTools
- Mozilla Developer Center
- Mozilla Labs
- PHP Docs
- PHP DOM
- PHP SimpleXML
- Pipes
- RegEx Editor
- SVN
- SVN CheatSheet
- SVN Docs
- XML Beautify
- XSPF
- XSPF Docs
- YQL
- YQL Console
- YQL Docs
- YQL Open Data Tables
February 12th, 2009 - 00:59
I’m using YMP on my website and would love to have your slider. Could you possibly send me some instructions? I found the posted code through the post on yahoogroups, but i’m still a noobie at programming and could use a walk through since I haven’t yet figured out how to get it working. If you can, I would really appreciate it. Thanks, Brandy
February 27th, 2009 - 09:59
The slider hack for the YMP looks great, but I can’t seem to find the links to the files on this page. Are the scripts available for use and, if so, how do I go about getting them? Thanks
March 22nd, 2009 - 22:36
Can you please clarify which “files” need to be copied? It’s a bit confusing to understand the instructions.
March 28th, 2009 - 10:59
This looks like such a great add-on to fix the only complaint I have about the player, but it looks like I’m a little late in checking out your codes. I hope you’re okay and can add the files back to your site soon!
March 29th, 2009 - 21:20
Hey guys, not sure where Eric has been or why the links are down. I’m using his hacks on another site of mine. I went ahead and wrote this post about how to find the files and link to them…….
http://www.ccastig.com/2009/03/29/yahoo-media-player-hacks/
hope that helps
April 1st, 2009 - 07:51
Hey guys, sorry for not responding for soooo long. Been I’ve been overwhelmed lately with work(Widgets for TV, http://connectedtv.yahoo.com/).
Evidently the last wordpress update hosed my syntax highlighter which prevented some examples and links from showing up. Should be good now
April 2nd, 2009 - 07:57
Fantastic. Thanks so much for getting the files back on the site. Can you tell me what the terms of use for the scripts are? I’d like to use them with some multimedia work I do at a community college. Are these FLOSS?
April 2nd, 2009 - 12:45
There are no ‘Terms of Use’. Use and abuse at will
FYI: these files will eventually move to google code or something so download the files locally to use them. Don’t link or at some point in the future the library won’t be available to you.
April 3rd, 2009 - 10:18
I love the appearance and function of YMP on your page with the trackseek hack. I installed the two files (‘ef.ymp.utilities.js’ and ‘ef.ymp.trackSeek.js’) on my server and called them after the YMP script but the appearance of YMP was unchanged – no slider and the ‘learn more about this player’ cell remained. Sorry to bother but I really like yours so if you have any suggestions I would greatly appreciate. Thanks.
April 7th, 2009 - 00:10
Hello!
You are a very popular hacker. looks like you’re pretty busy too!
I have to ask two things that I couldn’t figure out on my own. I have been able to ‘turn off’ certain divs on the YMP, that’s easy. But you seem to have figured out – how to auto-launch the player – I couldn’t figure it out. I tried setting the ymp-player class by hand to ‘ymp-player-max’ but it didn’t work. Do tell!
And how did you get rid of the extra space to the right of the white space (http://noonchild.com/muse/art/screenshot_01.jpg) – I’ve been trying to do that all night!
Thanks in advance for any pointers you might have.
cheers
k
April 7th, 2009 - 00:26
hehe, forgot about the old ‘right-click and view source’.
Never mind.
May 1st, 2009 - 00:11
hi… great addition to the player… pretty much perfect now…!
one thing I was wondering about.. on my blog, when looking at the home page (all post down the page) and a player is started, the search function doesn’t work. However, when you click on a specific post and go to it, the player search works fine..
May 21st, 2009 - 14:38
Syntax error on the first script. Need a “>” after the javascript”. Found it and it’s working great. Thanks.
July 22nd, 2009 - 11:27
Question about the trackseek – if you drag the slider far enough to the right, it goes to the next track. I thought maybe I had done something wrong, but it does it on your YMP on this page as well. I was assuming that dragging it to the right would allow me to go closer to the end of the current track, but again, if you drag too far, it just skips to the next track. Is it supposed to do that? Is there a way to fix that so the entire slider is only for the current track?
August 3rd, 2009 - 12:04
I find that trackseek works great on Internet Explorer but on Firefox, Safari and Google Chrome it does as Jeremy stated on July 22nd. if you drag the slider past the halfway point it goes onto the next track.
August 6th, 2009 - 09:31
Yahoo Media Player is awesome! I’m really excited to have discovered such a find and hope to use it in my own web projects very soon, but making customizations without butchering the source code seems a bit less trivial than I originally thought.
Krister Axel, I’m curious at how you were able to “turn off” certain divs on the YMP. It would be great to remove the ymp-yahoo-logo and the ymp-relevance divs altogether without forking the original source. I’ve tried using some CSS hacks, but the results left something to be desired when the divs were still taking up space when rendered in the browser.
I’m thinking that if there was some way to get the YMP script to execute and then run another custom script to modify the DOM tree that was created by the YMP script, I could jump off to a good start. At the moment, I’m having trouble getting my custom script to execute AFTER the YMP script and when I look at the source in the browser, my script always ends up BEFORE the YMP script despite my efforts to explicitly place my scripting code AFTER the YMP script.
Thanks for any divine wisdom that may descend from upon high from the gods of Javascripting. Actually, I’d just greatly appreciate any help/advice anyne has to offer. =)
August 20th, 2009 - 17:51
When I try to use your code with other javascript it seems to clash. I don’t know what I’m doing wrong. Also, the player doesn’t follow you on the page when you scroll. In IE it doesn’t even show up. Thanks.
October 21st, 2009 - 05:32
I have gotten track seek to work everywhere except IE6, works great on IE7 and IE8, but IE6 the bar slides around without doing anything. Anything special we need to do to have it work with IE6?
November 1st, 2009 - 13:53
Great addon to a great tool. And – incredible – keyboard friendly
for user who can’t use a mouse. Thanks a lot.
Just one question:
How about making the slider keyboard accessible (Shift + arrow right/left)
Greetings from Bavaria/Germany
January 15th, 2010 - 11:00
Hey guys, been off the grid for some time now. I’m seeing some interesting ideas in here. Has anyone extended the functionality of any of these additions? Does anyone know? I will have to take a look around and see.
As far as the links go, they are still hosted here, and will be for the foreseeable future.
As far as browser incompatibilities, I was really only targeting firefox at the time. From the looks of things, since these files were pretty standards compliant, issues have gone away as browsers have come up to speed so yay for laziness on my part(I say to myself).
January 30th, 2010 - 05:35
Hi guys, fantastic mod to YMP, great work! However I’m having trouble getting the scripts to work.
Here’s the page where I’ve embedded scripts:
http://www.calvarystockport.co.uk/Media/AudioMessages/tabid/188/Default.aspx
The scripts are obviously working however if you click on a “play” icon and try to seek all it does is restart the track from the start.
Does it require that the entire track is buffered before you can seek? This would normally not be a big deal but on this particular site I’m working on the tracks are 60mins long!! …
Any ideas?
February 5th, 2010 - 10:18
Andrew,
I’m speculating here because I don’t know exactly how the player works under the hood as I didn’t write it. Unless the files you are playing are being streamed or the player is utilizing progressive downloading(which it does not appear to be) then yes the entire file would need downloaded.
Does the file start playing before the seek bar is available ? I will check this out as well.
February 20th, 2010 - 06:03
hey eric,
thanks for the great hacks of the ymp.
i was wondering if you had found a way to have the player continue playback of the same track while you change the pages on your website?
i have long dj mixes and it would be great to be able to view my other pages without the music stopping.
thought id check.
thanks again.
March 3rd, 2010 - 22:59
Thanks bro. It works.
But I noticed that if the mp3 is long or is quite heavy with a few MBs, then the bar wouldn’t be of any use. Perhaps maybe after its fully buffered. What is quite sad is that the mp3s that are long are the ones that need the track seeker most. I hope you’ll be able to work around this issue fast and easily.
March 10th, 2010 - 22:16
By far the most concise and up to date information I found on this topic. Sure glad that I navigated to your page by accident. I’ll be subscribing to your feed so that I can get the latest updates. Appreciate all the information here
March 11th, 2010 - 02:32
Hi, it seems it doesn’t work.
March 14th, 2010 - 09:30
I am in the process of splitting up my sites personal/work so I have removed the working example for now. I will put it back up once the dust settles.
To answer a few questions about people having problems…
First of all this was an overnight hack and I’ve only touched the code once since then. This was really a prototype to show that it could be done with pretty limited work. So if there are edge cases that don’t work, so be it. Works for me and that was my goal. The code is open so anyone can take it and fix problems they find.
The guts behind the player is a flash player and I have no idea how that works but I am pretty sure that it depends on how the file is served. If the file is streamed then seeking should work as soon as the song starts and if the file is not streamed then the entire thing would need buffered. Maybe someone who knows more about the player itself can speak more specifically to that point.
March 28th, 2010 - 21:44
Just what i was looking for. Thanks.
P.S. Your script declarations above are missing a &rt; after “text/javascript”
March 28th, 2010 - 22:06
I can’t read the comments. I see there are 27 comments and portions of them show up in the sidebar but one every page no comments are visible and below the comment number is “No Comments Yet”.
I’m having an issue with the slider taking too long to generate anything usable. A person must wait about 10 seconds without clicking on it before the slider and timer is accurate and functional. Is this common? Perhaps it is similar to Adib’s problem (but not sure, can only see first couple dozen words of his comment). Thanks for any insight. I think your scripts are going in the right direction.
March 28th, 2010 - 22:54
Thanks for catching the Fup. I guess it’s been that way for awhile, maybe a month or more. Turns out it was a rouge wordpress plugin called “Page Restrict” which doesn’t seem to work with newer wordpress.
March 28th, 2010 - 22:57
I haven’t looked into it in awhile. I’m thinking maybe flash must buffer the entire song before it can expose the length, which is what I’m using to calculate offsets and snap points in the seek bar. I’ll try to make some time to look into this. Maybe since I wrote the code the underlying player has changed and possibly exposes that property earlier. Make sense ?