// Feature feature animator

var features = $('.feature');
var ctrls = $('.ad-ctrl li');
var tval = 5000; // time between moves
var sval = 5000; // start time

// load large background images for features

var bg = [];
bg[0] = 'images/ads/scanner_datalogic_quickscan_laser.jpg';
bg[1] = 'images/ads/scanner_symbol_LS4278_wireless.jpg';
bg[2] = 'images/ads/scanner.jpg';
bg[3] = 'images/ads/scanner_code_cr2500.jpg';
bg[4] = 'images/ads/scanner_datalogic_magella1100_retail.jpg';
bg[5] = 'images/ads/scanner_honeywell_6300_direct_part_marking.jpg';
bg[6] = 'images/ads/scanner_datalogic_quickscan_mobile.jpg';
bg[7] = 'images/ads/symbol_barcode_scanner_min-slot.jpg';
bg[8] = 'images/ads/barcodescannerstore.jpg';
$(features).each(function() {
    $(this).css('backgroundImage', 'url(' + bg[$(this).parent().children().index(this) - 1] + ')');
}); 

// Set initial delay and set random start position

var numfeatures = features.length - 1;
var p = 0 // for randow do Math.floor(numfeatures * Math.random());
$(ctrls).hide();
$('.benefits').hide();
startInterval = setInterval("startFeatures()", (sval));

// mouse actions

$(ctrls).click(function() {
    if (!$(this).is(".active")) {
        clearInterval(featureInterval);
        resetCtrls();
        $(ctrls).removeClass('active');
        $(this).addClass('active');
        pbutton = $(this).attr('id');
        p = parseInt(pbutton.slice(1));
        $(this).css({ backgroundPosition: (-34 * p) + 'px -34px' });
        $(features).css('left', '685px');
        $(features.get(p)).animate({ left: 0 + 'px' }, 400);
    }
});

function startFeatures() {
    $('.main-msg').fadeOut('fast');
    resetCtrls();
    $(ctrls).fadeIn('fast');
    $('.benefits').show();
    $(features.get(p)).animate({ left: 0 + 'px' }, 400);
    $(ctrls.get(p)).addClass('active');
    $(ctrls.get(p)).css({ backgroundPosition: (-34 * p) + 'px -34px' });
    clearInterval(startInterval);
    featureInterval = setInterval("featureFeed()", (tval));
};

function featureFeed() {
    $(features.get(p)).animate({ left: 0 + 'px' }, 400, function() { showFeature(); });
    p++;
    if (p == numfeatures + 1) { p = 0 }
};

function showFeature() {
    resetCtrls();
    $(features).css('left', '685px');
    $(features.get(p)).animate({ left: 0 + 'px' }, 400);
    $(ctrls).removeClass('active');
    $(ctrls.get(p)).addClass('active');
    $(ctrls.get(p)).css({ backgroundPosition: (-34 * p) + 'px -34px' });
};

function resetCtrls() {
    $(ctrls).each(function() {
        pbutton = $(this).attr('id');
        var c = parseInt(pbutton.slice(1));
        $(this).css({ backgroundPosition: (-34 * c) + 'px 0' });
    })
};

// comparison popup
function comparisons(targets, name) {
    var tags = $(targets);
    // comparisons("a", "compare-tips");
    $(tags).click(function(e) {
        if ($(this).attr('rel') != '') {
            var k = $(targets).index(this);
            var pos = $(tags.get(k)).position();
            var offset = 240;
            if ($('.ctips').length > 0) { $('.ctips').remove(); }
            $('body').append("<div class='wbox ctips' id='ctip'></div>");
            var compare_tip = $("#ctip");
            $(compare_tip).css({ left: (e.pageX - $(tags.get(k)).width() / 1.75) + 'px' });
            $(compare_tip).css({ top: (e.pageY - offset) + 'px' });
            $(compare_tip).show(100);
            // call handler with contents of rel tag as query parameter
            $('#ctip').load("/handlers/compare.ashx?p=" + $(this).attr('rel')); //, hideStatus()
            $(compare_tip).click(function(e) { $(this).remove(); })
            //alert($(this).attr('rel'));
        }
    });
}