/**
* SEBC Carousel Loop
* written by Koala Yeung @ 2008/09
* written for http://se-mart.org.hk
*/

/**
* todo
* ----
* 1. better parameter assignment then a long fat function parameter list
* 2. change it to OO. so more than 1 rowCarousel can co-exists on 1 page
*/



/**
* sebcCarouselLoop()
*/
function sebcCarouselLoop(id, itemClass, url, itemTotal, itemPerRow) {
  rowCarousel(id, itemClass, url, itemTotal, itemPerRow); // do the first time
  window.setInterval("rowCarousel('"+id+"', '"+itemClass+"', '"+url+"', "+itemTotal+", "+itemPerRow+");", 5000);  // looping
}


/**
* rowCarousel()
*/
function rowCarousel(id, itemClass, url, itemTotal, itemPerRow) {
  
  // initialization of this object
  if (rowCarousel.loopOne == undefined) {
    // core flags and parameters in operation
    rowCarousel.loopOne    = 1; // flag to show if this is the first loop or not
    rowCarousel.topN       = 0; // 1 + maximum pointer
    rowCarousel.ptr        = 0; // pointer of the next item to load
    rowCarousel.images     = new Array(); // image cache array
    rowCarousel.paused     = false;       // boolean flag for pause and resume
    rowCarousel.id         = id;          // css id of the DOM element to display this carousel
    rowCarousel.itemClass  = itemClass;   // class of each items in this carousel
    rowCarousel.itemTotal  = itemTotal;   // total items to load in the ajax request
    rowCarousel.itemPerRow = itemPerRow;  // items to display on each row
    
    // arrays to store carousel items
    rowCarousel.nidArr   = new Array();
    rowCarousel.titleArr = new Array();
    rowCarousel.linkArr  = new Array();
    rowCarousel.imageArr = new Array();

		// added 2009-01-09 wkf
    rowCarousel.teaserArr = new Array();
    
    // methods to pause and resume carousel
    rowCarousel.pause = function () {
      rowCarousel.paused = true;
    }
    rowCarousel.resume = function () {
      rowCarousel.paused = false;
    }
    
    // method to preload images to browser's DOM
    rowCarousel.preloadImage = function (nid, image) {
      if (rowCarousel.images[nid] == undefined) {
        rowCarousel.images[nid]=new Image();
        rowCarousel.images[nid].src = image;
      }
    }
    
    // method to generate html of a carousel row
    // for each time
    rowCarousel.templateItems = function () {
      htmlOut = "";
      
      for (i=0; i<rowCarousel.itemPerRow; i++) {
        // get item from items array
        nid   = rowCarousel.nidArr[rowCarousel.ptr];
        title = rowCarousel.titleArr[rowCarousel.ptr];
        link  = rowCarousel.linkArr[rowCarousel.ptr];
        image = rowCarousel.imageArr[rowCarousel.ptr];
        teaser = rowCarousel.teaserArr[rowCarousel.ptr];
        
        // preload item image
        rowCarousel.preloadImage(nid, image);
        
        // html item output
        htmlOut = htmlOut + '<div class="'+rowCarousel.itemClass+'">' +
				'<div id="main_highlight_left">' +
				'<a href="' + link + 
        '"><img src="' + image + '" title="' + title + '" ' +
        'onmouseover="rowCarousel.pause();" onmouseout="rowCarousel.resume();"/></a>' +
				'</div>' +
				'<div id="main_highlight_right">' +
				'<div id="main_highlight_right_title">' +
				'<a href="' + link + '">' +
				title + 
        '</a>' +
				'</div>' +
				'<div id="main_highlight_right_teaser">' +
				'<a href="' + link + '">' +
				teaser + 
        '</a>' +
				'</div>' +
				'</div>';

        rowCarousel.ptr = rowCarousel.ptr + 1;
        if (rowCarousel.ptr == rowCarousel.topN) rowCarousel.ptr = 0;
      } 
      return htmlOut;
    }
  }
  
  rowCarousel.main = function() {
    if (rowCarousel.loopOne == 1) {
      rowCarousel.loopOne = 0;  
  
      $.get(url, {"n": rowCarousel.itemTotal}, function(xmlData) {
        var jData = $(xmlData);
        
        // parse each "item" in response xml
        jData.find('item').each(function(){
          // item information
          rowCarousel.nidArr[rowCarousel.topN]   = $(this).find("nid").text();
          rowCarousel.titleArr[rowCarousel.topN] = $(this).find("title").text();
          rowCarousel.linkArr[rowCarousel.topN]  = $(this).find("link").text(); 
          rowCarousel.imageArr[rowCarousel.topN] = $(this).find("image").text(); 
          rowCarousel.teaserArr[rowCarousel.topN] = $(this).find("teaser").text(); 
          
          // increase topN to current max N + 1
          rowCarousel.topN++;
        });
  
        // get output html
        htmlOut = rowCarousel.templateItems();
  
        // if is not loopOne fadeout first
        $('#'+rowCarousel.id).html(htmlOut);
      });
    } else if (!rowCarousel.paused) {
      // get output html
      htmlOut = rowCarousel.templateItems();
      
      $('#'+rowCarousel.id).fadeOut(600, function() {
        $('#'+rowCarousel.id).html(htmlOut);
        $('#'+rowCarousel.id).fadeIn(600);
      });
    }
  }
  
  
  // run the main method
  rowCarousel.main();
  
}