/**
 * Created by IntelliJ IDEA.
 * User: kamal
 * Date: Sep 8, 2010
 * Time: 4:49:18 PM
 * To change this template use File | Settings | File Templates.
 */




//alert('yo! html5.js has been called!');


  function dynamicTheme(height, width, borderWidth, borderStyle, borderColor) {
		//box-shadow: 10px 10px 5px #888;
		// z-Index:100;  
		//var borderStyle = 'solid';
		//var	borderWidth = '15';

		$('#themeWrapper').css("height", height+'px').css("background-size", '100%').css("background-repeat", 'no-repeat');
    	var tc = Math.round($('#themeWrapper').height() / 2);
		var newTopMargin  =   tc - borderWidth - Math.round($('#html5ThemeImage').height() / 2);
		
		$('#html5ThemeImage')
		.css("margin-top", newTopMargin)
		.css("border-style", borderStyle)
		.css("border-color", borderColor)
		.css("border-width", borderWidth + 'px')
		.css("box-shadow", '10px 10px 5px rgba(0,0,0,0.5)')
		.css("z-Index", 100)
		.css("visibility", 'visible');	
				
			
	}	 
      
   function resetThemeToDefault()     {
   
   	$('#html5Image')
		.css("margin-top", 0)
		.css("border", 'none')
		.css("width", '100%')
		.css("height", '100%')
		.css("box-shadow", 'none')
		.css("z-Index", 100)
		.css("visibility", 'visible');	
		
   
   $('#themeWrapper').css("height", 'auto').css("background", 'transparent');
   
   }
      
        
function scaleImage(maxW, maxH) {

    if ($('#html5ThemeImage')) {
        var currH = $('#html5ThemeImage').height();
        var currW = $('#html5ThemeImage').width();
        var ratio = currH / currW;
        //alert ("currH:"+currH+", currW:"+currW);
        if (currW >= maxW && ratio <= 1) {
            currW = maxW;
            currH = currW * ratio;
        } else if (currH >= maxH) {
            currH = maxH;
            currW = currH / ratio;
        }

        if ((currH != 0) && (currW != 0)) {
            $('#html5ThemeImage').css("height", currH);
            $('#html5ThemeImage').css("width", currW);
        }
        $('#html5ThemeImage').show();
    } 
}

















function positionPlayButtonOverlay(maxH, maxW) {
  		// note: forHeight class added to what we want to measure
		// if themed , use the themeWrapper to measure the the height, otherwise use the html5Image
			
		if ($('#html5ThemeImage').length > 0) { 
		var conditionalMidpoint = $('#themeWrapper').height();
		} else {
		var conditionalMidpoint = $('#html5Image').height();
		}	
        var widthMidpoint = (maxW/ 2);
   		var heightMidpoint = (conditionalMidpoint / 2); //alert(maxH);
   		
		var playButtonTopOffset  =  heightMidpoint -  Math.round($('#bttnPlayFb').height() / 2);
        var playButtonLeftOffset  =  widthMidpoint -  Math.round($('#bttnPlayFb').width() / 2);
		$('#bttnPlayFb').css("top", playButtonTopOffset ).css("left", playButtonLeftOffset).css("visibility", 'visible');
		       
}















    var audio_duration;
    var audio_player;
    var volume_button;
    var volume_control;
    var playing = false;
    
    
    
    
    function pageLoaded()
    {	
	    scrubAudio();
        //scaleImage(500, 500);
        if ($('#newHTMLPlayer')) {
            $('#newHTMLPlayer').show();
        }
    }
    
    function set_volume(new_volume)
    {
        audio_player.volume = new_volume;
        //update_volume_bar();
        volume_button.value = "Volume: "+parseInt(new_volume*100);

    }
    function update_volume_bar()
    {

        new_top = volume_button.offsetHeight  - volume_control.offsetHeight;
        volume_bar.css('top', new_top+"px");
        volume = audio_player.volume;
        //change the size of the volume  bar
        wrapper = document.getElementById("volume_background");
        wrapper_height = wrapper.offsetHeight;
        wrapper_top = wrapper.offsetTop;
        new_height= wrapper_height*volume;
        volume_bar = document.getElementById("volume_bar");
        volume_bar.css('height', new_height+"px");
        new_top =  wrapper_top + (  wrapper_height - new_height  );
        volume_bar.css('top', new_top+"px");
    }

    function timeUpdate()
    {
        //get the duration of the player
        audio_player = getAudioPlayer()
        dur = audio_player.duration;
        time = audio_player.currentTime;
        setProgressBar(time, dur);
    }

    function setProgressBar(time, dur) {
        var fraction = time/dur;
        var percent = (fraction*100);
        var wrapper = document.getElementById("duration_background");
        var new_width = wrapper.offsetWidth*fraction;
        document.getElementById("duration_bar").style.width=new_width+"px";	

    }


     function getAudioPlayer() {
         if (document.getElementById('aplayer')) {
             return document.getElementById('aplayer');
         } else {
             if (navigator.appName.indexOf("Microsoft") != -1) {
                  return window['flash_audio_player'];
              } else {
                  return document['flash_audio_player_ff'];
              }
         }
     }

    function trackEnded()
    {
        //reset the playControl to 'play'
        stopAudio();


    }

function playAudio() {
    getAudioPlayer().play();
    setPlayState();
}

function stopAudio() {
    getAudioPlayer().pause();
    setPauseState();
}

function setPlayState() {
    $('#pauseButton').show();
    $('#playButton').hide();
    $("#bttnPlayFb").hide();
    playing=true;
}

function setPauseState() {
    $('#playButton').show();
    $('#pauseButton').hide();
    $('#bttnPlayFb').show();
    playing=false;

}




    function volumeClicked(event)
    {
        control = document.getElementById('volume_control');

        if(control.style.display=="block")
        {
            control.style.display="None";
        }else{
            control.style.display="Block";
            update_volume_bar();
        }
    }

    function volumeChangeClicked(event)
    {
        //get the position of the event
        clientY = event.clientY;
        offset =  event.currentTarget.offsetTop + event.currentTarget.offsetHeight  - clientY;
        volume = offset/event.currentTarget.offsetHeight;
        set_volume(volume);
        update_volume_bar();
    }

    function durationClicked(event)
    {
        //get the position of the event
		clientX = event.clientX;  						
        //left = event.currentTarget.offsetLeft;				//the default was giving me 0
        left = document.getElementById("wrap").offsetLeft;		//but this got me the value... stupid.
        clickoffset = clientX - left;
        percent = clickoffset/event.currentTarget.offsetWidth;
        duration_seek = percent*audio_duration;
        document.getElementById("aplayer").currentTime=duration_seek;  
    }



    function scrubAudio()
    {
  

		$('#duration_background').bind('click',function(event) {     
			var offset = $("#duration_background").offset(); 
			// this broken on the iPad - safari
			clientX = event.clientX; 														//clientX is where I click the screen,  the event is the click!
			left = event.currentTarget.offsetLeft; 											//left is always 0 for some reason
			clickoffset = clientX - left - offset.left;										// clickoffset is where it lands on the duration bar!
			percent = clickoffset/event.currentTarget.offsetWidth;
			duration_seek = percent*audio_duration;
			document.getElementById("aplayer").currentTime=duration_seek; 

		});

  }