var Shorten = Class.create({
  initialize: function(name,form,element,button,loading_img) {
    $(loading_img).hide();
    this.name=name;
    this.form=form;
    this.element=element;
    document.observe('data:loading', function(){
      $(loading_img).show();
    });
    document.observe('data:success', function(){
      $(loading_img).hide();
    });
    document.observe('shorten:page_info', function(){
    });
    $(button).observe('click', function(){
      u=new AjaxUtils('make_short','ajax_loading_icon','short_url',$('url_form').action,$('url_form').serialize(true),'shorten:shorten_created');
      u.do_ajax_request();
    }.bind(this));
    document.observe('shorten:shorten_created', function(){
      try{
        u2=new AjaxUtils('get_link','ajax_loading_icon','link_info','/set_page_title'+$('shortened_url').value.match(/\/[ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz1234567890-_]+$/),'','shorten:link_loaded');
        u2.do_ajax_request();
      }
      catch(err){
        
      }
    });
    document.observe('shorten:link_loaded', function(){
    });
  },
  
  shorten_created: function(){
  }
  
});


var AjaxUtils = Class.create({
  initialize: function(name,loading_element,update_element,url,params,event) {
    $(loading_element).hide();
    this.name=name;
    this.loading_element=loading_element;
    this.update_element=update_element;
    this.url=url;
    this.params=params;
    this.event=event;
    document.observe('utils_data:loading', function(){
      $(loading_element).show();
    });
    document.observe('utils_data:success', function(){
      $(loading_element).hide();
    });
    document.observe('utils_data:complete', function(){
      $(loading_element).hide();
    });
    document.observe('utils_data:failure', function(){
      $(loading_element).hide();
    });
  },
  
  do_ajax_request: function() {
    var params = this.params;
    this.ajax_req = new Ajax.Request(this.url, {
      method: 'GET',
      asynchronous: true,
      parameters: params,
      onLoading: function() {
        document.fire('utils_data:loading');
      }.bind(this),
      onSuccess: function(transport) {
        document.fire(this.event);
        $(this.update_element).update(transport.responseText);
        if($(this.update_element).select('.highlight')[0]){
          new Effect.Highlight($(this.update_element).select('.highlight')[0]);
        }
        document.fire(this.event);
        document.fire('utils_data:success');
      }.bind(this),
      onFailure: function() {
        document.fire('utils_data:failure');
      }.bind(this),
      onComplete: function() {
        document.fire('utils_data:complete');
      }.bind(this)
    });
  }
});

var Callout = Class.create({
  initialize: function(element,content,params){
    this.content=content;
    this.params={
      
    };
    Object.extend(this.params, params || {});
    this.mouse_over_event=this.show.bindAsEventListener(this);
    this.mouse_out_event=this.hide.bindAsEventListener(this);
    element.observe('mouseover',this.mouse_over_event);
    element.observe('mouseout',this.mouse_out_event);
  },
  show: function(event){
    Event.stop(event);
    x=event.element().cumulativeOffset()[0]+(event.element().getWidth()/2)-125;
    y=event.element().cumulativeOffset()[1]+(event.element().getHeight()/2)+10;
    if(!$('callout_div')){
      iframe=new Element('obj',{id:'callout_div'});
      iframe.insert(new Element('div',{id:'callout_div_content'}));
      $$('body')[0].insert({top:iframe});
    }
    $('callout_div').setStyle({
      left:x+"px",
      top:y+"px"
    });
    if($('callout_div_content')){
      $('callout_div_content').update(this.content);
    }
  },

  hide: function(event){
    Event.stop(event);
    if($('callout_div')){
      $('callout_div').remove();      
    }
  },
  
  html: function(){
  }

});

var shorten;
var utils;
document.observe('dom:loaded', function(e){
  shorten = new Shorten('shorten','url_form','short_url','shorten_button','ajax_loading_icon');
  $('url').observe('focus',function(e){
    $('url').value="";
    $('url').removeClassName("virgin");
    $('url').addClassName("active");
  });
  $('url').observe('blur',function(e){
    $('url').removeClassName("active");
    if($('url').value.length<7){
      $('url').value="Paste your url here. Your URL must start with http:// or https://";
      $('url').addClassName("virgin");
    }
  });
  $('url_form').observe('submit',function(e){
    Event.stop(e);
    shorten._do_ajax_request();
    return false;
  });

  $$('.callout_stats').each(function(el){
    content="<h4>stats</h4>"+el.up().select('.stats')[0].innerHTML;
    new Callout(el,content);
  });
});