// the join panel is only setup if there are no mailing cookies

var trace = function(str){

    try {
        opera.postError(str);
    } 
    catch (e) {
        try {
            console.log(str);
        } 
        catch (f) {
            //alert(str);
        }
    }

}

var JoinPanel = new Class({

  options:
  {
    onClose: Class.empty
   ,onFadeout: Class.empty
   ,content: false
   ,joinPanel: false
   ,joinDetails: false
   ,lnkJoin: false
   ,lnkClose: false
   ,joinForm: false
   ,joinResponse: false
   ,formName: false
   ,formEmail: false
   ,mailLinks: false
   ,loaderCssClass: 'loader_black'
  }
  
 ,initialize: function(options) {

    if (window.debugging) { trace('JoinPanel.initialize()'); }
    
    this.setOptions(options);

    this.content      = this.options.content      ? ($type(this.options.content) == 'element' ? this.options.content : $(this.options.content)) : $('content');
    this.joinPanel    = this.options.joinPanel    ? ($type(this.options.joinPanel) == 'element' ? this.options.joinPanel : $(this.options.joinPanel)) : $('joinPanel');
    this.joinDetails  = this.options.joinDetails  ? ($type(this.options.joinDetails) == 'element' ? this.options.joinDetails : $(this.options.joinDetails)) : $('joinDetails');
    this.lnkJoin      = this.options.lnkJoin      ? ($type(this.options.lnkJoin) == 'element' ? this.options.lnkJoin : $(this.options.lnkJoin)) : $('lnkJoin');
    this.lnkClose     = this.options.lnkClose     ? ($type(this.options.lnkClose) == 'element' ? this.options.lnkClose : $(this.options.lnkClose)) : $('close');
    this.joinDetails  = this.options.joinDetails  ? ($type(this.options.joinDetails) == 'element' ? this.options.joinDetails : $(this.options.joinDetails)) : $('joinDetails');
    this.joinForm     = this.options.joinForm     ? ($type(this.options.joinForm) == 'element' ? this.options.joinForm : $(this.options.joinForm)) : $('joinForm');
    this.joinResp     = this.options.joinResponse ? ($type(this.options.joinResponse) == 'element' ? this.options.joinResponse : $(this.options.joinResponse)) : $('joinResponse');
    this.formName     = this.options.formName     ? ($type(this.options.formName) == 'element' ? this.options.formName : $(this.options.formName)) : $('NAME');
    this.formEmail    = this.options.formEmail    ? ($type(this.options.formEmail) == 'element' ? this.options.formEmail : $(this.options.formEmail)) : $('EMAIL');
    this.mailLinks    = this.options.mailLinks    ? ($type(this.options.mailLinks) == 'array' ? this.options.mailLinks : $$(this.options.mailLinks)) : $$('.mailing');

    if (window.debugging) { trace(this.content,        this.joinForm,        this.joinResp,        this.lnkClose,        this.lnkJoin,       this.formName,        this.formEmail); }
    if (window.debugging) { trace($chk(this.content),  $chk(this.joinForm),  $chk(this.joinResp),  $chk(this.lnkClose),  $chk(this.lnkJoin), $chk(this.formName),  $chk(this.formEmail)); }
    if ( !( $chk(this.joinForm) && $chk(this.joinResp) && $chk(this.lnkClose) && $chk(this.lnkJoin) && $chk(this.formName) && $chk(this.formEmail) ) ) {
      if (window.debugging) { trace('JoinPanel.quitting()'); }
      return;
    }
    
    this.setupJoinPanelOpen();
    
  }
  
, displayJoinPanel: function() {
    if (window.debugging) { trace('JoinPanel.displayJoinPanel()'); }
    // show the form and hide the response panel
    this.joinForm.setStyle('display', 'block');
//    this.joinResp.setStyle('display', 'none');
//    this.joinResp.setHTML('');
    // ensure that the join panel is now put back in the flow (its none by default via css) and start the join panel's fade-in transition
    this.joinPanel.setStyle('display', 'block');
    this.joinPanel.$tmp.fx.start(1);
    
    this.setMailingViewed();              // log that panel viewed
    this.resetFadeTimeout();
  }
  
, setupJoinPanelOpen: function() {
    if (window.debugging) { trace('JoinPanel.setUpJoinPanelOpen()'); }
    // make the join panel see through
    this.joinPanel.setStyle('opacity', 0);
    // add its opacity transition
    this.joinPanel.$tmp.fx = new Fx.Style(this.joinPanel, 'opacity'
     ,{
        'wait': true
       ,'duration': 1000
       ,'transition': Fx.Transitions.Quart.easeInOut
       ,'onComplete': this.setUpJoinPanelClose.bind(this)
      }
    );

    // add corresponding events to the join and close links
    this.lnkJoin.addEvent('click', this.sendMaillistJoin.bind(this));
    this.lnkClose.addEvent('click', this.cancelMailingList.bind(this));
    // reset timeout on form focus/keypress
    this.formName.addEvent('keydown', this.resetFadeTimeout.bind(this));
    this.formEmail.addEvent('keydown', this.resetFadeTimeout.bind(this));

    // create the transitions and display the join panel
    this.mailLinks.each(function(el){
      el.addEvent('click', this.displayJoinPanel.bind(this));
    }.bind(this));
    
  }
  
, setUpJoinPanelClose: function() {
    if (window.debugging) { trace('JoinPanel.setUpJoinPanelClose()'); }
    
    this.content.setStyle('display', 'block');
    this.joinPanel.$tmp.fx = new Fx.Style(
        this.joinPanel
       ,'opacity'
       ,{
          'wait': true
         ,'duration': 1000
         ,'transition': Fx.Transitions.Quart.easeInOut
         ,'onComplete': this.notifyClose.bind(this)
        }
    );

  }

, cancelMailingList: function() {
    this.setMailingMember('none');
    this.fadeOut();
  }
    
  // fire the onClose event 
, notifyClose: function() {
    this.fireEvent('onFadeout', { type: 'onFadeout', target: this });
  }
  
, validate: function(name, email) {
    var reEml = new RegExp("\\w+([-+.']\\w+)*@\\w+([-.]\\w+)*\\.\\w+([-.]\\w+)*");
    return (name != '') && reEml.exec(email);
  }

  // sends an ajax request to the mailing list joinup proxy page
  // if successful, we show a success message, tell them to click the confirm link in the email they should have just received
  // if failure, we show a failure message, tell them to click the mailing list link in the nav again
  // after a short amount of time fade the join panel out
, sendMaillistJoin: function() {
    if (window.debugging) { trace('JoinPanel.sendMaillistJoin'); }
    var name = this.formName.getProperty('value');
    var email = this.formEmail.getProperty('value');
    if (this.validate(name, email)) {
      this.joinForm.setStyle('display', 'none');
      this.joinResp.setStyle('display', 'block');
      $('joinDetails').addClass(this.loaderCssClass);
      // ajax will return a call to setMailingMember if successful
      new Ajax('/xml/mailinglist.aspx', {
        method: 'get',
        data: this.joinForm.toQueryString(),
        evalScripts: true,
        update: this.joinResp,
        onFailure: function() {
          this.joinDetails.removeClass(this.loaderCssClass);
          this.joinResp.setHTML('<p>The server has failed to respond.</p>');
          this.fadeOut.delay(10000, this);
        }.bind(this),
        onSuccess: function() {
          this.setMailingMember(this.formEmail.getProperty('value'));
          this.formName.setProperty('value', '');
          this.formEmail.setProperty('value', '');
          this.joinDetails.removeClass(this.loaderCssClas);
          this.fadeOut.delay(10000, this);
        }.bind(this)
      }).request();
      
    }
    else {
      alert('You need to supply your name and a valid email address to join the mailing list.');
    }
  }

, fadeOut: function() {
    if (window.debugging) { trace('JoinPanel.joinFadeOut'); }
    this.joinPanel.$tmp.fx.start('0');
    this.fireEvent('onClose', { type: 'onClose', target: this });
  }

, displayJoinPanelByClick: function(evt) {
    if (window.debugging) { trace('JoinPanel.displayJoinPanelByClick '+evt); }
    new Event(evt).stop();
    this.displayJoinPanel();
    return false; // block page refresh called by mailing list link
  }

, resetFadeTimeout: function() {
    if (window.debugging) { trace('JoinPanel.resetJoinFadeTimeout '); }
    $clear(this.joinPanelTimeoutID);
    this.joinPanelTimeoutID = this.fadeOut.delay(60000, this);   // automatically transition after 60 sec
  }


, setMailingMember: function(email) {
    if (window.debugging) { trace('JoinPanel.setMailingMember '); }
    //Cookie.remove(Cookie.get('mailingListMember'));
    Cookie.set('mailingListMember', email, {duration: 90});
  }

, setMailingViewed: function() {
    if (window.debugging) { trace('JoinPanel.setMailingViewed '); }
    Cookie.set('mailingListViewed', 'true', {duration: 90});
  }

});

JoinPanel.implement(new Options, new Events);