//fill m_arrImg in 2 dimensions like m_arrImg[GroupId][ImageId]="image src"
var m_strPreviousImg = '/images/previous.png';
var m_strPreviousImgOver = '/images/previous.png';
var m_intPreviousImgHeight = 22;
var m_intPreviousImgWidth = 22;
var m_strNextImg = '/images/next.png';
var m_strNextImgOver = '/images/next.png';
var m_intNextImgHeight = 22;
var m_intNextImgWidth = 22;

var m_intStopFade = new Array();
var m_intCurrentFade = new Array();
var m_blnIE6 = (navigator.appVersion.indexOf('MSIE 6') > -1);

function ImageFade(p_objThis, p_intId) {
    m_intStopFade[p_intId] = false;
    m_intCurrentFade[p_intId] = false;
    if(m_arrImg[p_intId].length>1){
        //first img already exists
        var l_objImage = null;
        for(i=1;i<m_arrImg[p_intId].length;i++) {
            l_objImage=new Image()
            l_objImage.src=m_arrImg[p_intId][i]; 
            
            l_intOpacity=0;
            l_objImage.style.opacity=(l_intOpacity / 100);
            l_objImage.style.MozOpacity=(l_intOpacity / 100);
            l_objImage.style.KhtmlOpacity=(l_intOpacity / 100);
            l_objImage.style.filter="alpha(opacity=" + l_intOpacity + ")";
            l_objImage.style.position='absolute';
            l_objImage.style.zoom = '1';
            l_objImage.style.zIndex=-1;
            l_objImage.style.top='0px';
            l_objImage.style.left='0px';
            if(m_blnIE6) {
                l_objImage.style.display='none';
            }
            p_objThis.parentNode.appendChild(l_objImage);
        }
        m_intCurrentFade[p_intId] = p_objThis;
        
        var l_strPrev = 'FadePrevious' + p_intId;
        var l_strNext = 'FadeNext' + p_intId;
        var l_strStopFade = 'm_intStopFade['+p_intId+']=true;';
        var l_objHoverElement = document.createElement('div');
        l_objHoverElement.style.position='absolute';
        l_objHoverElement.style.zIndex=1000;
        l_objHoverElement.style.top='0px';
        l_objHoverElement.style.left='0px';
       
        l_objHoverElement.style.width=l_objImage.width+'px';
        l_objHoverElement.style.height=l_objImage.height+'px';
        l_objHoverElement.style.backgroundImage='url(/FakeIE6Img/)';
        l_objHoverElement.onmouseover = function(){eval(l_strStopFade);document.getElementById(l_strPrev).style.display='block';document.getElementById(l_strNext).style.display='block'};
        l_objHoverElement.onmouseout  = function(){document.getElementById(l_strPrev).style.display='none';document.getElementById(l_strNext).style.display='none'};
        p_objThis.parentNode.appendChild(l_objHoverElement);
        
        var l_objElement = document.createElement('div');
        l_objElement.style.position='absolute';
        if(l_objImage.height>500) {
            l_objElement.style.bottom='13px';
        } else {
            l_objElement.style.top=((l_objImage.height/2)-20) + 'px';
        }
        l_objElement.style.left='13px';
        l_objElement.style.width=m_intPreviousImgWidth+'px';
        l_objElement.style.height=m_intPreviousImgHeight+'px';
        l_objElement.style.zIndex=5;
        l_objElement.style.display='none';
        l_objElement.style.cursor='pointer';
        l_objElement.id=l_strPrev;
        l_objElement.style.backgroundImage='url(' + m_strPreviousImg +')';
        l_objElement.onmouseover = function(){document.getElementById(l_strPrev).style.backgroundImage='url(' + m_strPreviousImgOver + ')'};
        l_objElement.onmouseout = function(){document.getElementById(l_strPrev).style.backgroundImage='url(' + m_strPreviousImg + ')'};
        l_objElement.onclick = function(){PreviousFadeImage(p_intId)};
        l_objHoverElement.appendChild(l_objElement);
        
        l_objElement = document.createElement('div');
        l_objElement.style.position='absolute';
        if(l_objImage.height>500) {
            l_objElement.style.bottom='13px';
        } else {
            l_objElement.style.top=((l_objImage.height/2)-20) + 'px';
        }
        l_objElement.style.right='13px';
        l_objElement.style.width=m_intNextImgWidth+'px';;
        l_objElement.style.height=m_intNextImgHeight+'px';;
        l_objElement.style.zIndex =5;
        l_objElement.style.display='none';
        l_objElement.style.cursor='pointer';
        l_objElement.id=l_strNext;
        l_objElement.onmouseover = function(){document.getElementById(l_strNext).style.backgroundImage='url(' + m_strNextImgOver + ')'};
        l_objElement.onmouseout = function(){document.getElementById(l_strNext).style.backgroundImage='url(' + m_strNextImg + ')'};
        l_objElement.onclick = function(){NextFadeImage(p_intId)};
        l_objElement.style.backgroundImage='url(' + m_strNextImg +')';
        l_objHoverElement.appendChild(l_objElement);
        
        setTimeout(
            function() {
                FadingImage(
                    p_objThis,
                    p_intId,
                    p_objThis.nextSibling,
                    l_intOpacity
                )
            }, 10000
        );
    }
}

function PreviousFadeImage(p_intId) {
    if(m_intCurrentFade[p_intId].previousSibling) {
        m_intCurrentFade[p_intId].style.zIndex = 0;
        m_intCurrentFade[p_intId].style.opacity = (0 / 100);
        m_intCurrentFade[p_intId].style.MozOpacity = (0 / 100);
        m_intCurrentFade[p_intId].style.KhtmlOpacity = (0 / 100);
        m_intCurrentFade[p_intId].style.filter = "alpha(opacity=" + 0+ ") !important";
        if(m_blnIE6) {
            m_intCurrentFade[p_intId].style.display='none';
        }
        m_intCurrentFade[p_intId].previousSibling.style.zIndex = 1;
        m_intCurrentFade[p_intId] = m_intCurrentFade[p_intId].previousSibling;
        
    }
}

function NextFadeImage(p_intId){
    if(m_intCurrentFade[p_intId].nextSibling && m_intCurrentFade[p_intId].nextSibling.tagName=='IMG') {
        m_intCurrentFade[p_intId].nextSibling.style.zIndex = 1;
        m_intCurrentFade[p_intId].nextSibling.style.opacity = (100 / 100);
        m_intCurrentFade[p_intId].nextSibling.style.MozOpacity = (100 / 100);
        m_intCurrentFade[p_intId].nextSibling.style.KhtmlOpacity = (100 / 100);
        m_intCurrentFade[p_intId].nextSibling.style.filter = "alpha(opacity=" + 100+ ") !important";
        if(m_blnIE6) {
            m_intCurrentFade[p_intId].nextSibling.style.display='block';
        }
        m_intCurrentFade[p_intId] = m_intCurrentFade[p_intId].nextSibling;
    } else {
        m_intCurrentFade[p_intId].style.zIndex = 1;
        m_intCurrentFade[p_intId].style.opacity = (100 / 100);
        m_intCurrentFade[p_intId].style.MozOpacity = (100 / 100);
        m_intCurrentFade[p_intId].style.KhtmlOpacity = (100 / 100);
        m_intCurrentFade[p_intId].style.filter = "alpha(opacity=" + 100+ ") !important";
        if(m_blnIE6) {
            m_intCurrentFade[p_intId].style.display='block';
        }
    }
}

function FadingImage(p_objThis, p_intId, p_intCurrentFade, p_intOpacity){ 
    m_intCurrentFade[p_intId] = p_intCurrentFade;
    if(p_intOpacity<=100) {
        //fade img
        if(!(m_intStopFade[p_intId] && p_intOpacity==0)){
            p_intCurrentFade.style.zIndex = 1;
            p_intCurrentFade.style.opacity = (p_intOpacity / 100);
            p_intCurrentFade.style.MozOpacity = (p_intOpacity / 100);
            p_intCurrentFade.style.KhtmlOpacity = (p_intOpacity / 100);
            p_intCurrentFade.style.filter = "alpha(opacity=" + p_intOpacity + ")";
            if(m_blnIE6) {
                p_intCurrentFade.style.display='block';
            }
            setTimeout(
                function() {
                    FadingImage(
                        p_objThis,
                        p_intId,
                        p_intCurrentFade,
                        (p_intOpacity+5)
                    )
                }, 10
            );
        }
    } else {
        if(!m_intStopFade[p_intId]){
            //next img
            if(p_intCurrentFade.nextSibling && p_intCurrentFade.nextSibling.tagName=='IMG') {
                setTimeout(
                    function() {
                        FadingImage(
                            p_objThis,
                            p_intId,
                            p_intCurrentFade.nextSibling,
                            0
                        )
                    }, 10000 
                );
            } else {
                //no img left, reset all execept first 
                var l_arrAllImg = p_objThis.parentNode.getElementsByTagName('img');
                for(i=1;i<l_arrAllImg.length-1;i++) {
                    l_intOpacity = 0;
                    l_arrAllImg[i].style.zIndex = -1;
                    l_arrAllImg[i].style.opacity = (l_intOpacity / 100);
                    l_arrAllImg[i].style.MozOpacity = (l_intOpacity / 100);
                    l_arrAllImg[i].style.KhtmlOpacity = (l_intOpacity / 100);
                    l_arrAllImg[i].style.filter = "alpha(opacity=" + l_intOpacity + ")";
                    if(m_blnIE6) {
                        l_arrAllImg[i].style.display='none';
                    }
                }
                setTimeout(
                    function() {
                        ResetFade(
                            p_objThis,
                            p_intId,
                            p_intCurrentFade,
                            100
                        )
                    }, 10000
                );                              
            }
        }
    } 
}

function ResetFade(p_objThis, p_intId, p_intCurrentFade, p_intOpacity) {
    m_intCurrentFade[p_intId] = p_objThis.parentNode.childNodes[1];
    if(p_intOpacity>=0) {
        //fade img
        p_intCurrentFade.style.zIndex = 1;
        p_intCurrentFade.style.opacity = (p_intOpacity / 100);
        p_intCurrentFade.style.MozOpacity = (p_intOpacity / 100);
        p_intCurrentFade.style.KhtmlOpacity = (p_intOpacity / 100);
        p_intCurrentFade.style.filter = "alpha(opacity=" + p_intOpacity + ")";
        setTimeout(
            function() {
                ResetFade(
                    p_objThis,
                    p_intId,
                    p_intCurrentFade,
                    (p_intOpacity-5)
                )
            }, 10
        );
    } else {
        p_intCurrentFade.style.zIndex = -1;
        if(!m_intStopFade[p_intId]){
            //start again
            setTimeout(
                function() {
                    FadingImage(
                        p_objThis,
                        p_intId,
                        p_objThis.parentNode.childNodes[1],
                        0
                    )
                }, 10000
            );
        }
    }
}