PXL MP3 Player code available
May 26th, 2007 by Dave
Here is the main code behind the Mezzy MP3 Shredder (can be viewed here) as promised. Shouldn’t be too buggy but if you find anything, let me know and I’ll update it. I’ve been sitting on this code for a while messing with it and leaving off for other projects, and I know quite a few people were looking for a cool mp3 player base. So enjoy!
PXL Designs MP3 Player Flex code zip
UPDATE: The code for the PXL MP3 Player has been updated and improved on many times since this post. Take a look around the main page of this blog for the latest and greatest.
Hi
Unfortunately the mx:vSlider control use use does NOT recognise the tickValues="{[0.0,1.0]}" attribute. I am using Flex 2.0
Wonderful!
Ivor,
Sorry it took so long to get back on this, been busy as all hell.
Ok, so on the MP3.mxml component in com.pxldesigns.classes, line 293, the vSlider for volume control:
Replace the whole control with something like:
<!– This is the volume control slider –>
<mx:VSlider id="volumeControl" x="732" y="147" allowTrackClick="true"
change="setVolume(this.volumeControl.value)" toolTip="{}" snapInterval="5" labels="{['0','50%','100%']}" tickValues="{[0.0,5.0,10.0]}"
liveDragging="true" thumbDrag="setVolume(this.volumeControl.value)"/>
and you just hooked up the click event for the track in addition to the live dragging in the original code.
The original code had the tick mark values wrong, 0.0 and 1.0, should have been 0.0 and 10.0 because I never set it up to listen to track click, that’s why it didn’t recognize it. The above code will allow both click and drag, and for a quick test I just set it up for 0-50-100% with matching tick values.
This component was originally built in Flex 2.0.1, but it should be fine in 2.0.
dave
Hey when in pause state if we rewind it..it should have been in pause state but it starts playing mp3
Hey Rajesh,
Good point. I didn’t create it originally to work that way. From a UI standpoint, I figured if it’s paused and the user drags, my version would just play from that spot. But it might make more sense your way.
So real quick without testing thoroughly I changed a few lines to work how you suggested. Line 82 in MP3.mxml, the changeSize() function that handles a user drag on the hSlider. Right after the line: var playhead:Number = hSlider.value *.01;
I added a little check to see if it’s paused, isPaused is a bool that was set in your original code. If it is, just set pausePosition to the current position of the hSlider and return, don’t play. But that sets it where it should be to work the way you mentioned.
if(isPaused) {
this.pausePosition = (playhead * songLength) / 1000;
return;
}
Let me know if that works good for you, I don’t have any problems with it here.
Dave,
Great job on the player..thanks for posting the code! I noticed that the stop control does not get the hSlider back to the original position.
Also, what would it take to add support for transport controls (rewind & forward) I kinda wired this quick & dirty way…without too much testing:
private function rewindSong():void{
songLength = song.length * 1000;
soundFactory.stop();
var playhead:Number = hSlider.value *.01;
playhead = (playhead > 0.05)? playhead -0.05:0;
soundFactory = song.play((playhead * songLength)/1000); setVolume(volumeControl.value);
}
private function forwardSong():void {
songLength = song.length * 1000;
soundFactory.stop();
var playhead:Number = hSlider.value *.01;
playhead = ((1.00 – playhead) > 0.05)? playhead + 0.05: playhead;
soundFactory = song.play((playhead * songLength)/1000); setVolume(volumeControl.value);
}
Any suggestions?
Dave,
Great job on the player..thanks for posting the code! I noticed that the stop control does not get the hSlider back to the original position.
Also, what would it take to add support for transport controls (rewind & forward) I kinda wired this quick & dirty way…without too much testing:
private function rewindSong():void{
songLength = song.length * 1000;
soundFactory.stop();
var playhead:Number = hSlider.value *.01;
playhead = (playhead > 0.05)? playhead -0.05:0;
soundFactory = song.play((playhead * songLength)/1000); setVolume(volumeControl.value);
}
private function forwardSong():void {
songLength = song.length * 1000;
soundFactory.stop();
var playhead:Number = hSlider.value *.01;
playhead = ((1.00 – playhead) > 0.05)? playhead + 0.05: playhead;
soundFactory = song.play((playhead * songLength)/1000); setVolume(volumeControl.value);
}
Any suggestions?
Siddharth,
There’s actually a more recent post on the code base here http://www.pxldesigns.com/p…
That new source just basically makes use of Cairngorm 2.2 so everything’s reusable and you can add the MP3 player to any application easily OOP style. There’s a little tweak here and there for the MP3 player code too.
For actual rewind/FF buttons I left them out originally because of the slider itself. But I’ll put in your code and play around with it and see if I can’t whip up something that plays nice with the base code.
Setting the hSlider’s position back to 0 should be super easy. I’ll take a look at that too.
Now that Flex 3 is available I didn’t need an excuse to start playing with it
If I get some good code going today, I’ll post up the source again, keep an eye out for it soon anyway.
Appreciate it Dave!
Appreciate it Dave!
Siddharth,
Thanks for your help! I posted the latest code with the rewind/FF and setting hSlider thumb back to 0. You can download it here: http://www.pxldesigns.com/p…