billboard = Class.create({
  initialize: function(node, params) {
  	this.className = 'billboard';
  	this.element = $(node);
  	this.params = params;
  	this.follow = false;

  	if (this.params.status == 'LINK'){
  		this.params.url = this.params.link;
  		this.follow = true;
  	}else{
  		this.params.url = '/billboards/page/?id='+this.params.id;
  	}
  	if (this.params.r_place > 0){
      this.params.url = '/billboards/click/?p_id='+this.params.r_place+'&url='+this.params.url
    }

    var html = '';
    if(this.follow == true){
      html += '<a href="'+this.params.url+'" target="_blank" class="title"><span>'+this.params.title+'</span></a><div class="userpic">';
  	}else{
      html += '<a href="'+this.params.url+'" target="_top" class="title"><span>'+this.params.title+'</span></a><div class="userpic">';
  	}

    
    if(this.follow == true){
      if(this.params.img_orient == 'FIT'){
        html += '<a href="'+this.params.url+'" target="_blank" style="display:table-cell;">';
      }else{
        html += '<a href="'+this.params.url+'" target="_blank">';
      }
      html += '<i></i><img src="'+this.params.img+'" alt="" style="width:60px;height:60px;" id="img_'+node+'" /></a></div></div>';
      html += '<a href="'+this.params.url+'" target="_blank" class="description">'+this.params.desc+'</a>';
  	}else{
      if(this.params.img_orient == 'FIT'){
        html += '<a href="'+this.params.url+'" target="_top" style="display:table-cell;">';
      }else{
        html += '<a href="'+this.params.url+'" target="_top">';
      }
      html += '<i></i><img src="'+this.params.img+'" alt="" style="width:60px;height:60px;" id="img_'+node+'" /></a></div></div>';
      html += '<a href="'+this.params.url+'" target="_top" class="description">'+this.params.desc+'</a>';
  	}
    //html += '<img src="'+this.params.img+'" alt="" style="width:60px;height:60px;" id="img_'+node+'" /></div></div>';
  	//html += '<div class="description">'+this.params.desc+'</div>';

    this.element.update(html)

    var newScript = document.createElement('script');
    newScript.type = "text/javascript";
    newScript.text = 'new imagePreload("'+this.params.img+'",{onload: ip_onLoad, orientation: "'+this.params.img_orient+'", id: "img_'+node+'"}, true)';
    this.element.appendChild(newScript);

    this.element.observe('mouseover',this.mouseOver.bindAsEventListener(this));
  	this.element.observe('mouseout',this.mouseOut.bindAsEventListener(this));
  	
  },
  
  mouseOut: function(e){
    this.element.style.cursor = "";
  },
  mouseOver: function(e){
    this.element.style.cursor = "pointer";
  }
});


get_billboards = function(p_id){		
	var url = '/billboards/get/?p_id=' + p_id;
	var options = {};
	options.method = 'get';
	//options.asynchronous = false;
	options.onLoading = function(responce) {			
	}
	options.onSuccess = function(transport) {
		var result = transport.responseJSON;
		if(result.status == 0){
			var billboards = result.billboards;
			var holder = $('horizontal_banner_id');
			holder.addClassName('billboard');
			var className = ''
			for (var i = 0; i < billboards.length; i++) {
        var div = new Element('div', {'class': 'banner','id':'billboard_id'+i});
        if(className != ''){
					div.addClassName(className);
          className = '';
				}else{
          className = 'invert_banner';
        }
				holder.insert(div);
				new billboard('billboard_id'+i, {id:billboards[i].id, link:billboards[i].link, title:billboards[i].title, desc:billboards[i].desc, status: billboards[i].status, img: billboards[i].img, r_place: billboards[i].r_place, img_orient: billboards[i].img_orient});
			}
		}else{
			//'Error occured'
		}
	}
	new Ajax.Request(url, options);
}

Event.observe(document, 'dom:loaded', function() {
  get_billboards(place_id);
});