;(function( $, window, document, undefined ) { var istouch = 'ontouchstart' in window, estart = istouch ? 'touchstart' : 'mousedown', emove = istouch ? 'touchmove' : 'mousemove', eend = istouch ? 'touchend' : 'mouseup', ecancel = istouch ? 'touchcancel' : 'mouseup', secondstotime = function( secs ) { var hoursdiv = secs / 3600, hours = math.floor( hoursdiv ), minutesdiv = secs % 3600 / 60, minutes = math.floor( minutesdiv ), seconds = math.ceil( secs % 3600 % 60 ); if( seconds > 59 ) { seconds = 0; minutes = math.ceil( minutesdiv ); } if( minutes > 59 ) { minutes = 0; hours = math.ceil( hoursdiv ); } return ( hours == 0 ? '' : hours > 0 && hours.tostring().length < 2 ? '0'+hours+':' : hours+':' ) + ( minutes.tostring().length < 2 ? '0'+minutes : minutes ) + ':' + ( seconds.tostring().length < 2 ? '0'+seconds : seconds ); }, canplaytype = function( file ) { var audioelement = document.createelement( 'audio' ); return !!( audioelement.canplaytype && audioelement.canplaytype( 'audio/' + file.split( '.' ).pop().tolowercase() + ';' ).replace( /no/, '' ) ); }; $.fn.audioplayer = function( params ) { var params = $.extend( { classprefix: 'audioplayer', strplay: '', strpause: '', strvolume: 'volume' }, params ), cssclass = {}, cssclasssub = { playpause: 'playpause', playing: 'playing', stopped: 'stopped', time: 'time', timecurrent: 'time-current', timeduration: 'time-duration', bar: 'bar', barloaded: 'bar-loaded', barplayed: 'bar-played', volume: 'volume', volumebutton: 'volume-button', volumeadjust: 'volume-adjust', novolume: 'novolume', muted: 'muted', mini: 'mini' }; for( var subname in cssclasssub ) cssclass[ subname ] = params.classprefix + '-' + cssclasssub[ subname ]; this.each( function() { if( $( this ).prop( 'tagname' ).tolowercase() != 'audio' ) return false; var $this = $( this ), audiofile = $this.attr( 'src' ), isautoplay = $this.get( 0 ).getattribute( 'autoplay' ), isautoplay = isautoplay === '' || isautoplay === 'autoplay' ? true : false, isloop = $this.get( 0 ).getattribute( 'loop' ), isloop = isloop === '' || isloop === 'loop' ? true : false, issupport = false; if( typeof audiofile === 'undefined' ) { $this.find( 'source' ).each( function() { audiofile = $( this ).attr( 'src' ); if( typeof audiofile !== 'undefined' && canplaytype( audiofile ) ) { issupport = true; return false; } }); } else if( canplaytype( audiofile ) ) issupport = true; var theplayer = $( '
' + ( issupport ? $( '
' ).append( $this.eq( 0 ).clone() ).html() : '' ) + '
' ), theaudio = issupport ? theplayer.find( 'audio' ) : theplayer.find( 'embed' ), theaudio = theaudio.get( 0 ); if( issupport ) { theplayer.find( 'audio' ).css( { 'width': 0, 'height': 0, 'display': 'none' } ); theplayer.prepend( '
' ); var thebar = theplayer.find( '.' + cssclass.bar ), barplayed = theplayer.find( '.' + cssclass.barplayed ), barloaded = theplayer.find( '.' + cssclass.barloaded ), timecurrent = theplayer.find( '.' + cssclass.timecurrent ), timeduration = theplayer.find( '.' + cssclass.timeduration ), volumebutton = theplayer.find( '.' + cssclass.volumebutton ), volumeadjuster = theplayer.find( '.' + cssclass.volumeadjust + ' > div' ), volumedefault = 0, adjustcurrenttime = function( e ) { therealevent = istouch ? e.originalevent.touches[ 0 ] : e; theaudio.currenttime = math.round( ( theaudio.duration * ( therealevent.pagex - thebar.offset().left ) ) / thebar.width() ); }, adjustvolume = function( e ) { therealevent = istouch ? e.originalevent.touches[ 0 ] : e; theaudio.volume = math.abs( ( therealevent.pagey - ( volumeadjuster.offset().top + volumeadjuster.height() ) ) / volumeadjuster.height() ); }, updateloadbar = function() { var interval = setinterval( function() { if( theaudio.buffered.length < 1 ) return true; barloaded.width( ( theaudio.buffered.end( 0 ) / theaudio.duration ) * 100 + '%' ); if( math.floor( theaudio.buffered.end( 0 ) ) >= math.floor( theaudio.duration ) ) clearinterval( interval ); }, 100 ); }; var volumetestdefault = theaudio.volume, volumetestvalue = theaudio.volume = 0.111; if( math.round( theaudio.volume * 1000 ) / 1000 == volumetestvalue ) theaudio.volume = volumetestdefault; else theplayer.addclass( cssclass.novolume ); timeduration.html( '…' ); timecurrent.html( secondstotime( 0 ) ); theaudio.addeventlistener( 'loadeddata', function() { updateloadbar(); timeduration.html( $.isnumeric( theaudio.duration ) ? secondstotime( theaudio.duration ) : '…' ); volumeadjuster.find( 'div' ).height( theaudio.volume * 100 + '%' ); volumedefault = theaudio.volume; }); theaudio.addeventlistener( 'timeupdate', function() { timecurrent.html( secondstotime( theaudio.currenttime ) ); barplayed.width( ( theaudio.currenttime / theaudio.duration ) * 100 + '%' ); }); theaudio.addeventlistener( 'volumechange', function() { volumeadjuster.find( 'div' ).height( theaudio.volume * 100 + '%' ); if( theaudio.volume > 0 && theplayer.hasclass( cssclass.muted ) ) theplayer.removeclass( cssclass.muted ); if( theaudio.volume <= 0 && !theplayer.hasclass( cssclass.muted ) ) theplayer.addclass( cssclass.muted ); }); theaudio.addeventlistener( 'ended', function() { theplayer.removeclass( cssclass.playing ).addclass( cssclass.stopped ); }); thebar.on( estart, function( e ) { adjustcurrenttime( e ); thebar.on( emove, function( e ) { adjustcurrenttime( e ); } ); }) .on( ecancel, function() { thebar.unbind( emove ); }); volumebutton.on( 'click', function() { if( theplayer.hasclass( cssclass.muted ) ) { theplayer.removeclass( cssclass.muted ); theaudio.volume = volumedefault; } else { theplayer.addclass( cssclass.muted ); volumedefault = theaudio.volume; theaudio.volume = 0; } return false; }); volumeadjuster.on( estart, function( e ) { adjustvolume( e ); volumeadjuster.on( emove, function( e ) { adjustvolume( e ); } ); }) .on( ecancel, function() { volumeadjuster.unbind( emove ); }); } else theplayer.addclass( cssclass.mini ); theplayer.addclass( isautoplay ? cssclass.playing : cssclass.stopped ); theplayer.find( '.' + cssclass.playpause ).on( 'click', function() { if( theplayer.hasclass( cssclass.playing ) ) { $( this ).attr( 'title', params.strplay ).find( 'a' ).html( params.strplay ); theplayer.removeclass( cssclass.playing ).addclass( cssclass.stopped ); issupport ? theaudio.pause() : theaudio.stop(); } else { $( this ).attr( 'title', params.strpause ).find( 'a' ).html( params.strpause ); theplayer.addclass( cssclass.playing ).removeclass( cssclass.stopped ); issupport ? theaudio.play() : theaudio.play(); } return false; }); $this.replacewith( theplayer ); }); return this; }; })( jquery, window, document );