<!-- FORM: HEAD SECTION -->

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function(){
const FORM_TIME_START = Math.floor((new Date).getTime()/1000);
let formElement = document.getElementById("tfa_0");
if (null === formElement) {
formElement = document.getElementById("0");
}
let appendJsTimerElement = function(){
let formTimeDiff = Math.floor((new Date).getTime()/1000) - FORM_TIME_START;
let cumulatedTimeElement = document.getElementById("tfa_dbCumulatedTime");
if (null !== cumulatedTimeElement) {
let cumulatedTime = parseInt(cumulatedTimeElement.value);
if (null !== cumulatedTime && cumulatedTime > 0) {
formTimeDiff += cumulatedTime;
}
}
let jsTimeInput = document.createElement("input");
jsTimeInput.setAttribute("type", "hidden");
jsTimeInput.setAttribute("value", formTimeDiff.toString());
jsTimeInput.setAttribute("name", "tfa_dbElapsedJsTime");
jsTimeInput.setAttribute("id", "tfa_dbElapsedJsTime");
jsTimeInput.setAttribute("autocomplete", "off");
if (null !== formElement) {
formElement.appendChild(jsTimeInput);
}
};
if (null !== formElement) {
if(formElement.addEventListener){
formElement.addEventListener('submit', appendJsTimerElement, false);
} else if(formElement.attachEvent){
formElement.attachEvent('onsubmit', appendJsTimerElement);
}
}
});
</script>

<link href="https://www.tfaforms.com/dist/form-builder/5.0.0/wforms-layout.css?v=544" rel="stylesheet" type="text/css" />

<link href="https://www.tfaforms.com/uploads/themes/theme-57990.css" rel="stylesheet" type="text/css" />
<link href="https://www.tfaforms.com/dist/form-builder/5.0.0/wforms-jsonly.css?v=544" rel="alternate stylesheet" title="This stylesheet activated by javascript" type="text/css" />
<script type="text/javascript" src="https://www.tfaforms.com/wForms/3.11/js/wforms.js?v=544"></script>
<script type="text/javascript">
wFORMS.behaviors.prefill.skip = false;
</script>
<script type="text/javascript" src="https://www.tfaforms.com/wForms/3.11/js/localization-en_US.js?v=544"></script>
<script type="text/javascript" src="https://js.stripe.com/v2/"></script>
<script type="text/javascript">

/**
* Gets the form for Stripe JS usage
*/
function getStripeForm() {
return document.querySelector('.wForm > form');
}

/**
* Appends Stripe token input to form after a tokenization call
* This is "normal" operation
*/
function appendStripeTokenInputToForm(response) {
var stripeForm = getStripeForm();
// attach token to the form so we can pass it to stripe
var stripeTokenInput = document.createElement("input");
stripeTokenInput.type = "hidden";
stripeTokenInput.name = "stripeSourceToken";
stripeTokenInput.id = "stripeSourceToken";
stripeTokenInput.value = response.id;
stripeForm.appendChild(stripeTokenInput);
}

/**
* check if an element is visible
*/
function isVisible(element) {
if (element.offsetWidth > 0 && element.offsetHeight > 0) {
return true;
}
return false;
}

/**
* remove invisible elements from a collection
*/
function removeInvisibleElements(elements) {
let visibleElements = [];
if (elements) {
let i;
for(i=0;i<elements.length;i++) {
if(isVisible(elements[i])) {
visibleElements.push(elements[i]);
}
}
}
return visibleElements;
}

/**
* There are cases where forms may hide payment info if conditions are met to skip payment (discount codes, etc)
* We must try to determine this as best we can in order to figure out if payment info is missing due to respondent error or if it's intended
* Here we assume that if all the payment info fields are hidden from view, the form is intending to skip payment and treats it as such
*/
function determineIfStripeTokenizationCallShouldBeMade(ccNumberInput, cvcNumberInput, expiryMonthInput, expiryYearInput) {
return (ccNumberInput.disabled === false && cvcNumberInput.disabled === false && expiryMonthInput.disabled === false && expiryYearInput.disabled === false);
}

/**
* get value from input
*/
function getValueFromInput(input) {
if (input) {
let choiceMapping = null;
let mappings = {"credit_card_number":{"id":"tfa_2230"},"card_expiration_month":{"id":"tfa_2232"},"card_expiration_year":{"id":"tfa_2233"},"credit_card_code":{"id":""},"cardholder_full_name":{"id":"tfa_2229"}};
switch(input.type) {
case "radio":
case "checkbox":
if (
mappings &&
input.checked &&
mappings[input.name] &&
mappings[input.name]['choice_mapping'] &&
mappings[input.name]['choice_mapping'][input.value]
) {
choiceMapping = mappings[input.name]['choice_mapping'][input.value];
}
return choiceMapping;
case "select":
case "select-one":
if (
mappings &&
mappings[input.name] &&
mappings[input.name]['choice_mapping'] &&
mappings[input.name]['choice_mapping'][input.value]
) {
choiceMapping = mappings[input.name]['choice_mapping'][input.value];
}
return choiceMapping;

default:
return input.value;
}
}
return null;
}

/**
* get id or value from stripe (handles both static and webform values)
*/
function getIdOrValueFromStripe(field)
{
if (field && field.value) {
return field.value;
} else if (field && field.id) {
var fieldInput = document.getElementById(field.id);
if (fieldInput && fieldInput.type == 'radio' && document.querySelector("[name='" + stripe.id + "']:checked")) {
fieldInput = document.querySelector("[name='" + stripe.id + "']:checked")
}
return getValueFromInput(fieldInput);
}
return null;
}

/**
* add stripe address fields if applicable
*/
function addStripeAddressFields(stripeFields)
{
stripeFields.address_line1 = getIdOrValueFromStripe(null);
stripeFields.address_line2 = getIdOrValueFromStripe(null);
stripeFields.address_city = getIdOrValueFromStripe(null);
stripeFields.address_state = getIdOrValueFromStripe(null);
stripeFields.address_zip = getIdOrValueFromStripe(null);
stripeFields.address_country = getIdOrValueFromStripe(null);
return stripeFields;
}

/**
* function to handle the response from stripe createToken
*
* @param status
* @param response
*/
function stripeCardResponseHandler(status, response) {
if (response.error) { // Problem!
stripeErrorHandler(response.error);
} else { // Token was created!
Stripe.source.create({
type: 'card',
token: response.id
}, stripeSourceResponseHandler);
}
}

/**
* Handler for stripe source creation
*
* @param response
*/
function stripeSourceResponseHandler(status, response) {
if (response.error) {
stripeErrorHandler(response.error);
} else {
appendStripeTokenInputToForm(response);
var stripeForm = getStripeForm();

// submit the form
stripeForm.submit();
}
}

/**
* Displays error from stripe.js call
*
* @param error
*/
function stripeErrorHandler(error) {
// inserting our error message after wFormHeader (to match current behavior of the app)
var wFormHeaderNode = document.getElementsByClassName("wFormHeader")[0];
// start setting up our error node
var errorNode = document.createElement("div");
errorNode.className = "stripeError errorMessage errMsg";
errorNode.innerHTML = "Please review the error(s) below.<br />"
+ "<ul><li>" + error.message + "</li></ul>";
wFormHeaderNode.parentNode.insertBefore(errorNode, wFormHeaderNode.nextSibling);
errorNode.scrollIntoView();
// make our submit button useable again (wFormsValidation which has already run and passed disabled it)
var submit = base2.DOM.Element.querySelector(this.target,'.actions .primaryAction[type="submit"]');
submit.removeAttribute('disabled');
submit.removeAttribute('style');
submit.setAttribute('value',submit.getAttribute('data-label'));
}

Stripe.setPublishableKey('pk_live_oizWTGdGpwr4hy7aQLDljdmD00xaXMVFeh');
document.addEventListener("wFORMSLoaded", function() {
var stripeForm = getStripeForm();
stripeForm.addEventListener('submit', function(event) {
// if we have a stripe error already remove it since we are revalidating
var errorNode = document.getElementsByClassName('stripeError')[0];

if (errorNode) {
errorNode.parentElement.removeChild(errorNode);
}
var errFields = document.getElementsByClassName('errFld');
errFields = removeInvisibleElements(errFields);
// only try to create a token if we dont have any errors (we re ready to submit actually)
if (errFields.length <= 0) {
// Remove stripeSourceToken input if it already exists
var cardTokenField = document.getElementById('stripeSourceToken');
if (cardTokenField) {
cardTokenField.parentElement.removeChild(cardTokenField);
}

var stripeFields = {};

var creditCardNumberInput = document.getElementById("tfa_2230");
var cvcInput = document.getElementById("");
var expiryMonthInput = document.querySelector("[name='tfa_2232']");
if (expiryMonthInput && expiryMonthInput.type == 'radio' && document.querySelector("[name='tfa_2232']:checked")) {
expiryMonthInput = document.querySelector("[name='tfa_2232']:checked");
}
var expiryYearInput = document.querySelector("[name='tfa_2233']");
if (expiryMonthInput && expiryYearInput.type == 'radio' && document.querySelector("[name='tfa_2232']:checked")) {
expiryMonthInput = document.querySelector("[name='tfa_2232']:checked");
}
var tokenizationCallShouldBeMade = determineIfStripeTokenizationCallShouldBeMade(creditCardNumberInput, cvcInput, expiryMonthInput, expiryYearInput);
if (tokenizationCallShouldBeMade === true) {
// collect info from stripe mapped fields
stripeFields.number = creditCardNumberInput.value;
stripeFields.cvc = cvcInput.value;
stripeFields.exp_month = getValueFromInput(expiryMonthInput);
stripeFields.exp_year = getValueFromInput(expiryYearInput);
// full name is not a required field only include if it exists
stripeFields.name = document.getElementById("tfa_2229").value;
stripeFields = addStripeAddressFields(stripeFields);
// create the token using stripe and use the response handler to deal with the result
Stripe.card.createToken(stripeFields, stripeCardResponseHandler);
// prevent default we dont want to submit the form until we get our response back
event.preventDefault();
}
}
});
});
</script>
<!-- FORM: BODY SECTION -->
<div class="wFormContainer" >
<div class="wFormHeader"></div>
<style type="text/css">
#tfa_2229,
*[id^="tfa_2229["] {
width: 190px !important;
}
#tfa_2229-D,
*[id^="tfa_2229["][class~="field-container-D"] {
width: auto !important;
}

#tfa_2230,
*[id^="tfa_2230["] {
width: 190px !important;
}
#tfa_2230-D,
*[id^="tfa_2230["][class~="field-container-D"] {
width: auto !important;
}

#tfa_2230-L,
label[id^="tfa_2230["] {
width: 150px !important;
min-width: 0px;
}

#tfa_2232,
*[id^="tfa_2232["] {
width: 30px !important;
}
#tfa_2232-D,
*[id^="tfa_2232["][class~="field-container-D"] {
width: auto !important;
}

#tfa_2232-L,
label[id^="tfa_2232["] {
width: 30px !important;
min-width: 0px;
}

#tfa_2233,
*[id^="tfa_2233["] {
width: 30px !important;
}
#tfa_2233-D,
*[id^="tfa_2233["][class~="field-container-D"] {
width: auto !important;
}

#tfa_2233-L,
label[id^="tfa_2233["] {
width: 40px !important;
min-width: 0px;
}

#tfa_2234,
*[id^="tfa_2234["] {
width: 60px !important;
}
#tfa_2234-D,
*[id^="tfa_2234["][class~="field-container-D"] {
width: auto !important;
}

#tfa_2234-L,
label[id^="tfa_2234["] {
width: 50px !important;
min-width: 0px;
}

#tfa_2235,
*[id^="tfa_2235["] {
width: 190px !important;
}
#tfa_2235-D,
*[id^="tfa_2235["][class~="field-container-D"] {
width: auto !important;
}

#tfa_2235-L,
label[id^="tfa_2235["] {
width: 130px !important;
min-width: 0px;
}
</style><div class=""><div class="wForm" id="4745330-WRPR" dir="ltr">
<div class="codesection" id="code-4745330"></div>
<h3 class="wFormTitle" id="4745330-T">Credit Card Tester</h3>
<form method="post" action="https://www.tfaforms.com/responses/processor" class="hintsBelow labelsAbove" id="4745330" role="form">
<div class="oneField field-container-D " id="tfa_2236-D" role="group" aria-labelledby="tfa_2236-L">
<label id="tfa_2236-L" class="label preField ">I would like to buy </label><br><div class="inputWrapper"><span id="tfa_2236" class="choices vertical "><span class="oneChoice"><input type="checkbox" value="tfa_2237" class="" id="tfa_2237" name="tfa_2237" aria-labelledby="tfa_2236-L tfa_2237-L"><label class="label postField" id="tfa_2237-L" for="tfa_2237"><span class="input-checkbox-faux"></span>VIP to yyy</label></span><span class="oneChoice"><input type="checkbox" value="tfa_2238" class="" id="tfa_2238" name="tfa_2238" aria-labelledby="tfa_2236-L tfa_2238-L"><label class="label postField" id="tfa_2238-L" for="tfa_2238"><span class="input-checkbox-faux"></span>Basic Entry</label></span><span class="oneChoice"><input type="checkbox" value="tfa_2239" class="" id="tfa_2239" name="tfa_2239" aria-labelledby="tfa_2236-L tfa_2239-L"><label class="label postField" id="tfa_2239-L" for="tfa_2239"><span class="input-checkbox-faux"></span>Premier Acces</label></span></span></div>
</div>
<fieldset id="tfa_2228" class="section">
<legend id="tfa_2228-L">Payment Information</legend>
<div class="oneField field-container-D " id="tfa_2229-D">
<label id="tfa_2229-L" class="label preField " for="tfa_2229">Name on Card</label><br><div class="inputWrapper"><input type="text" id="tfa_2229" name="tfa_2229" value="" title="Name on Card" data-dataset-allow-free-responses="" class=""></div>
</div>
<div class="oneField field-container-D " id="tfa_2230-D">
<label id="tfa_2230-L" class="label preField " for="tfa_2230">Card Number</label><br><div class="inputWrapper"><input type="text" id="tfa_2230" name="tfa_2230" value="" placeholder="●●●●●●●●●●●●●●●●" title="Card Number" data-dataset-allow-free-responses="" class=""></div>
</div>
<div id="tfa_2231" class="section inline group">
<div class="oneField field-container-D " id="tfa_2232-D">
<label id="tfa_2232-L" class="label preField " for="tfa_2232">MM</label><br><div class="inputWrapper"><input type="text" id="tfa_2232" name="tfa_2232" value="" placeholder="MM" title="MM" data-dataset-allow-free-responses="" class=""></div>
</div>
<div class="oneField field-container-D " id="tfa_2233-D">
<label id="tfa_2233-L" class="label preField " for="tfa_2233">YY</label><br><div class="inputWrapper"><input type="text" id="tfa_2233" name="tfa_2233" value="" placeholder="YY" title="YY" data-dataset-allow-free-responses="" class=""></div>
</div>
<div class="oneField field-container-D " id="tfa_2234-D">
<label id="tfa_2234-L" class="label preField " for="tfa_2234">Code</label><br><div class="inputWrapper"><input type="text" id="tfa_2234" name="tfa_2234" value="" placeholder="●●●" title="Code" data-dataset-allow-free-responses="" class=""></div>
</div>
</div>
<div class="oneField field-container-D " id="tfa_2235-D">
<label id="tfa_2235-L" class="label preField reqMark" for="tfa_2235">Billing Email</label><br><div class="inputWrapper"><input type="text" id="tfa_2235" name="tfa_2235" value="" aria-required="true" title="Billing Email" data-dataset-allow-free-responses="" class="validate-email required"></div>
</div>
</fieldset>
<input type="hidden" id="STRIPE_CUSTOMER_330238" name="STRIPE_CUSTOMER_330238" value="" class=""><input type="hidden" id="STRIPE_SUBSCR_330238" name="STRIPE_SUBSCR_330238" value="" class=""><input type="hidden" id="STRIPE_CHARGE_330238" name="STRIPE_CHARGE_330238" value="" class=""><div class="actions" id="4745330-A"><input type="submit" data-label="Submit" class="primaryAction" id="submit_button" value="Submit"></div>
<div style="clear:both"></div>
<input type="hidden" value="4745330" name="tfa_dbFormId" id="tfa_dbFormId"><input type="hidden" value="" name="tfa_dbResponseId" id="tfa_dbResponseId"><input type="hidden" value="97fac74e081f0e626b294ab10eb1e9ea" name="tfa_dbControl" id="tfa_dbControl"><input type="hidden" value="2" name="tfa_dbVersionId" id="tfa_dbVersionId"><input type="hidden" value="" name="tfa_switchedoff" id="tfa_switchedoff">
</form>
</div></div><div class="wFormFooter"><p class="supportInfo"><a target="new" class="contactInfoLink" href="https://www.tfaforms.com/forms/help/4745330">Contact Information</a><br></p></div>
<p class="supportInfo" >


</p>
</div>