var numperpage = 10;
var map;
var mapload = false;
var gmarkers = [];
var gindex = 0;
var htmls =[];
var mapdata = [];

//alert(companies.length);
//contruct the data string
var dataArray = {'latitude': latitude, 'longitude': longitude, 'keywords': keyword,'categoryid': categoryid, 'city': city_name, 'state' : state_code, 'ip': ip};
$(document).ready(function(){
	
   //if (foundcity == 1){

	   togglemap();
   	   
   	   $('#bycategory').click(function(){
   	      $('#category').slideToggle("slow");
   	   	  return false;
   	   });
   	   
   	   $('#expandcategory').click(function(){

   	   	if ( $("table.panel-table").length > 0 )
   	   	  $('table.panel-table').remove();
   	    else showPanel(0, categoryhits);
   	    
   	    return false;
   	   });
   	   
   	   //if user clicks somewhere else, remove all panel.
   	   $('body').click(function(){
   	      hideAllPanel();
   	   })

       $('a.add_clipboard').click(function(){
           $.getJSON($(this).attr('href'), function(data){
               loadClipBoard();
           });
         
           return false;
        });
        
        //mapdata = data['companies'];
       //enlarge the image on hover
       $('img.enlarge').hover(
          function(){

          	  var src = $(this).attr('src');
          	  var newsrc = src.replace(imagepath, imagepath_large);

          	  $(this).next().attr('src', newsrc);
          	  var offset = $(this).offset();

          	  $(this).next().css('position', 'absolute').css('top', offset.top - 220)
          	                         .css('left', offset.left + 100)
          	                         .css('display', 'block')
          	                         .css('width', '400px').css('height', '300px')
          	                         .css('z-index', 500)
          	                         .css('border', '1px solid black');
          },
          
          function(){
          	  $(this).next().removeClass('hover_show').css('display', 'none').css('z-index', -1);

          }
       );

        googleMap(companies);

   	   /*
   	   if(searchPhone != ""){
   	   	 dataArray['phonenumber'] = searchPhone;
   	     searchPhoneNumber(dataArray);

   	   }
   	   else{
         searchKeyword(dataArray);
   	   }
   	   */
   	   
         //perform ajax call to retrieve business data
	 //find all links in page link and make them clickable
  //}
});

function loadgoogle(){

	function OnLoad() {
      // Create a search control
      var searchControl = new google.search.SearchControl();
      // Add in a full set of searchers
       var localSearch = new google.search.LocalSearch();

      searcher = new google.search.WebSearch();

      options = new google.search.SearcherOptions();
      options.setExpandMode(GSearchControl.EXPAND_MODE_OPEN);
      searcher.setUserDefinedLabel("Web Search Result: " + keyword);

      searchControl.addSearcher(searcher, options);
      searcher.setResultSetSize(google.search.Search.LARGE_RESULTSET);
      localSearch.setCenterPoint(city_name + ', ' + state_code);
       // create a drawOptions object
      var drawOptions = new google.search.DrawOptions();
      drawOptions.setSearchFormRoot(document.getElementById(""));
      
      searchControl.draw(document.getElementById("searchcontent"), drawOptions);

      // execute an inital search
      searchControl.execute(keyword + ' ' + city_name);
    }
    google.setOnLoadCallback(OnLoad);
}

function searchPhoneNumber(dataArray) {
	$('#searchcontent').addClass('ajax_loading');
	$.ajax({
	   url: '/city/searchbyphone', 
	   cache: false, 
	   data: dataArray, 
	   dataType: "json", 
	   success: function(data){

         $('#searchcontent').removeClass('ajax_loading');
         
         if (data.success == true && data['companies'].length != 0){
         	$('div.page_all').html(showNum(data['companies'].length, 1, numperpage));
	        $('div.page_num').html(paginate(data['companies'].length, 1, numperpage));
	        
	         var content = "";
	         for(var i = 0; i < data['companies'].length; i++){
	            	//replace space with dash in company name
	     	    var companyName = data['companies'][i]['company_name'].replace(/\s/g, '-');
	     	    
	     	    content += '<li class="rlt_list_blc">';
	     	    content += '<div class="biz_block"> <a href="/'+ currentCity + '/view/'+ companyName + '-' + data['companies'][i]['ID']
	     	             +'/ " class="biz_tit_link">';
	     	    if(data['companies'][i]['image'] == undefined)
	     		    content += '<img src="/img/no_img_defalt.gif" alt="no image" class="no_img" />';
                else
	     	       content += '<img  src="'+ imagepath + data['companies'][i]['image'] +  '" alt="image" class="no_img enlarge" />';
	     	 
	     	    content += '</a><img style="display:none" />';
	     	    content += '<div class="biz_info">';
	     	      //output the start function 
                var width = outputStar(data['companies'][i]['rate']);
	     	    //according to the rate, calculate the width for star
	     	    content += '<div class="rate"><div class="rate_star"  id = "rate" ><span style="width:' + width + 'px "></span></div>' + data['companies'][i]['rate'] + '/5 (' + data['companies'][i]['num_of_rate'] + ' reviews)';	
	     	    content += '</div>';
	     	
	     	    content +='<a href="/'+ currentCity + '/view/'+ companyName + '-' + data['companies'][i]['ID']
	     	             +'/ " class="biz_tit_link">' + data['companies'][i]['company_name'] +'</a>';
	     	    content += '<ol><li><span class="dark_grey">location:</span>';
	     	    content += data['companies'][i]['address'] + ' ' + data['companies'][i]['city'] + ' ' + data['companies'][i]['state'] + ' ' + data['companies'][i]['postal_code'] + "</li>";
	     	    
	     	    if (data['companies'][i]['phone_number'] != null)
	     	       content += '<li><span class="dark_grey">Telephone: </span>' + data['companies'][i]['phone_number'] + "</li>";

	     	    
	     	    if (data['companies'][i]['fax_number'] != null)
	     	       content += '<li><span class="dark_grey">Fax number: </span>' + data['companies'][i]['fax_number'] + "</li>";
	     	       
	     	    if (data['companies'][i]['url'] != null)
	     	       content += '<li><span class="dark_grey">Website: </span><a href="' + data['companies'][i]['url'] + '" target="_blank" >' + outputurl(data['companies'][i]['url']) + '</a></li>';
	     	   
	     	    var cat_description = replaceDash(data['companies'][i]['description']);
	     	    
	     	       content += "</ol>";
	     	    content += '<div class="biz_category">category: ';
                content += '<a href="/' + currentCity + '/category-' + cat_description + '-'+ data['companies'][i]['cid'] + '-' + '4' + '">' + data['companies'][i]['description']+ '</a>';
	            content +=  '</div>';
	     	    content += 
                       '</div></div><div class="biz_link">' + 
                       '<a href="/'+ currentCity + '/view/'+ companyName + '-' + data['companies'][i]['ID'] + '-write " class="wrt_rev">write review</a>' +       
                      '<a href="/business/addclipboard?businessid=' + data['companies'][i]['ID'] +  '" class="add_clipboard">add to clipboard</a>' +                         
                       '<a href="/business/contactbusiness?businessid=' + data['companies'][i]['ID'] +  '" class="contact_business">contact business</a>' +
                       '</div>' +                       
                       '</div>';
                  	   
	     	    content += '</li>';
	     	    
	     	    $('#searchcontent').html(content);

                  //ajax call to add favourite business
	           $('a.add_clipboard').click(function(){
	              $.getJSON($(this).attr('href'), function(data){
	                 loadClipBoard();
	           });
	           return false;
	        });
          }
         }
         else $('#searchcontent').html('<h2>Sorry, no record has been found</h2>');
	   }, 
	   error: function(){
	      alert("Failed to connect server");
	   }
	});
	
	if(clipboard == 1) 
	   loadClipBoard();
}

/**
 * Enable float map
 */
function mapfloat(){
   	$(window).scroll(mapscrollwithtime);
}
function mapscrollwithtime(){
	setTimeout('mapscroll()', 500);
}

function mapscroll(){
	   var offset = $(document).scrollTop();
       offset = offset + "px";
      $('#float_map').animate({top:offset},{duration:1000,queue:false}); 
}

/**
 * Disable map float
 */
function disablemapfloat(){
   $(window).unbind('scroll', mapscrollwithtime);
}

/*
function searchKeyword(passData){
	    if (ajaxcall != 0){
	       $('#searchcontent').addClass('ajax_loading');
	       $('#searchcontent').html('');
	    }

	    $.ajax({
	   	 url: searchUrl, 
	   	 cache: false,
	   	 data: passData,
	     dataType: "jsonp",
	     jsonp: 'jsoncallback',
	     timeout: 7000,
	     success: function(data){
         
	     $('#searchcontent').removeClass('ajax_loading');
	     if (data.success == true && data.totalnumber != 0){
	     	 if (ajaxcall != 0){
                $('div.page_all').html(showNum(data['totalnumber'], data['request']['beginindex'], numperpage));
	            $('div.page_num').html(paginate(data['totalnumber'], data['request']['beginindex'], numperpage));
	     	
	            var content = "";
	            for(var i = 0; i < data['companies'].length; i++){
	            
	         	    //replace space with dash in company name
	     	        var companyName = data['companies'][i]['company_name'].replace(/\s/g, '-');
	     	    
		     	    content += '<li class="rlt_list_blc" ref = "' + i + '">';
		     	    content += '<div class="biz_block"> <a href="/'+ currentCity + '/view/'+ companyName + '-' + data['companies'][i]['ID']
		     	             +'/ " class="biz_tit_link">';
		     	    if(data['companies'][i]['image'] == undefined)
		     		   content += '<img src="/img/no_img_defalt.gif" alt="no image" class="no_img" />';
	                else
		     	       content += '<img  src="'+ imagepath + data['companies'][i]['image'] +  '" alt="image" class="no_img enlarge" />';
		     	       
		     	    content += '</a><img style="display:none" />';
		     	    	     	    
		     	    //output the start function 
	                var width = outputStar(data['companies'][i]['rate']);
	               var cat_description = replaceDash(data['companies'][i]['categories'][0]);
		     	    //according to the rate, calculate the width for star
		     	    content += '<div class="biz_info"><div class="rate"><div class="rate_star"  id = "rate" ><span style="width:' + width + 'px "></span></div>' + data['companies'][i]['rate'] + '/5 (' + data['companies'][i]['num_of_rate'] + ' reviews)';	
		     	    content += '</div>';
	                
	                content +='<a href="/'+ currentCity + '/view/'+ companyName + '-' + data['companies'][i]['ID']
		     	             +'/ " class="biz_tit_link">' + data['companies'][i]['company_name'] +'</a>';
		     	    content +='<p class="biz_cat">Category: ';
		     	    content += '<a href="/' + currentCity + '/category-'+ cat_description + '-'+ data['companies'][i]['cid'] + '-' + '4' + '">' + data['companies'][i]['categories'][0] + '</a></p>';
		     	    content += '<p>';
		     	    content += data['companies'][i]['address'] + ' ' + data['companies'][i]['city'] + ' ' + data['companies'][i]['state'] + ' ' + data['companies'][i]['postal_code'] + '</p>';
		     	    content += '<p>';
		     	    if (data['companies'][i]['phone_number'] != null)
		     	       content += '(phone)' + data['companies'][i]['phone_number'];
	
		     	    
		     	    if (data['companies'][i]['fax_number'] != null)
		     	       content += ' (Fax)' + data['companies'][i]['fax_number'];
		     	    
		     	    content += '</p>';
		     	    
		     	    if (data['companies'][i]['url'] != null)
		     	       content += '<a href="' + data['companies'][i]['url'] + '" target="_blank" >' + outputurl(data['companies'][i]['url']) + '</a>';

		     	       content += 
	                       '</div></div><div class="biz_link">' + 
	                       '<a href="/'+ currentCity + '/view/'+ companyName + '-' + data['companies'][i]['ID'] + '-write " class="wrt_rev">write review</a>' +       
	                       '<a href="/business/addclipboard?businessid=' + data['companies'][i]['ID'] +  '" class="add_clipboard">add to clipboard</a>' +   
	                        '<a href="/business/contactbusiness?businessid=' + data['companies'][i]['ID'] +  '" class="contact_business">contact business</a>' +
	                       '</div>';
	                  	   
		     	       content += '</li>';
	          }
	 
	         $('#searchcontent').html(content);
	      }     
	       //allow images to hover
	       hoverImage();
           
	       showCategories(data['categoryhits'], passData);
	       
	        if (ajaxcall != 0){
	           //pagination links
	          $('div.page_num').find('a').click(function(){
	       	        newdata = {'latitude': latitude, 'longitude': longitude, 'keywords': keyword, 'beginindex': $(this).attr('rel'), 'categoryid': data['request']['categoryid'], 'city': city_name, 'state' : state_code, 'ip': ip};
                 	mapload = false;
                 	searchKeyword(newdata);
                 	$('#mapwrapper').css('display', 'none');

                 	return false;
              });
	        }
            
           //ajax call to add favourite business
	        $('a.add_clipboard').click(function(){
	           $.getJSON($(this).attr('href'), function(data){
	               loadClipBoard();
	           });
	         
	           return false;
	        });
	        
            mapdata = data['companies'];

	        googleMap(mapdata);
	        
	     }
	     
	     else {
	     	  if (showGoogle != 'undefined' && showGoogle == "1")
	     	     loadgoogle();
	          else $('#searchcontent').html('<h2>Sorry, no record has been found</h2>');
	     }
	    
	   },
	     error: function() {
            alert("Failed to connect server");
        }
     
	 });
   }
*/

function hideAllPanel(){
	for(var i = 0; i <= 4; i++)
	   $('#panel-table' + i).remove();
}
   /**
    * Hover the image 
    */
function hoverImage(){
	       //enlarge the image on hover
	$('img.enlarge').hover(
	   function(){
	       var src = $(this).attr('src');
	       var newsrc = src.replace(imagepath, imagepath_large);

	       $(this).parent().next().attr('src', newsrc);
	       var offset = $(this).offset();

	       $(this).parent().next().css('position', 'absolute').css('top', offset.top + $(this).height())
	           	                         .css('left', offset.left - $(this).width())
	           	                         .css('display', 'block')
	           	                         .css('width', '400px').css('height', '300px')
	           	                         .css('z-index', 500)
	           	                         .css('border', '1px solid black');
	      },
	           
	      function(){
	      $(this).parent().next().removeClass('hover_show').css('display', 'none').css('z-index', -1);

	     }
	);	
}
//output the number of items in format : "	Showing 1-10 total 100
function showNum(total, start, numperpage){
    if (start == 0)
      start++;
      
    if (!start)
      start = 1;
	if (total >  parseInt(start) + parseInt(numperpage))
	  var end = parseInt(start) + parseInt(numperpage) - 1;
	else end = total;
	
	var showbar = "Showing " + start + "-" + end + " of " + total;
	
	return showbar;
}

//output the pagiantion
function paginate(total, start, numperpage) {
	if (!start)
      start = 1;
      
	//get total number of pages
	var pages = Math.ceil(total / numperpage);	
	var link = "";
	var currentpage = Math.floor((start / numperpage)) + 1;
		
	var half = Math.ceil(numperpage /2);
    var upper_limit = pages - numperpage;
    var start = currentpage>half ?Math.max(Math.min(currentpage-half, upper_limit), 1):1;
    var end = currentpage>half?Math.min(currentpage+half, pages):Math.min(numperpage, pages);
    var url = window.location;
    
    //output the page link
	if (currentpage != 1)
	  link += '<a rel="'+ (currentpage - 2) * numperpage +'">Previous</a>'
	else
	  link += 'Previous';

	for(var i = start; i <= end; i++){
      if (currentpage == i)
      	link += "<b> " + i + " </b>";
      else
        link += '<a id = "#' + (i - 1) * numperpage +'" rel="'+ ((i - 1) * numperpage + 1) +'"> ' + i + ' </a>';
	}
	
	if (currentpage != pages)
	  link += '<a rel="'+ (currentpage) * numperpage +'"> Next </a>';
	else 
	  link += 'Next';
	  
    return link;
}

/**
 * Show categories filter
 */
function showCategories(data, dataArray) {
  
   data = data.sort(sortByQuantity);
   var passData = dataArray;
   
   var categories = "";
  
   var limit = 5;
   if (data.length < 5)  limit = data.length
   //alert("Cates: " + data.length);
   
   for (var i = 0; i < limit; i++){
   	  var title = data[i][1];

      if (title.length > 15)  title = title.substring(0, 18) + "...";
         
   	  //categories += '<ol><a class="category_filter" href=""  ref="' + data[i][0]+ '" title="' + data[i][1] + '">'+ title + ' (' + data[i][6] + ') ' + '</a></ol>';
   	  categories += '<ol><a class="category_filter" href="/city/search?category=' + data[i][0] 
   	  	+ '&city=' + dataArray['city']
   	  	+ '&keyword=' + dataArray['keywords'] + '">'
   	  	+ title + ' (' + data[i][6] + ') ' + '</a></ol>';
   	  
   	  if (i + 1 == limit)
   	    categories += '<div class="category_more"><a href="#" id="expandcategory" class=" right">more</a> </div>';
   }

   $('#category').html(categories);
 
   /**
   $('a.category_filter').click(function(){
   	  var id = $(this).attr('ref');
   	  passData['categoryid'] = id;
   	  passData['beginindex'] = 1;
      searchKeyword(passData);
      return false;
   });
   **/
   
   //slide toggle category
   $('#bycategory').click(function(){
      $('#category').slideToggle("slow");
   	  return false;
   });
   
   $('#expandcategory').click(function(){

   	if ( $("table.panel-table").length > 0 )
   	  $('table.panel-table').remove();
    else showPanel(0, data);
    
    return false;
   });
   
   //if user clicks somewhere else, remove all panel.
   $('body').click(function(){
      hideAllPanel();
   })
  
}
/**
 * action when user clicks on the category
 * @param {} name
 */
function showResult(name){
	
	var tempData = dataArray;
	tempData['categoryid'] = name;
    hideAllPanel();
	searchKeyword(tempData);

}
/**
 * Build the panel.
 * This is the four level panel where user can select the child category by 
 * going through a serial of parent categories.
 * @param {} level
 */
function showPanel(level,  data, parent){
	
    if (level == 0)
      var levelArray = categoryCount(data, level);
    else {
      var levelArray = categoryCountWithParent(data, level, parent.attr('name'));
    }
   
    levelArray = levelArray.sort(sortByValue);
        
      var position = "";
      if (level == 0){
         position = $("#expandcategory").offset();
         var offset = 50;
         var left = position.left + offset;
         var top = position.top;
      }
      else{
      	position = parent.offset();
        var left = position.left + 110;
        var top = position.top;
      }
      
	  var content = '<table style="position: absolute; left: ' + left + 'px; top: ' + top + 'px; width: 150px; overflow: hidden;" class="panel-table" id="panel-table' + level + '"><tr class="panel-r1"><td class="tl"></td><td class="b"></td><td class="tr"></td></tr><tr class="panel-r2"><td class="tl"></td><td class="b"><div id = "category-panel-' + level + '"class="category_panel panel_' + level + '" style = "border: 1px solid #ccc; background-color: #fff; " id="panel' + level + '">';
	  content += '<ul>';
	 
	  if (level != 4){
         for(i in levelArray){
             content += '<li><a class = "category_item_' + level + '" name="'+ i+ '" ref="' + (parseInt(level) + 1) + '" title="' + i + '">' + outputCategory(i) + ' (' + levelArray[i] + ')</a></li>';
         }
	  }
	  else{
	  	 for(i in levelArray){
	  	 	 var id = findId(data, i);
             content += '<li><a onclick="showResult(' + id + ')" class = "category_item_' + level + '" name="'+ i+ '" ref="' + (parseInt(level) + 1) + '" title="' + i + '">' + outputCategory(i) + ' (' + levelArray[i] + ')</a></li>';
         }
	  }
      content += '</ul>';
      content += '</div></td><td class="tr"></td></tr><tr class="panel-r3"><td class="tl"></td><td class="b"></td><td class="tr"></td></tr></table>';
      
      $('#category').append($(content));
      
     if (level != 4){
        $('a.category_item_' + level).hover(
          function(){
         	var nextlevel = $(this).attr('ref');

         	for (var i = parseInt(nextlevel); i < 5; i++)
          	 $('#panel-table' + i).remove();
            showPanel(nextlevel, data, $(this));
         },
         function(){
               
         }
       );
     }
}

/**
 * find the id of category in  the returned jason data
 * @param {} data
 * @param {} name
 * @return {}
 */
function findId(data, name)
{
	for(var i = 0; i < data.length; i++){
		if (name == data[i]['1'])
		   return data[i][0]
	}
}
/**
 * Output the category, if the category is too long, will only output a portion of 
 * the whole string
 * @param {} category
 * @return {}
 */
function outputCategory(category){
	if (category.length > 18)
	  category = category.substring(0, 15) + "...";
	  
	return category;
}


/**
 * return count with parent specified
 *
 */
function categoryCountWithParent(data, level, parent){
   temp = new Array();
   index = parseInt(level) + 2;
   
   if (level < 4){
   for(var i = 0; i < data.length; i++){
   	if (data[i][index - 1] == parent){

      if (temp[data[i][index]])
         temp[data[i][index]] += parseInt(data[i][6]);
      else
         temp[data[i][index]] = parseInt(data[i][6]);
         
     }
   }
  }
  
 if (level == 4){
  	for(var i = 0; i < data.length; i++){
  		 if (data[i][5] == parent){
  	      temp[data[i][1]] = data[i][6];
  		 }
  	}
  }
   return temp;
}


function categoryCount(data, level){
   temp = new Array();
   index = parseInt(level) + 2;
   
   for(var i = 0; i < data.length; i++){
      if (temp[data[i][index]])
         temp[data[i][index]] += parseInt(data[i][6]);
      else
         temp[data[i][index]] = parseInt(data[i][6]);
   }
  
   return temp;
}

//format string
function formatString(str) {
  str = str.toLowerCase();
  str = str.replace(/['"-]/g, "");
  str = str.replace(/\W/g, " ");
  str = str.replace(/\s+/g, " ");
  return str;
}

/**
 * Sort array by the number of searches found
 *
 */
function sortByQuantity(a, b){
	var x = a[6];
	var y = b[6];

	return ((x < y) ? 1 : ((x > y) ? -1 : 0));
}

function sortByValue(a, b){
   return b- a;
}

function googleMap(data){

	if ( typeof(GBrowserIsCompatible)==typeof(googleMap) && GBrowserIsCompatible()) {
       
	   gmarkers = [];
	   htmls = [];
	   gindex = 0;
	   $('#mapwrapper').css('display', 'block');
	   
	   //if map float is enabled, initiate float

	   $('#mapbutton').css('display', 'none');
        map = new GMap2(document.getElementById('mapsearch'));
        map.addControl(new GLargeMapControl());
        map.setCenter(new GLatLng(0,0),0);
        var bounds = new GLatLngBounds();

        for(var i = 0; i < data.length; i++){
            
           var company = data[i];
           var latitude = company['latitude'];
           var longitude = company['longitude'];
           
  
           var point = new GLatLng(latitude, longitude);
           var width = outputStar(company['rate']);
          
           var companyName = company['company_name'].replace(/\s/g, '-');
           var content = "";
	     	    //according to the rate, calculate the width for star
	       content += '<div style=" text-align: left;">' + '<span style="color: #ff0000; font-weight: bold;"><a href="/'+ currentCity + '/view/'+ companyName + '-' + company['ID'] 
	     	             +'/ " class="biz_tit_link">' + company['company_name'] +  '</a></span>' + 
	      		'<div class="rate"><div class="rate_star"  id = "rate" ><span style="width:' + width + 'px "></span></div>' + company['rate'] + '/5 (' + company['num_of_rate'] + ' reviews)';
	       content += '<br /><a href="/'+ currentCity + '/view/'+ companyName + '-' + company['ID'] 
	     	             +'/ " class="biz_tit_link">view</a>';	
	       content += '</div>';

           var marker = createMarker(point, content);

           map.addOverlay(marker);
           bounds.extend(point);
        }
         
        map.setZoom(map.getBoundsZoomLevel(bounds));
        map.setCenter(bounds.getCenter());
        
        //setup hover - popup information effect
        mapload = true;
        hoverPopup();

  }
}

/**
 * Toggle the map
 */
function togglemap(){
   $('#float_map').toggle(
   	function(){

	 $('#float_map').animate({'top': 10},{duration: 1000, queue: false});
	 $('#float_map h2 a').css("background-image", 'url(../img/map_float_btn_hover.gif)');
	 $('#float_map h2 a').text('Click here to disable floating');
	 mapfloat();
   
	},
	
    function(){
       $('#float_map h2 a').css("background-image", 'url(../img/map_float_btn.gif)');
        $('#float_map h2 a').text('Click here to float the map');
        disablemapfloat();
	  }
    );
}

function hoverPopup()
{
	$('li.rlt_list_blc').hover(
	  function(){
	   var i = $(this).attr('ref');
	   gmarkers[i].openInfoWindowHtml(htmls[i]);
	   
	}, function(){

	})
}

function createMarker(point, html){
   var marker = new GMarker(point);
   GEvent.addListener(marker, "click", function(){
      marker.openInfoWindowHtml(html);
   })
  
   gmarkers[gindex] = marker;
   htmls[gindex] = html;
  
   gindex++;

   return marker;
}