///////////////////////////////////////////////////////////////////////////////////////////////////
// File: carousel.js
// Creator: Monjay Settro, Devbleue Inc.
// Purpose: library to implement carousel feature.
// Copyright (c) 2010, Devbleue Inc. All rights reserved.
///////////////////////////////////////////////////////////////////////////////////////////////////

var maxIndex = 0,
    count = 0,
    timer = null,
    length = 5000;
    lastN = null;

function populateCarousel () {
    var sourceUrl = ('carousel.html?' + new Date).replace(/ /g, '+');
    $.ajax({
         url: sourceUrl
        ,context: document.body
        ,success: function(data) {
            var start = data.indexOf('<table');
            var end = data.indexOf('</table>') + 8;
            var data = data.substr(data.indexOf('<table'), end - start);
                data = data.replace(/(\n|\r)/g, '');
    
            var td = 1;
            var increment = true;
            var feature = 1;
            var debugString = '';

            var field = '';
            var model = '<li><a href="[link]" style="display:block;width:575px;height:292px;border-right:2px solid #fff;overflow:hidden;"><img style="visibility:visible;" src="[image]" title="[title]" longdesc="[desc]" /></a></li>';
            var workingModel = '';
            var html = '<ul>';
    
            data.replace(/<[Tt][Dd]\b[^>]*>(.*?)<\/[Tt][Dd]>/g, function(m, value) { 
                    if (td == 1)
                    {
                        field = 'image';
                        increment = true;
                        workingModel = model;

                        var valueTemp = null;
                        value.replace(/src="(.*?)"/, function(n, url) { valueTemp = url; })
                        if (valueTemp)
                            value = valueTemp;
                    }
                    else if (td == 2)
                    {
                        field = 'title';
                        increment = true;
                    }
                    else if (td == 3)
                    {
                        field = 'desc';
                        increment = true;
                        value = value.replace(/<br\b\/>/g, '[br]');
                        value = value.replace(/<[Pp]\b[^>]*>/g, '[br][br]').replace(/<\/[Pp]>/g, '').replace(/"/g, "'");
                        value = value.replace(/^\[br\]\[br\]/g, '');
                        value = value.replace(/  +\[br\]/g, '[br]');
                        value = value.replace(/\[br\]  +/g, '[br]');
                        value = value.replace(/\[br\]\[br\]/g, '[br]');
                    }
                    else if (td == 4)
                    {
                        field = 'link';
                        increment = false;
                        var valueTemp = null;
                        value.replace(/href="(.*?)"/, function(n, url) { valueTemp = url; })
                        if (valueTemp)
                            value = valueTemp;
                    }
    
                    //////////////////
    
                    workingModel = workingModel.replace('[' + field + ']', value);

                    if (td == 4)
                    {
                        html = html + workingModel;
                    }

                    //////////////////
    
                    if (increment)
                    {
                        td = td + 1;
                    }
                    else
                    {
                        td = 1;
                        feature = feature + 1;
                    }
            }) /* data.replace */

            html = html + '<li id="featureCoverAreaLi">'
                        + '<div id="featureCoverArea">'
                        + '<div id="featureCoverContent">'
                        + '<a id="featureTitle" href=""></a>'
                        + '<a id="featureBody" href=""></a>'
                        + '</div>'
                        + '</div>'
                        + '</li>'
                        + '<li id="featureNavLi">'
                        + '<div id="featureNav"></div>'
                        + '</li>'
                        ;

            html = html + '</ul>';

            $('#carousel').html(html);
            startFeaturesAnimation();
        }
        ,error: function (err) {
            alert(err)
        }
    });
} /* populateCarousel() */
function startFeaturesAnimation() {
    clearTimer();
    drawNav();
    hideAll();
    showNext(0);

    $('#featureCoverArea').css('opacity', 0.70);
    $('#featureCoverArea').css('display', 'block');
    $('#featureCoverAreaLi').css('display', 'block'); // makes Nav visible
    $('#featureNavLi').css('display', 'block');

} /* startFeaturesAnimation() */
function clearTimer() {
    if (timer) {
        clearTimeout(timer);
        timer = null;    
    }
}
function drawNav() {
    var featureNavHTML = '';
    $('ul li img').each(function (i, e) { 
    var link = '<a id="featureNavLink[I]" class="" href="#" onclick="javascript: clearTimeout(timer); timer=null; hide(lastN); show([I]); next([I],[N]); return false;">[N]</a> ';
        link = link.replace(/\[I\]/g, i).replace(/\[N\]/g, i+1).replace(/\[url\]/, e.parentNode);
        featureNavHTML = featureNavHTML + link;
    })
    $('#featureNav').html(featureNavHTML);
}
function hideAll(exceptN) {
    $('ul li img').each( function (i,e) {
        var hide = true;
        if (exceptN != null && i == exceptN) hide = false;
        if (hide) {
            jQuery(e).css('display', 'none');
        }
        else {
            jQuery(e).css('display', 'block');
        }
        maxIndex = i;
        count = i+1;
    })
}
function hide(indexN) {
    if (indexN) {
        $('ul li img').each(function (i,e) { 
            if (i == indexN) {
                jQuery(e).fadeOut('slow');
            }
        })
    }
}
function showNext(currentN) {
    clearTimer();
    show(currentN);
    next(currentN, currentN+1);
}
function show(indexN) {
    $('ul li img').each(function (i,e) { 
        if (i == indexN) {
            lastN = indexN;
            var o = jQuery(e);

            $('#featureTitle').html(o.attr('title'));
            $('#featureTitle').attr('href', e.parentNode);
            $('#featureBody').html(o.attr('longdesc').replace(/\[br\]/g, '<br/>'));
            $('#featureBody').attr('href', e.parentNode);

            o.fadeIn('slow');

            $('#featureNav a').each(function (ii, ee) { /* highligh the feature nav item */
                jQuery(ee).removeClass('On');
                if (ii == i)
                    jQuery(ee).addClass('On');
            });
        }
    })
}
function next(currentN, nextN) {
    if (nextN > maxIndex)
    {
        timer = setTimeout(function() { show(0); hide(currentN); next(0, 1); }, length);
    }
    else
    {
        timer = setTimeout(function() { show(nextN); hide(currentN); next(nextN, nextN+1); }, length);
    }
}


$(document).ready(function () { populateCarousel(); });
$('#featureArea').resize(function () { startFeaturesAnimation(); });












