﻿

function mycarousel_itemAddCallback(carousel, xml) {
    var $items = jQuery('item', xml);

    $items.each(function(i) {
        carousel.add(i + 1, mycarousel_getItemHTML(this));
    });
    if ($items.size() > 0) {
        carousel.size($items.size());
    };
    // Unlock and setup.
    carousel.unlock();
    carousel.setup();

    // Disable autoscrolling if the user clicks the prev or next button.
    carousel.buttonNext.bind('click', function() {
        carousel.startAuto(0);
    });

    carousel.buttonPrev.bind('click', function() {
        carousel.startAuto(0);
    });
    // Pause autoscrolling if the user moves with the cursor over the clip.
    carousel.clip.hover(function() {
        carousel.stopAuto();
    }, function() {
        carousel.startAuto();
    });
};

/**
* Item html creation helper.
*/
function mycarousel_getItemHTML(item) {
    return '<div class="accessoriesDiv"><a href="' + $('link', item).text() + '" runat="server" target="_self"  ><div class="accessories_title">' + $('title', item).text() + '</div></a><div class="accessries_img"><a href="' + $('link', item).text() + '" target="_self"  title="' + $('title', item).text() + '"><img border="0" src="' + $('image', item).text() + '" runat="server" alt="' + $('title', item).text() + '" /></a></div></div>';
};

/**
* Utility function for truncating a string without breaking words.
*/
function mycarousel_truncate(str, length, suffix) {
    if (str.length <= length) {
        return str;
    }

    if (suffix == undefined) {
        suffix = '...';
    }

    return str.substr(0, length).replace(/\s+?(\S+)?$/g, '') + suffix;
};

jQuery(document).ready(function() {
    /**
    * We show a simple loading indicator
    * using the jQuery ajax events
    */
    jQuery().ajaxStart(function() {
        jQuery(".jcarousel-clip-horizontal").addClass('loading');
    });

    jQuery().ajaxStop(function() {
        jQuery(".jcarousel-clip-horizontal").removeClass('loading');
    });

    jQuery('#mycarousel').jcarousel({
        auto: 2,
        wrap: 'last',
        initCallback: mycarousel_initCallback,
        scroll: 1,
        visible: 5
    });
});
