crowdstart-checkout/lib/views/controls/index.js

One Click Checkout for Crowdstart

// Generated by CoffeeScript 1.10.0
var CardNumber, Checkbox, CountrySelect, Events, Input, InputView, QuantitySelect, Select, StateSelect, Static, analytics, countryUtils, crowdcontrol, emailRe, helpers, isNumber, isObject, requestAnimationFrame,
  extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },
  hasProp = {}.hasOwnProperty;

crowdcontrol = require('crowdcontrol');

Events = crowdcontrol.Events;

InputView = crowdcontrol.view.form.InputView;

requestAnimationFrame = crowdcontrol.utils.shim.requestAnimationFrame;

analytics = require('../../utils/analytics');

helpers = crowdcontrol.view.form.helpers;

helpers.defaultTagName = 'crowdstart-input';

isObject = require('is-object');

isNumber = require('is-number');

Input = (function(superClass) {
  extend(Input, superClass);

  function Input() {
    return Input.__super__.constructor.apply(this, arguments);
  }

  Input.prototype.tag = 'crowdstart-input';

  Input.prototype.errorHtml = require('../../../templates/control/error.jade');

  Input.prototype.html = require('../../../templates/control/input.jade');

  Input.prototype.js = function(opts) {
    return this.model = opts.input ? opts.input.model : this.model;
  };

  return Input;

})(InputView);

Input.register();

CardNumber = (function(superClass) {
  extend(CardNumber, superClass);

  function CardNumber() {
    return CardNumber.__super__.constructor.apply(this, arguments);
  }

  CardNumber.prototype.tag = 'crowdstart-card-number';

  CardNumber.prototype.html = require('../../../templates/control/cardnumber.jade');

  return CardNumber;

})(Input);

CardNumber.register();

Static = (function(superClass) {
  extend(Static, superClass);

  function Static() {
    return Static.__super__.constructor.apply(this, arguments);
  }

  Static.prototype.tag = 'crowdstart-static';

  Static.prototype.html = '<span>{ model.value }</span>';

  return Static;

})(Input);

Static.register();

Checkbox = (function(superClass) {
  extend(Checkbox, superClass);

  function Checkbox() {
    return Checkbox.__super__.constructor.apply(this, arguments);
  }

  Checkbox.prototype.tag = 'crowdstart-checkbox';

  Checkbox.prototype.html = require('../../../templates/control/checkbox.jade');

  Checkbox.prototype.change = function(event) {
    var value;
    value = event.target.checked;
    if (value !== this.model.value) {
      this.obs.trigger(Events.Input.Change, this.model.name, value);
      this.model.value = value;
      return this.update();
    }
  };

  return Checkbox;

})(Input);

Checkbox.register();

Select = (function(superClass) {
  var obj;

  extend(Select, superClass);

  function Select() {
    return Select.__super__.constructor.apply(this, arguments);
  }

  Select.prototype.tag = 'crowdstart-select';

  Select.prototype.html = require('../../../templates/control/select.jade');

  Select.prototype.tags = false;

  Select.prototype.min = 10;

  Select.prototype.lastValueSet = null;

  Select.prototype.events = (
    obj = {},
    obj["" + Events.Input.Set] = function(name, value) {
      if (name === this.model.name && (value != null)) {
        this.clearError();
        this.model.value = value;
        return riot.update();
      }
    },
    obj
  );

  Select.prototype.options = function() {
    return this.selectOptions;
  };

  Select.prototype.changed = false;

  Select.prototype.change = function(event) {
    var value;
    value = $(event.target).val();
    if (value !== this.model.value && parseFloat(value) !== this.model.value) {
      this.obs.trigger(Events.Input.Change, this.model.name, value);
      this.model.value = value;
      this.changed = true;
      return this.update();
    }
  };

  Select.prototype.isCustom = function(o) {
    var name, options, value;
    options = o;
    if (options == null) {
      options = this.options();
    }
    for (name in options) {
      value = options[name];
      if (isObject(value)) {
        if (!this.isCustom(value)) {
          return false;
        }
      } else if (name === this.model.value) {
        return false;
      }
    }
    return true;
  };

  Select.prototype.initSelect = function($select) {
    return $select.select2({
      tags: this.tags,
      placeholder: this.model.placeholder,
      minimumResultsForSearch: this.min
    }).change((function(_this) {
      return function(event) {
        return _this.change(event);
      };
    })(this));
  };

  Select.prototype.js = function(opts) {
    Select.__super__.js.apply(this, arguments);
    opts.style = opts.style || 'width:100%';
    this.selectOptions = opts.options;
    this.on('updated', (function(_this) {
      return function() {
        var $select;
        $select = $(_this.root).find('select');
        if ($select[0] != null) {
          if (!_this.initialized) {
            return requestAnimationFrame(function() {
              _this.initSelect($select);
              _this.initialized = true;
              return _this.changed = true;
            });
          } else if (_this.changed) {
            return requestAnimationFrame(function() {
              if (_this.isCustom()) {
                $select.select('destroy');
                _this.initSelect($select);
              }
              _this.changed = false;
              return $select.select2('val', _this.model.value);
            });
          }
        } else {
          return requestAnimationFrame(function() {
            return _this.update();
          });
        }
      };
    })(this));
    return this.on('unmount', (function(_this) {
      return function() {
        var $select;
        return $select = $(_this.root).find('select');
      };
    })(this));
  };

  return Select;

})(Input);

Select.register();

QuantitySelect = (function(superClass) {
  extend(QuantitySelect, superClass);

  function QuantitySelect() {
    return QuantitySelect.__super__.constructor.apply(this, arguments);
  }

  QuantitySelect.prototype.tag = 'crowdstart-quantity-select';

  QuantitySelect.prototype.options = function() {
    return {
      1: 1,
      2: 2,
      3: 3,
      4: 4,
      5: 5,
      6: 6,
      7: 7,
      8: 8,
      9: 9
    };
  };

  QuantitySelect.prototype.change = function(event) {
    var deltaQuantity, newValue, oldValue;
    oldValue = this.model.value;
    QuantitySelect.__super__.change.apply(this, arguments);
    newValue = this.model.value;
    deltaQuantity = newValue - oldValue;
    if (deltaQuantity > 0) {
      return analytics.track('Added Product', {
        id: this.model.productId,
        sku: this.model.productSlug,
        name: this.model.productName,
        quantity: deltaQuantity,
        price: parseFloat(this.model.price / 100)
      });
    } else if (deltaQuantity < 0) {
      return analytics.track('Removed Product', {
        id: this.model.productId,
        sku: this.model.productSlug,
        name: this.model.productName,
        quantity: deltaQuantity,
        price: parseFloat(this.model.price / 100)
      });
    }
  };

  return QuantitySelect;

})(Select);

QuantitySelect.register();

StateSelect = (function(superClass) {
  var obj;

  extend(StateSelect, superClass);

  function StateSelect() {
    return StateSelect.__super__.constructor.apply(this, arguments);
  }

  StateSelect.prototype.tag = 'crowdstart-state-select';

  StateSelect.prototype.html = require('../../../templates/control/stateselect.jade');

  StateSelect.prototype.country = '';

  StateSelect.prototype.events = (
    obj = {},
    obj["" + Events.Country.Set] = function(country) {
      this.country = country;
      if (this.country === 'us') {
        this.obs.trigger;
        return $(this.root).find('.select2').show();
      } else {
        $(this.root).find('.select2').hide();
        if (this.model.value != null) {
          return this.model.value = this.model.value.toUpperCase();
        }
      }
    },
    obj
  );

  StateSelect.prototype.options = function() {
    return require('../../data/states');
  };

  StateSelect.prototype.js = function() {
    StateSelect.__super__.js.apply(this, arguments);
    if (this.model.value != null) {
      return this.model.value = this.model.value.toLowerCase();
    }
  };

  return StateSelect;

})(Select);

StateSelect.register();

CountrySelect = (function(superClass) {
  var obj;

  extend(CountrySelect, superClass);

  function CountrySelect() {
    return CountrySelect.__super__.constructor.apply(this, arguments);
  }

  CountrySelect.prototype.tag = 'crowdstart-country-select';

  CountrySelect.prototype.min = 1;

  CountrySelect.prototype.events = (
    obj = {},
    obj["" + Events.Input.Set] = function(name, value) {
      if (name === this.model.name && (value != null)) {
        this.clearError();
        this.model.value = value;
        this.obs.trigger(Events.Country.Set, value);
        return riot.update();
      }
    },
    obj
  );

  CountrySelect.prototype.options = function() {
    return require('../../data/countries').data;
  };

  CountrySelect.prototype.js = function() {
    CountrySelect.__super__.js.apply(this, arguments);
    if (this.model.value != null) {
      this.model.value = this.model.value.toLowerCase();
    }
    return this.obs.trigger(Events.Country.Set, this.model.value);
  };

  return CountrySelect;

})(Select);

CountrySelect.register();

helpers.registerTag(function(inputCfg) {
  return inputCfg.hints.input;
}, 'crowdstart-input');

helpers.registerTag(function(inputCfg) {
  return inputCfg.hints.cardnumber;
}, 'crowdstart-card-number');

helpers.registerTag(function(inputCfg) {
  return inputCfg.hints["static"];
}, 'crowdstart-static');

helpers.registerTag(function(inputCfg) {
  return inputCfg.hints.checkbox;
}, 'crowdstart-checkbox');

helpers.registerTag(function(inputCfg) {
  return inputCfg.hints.select;
}, 'crowdstart-select');

helpers.registerTag(function(inputCfg) {
  return inputCfg.hints['state-select'];
}, 'crowdstart-state-select');

helpers.registerTag(function(inputCfg) {
  return inputCfg.hints['country-select'];
}, 'crowdstart-country-select');

helpers.registerTag(function(inputCfg) {
  return inputCfg.hints['quantity-select'];
}, 'crowdstart-quantity-select');

countryUtils = require('../../utils/country');

helpers.registerValidator((function(inputCfg) {
  return inputCfg.hints.input || inputCfg.hints.password;
}), function(model, name) {
  var value;
  value = model[name];
  if (!isNumber(value)) {
    value = value != null ? typeof value.trim === "function" ? value.trim() : void 0 : void 0;
  }
  return value;
});

helpers.registerValidator((function(inputCfg) {
  return inputCfg.hints.postalRequired;
}), function(model, name) {
  var value;
  value = model[name];
  if (countryUtils.requiresPostalCode(model.country || '') && ((value == null) || value === '')) {
    throw new Error("Required for Selected Country");
  }
  return value;
});

helpers.registerValidator((function(inputCfg) {
  return inputCfg.hints.required;
}), function(model, name) {
  var value;
  value = model[name];
  if (isNumber(value)) {
    return parseFloat(value);
  }
  value = value != null ? typeof value.trim === "function" ? value.trim() : void 0 : void 0;
  if ((value == null) || value === '') {
    throw new Error("Required");
  }
  return value;
});

helpers.registerValidator((function(inputCfg) {
  return inputCfg.hints.requiredstripe;
}), function(model, name) {
  var value;
  value = model[name];
  if (isNumber(value)) {
    return value;
  }
  value = value != null ? typeof value.trim === "function" ? value.trim() : void 0 : void 0;
  if (model._type === 'stripe' && ((value == null) || value === '')) {
    throw new Error("Required");
  }
  return value;
});

helpers.registerValidator((function(inputCfg) {
  return inputCfg.hints.uppercase;
}), function(model, name) {
  var value;
  value = model[name].toUpperCase();
  return value;
});

helpers.registerValidator((function(inputCfg) {
  return inputCfg.hints.terms;
}), function(model, name) {
  var value;
  value = model[name];
  if (!value) {
    throw new Error('Please read and agree to the terms and conditions.');
  }
  return value;
});

helpers.registerValidator((function(inputCfg) {
  return inputCfg.hints.name;
}), function(model, name) {
  var i, value;
  value = model[name];
  i = value.indexOf(' ');
  model.firstName = value.slice(0, i);
  model.lastName = value.slice(i + 1);
  return value;
});

helpers.registerValidator((function(inputCfg) {
  return inputCfg.hints.cardnumber;
}), function(model, name) {
  var value;
  value = model[name];
  value = value != null ? typeof value.trim === "function" ? value.trim() : void 0 : void 0;
  if (model._type !== 'stripe') {
    return value;
  }
  return crowdcontrol.utils.shim.promise["new"](function(resolve, reject) {
    return requestAnimationFrame(function() {
      if ($('input[name=number]').hasClass('jp-card-invalid')) {
        reject(new Error('Enter a valid card number'));
      }
      return resolve(value);
    });
  });
});

helpers.registerValidator((function(inputCfg) {
  return inputCfg.hints.expiration;
}), function(model, name) {
  var base, base1, date, value;
  value = model[name];
  value = value != null ? typeof value.trim === "function" ? value.trim() : void 0 : void 0;
  if (model._type !== 'stripe') {
    return value;
  }
  date = value.split('/');
  if (date.length < 2) {
    throw new Error('Enter a valid expiration date');
  }
  model.month = typeof (base = date[0]).trim === "function" ? base.trim() : void 0;
  model.year = ('' + (new Date()).getFullYear()).substr(0, 2) + (typeof (base1 = date[1]).trim === "function" ? base1.trim() : void 0);
  return crowdcontrol.utils.shim.promise["new"](function(resolve, reject) {
    return requestAnimationFrame(function() {
      if ($('input[name=expiry]').hasClass('jp-card-invalid')) {
        reject(new Error('Enter a valid expiration date'));
      }
      return resolve(value);
    });
  });
});

helpers.registerValidator((function(inputCfg) {
  return inputCfg.hints.cvc;
}), function(model, name) {
  var value;
  value = model[name];
  value = value != null ? typeof value.trim === "function" ? value.trim() : void 0 : void 0;
  if (model._type !== 'stripe') {
    return value;
  }
  return crowdcontrol.utils.shim.promise["new"](function(resolve, reject) {
    return requestAnimationFrame(function() {
      if ($('input[name=cvc]').hasClass('jp-card-invalid')) {
        reject(new Error('Enter a valid CVC number'));
      }
      return resolve(value);
    });
  });
});

emailRe = /^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;

helpers.registerValidator((function(inputCfg) {
  return inputCfg.hints.email;
}), function(model, name) {
  var value;
  value = model[name];
  value = value != null ? typeof value.trim === "function" ? value.trim() : void 0 : void 0;
  if (!emailRe.test(value)) {
    throw new Error("Enter a valid email");
  }
  return value;
});

helpers.registerValidator((function(inputCfg) {
  return inputCfg.hints.parsenumber;
}), function(model, name) {
  var value;
  value = model[name];
  value = value != null ? typeof value.trim === "function" ? value.trim() : void 0 : void 0;
  return parseFloat(value);
});

//# sourceMappingURL=index.js.map