var BrowserDetect = {
        init: function () {
            this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
            this.version = this.searchVersion(navigator.userAgent)
                || this.searchVersion(navigator.appVersion)
                || "an unknown version";
            this.OS = this.searchString(this.dataOS) || "an unknown OS";
        },
        searchString: function (data) {
            for (var i=0;i<data.length;i++)	{
                var dataString = data[i].string;
                var dataProp = data[i].prop;
                this.versionSearchString = data[i].versionSearch || data[i].identity;
                if (dataString) {
                    if (dataString.indexOf(data[i].subString) != -1)
                        return data[i].identity;
                }
                else if (dataProp)
                    return data[i].identity;
            }
        },
        searchVersion: function (dataString) {
            var index = dataString.indexOf(this.versionSearchString);
            if (index == -1) return;
            return parseFloat(dataString.substring(index+this.versionSearchString.length+1));
        },
        dataBrowser: [
            {
                string: navigator.userAgent,
                subString: "Chrome",
                identity: "Chrome"
            },
            { 	string: navigator.userAgent,
                subString: "OmniWeb",
                versionSearch: "OmniWeb/",
                identity: "OmniWeb"
            },
            {
                string: navigator.vendor,
                subString: "Apple",
                identity: "Safari",
                versionSearch: "Version"
            },
            {
                prop: window.opera,
                identity: "Opera"
            },
            {
                string: navigator.vendor,
                subString: "iCab",
                identity: "iCab"
            },
            {
                string: navigator.vendor,
                subString: "KDE",
                identity: "Konqueror"
            },
            {
                string: navigator.userAgent,
                subString: "Firefox",
                identity: "Firefox"
            },
            {
                string: navigator.vendor,
                subString: "Camino",
                identity: "Camino"
            },
            {		// for newer Netscapes (6+)
                string: navigator.userAgent,
                subString: "Netscape",
                identity: "Netscape"
            },
            {
                string: navigator.userAgent,
                subString: "MSIE",
                identity: "Explorer",
                versionSearch: "MSIE"
            },
            {
                string: navigator.userAgent,
                subString: "Gecko",
                identity: "Mozilla",
                versionSearch: "rv"
            },
            { 		// for older Netscapes (4-)
                string: navigator.userAgent,
                subString: "Mozilla",
                identity: "Netscape",
                versionSearch: "Mozilla"
            }
        ],
        dataOS : [
            {
                string: navigator.platform,
                subString: "Win",
                identity: "Windows"
            },
            {
                string: navigator.platform,
                subString: "Mac",
                identity: "Mac"
            },
            {
                   string: navigator.userAgent,
                   subString: "iPhone",
                   identity: "iPhone/iPod"
            },
            {
                string: navigator.platform,
                subString: "Linux",
                identity: "Linux"
            }
        ]
    
    };
    BrowserDetect.init();
    
        var playlist = [
			{
                mp3 : "/Music/Stars.mp3",
                ogg : "/Music/Stars.ogg",
                title : "Shout by Telescope"
            },			
            {
                mp3 : "/Music/Hollywood.mp3",
                ogg : "/Music/Hollywood.ogg",
                title : "Hollywood by Telescope"
            },
            {
                mp3 : "/Music/Shine.mp3",
                ogg : "/Music/Shine.ogg",
                title : "Shine by Telescope"
            },
            {
                mp3 : "/Music/Bright Eyes.mp3",
                ogg : "/Music/Bright Eyes.ogg",
                title : "Bright Eyes by Telescope"
            },			
            {
                mp3 : "/Music/Falling For You.mp3",
                ogg : "/Music/Falling For You.ogg",
                title : "Falling For You by Telescope"
            },
            {
                mp3 : "/Music/Stormy Weather.mp3",
                ogg : "/Music/Stormy Weather.ogg",
                title : "Stormy Weather by Telescope"
            },
        ];
    
        $(document).ready(function() {
                                   
            $('#jukebox .info').html(playlist[0].title);					   
        
            var aud = $('#jukebox .aud').get(0);
            aud.pos = -1;
                    
            $('#jukebox .play').bind('click', function(evt) {
                if (aud.pos < 0) {
                    aud.pause();
					aud.pos++;
					if (aud.pos == playlist.length) aud.pos = 0;
					if (BrowserDetect.browser == "Firefox") aud.setAttribute('src', playlist[aud.pos].ogg);
					else aud.setAttribute('src', playlist[aud.pos].mp3);
								$('#jukebox .info').html(playlist[aud.pos].title);
					aud.load();
					aud.play();
                } else {
                    aud.play();
                }
            });
                        
            $('#jukebox .pause').bind('click', function(evt) {
                aud.pause();
            });
            
            $('#jukebox .next').bind('click', function(evt) {
                aud.pause();
                aud.pos++;
                if (aud.pos == playlist.length) aud.pos = 0;
                if (BrowserDetect.browser == "Firefox") aud.setAttribute('src', playlist[aud.pos].ogg);
                else aud.setAttribute('src', playlist[aud.pos].mp3);
                            $('#jukebox .info').html(playlist[aud.pos].title);
                aud.load();
                aud.play();
            });
            
            $('#jukebox .prev').bind('click', function(evt) {
                aud.pause();
                aud.pos--;
                if (aud.pos < 0) aud.pos = playlist.length - 1;
                if (BrowserDetect.browser == "Firefox") aud.setAttribute('src', playlist[aud.pos].ogg);
                else aud.setAttribute('src', playlist[aud.pos].mp3);
                            $('#jukebox .info').html(playlist[aud.pos].title);
                aud.load();
                aud.play();
            });
            
            aud.addEventListener('progress', function(evt) {
                var width = parseInt($('#jukebox').css('width'));
                var percentLoaded = Math.round(evt.loaded / evt.total * 100);
                var barWidth = Math.ceil(percentLoaded * (width / 100));
                $('#jukebox .load-progress').css( 'width', barWidth );
                
            });
                            
            aud.addEventListener('timeupdate', function(evt) {
                var width = parseInt($('#jukebox').css('width'));
                var percentPlayed = Math.round(aud.currentTime / aud.duration * 100);
                var barWidth = Math.ceil(percentPlayed * (width / 100));
                $('#jukebox .play-progress').css( 'width', barWidth);
            });
            
            aud.addEventListener('canplay', function(evt) {
                $('#jukebox .play').trigger('click');
            });
            
            aud.addEventListener('ended', function(evt) {
                $('#jukebox .next').trigger('click');
            });
			
        
        });