var IMAGECOUNT = 8;
var SHOWTIME = 5000;
var currentImage = 1;
var timerID = null;
var m_eLoading = null;
var m_eCurrent = null;
var eImage = null;
var playing = false;

function start() {
    timerID = window.setInterval('changeImage()', SHOWTIME);   
}

function stop() {
    window.clearInterval(timerID);
}

function changeImage() {
    currentImage = currentImage + 1;
    if (currentImage > IMAGECOUNT) currentImage = 1;
    
    var m_eTarget = $get('holder');    
    eImage = document.createElement('img');
    eImage.setAttribute('src', '../App_Themes/Default/Images/inspiration/Inspiration_0' + currentImage + '.jpg');
    $(eImage).setStyle({ position: 'absolute', left: '0px', top: '0px', opacity: '0' });
    m_eTarget.appendChild(eImage);
    if (!eImage.complete) {          
        /* The image is not yet loaded, so fix the loading div */
        m_eLoading = document.createElement('div');
        $(m_eLoading).setStyle({ position: 'absolute', left: '5px', bottom: '5px', color: '#FFF' });
        m_eLoading.appendChild(document.createTextNode(''));
        m_eTarget.appendChild(m_eLoading);
        Event.observe(eImage, 'load', _onLoad);
    } else {
    /* The image is already loaded*/    
        m_eLoading = null;
        _transImage(eImage);
    }
}

function _onLoad() {
    _transImage();
}

function _transImage() {
    if (m_eLoading != null) m_eLoading.remove();

    $(m_eCurrent).setStyle({ position: 'absolute', left: '0px', top: '0px', opacity: '0' });
    $(m_eCurrent).setStyle({ display: 'block', opacity: '1' });
    $(eImage).setStyle({ left: '-' + eImage.width + 'px', display: 'block', opacity: '1' });
    $(eImage).morph('left:0px', { duration: 1 });
    $(m_eCurrent).morph('left:' + eImage.width + 'px', { duration: 1, afterFinish: _removeImage });
    
    m_eCurrent = eImage;
}

function _removeImage(p_oObj) {
    p_oObj.element.remove();
}

function init() {
    for (i = $('holder').childNodes.length - 1; i >= 0; i--) {
        if ($('holder').childNodes[i].nodeName == 'IMG') {
            m_eCurrent = $('holder').childNodes[i];
            break;
        }
    }

    ImagePlay_Click();
}

function ImagePlay_Click() {    
    if (playing) {
        $get('ctl00_ContentPlaceHolder_Main_ImagePlay').src = '../App_Themes/Default/Images/shared/dotButton_arrowBig.png';
        stop();
    }
    else {
        $get('ctl00_ContentPlaceHolder_Main_ImagePlay').src = '../App_Themes/Default/Images/shared/dotButton_pauseBig.png';
        start();
    }

    playing = !playing;
}