Ext.onReady(function(){
  Ext.Direct.addProvider(Ext.app.REMOTING_API);

  var Cookies = Ext.util.Cookies;
  Ext.BLANK_IMAGE_URL = 'assets/images/s.gif';
  Ext.form.Field.prototype.msgTarget = 'under';
  var lastKnownUser = Cookies.get('lun') || '';

  var formPanel = new Ext.FormPanel({
    labelWidth: 70,
    labelAlign: 'top',
    monitorValid: true,
    baseCls: 'x-plain',
    el: 'form-box',
    autoHeight: true,
    defaultType: 'textfield',
    defaults: {
      validationEvent: false,
      validateOnBlur: false
    },
    items: [{
      id: 'email',
      fieldLabel: 'Email',
      name: 'email',
      width: 185,
      allowBlank: false,
      autoCreate: {
        tag: "input",
        type: "text",
        autocomplete: "on"
      }
    }],
    buttons: [{
      text: 'Email me',
      disabled: true,
      handler: doResetPassword,
      formBind: true
    }],
    keys: [{
      key: 13,
      fn: doResetPassword
    }]
  });


  var panel = new Ext.Panel({
    layout:'table',
    layoutConfig:{columns:2},
    frame: true,
    el: 'login-box',
    autoHeight: true,
    items: [{
      xtype: 'box',
      el: 'info-box',
      colspan: 2,
      cellCls:'info-cell'
    },{
      xtype: 'box',
      width: 150,
      el: 'left-box',
      cellCls:'left-cell'
    },formPanel]
  });
  panel.render();

  // get a ref to logo.
  var logo = Ext.getDom('logo');

  function doResetPassword(){
    var form = formPanel.getForm();
    var btn = formPanel.buttons[0];

    if (form.isValid()) {
      //animate the logo
      //logo.src = 'assets/images/extlogo64-anim.gif';

      var o = form.getFieldValues();
      saveCookies(o);  //?

      //disable the form
      form.callFieldMethod('disable');
      btn.formBind = false;
      btn.disable();

      LoginAction.resetPassword(o.email, function(url, res) {
        // un-animate logo.
        //logo.src = 'assets/images/extlogo64.gif';

        if (res.status === false) {
            // something bad happened.  show message and return.
            form.callFieldMethod('enable');
            btn.formBind = true;
            btn.enable();
            return Ext.MessageBox.alert('Error', res.message);
        }

        Ext.Msg.show({
           title:'Success',
           msg: 'Your password has been changed and emailed to you.',
           buttons: Ext.Msg.OK,
           fn: function() {
             window.location.href = url;
           },
           icon: Ext.MessageBox.INFO
        });
      });
    }
  }

  function getTimeOffset(){
    var date = new Date();
      date.setFullYear(date.getFullYear() + 1);
    return ((new Date().getTimezoneOffset() / 60) * -1) * 1000 * 60 * 60;
  }

  function saveCookies(o){
    var date = new Date();
    date.setFullYear(date.getFullYear() + 1);
    Cookies.set('lun', o.email, date);
  }

  if (lastKnownUser) {
    formPanel.items.get('email').setValue(lastKnownUser);
  } else {
    formPanel.items.get('email').focus(true, true);
  }
});

