var ExpandCollapse = Class.create({
  initialize:function(){
    $$('.expand-collapse-trigger').invoke('observe','click', this.expandCollapse.bindAsEventListener(this));
  },
  expandCollapse:function(event){
    Event.stop(event);
    aLink = Event.element(event);
    aTarget = $(aLink.readAttribute('rel'));
    if(aTarget!=undefined){
      new Effect.toggle(aTarget, 'blind',{duration:0.5})  
    }
  }
  
});

var FormWarning = Class.create({
  initialize:function(wForm){
    this.wForm = wForm; // the form
    this.wAlert = false; // flag to ckeck if we want to alert the warning
    this.wMessage = "All the information entered will be lost!"; // warning text
    
    /* Observe form elements */
    this.wForm.getElements().invoke('observe', 'change', this.fieldChange.bindAsEventListener(this));
        
    this.wForm.observe('submit', this.clearWarning.bindAsEventListener(this));
    Event.observe(window, 'beforeunload', this.showWarning.bindAsEventListener(this))
  },
  
  fieldChange:function(event){
    this.wAlert = true;
  },
  
  showWarning:function(event){
    if(this.wAlert){
      event.returnValue = this.wMessage;
    }
  },
  
  clearWarning:function(event){
    this.wAlert = false;
  }
  
  
});

showTooltip = function(event){
  ibutton = Event.findElement(event,'img.info-button');
  tooltip_text = ibutton.hasAttribute('tooltip') ? ibutton.readAttribute('tooltip') : ibutton.readAttribute('alt')
  if(!ibutton.hasAttribute('tooltip')){
    ibutton.writeAttribute('tooltip', ibutton.readAttribute('alt'));
    ibutton.writeAttribute('alt','');
  }
  overlib(tooltip_text);
}

hideTooltip = function(event){
  nd();
}


hideSuccessMessages = function(pe){
  $$('.flash-success').invoke('fade');
  pe.stop();
}

document.observe("dom:loaded",function(){
  ol_fgcolor = '#5696D0';
  ol_bgcolor = '#19789D';
  ol_textcolor = '#ffffff';
  ol_width="200";    
  
  new ExpandCollapse();
  $$('img.info-button').invoke('observe', 'mouseover', showTooltip)
  $$('img.info-button').invoke('observe', 'mouseout', hideTooltip)
  $$('form.show-warning').each(function(f){
    new FormWarning(f);
  });
  
})

  populatePositions=function(ajax){
    var self= this;
    $A(ajax.headerJSON).each(function(position,key){
      self.positions_select.options[key+1] = new Option(position.position_name, position.position_id, false, false)
    });
    this.positions_select.options[0].text = self.positions_select_default_text;
  }

  getJobAreaPositions = function(event){
    var self= this;
    job_area_select = Event.findElement(event, 'select');
    job_area_id = job_area_select.options[job_area_select.selectedIndex].value;
    position_select_container = $('position_'+job_area_select.readAttribute('id'));
    // clear positions select
    self.positions_select = position_select_container.select('select').first();
    self.positions_select_default_text = this.positions_select.options[0].text;
    
    if(positions_select !=undefined){
      positions_select.options.length = 1;
      
    }
    // Make the Ajax request
    if(position_select_container !=undefined && job_area_id !=''){
       new Ajax.Request(
        '/im/positions',
        {
          postBody:"job_area_id="+job_area_id,
          onComplete:populatePositions.bind(self),
          onCreate:function(){
            self.positions_select.options[0].text = 'Loading...';
          }
        }
      );
    }
  }
 
 Ajax.Responders.register({
    onCreate: function(req) {
      if($(req.container.success) != undefined)
      $(req.container.success).update('<div style="padding:3px;"> <img id="spinner" src="\/img\/spinner.gif" style="float:left;margin:0 5px;">Loading..<\/div>')
    },
    onComplete:function(req){
       if($(req.container.success) != undefined){
        $(req.container.success).select('img.info-button').invoke('observe', 'mouseover', showTooltip);
        $(req.container.success).select('img.info-button').invoke('observe', 'mouseout', hideTooltip);
        lightwindowInit();
       }
    }
  });