'use strict';
var Destructor = require('../../lib/destructor');
var classlist = require('../../lib/classlist');
var iFramer = require('iframer');
var Bus = require('../../lib/bus');
var BraintreeError = require('../../lib/error');
var composeUrl = require('./compose-url');
var constants = require('../shared/constants');
var errors = require('../shared/errors');
var INTEGRATION_TIMEOUT_MS = require('../../lib/constants').INTEGRATION_TIMEOUT_MS;
var uuid = require('../../lib/uuid');
var findParentTags = require('../shared/find-parent-tags');
var throwIfNoCallback = require('../../lib/throw-if-no-callback');
var isIos = require('../../lib/is-ios');
var events = constants.events;
var EventEmitter = require('../../lib/event-emitter');
var injectFrame = require('./inject-frame');
var analytics = require('../../lib/analytics');
var whitelistedFields = constants.whitelistedFields;
var VERSION = require('package.version');
var methods = require('../../lib/methods');
var convertMethodsToError = require('../../lib/convert-methods-to-error');
var deferred = require('../../lib/deferred');
var sharedErrors = require('../../errors');
var getCardTypes = require('credit-card-type');
/**
* @typedef {object} HostedFields~tokenizePayload
* @property {string} nonce The payment method nonce.
* @property {object} details Additional account details.
* @property {string} details.cardType Type of card, ex: Visa, MasterCard.
* @property {string} details.lastTwo Last two digits of card number.
* @property {string} description A human-readable description.
* @property {string} type The payment method type, always `CreditCard`.
*/
/**
* @typedef {object} HostedFields~stateObject
* @description The event payload sent from {@link HostedFields#on|on} or {@link HostedFields#getState|getState}.
* @property {HostedFields~hostedFieldsCard[]} cards
* This will return an array of potential {@link HostedFields~hostedFieldsCard|cards}. If the card type has been determined, the array will contain only one card.
* Internally, Hosted Fields uses <a href="https://github.com/braintree/credit-card-type">credit-card-type</a>,
* an open-source card detection library.
* @property {string} emittedBy
* The name of the field associated with an event. This will not be included if returned by {@link HostedFields#getState|getState}. It will be one of the following strings:<br>
* - `"number"`
* - `"cvv"`
* - `"expirationDate"`
* - `"expirationMonth"`
* - `"expirationYear"`
* - `"postalCode"`
* @property {object} fields
* @property {?HostedFields~hostedFieldsFieldData} fields.number {@link HostedFields~hostedFieldsFieldData|hostedFieldsFieldData} for the number field, if it is present.
* @property {?HostedFields~hostedFieldsFieldData} fields.cvv {@link HostedFields~hostedFieldsFieldData|hostedFieldsFieldData} for the CVV field, if it is present.
* @property {?HostedFields~hostedFieldsFieldData} fields.expirationDate {@link HostedFields~hostedFieldsFieldData|hostedFieldsFieldData} for the expiration date field, if it is present.
* @property {?HostedFields~hostedFieldsFieldData} fields.expirationMonth {@link HostedFields~hostedFieldsFieldData|hostedFieldsFieldData} for the expiration month field, if it is present.
* @property {?HostedFields~hostedFieldsFieldData} fields.expirationYear {@link HostedFields~hostedFieldsFieldData|hostedFieldsFieldData} for the expiration year field, if it is present.
* @property {?HostedFields~hostedFieldsFieldData} fields.postalCode {@link HostedFields~hostedFieldsFieldData|hostedFieldsFieldData} for the postal code field, if it is present.
*/
/**
* @typedef {object} HostedFields~hostedFieldsFieldData
* @description Data about Hosted Fields fields, sent in {@link HostedFields~stateObject|stateObjects}.
* @property {HTMLElement} container Reference to the container DOM element on your page associated with the current event.
* @property {boolean} isFocused Whether or not the input is currently focused.
* @property {boolean} isEmpty Whether or not the user has entered a value in the input.
* @property {boolean} isPotentiallyValid
* A determination based on the future validity of the input value.
* This is helpful when a user is entering a card number and types <code>"41"</code>.
* While that value is not valid for submission, it is still possible for
* it to become a fully qualified entry. However, if the user enters <code>"4x"</code>
* it is clear that the card number can never become valid and isPotentiallyValid will
* return false.
* @property {boolean} isValid Whether or not the value of the associated input is <i>fully</i> qualified for submission.
*/
/**
* @typedef {object} HostedFields~hostedFieldsCard
* @description Information about the card type, sent in {@link HostedFields~stateObject|stateObjects}.
* @property {string} type The code-friendly representation of the card type. It will be one of the following strings:
* - `american-express`
* - `diners-club`
* - `discover`
* - `jcb`
* - `maestro`
* - `master-card`
* - `unionpay`
* - `visa`
* @property {string} niceType The pretty-printed card type. It will be one of the following strings:
* - `American Express`
* - `Diners Club`
* - `Discover`
* - `JCB`
* - `Maestro`
* - `MasterCard`
* - `UnionPay`
* - `Visa`
* @property {object} code
* This object contains data relevant to the security code requirements of the card brand.
* For example, on a Visa card there will be a <code>CVV</code> of 3 digits, whereas an
* American Express card requires a 4-digit <code>CID</code>.
* @property {string} code.name <code>"CVV"</code> <code>"CID"</code> <code>"CVC"</code>
* @property {number} code.size The expected length of the security code. Typically, this is 3 or 4.
*/
/**
* @name HostedFields#on
* @function
* @param {string} event The name of the event to which you are subscribing.
* @param {function} handler A callback to handle the event.
* @description Subscribes a handler function to a named event. `event` should be {@link HostedFields#event:blur|blur}, {@link HostedFields#event:focus|focus}, {@link HostedFields#event:empty|empty}, {@link HostedFields#event:notEmpty|notEmpty}, {@link HostedFields#event:cardTypeChange|cardTypeChange}, or {@link HostedFields#event:validityChange|validityChange}. Events will emit a {@link HostedFields~stateObject|stateObject}.
* @example
* <caption>Listening to a Hosted Field event, in this case 'focus'</caption>
* hostedFields.create({ ... }, function (createErr, hostedFieldsInstance) {
* hostedFieldsInstance.on('focus', function (event) {
* console.log(event.emittedBy, 'has been focused');
* });
* });
* @returns {void}
*/
/**
* This event is emitted when the user requests submission of an input field, such as by pressing the Enter or Return key on their keyboard, or mobile equivalent.
* @event HostedFields#inputSubmitRequest
* @type {HostedFields~stateObject}
* @example
* <caption>Clicking a submit button upon hitting Enter (or equivalent) within a Hosted Field</caption>
* var hostedFields = require('braintree-web/hosted-fields');
* var submitButton = document.querySelector('input[type="submit"]');
*
* hostedFields.create({ ... }, function (createErr, hostedFieldsInstance) {
* hostedFieldsInstance.on('inputSubmitRequest', function () {
* // User requested submission, e.g. by pressing Enter or equivalent
* submitButton.click();
* });
* });
*/
/**
* This event is emitted when a field transitions from having data to being empty.
* @event HostedFields#empty
* @type {HostedFields~stateObject}
* @example
* <caption>Listening to an empty event</caption>
* hostedFields.create({ ... }, function (createErr, hostedFieldsInstance) {
* hostedFieldsInstance.on('empty', function (event) {
* console.log(event.emittedBy, 'is now empty');
* });
* });
*/
/**
* This event is emitted when a field transitions from being empty to having data.
* @event HostedFields#notEmpty
* @type {HostedFields~stateObject}
* @example
* <caption>Listening to an notEmpty event</caption>
* hostedFields.create({ ... }, function (createErr, hostedFieldsInstance) {
* hostedFieldsInstance.on('notEmpty', function (event) {
* console.log(event.emittedBy, 'is now not empty');
* });
* });
*/
/**
* This event is emitted when a field loses focus.
* @event HostedFields#blur
* @type {HostedFields~stateObject}
* @example
* <caption>Listening to a blur event</caption>
* hostedFields.create({ ... }, function (createErr, hostedFieldsInstance) {
* hostedFieldsInstance.on('blur', function (event) {
* console.log(event.emittedBy, 'lost focus');
* });
* });
*/
/**
* This event is emitted when a field gains focus.
* @event HostedFields#focus
* @type {HostedFields~stateObject}
* @example
* <caption>Listening to a focus event</caption>
* hostedFields.create({ ... }, function (createErr, hostedFieldsInstance) {
* hostedFieldsInstance.on('focus', function (event) {
* console.log(event.emittedBy, 'gained focus');
* });
* });
*/
/**
* This event is emitted when activity within the number field has changed such that the possible card type has changed.
* @event HostedFields#cardTypeChange
* @type {HostedFields~stateObject}
* @example
* <caption>Listening to a cardTypeChange event</caption>
* hostedFields.create({ ... }, function (createErr, hostedFieldsInstance) {
* hostedFieldsInstance.on('cardTypeChange', function (event) {
* if (event.cards.length === 1) {
* console.log(event.cards[0].type);
* } else {
* console.log('Type of card not yet known');
* }
* });
* });
*/
/**
* This event is emitted when the validity of a field has changed. Validity is represented in the {@link HostedFields~stateObject|stateObject} as two booleans: `isValid` and `isPotentiallyValid`.
* @event HostedFields#validityChange
* @type {HostedFields~stateObject}
* @example
* <caption>Listening to a validityChange event</caption>
* hostedFields.create({ ... }, function (createErr, hostedFieldsInstance) {
* hostedFieldsInstance.on('validityChange', function (event) {
* var field = event.fields[event.emittedBy];
*
* if (field.isValid) {
* console.log(event.emittedBy, 'is fully valid');
* } else if (field.isPotentiallyValid) {
* console.log(event.emittedBy, 'is potentially valid');
* } else {
* console.log(event.emittedBy, 'is not valid');
* }
* });
* });
*/
function createInputEventHandler(fields) {
return function (eventData) {
var field;
var merchantPayload = eventData.merchantPayload;
var emittedBy = merchantPayload.emittedBy;
var container = fields[emittedBy].containerElement;
Object.keys(merchantPayload.fields).forEach(function (key) {
merchantPayload.fields[key].container = fields[key].containerElement;
});
field = merchantPayload.fields[emittedBy];
classlist.toggle(container, constants.externalClasses.FOCUSED, field.isFocused);
classlist.toggle(container, constants.externalClasses.VALID, field.isValid);
classlist.toggle(container, constants.externalClasses.INVALID, !field.isPotentiallyValid);
this._state = { // eslint-disable-line no-invalid-this
cards: merchantPayload.cards,
fields: merchantPayload.fields
};
this._emit(eventData.type, merchantPayload); // eslint-disable-line no-invalid-this
};
}
/**
* @class HostedFields
* @param {object} options The Hosted Fields {@link module:braintree-web/hosted-fields.create create} options.
* @description <strong>Do not use this constructor directly. Use {@link module:braintree-web/hosted-fields.create|braintree-web.hosted-fields.create} instead.</strong>
* @classdesc This class represents a Hosted Fields component produced by {@link module:braintree-web/hosted-fields.create|braintree-web/hosted-fields.create}. Instances of this class have methods for interacting with the input fields within Hosted Fields' iframes.
*/
function HostedFields(options) {
var failureTimeout, clientVersion;
var self = this;
var fields = {};
var fieldCount = 0;
var componentId = uuid();
if (!options.client) {
throw new BraintreeError({
type: sharedErrors.INSTANTIATION_OPTION_REQUIRED.type,
code: sharedErrors.INSTANTIATION_OPTION_REQUIRED.code,
message: 'options.client is required when instantiating Hosted Fields.'
});
}
clientVersion = options.client.getConfiguration().analyticsMetadata.sdkVersion;
if (clientVersion !== VERSION) {
throw new BraintreeError({
type: sharedErrors.INCOMPATIBLE_VERSIONS.type,
code: sharedErrors.INCOMPATIBLE_VERSIONS.code,
message: 'Client (version ' + clientVersion + ') and Hosted Fields (version ' + VERSION + ') components must be from the same SDK version.'
});
}
if (!options.fields) {
throw new BraintreeError({
type: sharedErrors.INSTANTIATION_OPTION_REQUIRED.type,
code: sharedErrors.INSTANTIATION_OPTION_REQUIRED.code,
message: 'options.fields is required when instantiating Hosted Fields.'
});
}
EventEmitter.call(this);
this._injectedNodes = [];
this._destructor = new Destructor();
this._fields = fields;
this._state = {
fields: {},
cards: getCardTypes('')
};
this._bus = new Bus({
channel: componentId,
merchantUrl: location.href
});
this._destructor.registerFunctionForTeardown(function () {
self._bus.teardown();
});
this._client = options.client;
analytics.sendEvent(this._client, 'custom.hosted-fields.initialized');
Object.keys(options.fields).forEach(function (key) {
var field, container, frame;
if (!constants.whitelistedFields.hasOwnProperty(key)) {
throw new BraintreeError({
type: errors.HOSTED_FIELDS_INVALID_FIELD_KEY.type,
code: errors.HOSTED_FIELDS_INVALID_FIELD_KEY.code,
message: '"' + key + '" is not a valid field.'
});
}
field = options.fields[key];
container = document.querySelector(field.selector);
if (!container) {
throw new BraintreeError({
type: errors.HOSTED_FIELDS_INVALID_FIELD_SELECTOR.type,
code: errors.HOSTED_FIELDS_INVALID_FIELD_SELECTOR.code,
message: errors.HOSTED_FIELDS_INVALID_FIELD_SELECTOR.message,
details: {
fieldSelector: field.selector,
fieldKey: key
}
});
} else if (container.querySelector('iframe[name^="braintree-"]')) {
throw new BraintreeError({
type: errors.HOSTED_FIELDS_FIELD_DUPLICATE_IFRAME.type,
code: errors.HOSTED_FIELDS_FIELD_DUPLICATE_IFRAME.code,
message: errors.HOSTED_FIELDS_FIELD_DUPLICATE_IFRAME.message,
details: {
fieldSelector: field.selector,
fieldKey: key
}
});
}
frame = iFramer({
type: key,
name: 'braintree-hosted-field-' + key,
style: constants.defaultIFrameStyle
});
this._injectedNodes = this._injectedNodes.concat(injectFrame(frame, container));
this._setupLabelFocus(key, container);
fields[key] = {
frameElement: frame,
containerElement: container
};
fieldCount++;
this._state.fields[key] = {
isEmpty: true,
isValid: false,
isPotentiallyValid: true,
isFocused: false,
container: container
};
setTimeout(function () {
frame.src = composeUrl(self._client.getConfiguration().gatewayConfiguration.assetsUrl, componentId);
}, 0);
}.bind(this));
failureTimeout = setTimeout(function () {
analytics.sendEvent(self._client, 'custom.hosted-fields.load.timed-out');
}, INTEGRATION_TIMEOUT_MS);
this._bus.on(events.FRAME_READY, function (reply) {
fieldCount--;
if (fieldCount === 0) {
clearTimeout(failureTimeout);
reply(options);
self._emit('ready');
}
});
this._bus.on(
events.INPUT_EVENT,
createInputEventHandler(fields).bind(this)
);
this._destructor.registerFunctionForTeardown(function () {
var j, node, parent;
for (j = 0; j < self._injectedNodes.length; j++) {
node = self._injectedNodes[j];
parent = node.parentNode;
parent.removeChild(node);
classlist.remove(
parent,
constants.externalClasses.FOCUSED,
constants.externalClasses.INVALID,
constants.externalClasses.VALID
);
}
});
this._destructor.registerFunctionForTeardown(function () {
var methodNames = methods(HostedFields.prototype).concat(methods(EventEmitter.prototype));
convertMethodsToError(self, methodNames);
});
}
HostedFields.prototype = Object.create(EventEmitter.prototype, {
constructor: HostedFields
});
HostedFields.prototype._setupLabelFocus = function (type, container) {
var labels, i;
var shouldSkipLabelFocus = isIos();
var bus = this._bus;
if (shouldSkipLabelFocus) { return; }
if (container.id == null) { return; }
function triggerFocus() {
bus.emit(events.TRIGGER_INPUT_FOCUS, type);
}
labels = Array.prototype.slice.call(document.querySelectorAll('label[for="' + container.id + '"]'));
labels = labels.concat(findParentTags(container, 'label'));
for (i = 0; i < labels.length; i++) {
labels[i].addEventListener('click', triggerFocus, false);
}
this._destructor.registerFunctionForTeardown(function () {
for (i = 0; i < labels.length; i++) {
labels[i].removeEventListener('click', triggerFocus, false);
}
});
};
/**
* Cleanly tear down anything set up by {@link module:braintree-web/hosted-fields.create|create}
* @public
* @param {callback} [callback] Callback executed on completion, containing an error if one occurred. No data is returned if teardown completes successfully.
* @example
* hostedFieldsInstance.teardown(function (teardownErr) {
* if (teardownErr) {
* console.error('Could not tear down Hosted Fields!');
* } else {
* console.info('Hosted Fields has been torn down!');
* }
* });
* @returns {void}
*/
HostedFields.prototype.teardown = function (callback) {
var client = this._client;
this._destructor.teardown(function (err) {
analytics.sendEvent(client, 'custom.hosted-fields.teardown-completed');
if (typeof callback === 'function') {
callback = deferred(callback);
callback(err);
}
});
};
/**
* Tokenizes fields and returns a nonce payload.
* @public
* @param {object} [options] All tokenization options for the Hosted Fields component.
* @param {boolean} [options.vault=false] When true, will vault the tokenized card. Cards will only be vaulted when using a client created with a client token that includes a customer ID.
* @param {callback} callback The second argument, <code>data</code>, is a {@link HostedFields~tokenizePayload|tokenizePayload}
* @example <caption>Tokenize a card</caption>
* hostedFieldsInstance.tokenize(function (tokenizeErr, payload) {
* if (tokenizeErr) {
* switch (tokenizeErr.code) {
* case 'HOSTED_FIELDS_FIELDS_EMPTY':
* console.error('All fields are empty! Please fill out the form.');
* break;
* case 'HOSTED_FIELDS_FIELDS_INVALID':
* console.error('Some fields are invalid:', tokenizeErr.details.invalidFieldKeys);
* break;
* case 'HOSTED_FIELDS_FAILED_TOKENIZATION':
* console.error('Tokenization failed server side. Is the card valid?');
* break;
* case 'HOSTED_FIELDS_TOKENIZATION_NETWORK_ERROR':
* console.error('Network error occurred when tokenizing.');
* break;
* default:
* console.error('Something bad happened!', tokenizeErr);
* }
* } else {
* console.log('Got nonce:', payload.nonce);
* }
* });
* @example <caption>Tokenize and vault a card</caption>
* hostedFieldsInstance.tokenize({
* vault: true
* }, function (tokenizeErr, payload) {
* if (tokenizeErr) {
* console.error(tokenizeErr);
* } else {
* console.log('Got nonce:', payload.nonce);
* }
* });
* @returns {void}
*/
HostedFields.prototype.tokenize = function (options, callback) {
if (!callback) {
callback = options;
options = {};
}
throwIfNoCallback(callback, 'tokenize');
this._bus.emit(events.TOKENIZATION_REQUEST, options, function (response) {
callback.apply(null, response);
});
};
/**
* Add a class to a {@link module:braintree-web/hosted-fields~field field}. Useful for updating field styles when events occur elsewhere in your checkout.
* @public
* @param {string} field The field you wish to add a class to. Must be a valid {@link module:braintree-web/hosted-fields~fieldOptions fieldOption}.
* @param {string} classname The class to be added.
* @param {callback} [callback] Callback executed on completion, containing an error if one occurred. No data is returned if the class is added successfully.
*
* @example
* hostedFieldsInstance.addClass('number', 'custom-class', function (addClassErr) {
* if (addClassErr) {
* console.error(addClassErr);
* }
* });
* @returns {void}
*/
HostedFields.prototype.addClass = function (field, classname, callback) {
var err;
if (!whitelistedFields.hasOwnProperty(field)) {
err = new BraintreeError({
type: errors.HOSTED_FIELDS_FIELD_INVALID.type,
code: errors.HOSTED_FIELDS_FIELD_INVALID.code,
message: '"' + field + '" is not a valid field. You must use a valid field option when adding a class.'
});
} else if (!this._fields.hasOwnProperty(field)) {
err = new BraintreeError({
type: errors.HOSTED_FIELDS_FIELD_NOT_PRESENT.type,
code: errors.HOSTED_FIELDS_FIELD_NOT_PRESENT.code,
message: 'Cannot add class to "' + field + '" field because it is not part of the current Hosted Fields options.'
});
} else {
this._bus.emit(events.ADD_CLASS, field, classname);
}
if (typeof callback === 'function') {
callback = deferred(callback);
callback(err);
}
};
/**
* Removes a class to a {@link module:braintree-web/hosted-fields~field field}. Useful for updating field styles when events occur elsewhere in your checkout.
* @public
* @param {string} field The field you wish to remove a class from. Must be a valid {@link module:braintree-web/hosted-fields~fieldOptions fieldOption}.
* @param {string} classname The class to be removed.
* @param {callback} [callback] Callback executed on completion, containing an error if one occurred. No data is returned if the class is removed successfully.
*
* @example
* hostedFieldsInstance.addClass('number', 'custom-class', function (addClassErr) {
* if (addClassErr) {
* console.error(addClassErr);
* return;
* }
*
* // some time later...
* hostedFieldsInstance.removeClass('number', 'custom-class');
* });
* @returns {void}
*/
HostedFields.prototype.removeClass = function (field, classname, callback) {
var err;
if (!whitelistedFields.hasOwnProperty(field)) {
err = new BraintreeError({
type: errors.HOSTED_FIELDS_FIELD_INVALID.type,
code: errors.HOSTED_FIELDS_FIELD_INVALID.code,
message: '"' + field + '" is not a valid field. You must use a valid field option when removing a class.'
});
} else if (!this._fields.hasOwnProperty(field)) {
err = new BraintreeError({
type: errors.HOSTED_FIELDS_FIELD_NOT_PRESENT.type,
code: errors.HOSTED_FIELDS_FIELD_NOT_PRESENT.code,
message: 'Cannot remove class from "' + field + '" field because it is not part of the current Hosted Fields options.'
});
} else {
this._bus.emit(events.REMOVE_CLASS, field, classname);
}
if (typeof callback === 'function') {
callback = deferred(callback);
callback(err);
}
};
/**
* Sets the placeholder of a {@link module:braintree-web/hosted-fields~field field}.
* @public
* @param {string} field The field whose placeholder you wish to change. Must be a valid {@link module:braintree-web/hosted-fields~fieldOptions fieldOption}.
* @param {string} placeholder Will be used as the `placeholder` attribute of the input.
* @param {callback} [callback] Callback executed on completion, containing an error if one occurred. No data is returned if the placeholder updated successfully.
*
* @example
* hostedFieldsInstance.setPlaceholder('number', '4111 1111 1111 1111', function (placeholderErr) {
* if (placeholderErr) {
* console.error(placeholderErr);
* }
* });
*
* @example <caption>Update CVV field on card type change</caption>
* hostedFieldsInstance.on('cardTypeChange', function (event) {
* // Update the placeholder value if there is only one possible card type
* if (event.cards.length === 1) {
* hostedFields.setPlaceholder('cvv', event.cards[0].code.name, function (placeholderErr) {
* if (placeholderErr) {
* // Handle errors, such as invalid field name
* console.error(placeholderErr);
* }
* });
* }
* });
* @returns {void}
*/
HostedFields.prototype.setPlaceholder = function (field, placeholder, callback) {
var err;
if (!whitelistedFields.hasOwnProperty(field)) {
err = new BraintreeError({
type: errors.HOSTED_FIELDS_FIELD_INVALID.type,
code: errors.HOSTED_FIELDS_FIELD_INVALID.code,
message: '"' + field + '" is not a valid field. You must use a valid field option when setting a placeholder.'
});
} else if (!this._fields.hasOwnProperty(field)) {
err = new BraintreeError({
type: errors.HOSTED_FIELDS_FIELD_NOT_PRESENT.type,
code: errors.HOSTED_FIELDS_FIELD_NOT_PRESENT.code,
message: 'Cannot set placeholder for "' + field + '" field because it is not part of the current Hosted Fields options.'
});
} else {
this._bus.emit(events.SET_PLACEHOLDER, field, placeholder);
}
if (typeof callback === 'function') {
callback = deferred(callback);
callback(err);
}
};
/**
* Clear the value of a {@link module:braintree-web/hosted-fields~field field}.
* @public
* @param {string} field The field whose placeholder you wish to clear. Must be a valid {@link module:braintree-web/hosted-fields~fieldOptions fieldOption}.
* @param {callback} [callback] Callback executed on completion, containing an error if one occurred. No data is returned if the field cleared successfully.
* @returns {void}
* @example
* hostedFieldsInstance.clear('number', function (clearErr) {
* if (clearErr) {
* console.error(clearErr);
* }
* });
*
* @example <caption>Clear several fields</caption>
* hostedFieldsInstance.clear('number');
* hostedFieldsInstance.clear('cvv');
* hostedFieldsInstance.clear('expirationDate');
*/
HostedFields.prototype.clear = function (field, callback) {
var err;
if (!whitelistedFields.hasOwnProperty(field)) {
err = new BraintreeError({
type: errors.HOSTED_FIELDS_FIELD_INVALID.type,
code: errors.HOSTED_FIELDS_FIELD_INVALID.code,
message: '"' + field + '" is not a valid field. You must use a valid field option when clearing a field.'
});
} else if (!this._fields.hasOwnProperty(field)) {
err = new BraintreeError({
type: errors.HOSTED_FIELDS_FIELD_NOT_PRESENT.type,
code: errors.HOSTED_FIELDS_FIELD_NOT_PRESENT.code,
message: 'Cannot clear "' + field + '" field because it is not part of the current Hosted Fields options.'
});
} else {
this._bus.emit(events.CLEAR_FIELD, field);
}
if (typeof callback === 'function') {
callback = deferred(callback);
callback(err);
}
};
/**
* Returns an {@link HostedFields~stateObject|object} that includes the state of all fields and possible card types.
* @public
* @returns {object} {@link HostedFields~stateObject|stateObject}
* @example <caption>Check if all fields are valid</caption>
* var state = hostedFields.getState();
*
* var formValid = Object.keys(state.fields).every(function (key) {
* return state.fields[key].isValid;
* });
*/
HostedFields.prototype.getState = function () {
return this._state;
};
module.exports = HostedFields;