// JavaScript Document
var dataSale = new Array () ;
var pageSale = new Array () ;
var AJAX_SaleProperty;
var posBefore = new Array();

function PropertyForSale ()
{
  var input = document.getElementById("Layer1") ;  
  
  if (input.checked == true)
  {	     
    if(this.mapObj.getLevel() > 10)
    {          
      this.mapObj.setCenter () ;
  	  this.mapObj.getRowCol () ;   	       
  	  if (this.mapObj.getMouseType() != "ruler" )
  	  {       
        var url = AjaxServer + "propertySale.php" ;
        url = url + "?top=" + this.mapObj.getTop() ;
        url = url + "&left=" + this.mapObj.getLeft() ;
        url = url + "&bottom=" + this.mapObj.getBottom() ;
        url = url + "&right=" + this.mapObj.getRight() ;
        url = url + "&level=" + this.mapObj.getLevel() ;
        url = url + "&sid=" +  Math.round(Math.random(0,1)*100000000000) ;
      }
      else if(this.mapObj.getMouseType() == "ruler" )
      {
        var url = AjaxServer + "propertySale.php" ;
        url = url + "?top=" + TLRuler[1] ;
        url = url + "&left=" + TLRuler[0] ;
        url = url + "&bottom=" + BRRuler[1] ;
        url = url + "&right=" + BRRuler[0] ;
        url = url + "&level=" + this.mapObj.getLevel() ;
        url = url + "&sid=" +  Math.round(Math.random(0,1)*100000000000) ;              
      }            
      AJAX_SaleProperty = new ajax();
      AJAX_SaleProperty.Ajax_ID = "GetPropertySale";
      AJAX_SaleProperty.url = url ;

    	AJAX_SaleProperty.method = "GET" ;
    	AJAX_SaleProperty.timeout = 60 ;
    	AJAX_SaleProperty.callback = "bundleDataSale();" ;    
    	AJAX_SaleProperty.request();                 
    } 
    else
    {
      this.mapObj.changeLevel (12, this.mapObj.longitude, this.mapObj.latitude) ;
      this.mapObj.showLayers();     
      this.mapObj.showButtonType(true);    		
    }      
  }
  else
  {
    if (document.getElementById("Layer_Sale_" + this.mapObj.divName))
    {
      var LS = document.getElementById("Layer_Sale_" + this.mapObj.divName) ;
      LS.innerHTML = "" ;
    
      if (document.getElementById("Balloon_" + this.mapObj.divName))
      {
        var divLayer = document.getElementById("Balloon_" + this.mapObj.divName) ;
        divLayer.innerHTML = "" ;    
      }
      
      if (document.getElementById("Ruler_Div"))
      {
        var Ruler = document.getElementById("Ruler_Div") ;        
        Ruler.style.zIndex = 9999999999 ;
        LS.style.zIndex = 999990 ;
      }          
    }
  }
}

function SaleDB ()
{
	this.X = 0 ;
	this.Y = 0 ;
	this.Xp = 0 ;
	this.Yp = 0 ;		
	this.Sale = new Array () ;
}

function SaleDetail (id)
{
	this.id = id ;
	this.imgSrc = "" ;
	this.address = "" ;
	this.bath = 0 ;
	this.bed = 0 ;
	this.desc = "" ;
	this.pType = "" ;
	this.price = "" ;
	this.saleType = "" ;
}

function bundleDataSale ()
{
  dataFull = AJAX_SaleProperty.resultText();
  delete AJAX_SaleProperty;
  this.mapObj.setGenmapClickAction(1);
  
  dataSale.splice(0, dataSale.length) ;
  var dataLine = dataFull.split("\n") ;  
  setQtySale(dataLine[0]) ;
  dataLine.shift() ;
  var fontLayer = document.getElementById ("PropertyForSale_font") ;
  fontLayer.innerHTML = " Property For Sale [ " + getQtySale() + " ]" ;     
  
  for (var i = 0 ; i < dataLine.length - 1 ; i ++)
  {
    var dataDetail = dataLine[i].split('**') ;

    var a = this.mapObj.changeToPixel(dataDetail[1],dataDetail[2]) ;
    
		if (dataDetail[10] == dataDetail[11] || dataDetail[10] < 2 || dataDetail[11] < 2)
		{
			if (dataDetail[10] > 2) var TPrice = "$" + dataDetail[10] ;
			if (dataDetail[11] > 2) var TPrice = "$" + dataDetail[11] ;
		}
		else
		{
			var TPrice = "$" + dataDetail[10] + " - $" + dataDetail[11] ;
		}
    
		var Des = dataDetail[17] ;
		//alert (dataDetail[16]) ;
		Des = Des.split ("##") ;
		var Description = "" ;
		for (var z = 0 ; z < Des.length ; z ++)
		{
			Description = Description + Des[z] + ",";
		}
		
		var Addr = dataDetail[3] + "/" + dataDetail[4] + " " + dataDetail[5] + " " + dataDetail[6] + "<br>" + dataDetail[7] + ", " + dataDetail[8] + " " + dataDetail[9] ;
        
    if (dataSale.length == 0)
    {
      dataSale[0] = new SaleDB () ;
      dataSale[0].Sale[0] = new SaleDetail (dataDetail[13]) ;      
      dataSale[0].X = dataDetail[1] ;
      dataSale[0].Y = dataDetail[2] ;
      dataSale[0].Xp = a[0] ;
      dataSale[0].Yp = a[1] ;
      //dataSale[0].Sale[0].id = dataDetail[2] ;
      dataSale[0].Sale[0].imgSrc = dataDetail[12] ;
      dataSale[0].Sale[0].address = Addr ;
      dataSale[0].Sale[0].bath = dataDetail[15] ;
      dataSale[0].Sale[0].bed = dataDetail[14] ;
      dataSale[0].Sale[0].desc = Description ;
      dataSale[0].Sale[0].pType = dataDetail[16] ;
      dataSale[0].Sale[0].price = TPrice ;
      dataSale[0].Sale[0].saleType = dataDetail[0] ;
    }
    else
    {
      var newId = dataSale.length ;
      var flag = 0 ;
      for (var j = 0 ; j < dataSale.length ; j ++)
      {   
        //alert ( Math.abs(dataSale[j].Xp - a[0]) ) ;     
        if ( (dataDetail[0] == dataSale[j].X && dataDetail[1] == dataSale[j].Y) || ( ( Math.abs(dataSale[j].Xp - a[0]) < 4 ) && ( Math.abs(dataSale[j].Yp - a[1]) < 4 ) ) )
        {
          var k = dataSale[j].Sale.length ;
					dataSale[j].Sale[k] = new SaleDetail (dataDetail[13]) ;
					//dataSale[j].Sale[k].id = dataDetail[2] ;
          dataSale[j].Sale[k].imgSrc = dataDetail[12] ;
          dataSale[j].Sale[k].address = Addr ;
          dataSale[j].Sale[k].bath = dataDetail[15] ;
          dataSale[j].Sale[k].bed = dataDetail[14] ;
          dataSale[j].Sale[k].desc = Description ;
          dataSale[j].Sale[k].pType = dataDetail[16] ;
          dataSale[j].Sale[k].price = TPrice ;
          dataSale[j].Sale[k].saleType = dataDetail[0] ;
					flag = 1 ;          
        }
      }
      
      if (flag == 0)
      {
        dataSale[newId] = new SaleDB() ;
        dataSale[newId].Sale[0] = new SaleDetail (dataDetail[2]) ;
        dataSale[newId].X = dataDetail[1] ;
        dataSale[newId].Y = dataDetail[2] ;
        dataSale[newId].Xp = a[0] ;
        dataSale[newId].Yp = a[1] ;        
        dataSale[newId].Sale[0].imgSrc = dataDetail[12] ;
        dataSale[newId].Sale[0].address = Addr ;
        dataSale[newId].Sale[0].bath = dataDetail[15] ;
        dataSale[newId].Sale[0].bed = dataDetail[14] ;
        dataSale[newId].Sale[0].desc = Description ;
        dataSale[newId].Sale[0].pType = dataDetail[16] ;
        dataSale[newId].Sale[0].price = TPrice ;
        dataSale[newId].Sale[0].saleType = dataDetail[0] ;               
      }
    }
  } 
  
  showSale () ; 
}

function setQtySale (qty)
{
  this.qtySale = qty ;
}

function getQtySale ()
{
  //alert (dataFull) ;
  return this.qtySale ;
}

function showSale () 
{
  var parent = "mapDiv_" + this.mapObj.divName ;
  var child = "Layer_Sale_" + this.mapObj.divName ;
  var input = document.getElementById("Layer1") ; 
  
  if (!document.getElementById(child))
  {
    createNewLayer(parent,child) ;
    input.code = "Layer_Sale_" + this.mapObj.divName ;
  }  

  var LS = document.getElementById(child) ;
  LS.innerHTML = "" ;
  LS.style.zIndex = 999990 ;
  LS.style.position = "absolute" ;

  var input = document.getElementById("Layer1") ;
  if (input.checked == true)
  {        
    for (var i = 0 ; i < dataSale.length ; i ++)
    {
      var id = "Sale_icon_" + i ;    
      if (!document.getElementById(id))
      {  
        var a = this.mapObj.changeToPixel(dataSale[i].X,dataSale[i].Y) ;
        var img = document.createElement("img") ;
        img.id = id ;
        if (dataSale[i].Sale[0].saleType == 0)
        {
          img.src = "images/property0.gif" ;
        }
        else
        {
          img.src = "images/property2.gif" ;
        }
        
        img.style.position = "absolute" ;  		
    		img.sX = this.mapObj.xStart ;
    		img.sY = this.mapObj.yStart ;
    		img.lon = a[0] ;
    		img.lat = a[1] ;
    		img.onload = function ()
    		{
    			this.style.left = (this.lon - this.sX) - (parseInt(this.width)/2) + 'px' ;
    			this.style.top = (this.lat - this.sY) - (parseInt(this.height)/2) + 'px' ;		
        }  		
    		img.style.left = ((a[0] - this.mapObj.xStart) - (parseInt(img.width)/2)) + 'px' ;			
    		img.style.top = ((a[1] - this.mapObj.yStart) - (parseInt(img.height)/2)) + 'px' ;      
        img.style.cursor = 'pointer' ;
        img.index = i ;
        img.style.zIndex = 999999 ;
        img.mapObj = this.mapObj ;
        img.style.visibility = 'visible' ; 
        img.style.display = '' ;
        dataSale[i].Xp = parseInt(img.style.left) ;
        dataSale[i].Yp = parseInt(img.style.top) ;          
    		img.onmouseover = function()
    		{
    				this.PrevZIndex = this.style.zIndex ;
    				this.style.zIndex = 999998 ;
    		}
    		img.onmouseout = function()
    		{
    				this.style.zIndex = this.PrevZIndex ;
    		}     	
        img.onclick = moveSaleMap ;
        LS.appendChild(img) ;       
      }	                      
    }    
  }  
  else
  {
    if (document.getElementById("Balloon_" + this.mapObj.divName))
    {
      var divLayer = document.getElementById("Balloon_" + this.mapObj.divName) ;
      divLayer.innerHTML = "" ;    
    }
  }
}

function moveSaleMap() 
{
  
	var tmpa = this.id;
	this.mapObj.xNext = this.lon ; 
	this.mapObj.yNext = this.lat ; 	
	this.mapObj.movX = 0 ;
	this.mapObj.movY = 0 ;
	if (panelWidth < 800)
    this.mapObj.xNext = this.mapObj.xNext - this.mapObj.xStart + Math.round( panelWidth / 3.5 ) ;
	else
    this.mapObj.xNext = this.mapObj.xNext - this.mapObj.xStart ;	 
	this.mapObj.yNext = this.mapObj.yNext - this.mapObj.yStart - 200 ;
	posBefore[0] = this.mapObj.xCenter;
  posBefore[1] = this.mapObj.yCenter;
	this.mapObj.flagAnim = 2;
	this.mapObj.checkAnimation () ;
	showSaleInfo(this) ;
}

function showSaleInfo (image)
{   
//alert (dataSale[image.index].Sale[0].price) ;
  var div = document.getElementById("Balloon_" + this.mapObj.divName) ;     
  div.style.left = parseInt(image.style.left) - 140 + 'px' ;
  div.style.top = parseInt(image.style.top) - 310 + 'px' ;
  div.innerHTML = "" ;
  
  if (!document.getElementById("Balloon_Img"))
  {
    var img = document.createElement("img") ;    
    img.id = "Balloon_Img" ;
    img.divLayer = div ;
    img.onclick = function ()
    {
      this.divLayer.innerHTML = "" ;
    }  
    div.appendChild(img) ;
    transparantPNG (div,img) ;
    
    var info = document.createElement ("div") ;
    info.id = "Balloon_info" ;
    div.appendChild (info) ;                
  }    
  
  var info_div = document.getElementById("Balloon_info") ;    
  info_div.style.zIndex = 999 ;
  info_div.style.position = "absolute" ;
  info_div.style.left = 10 + 'px' ;
  info_div.style.top = 5 + 'px' ;
  info_div.style.width = 440 + 'px' ;  
  info_div.align = 'left' ;
  info_div.style.overflow = 'hidden' ;  
  
  if (!document.getElementById("Balloon_table"))
  {
    var table = document.createElement("table") ;
    table.width = 445 + 'px' ;    
    //table.border = "2px" ;
    //table.cellPadding = 0 ; 
    //table.cellSpacing = 1 ;
    var tbody = document.createElement("tbody") ;
    tbody.id = "Balloon_table"
    table.appendChild(tbody) ;
  
    var tr = document.createElement("tr") ;    
    tbody.appendChild(tr) ;
    var td = document.createElement("td") ;
    td.width = 445 + 'px' ;
    td.colSpan = 2 ;
    tr.appendChild(td) ;
    
    var table2 = document.createElement("table") ;
    //table2.border = '1px' ;
    td.appendChild(table2) ;
    var tbody2 = document.createElement("tbody") ;
    table2.appendChild(tbody2) ;
    //table2.cellPadding = 0 ;
    //table2.cellSpacing = 0 ;    
    var tr2 = document.createElement("tr") ;
    tbody2.appendChild(tr2) ;
    var td2 = document.createElement("td") ;    
    tr2.appendChild(td2) ;
    td2.style.verticalAlign = 'top' ;
    td2.align = 'center' ;
    td2.width = 400 + 'px' ;    
    var div_prev_next = document.createElement("div") ;
    div_prev_next.id = "Balloon_prev_next" ;     
    div_prev_next.align = "center" ;           
    td2.appendChild (div_prev_next) ;        
    var td2 = document.createElement("td") ;        
    td2.style.verticalAlign = "top" ;
    td2.align = 'right' ; 
    td2.width = 43 + 'px' ;
    var div_close = document.createElement("div") ;
    div_close.id = "Balloon_close" ;            
    td2.appendChild (div_close) ;
    tr2.appendChild(td2) ;
  
    var tr = document.createElement("tr") ;
    tbody.appendChild(tr) ;
    var td = document.createElement("td") ;
    td.style.verticalAlign = 'top' ;    
    td.width = 150 + 'px' ; //
    td.height = 180 + 'px' ; //
    var img = document.createElement ("img") ;
    img.id = 'Balloon_image'  ;   
    img.style.left = 5 + 'px' ;
    img.style.top = 0 + 'px' ;
    img.style.width = 150 + 'px' ;
    img.style.height = 100 + 'px' ;
    var div_info3 = document.createElement("div") ;    
    div_info3.id = "Balloon_info3" ;
    td.appendChild (img) ;
    td.appendChild (div_info3) ;
    
    tr.appendChild(td) ;
    var td = document.createElement("td") ;
    td.style.verticalAlign = 'top' ;
    td.width = 280 + 'px' ; //
    td.height = 180 + 'px' ; //
    td.border = '2px' ;    
    var div_info1 = document.createElement("div") ;
    div_info1.id = "Balloon_info1" ;
    div_info1.style.top = '0px' ;
    //alert (div_info1.style.verticalAlign)
    div_info1.style.verticalAlign = "top" ;   
    div_info1.style.overflow = 'auto';
    div_info1.style.left = 50 + 'px' ;
    div_info1.style.width = 270 + 'px' ;
    div_info1.style.height = 170 + 'px' ;
    //div_info1.style.border = "2px solid" ;
    td.appendChild(div_info1) ; 
    tr.appendChild(td) ;  
  
    var tr = document.createElement("tr") ;
    tbody.appendChild(tr) ;
    var td = document.createElement("td") ;
    td.id = "td_info1" ;
    td.style.verticalAlign = "top" ;
    td.width = 430 + 'px' ; //
    td.bgcolor = 'blue' ;    
    //td.style.borderTop = '1px solid' ;
    td.height = 55 + 'px' ; //
    td.colSpan = 2 ;
    var div_info2 = document.createElement("div") ;
    div_info2.id = "Balloon_info2" ;
    td.appendChild(div_info2) ;
    tr.appendChild(td) ;  
    
    info_div.appendChild(table) ;    
  }        
 
  var balloon = document.getElementById("Balloon_Img") ;
  balloon.src = "images/sale_baloon.png" ;
  var img = document.getElementById('Balloon_image') ;
  if (dataSale[image.index].Sale[0].imgSrc == "")
    img.src = "images/no_camera.jpg" ;
  else
    img.src = dataSale[image.index].Sale[0].imgSrc ;
  
  var info_1 = document.getElementById("Balloon_info1") ;
  var txt = "For SALE &nbsp;&nbsp;" + dataSale[image.index].Sale[0].price + "<br>" +
            "Type : " + dataSale[image.index].Sale[0].pType + "<br><br>" +
            "Address : " + dataSale[image.index].Sale[0].address + "<br><br>" +
            dataSale[image.index].Sale[0].desc ;
  info_1.style.verticalAlign = "top" ;
  info_1.innerHTML = txt ; 
  
  var info2 = document.getElementById("Balloon_info2") ;
  //info2.style.borderTop = "2px solid red"
  var txt = "Get Direction: To Here | From Here <br>Search Nearby, Add your site, Bookmark, Streetview<br>Save as default location"
  info2.innerHTML = txt ;
  
  //alert (dataSale[this.index].Sale[0].bath) ;
  var info3 = document.getElementById("Balloon_info3") ;
  var txt = "Bedrooms : " + dataSale[image.index].Sale[0].bed + 
            "<br>Bathrooms : " + dataSale[image.index].Sale[0].bath ;
  //alert (txt) ;
  info3.innerHTML = txt ;    

    
  var close = document.getElementById("Balloon_close") ;
  close.innerHTML = "" ;
  /*
  var img = document.createElement("img") ;
  img.src = "images/zoom_in_rest.gif" ;
  close.appendChild(img) ;
  */
  var img2 = document.createElement("img") ;
  img2.src = "images/sale_info_close.png" ;
  img2.obj = this.mapObj ;
  img2.onclick = function ()
  {
    if (document.getElementById("Balloon_" + this.obj.divName))
    {
      var divLayer = document.getElementById("Balloon_" + this.obj.divName) ;
      divLayer.innerHTML = "" ;    
      this.obj.flagAnim = 2;
      this.obj.recenter(this.obj.getCurrLong(posBefore[0],posBefore[1]), this.obj.getCurrLat(posBefore[0],posBefore[1]));
    }  
  }
  close.appendChild(img2) ;        
  
  //paging

  if (dataSale[image.index].Sale.length > 1)
  {
    var pageQty = Math.ceil (parseInt(dataSale[image.index].Sale.length) / 5) ;
    var j = 1 ;
    for(var i = 0 ; i < pageQty ; i ++)
    {
      pageSale[i] = j ;
      j += 5 ;
    }    
    pagingSale (image, 0) ;  
  }  
}

function pagingSale (image, index)
{
  var prev_next = document.getElementById("Balloon_prev_next") ;
  var prev = document.getElementById("prev_photo_image") ;
  var next = document.getElementById("next_photo_image") ;
  prev_next.innerHTML = "" ;
  
  var pg = Math.floor( (index+1) / 5 ) ;      
  
  var prev = document.createElement("img") ;
  prev.id = "prev_photo_image" ;
  prev.style.cursor = "pointer" ;
  prev.src = "images/prev.png" ;  
  prev.image = image ;
  prev.pg = pg ;
  prev.pageSale = pageSale ;    
  prev.onclick = function ()
  {      
    if(this.pg > 0)
    {
      this.pg -= 1 ;
      pagingSale (this.image, this.pageSale[this.pg]-1) ;        
    }
  }
  prev_next.appendChild(prev) ;
  
  if( pg <= pageSale.length - 1)
  {
    if(pg == pageSale.length - 1 || dataSale[image.index].Sale.length <= 5)
    {        
      for(var i = pageSale[pg] ; i <= dataSale[image.index].Sale.length ; i ++)
      {
        var span = document.createElement("span") ;
        span.style.color = "blue" ;                          
        span.innerHTML = "&nbsp;" + i + "&nbsp;" ;
        span.image = image ;
        span.style.cursor = "pointer" ;
        span.index = i - 1 ;
        span.id = "numberPageSale_" + span.index ;
        span.onclick = function ()
        {
          SaleInfoContent(this.image, this.index) ;
        }
        prev_next.appendChild(span) ;
      }
    }
    else
    {      
      for(var i = pageSale[pg] ; i < (pageSale[pg] + 5) ; i ++)
      {
        var span = document.createElement("span") ;               
        span.style.color = "blue" ;                          
        span.innerHTML = "&nbsp;" + i + "&nbsp;" ;
        span.image = image ;
        span.index = i - 1 ;                     
        span.id = "numberPageSale_" + span.index ;        
        span.onmouseover = function ()
        {
          this.style.cursor = "pointer" ;
        }   
        span.onclick = function ()
        {            
          SaleInfoContent(this.image, this.index) ;
        }          
        prev_next.appendChild(span) ;      
      }
    }   
  } 
  
  var next = document.createElement("img") ;
  next.src = "images/next.png" ;
  next.id = "next_photo_image" ;
  next.style.cursor = "pointer" ;
  next.image = image ;
  next.pg = pg ;
  next.pageSale = pageSale ;
  next.onclick = function ()
  {
    if (this.pg < (this.pageSale.length - 1) )
    {
      this.pg += 1 ;
      pagingSale (this.image, this.pageSale[this.pg]-1) ;
    }
  }
  prev_next.appendChild(next) ; 
  
  var close = document.getElementById("Balloon_close") ;
  close.innerHTML = "" ;
  /*
  var img = document.createElement("img") ;
  img.src = "images/zoom_in_rest.gif" ;
  close.appendChild(img) ;
  */
  var img2 = document.createElement("img") ;
  img2.src = "images/sale_info_close.png" ;
  img2.obj = this.mapObj ;
  img2.onclick = function ()
  {
    if (document.getElementById("Balloon_" + this.obj.divName))
    {
      var divLayer = document.getElementById("Balloon_" + this.obj.divName) ;
      divLayer.innerHTML = "" ;    
    }  
  }
  close.appendChild(img2) ;       
  
  SaleInfoContent (image, index) ;            
}

function SaleInfoContent (image, index)
{
  var prev = document.getElementById("prev_photo_image") ;
  var next = document.getElementById("next_photo_image") ;

  var img = document.getElementById('Balloon_image') ;
  if (dataSale[image.index].Sale[index].imgSrc == "")
    img.src = "images/no_camera.jpg" ;
  else
    img.src = dataSale[image.index].Sale[index].imgSrc ;    
  
  var info_1 = document.getElementById("Balloon_info1") ;  
  var txt = "For SALE &nbsp;&nbsp;" + dataSale[image.index].Sale[index].price + "<br>" +
            "Type : " + dataSale[image.index].Sale[index].pType + "<br><br>" +
            "Address : " + dataSale[image.index].Sale[index].address + "<br><br>" +
            dataSale[image.index].Sale[index].desc ;
  info_1.style.verticalAlign = "top"                       
  info_1.innerHTML = txt ; 
  
  var info3 = document.getElementById("Balloon_info3") ;
  var txt = "Bedrooms : " + dataSale[image.index].Sale[index].bed + 
            "<br>Bathrooms : " + dataSale[image.index].Sale[index].bath ;
  info3.innerHTML = txt ;   
  
  if (dataSale[image.index].Sale.length <= 5)
  {
    prev.style.visibility = "hidden" ;   
    next.style.visibility = "hidden" ;  
    for (var i = 0 ; i < dataSale[image.index].Sale.length; i++)
    {
      var span = document.getElementById("numberPageSale_" + i ) ;
      if (i == index)
      {
        span.style.color = "red" ;
        span.style.fontWeight = "bold" ;
      }          
      else
      {
        span.style.color = "blue" ;
        span.style.fontWeight = "normal" ;
      }                     
    }
  }
  else
  {
    var pg = Math.floor( (index+1) / 6 ) ;  
    if(pg == 0)
    {
      prev.style.visibility = "hidden" ;   
      next.style.visibility = "visible" ;    
    }
    else if(pg == (pageSale.length - 1) )
    {
      prev.style.visibility = "visible" ;   
      next.style.visibility = "hidden" ;  
    }
    else
    {
      prev.style.visibility = "visible" ;   
      next.style.visibility = "visible" ;    
    }  
    
    if ( ( pageSale[pg] + 5) > dataSale[image.index].Sale.length)
    {
      for(var i = pageSale[pg] ; i < (pageSale[pg] + 5) ; i ++)
      {
        var k = i - 1 ;
        if (document.getElementById("numberPageSale_" + k ))
        {
          var span = document.getElementById("numberPageSale_" + k ) ;         
          if (k == index)
          {
            span.style.fontWeight = "bold" ;
            span.style.color = "red" ;
          }           
          else
          {
            span.style.color = "blue" ;
            span.style.fontWeight = "normal" ;
          }                                        
        }
      }    
    }
    else
    {
      for(var i = pageSale[pg] ; i <= dataSale[image.index].Sale.length ; i ++)
      {
        var k = i - 1 ;
        if (document.getElementById("numberPageSale_" + k ))
        {
          var span = document.getElementById("numberPageSale_" + k ) ; 
          if (k == index)
          {
            span.style.fontWeight = "bold" ;
            span.style.color = "red" ;
          }            
          else
          {
            span.style.color = "blue" ;
            span.style.fontWeight = "normal" ;
          }                             
        }
      }    
    }
    
  }
      
  //var span = document.getElementById("numberPageSale_" + index) ;
  //span.style.color = "red" ;
}