var _MAXPC_XML_DATA = null;

function mycarousel_initCallback(carousel)
{
  // 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();
  });
};

function mycarousel_itemVisibleInCallback(carousel, item, i, state, evt)
{
  // The index() method calculates the index from a
  // given index who is out of the actual item range.
  var idx = carousel.index(i, _MAXPC_XML_DATA.length) - 1;
  carousel.add(i, 
    mycarousel_getItemHTML( 
      _MAXPC_XML_DATA[idx].getElementsByTagName('enclosure')[0].getAttribute("url"),
      _MAXPC_XML_DATA[idx].getElementsByTagName('remotelink')[0].childNodes[0].nodeValue,
      _MAXPC_XML_DATA[idx].getElementsByTagName('title')[0].childNodes[0].nodeValue,
      _MAXPC_XML_DATA[idx].getElementsByTagName('description')[0].childNodes[0].nodeValue,
      i)      
      // note the added argument above
  );
};

function mycarousel_itemVisibleOutCallback(carousel, item, i, state, evt)
{
  // this timeout makes the remove command wait 500ms before
  // activiation so we don't end up with that snap delete 
  // setTimeout( function() { carousel.remove(i); }, 800);
  carousel.remove(i);
};


function mycarousel_start(xml_path) {
  jQuery.get(xml_path, function(data) {
    mycarousel_carousel_init(data);
  });
}

function mycarousel_carousel_init(data)
{
  // Simply add all items at once and set the size accordingly.itemVisibleOutCallback: {onAfterAnimation: function(carousel, item, i, state, evt) { carousel.remove(i); }},
  _MAXPC_XML_DATA = data.getElementsByTagName("item");

  if (_MAXPC_XML_DATA.length < 3) {
    jQuery('#scroller').slideUp('400');
  } else {
	jQuery('#mycarousel').jcarousel({  
		scroll: 1,
		auto: 0,
		animation: 800,
		wrap: null,
		itemVisibleInCallback: {onBeforeAnimation: mycarousel_itemVisibleInCallback},
		itemVisibleOutCallback: {onAfterAnimation: mycarousel_itemVisibleOutCallback},
		itemLoadCallback:  mycarousel_itemLoadCallback,
		initCallback: mycarousel_initCallback
	});
  }
};


function mycarousel_itemLoadCallback(carousel, state){
   for (var i = carousel.first; i <= carousel.last; i++) {
       // Check if the item already exists
        if (!carousel.has(i)) {
            // Add the item
            carousel.add(i, pane_num);
        }
   };
};


function cheap_track(category, action, label, value) { 
//    if (typeof pageTracker != 'undefined') { 
//        pageTracker._trackEvent(category, action, label, value); 
        _gaq.push(['et._trackEvent', category, action, label, value]);
//    } 
} 
  
/** 
* Item html creation helper. 
*/ 
 
function mycarousel_getItemHTML(url, linkto, title, desc, pane_num) 
{ 

    var html= '<div class="jc-item jcitem"><div class="title">' 
     + '<a href="'+linkto+'" ' 
     + 'onclick="cheap_track(\'Homepage\', \'Homepage_slider/'+ pane_num +'\', \'' + linkto + '\', 0)"><span class="left"><span class="header">'
     + title+'<span class="description">'+ desc + '</span></span>' 
     + '<span class="right"></span></div><div class="clear">' 
     + '<img ' + ' src="' + url + '" width="196" height="120" hspace="0" alt="" /></a></div></div>';
    return html;
}; 
