﻿Type.registerNamespace("Core");

Core.SimpleCarousel = function(element) {
  Core.SimpleCarousel.initializeBase(this, [element]);

  //values can be changed
  //this._numberOfVisibleItems = 5; //TODO Calculate number based on available width NO NEED FOR IT
  this._pixelsPerInterval = 1;
  this._singleItemWidth = 181;
  this._totalWidth = "250px"; //945px for realtyspace
  // Don't change any value below
  //Dom Elements
  this._carousel = element;
  this._carouselHolder = null;
  this._carouselStrip = null;
  this._carouselItems = null; //The unordered list of the carousel
  //Dom Elements - END

	this._data = null;
  this._liMaster = null;
  this._imgMaster = null;
  this._divMaster = null;
}

Core.SimpleCarousel.prototype = {
  initialize: function(){
  
    Core.SimpleCarousel.callBaseMethod(this, 'initialize');

	  this._divMaster = document.createElement("div");
	  var span = document.createElement("span");
	 // Sys.UI.DomElement.addCssClass(td, "center")

    this._carouselHolder = this._divMaster.cloneNode(false);   
    Sys.UI.DomElement.addCssClass(this._carouselHolder, "carousel");

    this._carouselStrip = this._divMaster.cloneNode(false);
    this._carouselStrip.style.position = "relative";

    this._carouselItems = document.createElement("ul");
    this._carouselStrip.appendChild(this._carouselItems);
    
    this._carouselHolder.appendChild(this._carouselStrip);

	  this._carousel.appendChild(this._carouselHolder);
	    
	  //IE6 Fix  
   // this._carouselHolder.style.width = (((this._singleItemWidth) * this._numberOfVisibleItems)) + "px";
   this._carouselHolder.style.width = this._totalWidth;

    this._carouselStrip.style.left = "0px";
    this._liMaster = document.createElement("li");
 	  this._imgMaster = document.createElement("img");
    this._imgMaster.setAttribute("alt","");
  },

	setData: function(data)
	{
	  this._data = data;
	},
    
  load: function()
  {
    this.render();
    this._animationLoop();
  },
    
  _animationLoop: function() 
  {
    var _this = this;

    this._carouselStrip.style.left = (parseInt(this._carouselStrip.style.left) - this._pixelsPerInterval) + 'px'; 
    if (parseInt(this._carouselStrip.style.left) < -this._singleItemWidth ) 
    {
       var node = this._carouselItems.childNodes[0].cloneNode(true)
       this._carouselItems.removeChild(this._carouselItems.childNodes[0]);
       this._carouselStrip.style.left = (parseInt(this._carouselStrip.style.left) + this._singleItemWidth) + 'px';
       this._carouselItems.appendChild(node);
    }
    setTimeout(function(){_this._animationLoop()}, 40);
  },  

  render: function()
  {
    for (i=0;i<this._data.length;i++)
    {
      this.renderLI(this._carouselItems, this._data[i], false);
    }
  },

  renderLI: function(ul, property)
  {
    var liClone =  this._liMaster.cloneNode(false);
    //Add City
    var divClone = this._divMaster.cloneNode(false);
    divClone.appendChild(document.createTextNode(property.city));
    Sys.UI.DomElement.addCssClass(divClone, "carouselText");
    
    liClone.appendChild(divClone);

		//Add Image
    var imgClone = this._imgMaster.cloneNode(false);  
    imgClone.setAttribute("src",property.image); 
    liClone.appendChild(imgClone);
   // var br = document.createElement("br");
   // liClone.appendChild(br);

    var divClone2 = this._divMaster.cloneNode(false);
    divClone2.appendChild(document.createTextNode(property.price));
    Sys.UI.DomElement.addCssClass(divClone2, "carouselText");

		//Add price
    liClone.appendChild(divClone2);
		//Add to UL
    ul.appendChild(liClone);
  },
  
  dispose: function()
  {
    Core.SimpleCarousel.callBaseMethod(this, 'dispose');
  }
}

Core.SimpleCarousel.registerClass('Core.SimpleCarousel', Sys.UI.Control);
  
