/*
/*  peppermedia.js
*/

var FormObserver = Class.create({
  initialize: function (el, options) {
    this.el      = el;
    this.options = options;
    this.observeElement();
  },
  
  observeElement: function () {
    var obj = this;
    this.el.observe("change", function () {
      obj.updateForm();
    });
    this.el.observe("input", function () {
      obj.updateForm();
    });
  },
  
  updateForm: function () {
    new Ajax.Updater(this.options.update, this.options.url, {
      method:     "post",
      parameters: this.el.up("form").serialize(true)
    });
  }
})

document.observe("dom:loaded", function () {
  if ($$("form#subscribe")) {
    new FormObserver($("credit_card_number"), {
      url:    "/credit_cards/number_status",
      update: $("credit-card-number-status")
    });
    new FormObserver($("credit_card_exp_month"), {
      url:    "/credit_cards/exp_date_status",
      update: $("credit-card-exp-date-status")
    });
    new FormObserver($("credit_card_exp_year"), {
      url:    "/credit_cards/exp_date_status",
      update: $("credit-card-exp-date-status")
    });
    new FormObserver($("credit_card_number"), {
      url:    "/credit_cards/cvv_hint",
      update: $("credit-card-cvv-hint")
    });
  }
});