﻿/*
SlideShow.

Description
~~~~~~~~~~~

How to use
~~~~~~~~~~
Example:
--------
Place this code in ASPX/HTML file.
In case of HTML :
    - Remove the line : var oHdnTotalImages = document.getElementById('<%=hdnTotalImages.ClientID %>');
    - Use the static value instead of oHdnTotalImages.value
-------------------------------
<script type="text/javascript" language="javascript">
    var oHdnTotalImages = document.getElementById('<%=hdnTotalImages.ClientID %>');
    startSlideShow('divBigImageSlideShow','divBigImageSlideShowABS','divBigImageSlideShow_',parseInt(oHdnTotalImages.value));
</script>
-------------------------------

Author
~~~~~~
RaviK S

Created Date
~~~~~~~~~~~~~
14/11/2010

** PLEASE DO NOT EDIT BELOW THIS LINE **/

function getE(elem){
    return document.getElementById(elem);
}
function startSlideShow(elemId, elemIdABS, elemIdPrefix, count,elemIdTitle, elemIdTitlePrefix, startIndex, delay, fromOpacity, toOpacity, time, fps){  
    var oSlideShow = new Object();
    oSlideShow.elemId = elemId;
    oSlideShow.elemIdABS = elemIdABS;
    oSlideShow.elemIdPrefix = elemIdPrefix;
    oSlideShow.count = count;
    oSlideShow.elemIdTitle = typeof(elemIdTitle) != 'undefined' ? elemIdTitle : '';
    oSlideShow.elemIdTitlePrefix = typeof(elemIdTitlePrefix) != 'undefined' ? elemIdTitlePrefix : '';
    oSlideShow.startIndex = typeof(startIndex) != 'undefined' ? startIndex : 0;
    oSlideShow.delay = typeof(delay) != 'undefined' ? delay : 6500;//6.5 seconds
    oSlideShow.fromOpacity = typeof(fromOpacity) != 'undefined' ? fromOpacity : 100;
    oSlideShow.toOpacity = typeof(toOpacity) != 'undefined' ? toOpacity : 0;
    oSlideShow.time = typeof(time) != 'undefined' ? time : 500;
    oSlideShow.fps = typeof(fps) != 'undefined' ? fps : 10;

    if(count >= 1){
        if(oSlideShow.startIndex >= oSlideShow.count)
            oSlideShow.startIndex = oSlideShow.count -1;
            
        if((getE(oSlideShow.elemId) != null) && (getE(oSlideShow.elemIdPrefix + oSlideShow.startIndex) != null)) 
            getE(oSlideShow.elemId).innerHTML = getE(oSlideShow.elemIdPrefix + oSlideShow.startIndex).innerHTML;
            
        if((getE(oSlideShow.elemIdTitle) != null) && (getE(oSlideShow.elemIdTitlePrefix + oSlideShow.startIndex) != null))  
            getE(oSlideShow.elemIdTitle).innerHTML = getE(oSlideShow.elemIdTitlePrefix + oSlideShow.startIndex).innerHTML;        
        
        var step = 0;//count ==1
        if(oSlideShow.count > 1){
            startIndexABS = oSlideShow.startIndex + 1;
            step = oSlideShow.startIndex + 1;
            
            getE(elemIdABS).innerHTML = getE(oSlideShow.elemIdPrefix + startIndexABS).innerHTML;
            getE(elemId).style.opacity = 1.0;
            
            //slideImages(elemId, elemIdABS, elemIdPrefix, count, delay, fromOpacity, toOpacity, time, fps, step);
            /////////delayed sometime (make the 1st image still for some time) b4 calling slideImages 
            setTimeout(function(){slideImages(oSlideShow,step)},oSlideShow.delay); 
        }    
    }
}
///////////

function slideImages(oSlideShow, step){
    if(oSlideShow.count > 0){
        FadeOpacity_DownThenUp(oSlideShow,step);
        //alert(step + ':' + count);
        if(step < (oSlideShow.count-1))
            step++;
        else
            step = 0;
            
        setTimeout(function(){slideImages(oSlideShow,step)},oSlideShow.delay); 
    }
}   
    
//////////////
function FadeOpacity_DownThenUp(oSlideShow, stepImageNum){
    var steps = Math.ceil(oSlideShow.fps * (oSlideShow.time / 1000));
    var delta = (oSlideShow.toOpacity - oSlideShow.fromOpacity) / steps;
	
    FadeOpacityStep_DownThenUp(oSlideShow, 0, steps, delta, (oSlideShow.time / steps), stepImageNum);
}

function FadeOpacityStep_DownThenUp(oSlideShow, stepNum, steps, delta, timePerStep, stepImageNum){
    //alert(Math.round(parseInt(fromOpacity) + (delta * stepNum))/100 + "::" + getE(elemId).style.opacity);
    var oGap = Math.round(parseInt(oSlideShow.fromOpacity) + (delta * stepNum)/100) - getE(oSlideShow.elemId).style.opacity;
    
    ////////////////////////////////////////
    //alert(oGap);
    var opacityAsInt = Math.round(parseInt(oSlideShow.fromOpacity) + (delta * stepNum));
    if (opacityAsInt > 100)
	    opacityAsInt = 100;
    
    var elemABS = getE(oSlideShow.elemIdABS);
    var opacityAsIntABS = 0;
    if(opacityAsInt == 100){
        elemABS.innerHTML= getE(oSlideShow.elemIdPrefix + stepImageNum).innerHTML;
    }
    else{
        var opacityAsDoubleABS = parseFloat(getE(oSlideShow.elemIdABS).style.opacity);
        opacityAsDoubleABS += oGap;
        opacityAsIntABS = parseFloat(opacityAsDoubleABS) * 100;
    }
    SetOpacity(getE(oSlideShow.elemIdABS), opacityAsIntABS, 1);//up
    ////////////////////////////////////////
    
    SetOpacity(getE(oSlideShow.elemId), opacityAsInt, 0);//down
    
    if (stepNum < steps){
        ////call it (self) again and again and sets opacity from 100 to 0
        setTimeout(function(){FadeOpacityStep_DownThenUp(oSlideShow,stepNum+1,steps,delta,timePerStep,stepImageNum)},timePerStep); 
    }
    else{
        //alert(getE(elemId).style.opacity + "::/n" + getE(elemId).style.filter)
        //alert(getE(elemIdABS).style.opacity + "::/n" + getE(elemIdABS).style.filter)
        getE(oSlideShow.elemId).innerHTML = getE(oSlideShow.elemIdPrefix + stepImageNum).innerHTML;
        //FadeOpacity(elemId,30,100,1000,20);////sets opacity from 0 to 100
        
        if(getE(oSlideShow.elemIdTitle) != null){
            if(getE(oSlideShow.elemIdTitlePrefix + stepImageNum) != null)        
                getE(oSlideShow.elemIdTitle).innerHTML= getE(oSlideShow.elemIdTitlePrefix + stepImageNum).innerHTML;
        }
    }
}
/////////////
function FadeOpacity(elemId, fromOpacity, toOpacity, time, fps){
    var steps = Math.ceil(fps * (time / 1000));
    var delta = (toOpacity - fromOpacity) / steps;
    //alert(steps + '::' + delta);
    FadeOpacityStep(elemId, 0, steps, fromOpacity, delta, (time / steps));
}

function FadeOpacityStep(elemId, stepNum, steps, fromOpacity, delta, timePerStep){
    SetOpacity(getE(elemId), Math.round(parseInt(fromOpacity) + (delta * stepNum)), 1);//up

    if (stepNum < steps){
        setTimeout(function(){FadeOpacityStep(elemId,(stepNum+1),steps,fromOpacity,delta,timePerStep)},timePerStep); 
    }
}
///////////////
function SetOpacity(elem, opacityAsInt, downOrUp){//0->down//1->up
    var opacityAsDecimal = opacityAsInt;
	
    if (opacityAsInt > 100)
	    opacityAsInt = opacityAsDecimal = 100;
	//else if (opacityAsInt < 30)
	//    opacityAsInt = opacityAsDecimal = 30; 
	    
    opacityAsDecimal /= 100;
    	        
    //if (opacityAsInt < 1)
	//    opacityAsInt = 1; // IE7 bug, text smoothing cuts out if 0
	    
	//alert(opacityAsDecimal + '::' + opacityAsInt);
    elem.style.opacity = opacityAsDecimal;
    elem.style.filter  = "alpha(opacity=" + opacityAsInt + ")";
    //alert(elem.style.opacity);
}

/** End of File **/
