steveosoule
1/22/2016 - 10:16 PM
Levels OPAY CVV Fix
Levels OPAY CVV Fix
var cornerstoneUX = {
init: function () {
String.prototype.toCamelCase = function(cap1st) {
return ((cap1st ? '-' : '') + this).replace(/-+([^-])/g, function(a, b) {
return b.toUpperCase();
});
};
var pageID = document.body.id.toCamelCase();
if (cornerstoneUX[pageID]) {
// ---- If the function exists, run it, otherwise, don't do anything. ---- //
$(document).ready(function () {
cornerstoneUX[pageID]();
});
}
$(document).ready(function () {
// ---- Create the "main" element for older versions of IE ---- //
document.createElement('main');
$('.js-hide').hide();
$('.js-show').show();
$('.js-remove').remove();
$('select, :text, textarea').not('.input').addClass('input');
cornerstoneUX.sharedFunctions.toggle();
cornerstoneUX.sharedFunctions.showHide();
cornerstoneUX.sharedFunctions.tabs();
$('.js-slide-toggle').on('click', function (e) {
e.preventDefault();
var $trigger = $(this),
$target = $($trigger.data('target'));
$target.slideToggle('fast');
});
// ---- Allow Named Anchors With A Class Of "smoothscroll" To Work Without Full URL ---- //
$('a[href^="\#"].smoothscroll').on('click', function (e) {
e.preventDefault();
var selector = this.href.substr(this.href.indexOf('#')),
target = $(selector),
offset = 10;
if (target.offset().top > windowHeight / 2) {
offset = $('#js-header').outerHeight();
}
scrollToDiv(target, offset);
});
// ---- Quantity Incrementer ---- //
$('#js-increase-quantity, .js-increase-quantity').on('click', function () {
var $qty = $(this).parent().prev(),
currentVal = parseInt($qty.val()),
$update = $(this).parent().siblings('.js-update-quantity');
if (!isNaN(currentVal)) {
$qty.val(currentVal + 1).change();
$update.trigger('click');
}
});
$('#js-decrease-quantity, .js-decrease-quantity').on('click', function () {
var $qty = $(this).parent().prev(),
currentVal = parseInt($qty.val()),
min = (!isNaN($qty.data('min'))) ? $qty.data('min') : 1,
$update = $(this).parent().siblings('.js-update-quantity');
if (!isNaN(currentVal) && currentVal > min) {
$qty.val(currentVal - 1).change();
$update.trigger('click');
}
});
$('.js-read-more').readmore({
speed: 75,
moreLink: '<a href="#" class="js-read-more-toggle read-more-toggle">... read more</a>',
lessLink: '<a href="#" class="js-read-more-toggle read-less-toggle">read less</a>',
collapsedHeight: 67,
embedCSS: false
});
// ---- Sticky ---- //
function stickyHeader() {
// Main Header & Stick Header
var jsHeader = $('#js-header'),
stickyNav = $('#js-sticky-header'),
jsHHeight = $(jsHeader).height(),
sNHeight = $(stickyNav).height(),
jsMain = $('main');
// Copying of the Logo & dropdown menu
var allCategoriesNav = $('#js-all-categories-nav').clone();
$(allCategoriesNav).attr('id', 'js-sticky-categories-nav');
$('#js-sticky-dropdown-button .dropdown-menu-sticky-wrap').html( allCategoriesNav );
$(window).scroll(function () {
if ( $(this).scrollTop() >= jsHHeight) {
$(stickyNav).addClass('slideDownSticky');
$(jsHeader).addClass('sticky-shown');
$(jsMain).addClass('sticky-is-shown');
} else if ( $(stickyNav).hasClass('slideDownSticky') ) {
$(stickyNav).removeClass('slideDownSticky');
$(jsHeader).removeClass('sticky-shown');
$(jsMain).removeClass('sticky-is-shown');
}
});
}
//stickyHeader();
(function floatingPlaceholder(){
function updateText(event){
var $input = $(this);
setTimeout(function(){
if( $input.val() !== '' || $input.is(':focus') || $input.prop('tagName') === 'SELECT' ) {
$input.parent().addClass('floating-placeholder-float');
} else {
$input.parent().removeClass('floating-placeholder-float');
}
}, 1);
}
$('.floating-placeholder .input').each(updateText);
$('.floating-placeholder .input, .floating-placeholder select').on('input keyup change blur', updateText);
})();
(function(){
var autocomplete = {
$inputs: $('.js-autocomplete-input'),
$results: $('.js-autocomplete-results'),
init: function(){
autocomplete.$inputs.on('input', autocomplete.getResults);
autocomplete.$inputs.on('blur', autocomplete.hideResults);
// TODO: Add keyboard controls
},
getResults: debounce(function(e) {
var $input = $(this),
search = $.trim($input.val());
if( !search.length ) return;
$.get(
$input.data('api-url'),
{
Get: 'autocomplete',
Search: search
},
autocomplete.displayResults
);
}, 150),
displayResults: function(response){
if( !$.trim(response) ){
autocomplete.$results.hide();
return;
}
autocomplete.$results.html(response);
autocomplete.$results.fadeIn(100);
},
hideResults: debounce(function(){
autocomplete.$results.fadeOut(100);
}, 750)
};
autocomplete.init();
})();
// ---- Back to Top Controls ---- //
(function backToTop () {
if ($(window).innerWidth() < 768) {
return;
}
var chaser = $('#js-chaser'),
windowHeight = $(window).height();
if (chaser) {
$(window).scroll(function() {
if ($(window).scrollTop() >= windowHeight / 2) {
chaser.fadeIn();
}
else {
chaser.hide();
}
});
chaser.on('click', function () {
$('html, body').animate({scrollTop: '0px'}, 800);
});
}
})();
// ---- On scroll, fix the header to the top ---- //
// if (document.location.protocol !== 'https:' && $(window).innerWidth() > 768) {
// $('#js-header').stuck();
// }
// ---- Toggle global search display ---- //
$('#js-open-global-search, #js-open-global-search--tablet').on('click', function (e) {
e.preventDefault();
$(this).toggleClass('bg-gray');
$('#js-global-search').fadeToggle();
});
// ---- Mobile Footer Links Control ---- //
function footerNavControl () {
/* Corrects positioning of virtual keyboard */
$(document).on('focus', 'input, select, textarea', function () {
$('#mobile-footer').hide();
});
$(document).on('blur', 'input, select, textarea', function () {
$('#mobile-footer').show();
});
}
$(window).on('debouncedresize load', footerNavControl ());
});
$('.js-az-menu-trigger').on('click', function(e){
e.preventDefault();
$('.nav-group-2').toggle();
if( !$('.nav-group-2').is(':visible') ){
$('.nav-group-3, .nav-group-4').hide();
}
});
$('.js-az-menu-trigger, #js-sticky-dropdown-button .button').on('mouseenter', function(){
$('.nav-group-2').show();
});
var timer;
$('.js-az-menu-trigger, #js-sticky-dropdown-button .button, .nav-group-2, .nav-group-3, .nav-group-4').on({
mouseover: function(){
clearTimeout(timer);
},
mouseout: function(e){
clearTimeout(timer);
timer = setTimeout(function(){
$('.nav-group-2, .nav-group-3, .nav-group-4').hide();
}, 250);
}
});
$('.nav-group-2 a').on('mouseenter', function() {
$('.nav-group-3').css('min-height', $(this).parent().height());
});
$.getScript(theme_path + '/js/jquery.menu-aim.js', function(data, textStatus) {
$('.nav-group-2').menuAim({
activate: function(row) {
var $item = $(row),
index = $('.nav-item-2').index( $item ),
$group = $('.nav-group-4').eq(index);
$('.nav-group-4').hide();
$group.show();
$('.nav-group-3').show();
},
deactivate: function(row) {
$('.nav-group-4').hide();
$('.nav-group-3').hide();
},
rowSelector: ".nav-item-2"
});
});
// ---- Mobile Footer Links Control ---- //
function mobileFooterToggles(h5) {
if ( $(window).width() <= 768 ) {
if ( $(h5).parent().find('.mobile-toggle').is(':visible') ) {
$(h5).find('span').attr('data-icon', 'L');
} else {
$(h5).find('span').attr('data-icon', 'K');
}
$(h5).parent().find('.mobile-toggle').slideToggle();
}
}
$('footer h5').on('click', function(e) {
mobileFooterToggles($(this));
});
},
sharedFunctions: {
// ---- Product Carousels ---- //
productsCarousels: function (carousel, append) {
var carousel = $(carousel);
if (append === true) {
var appendArrowsTo = $(carousel.selector).parent();
}
else if (append === 'undefined') {
var appendArrowsTo = $(carousel.selector);
}
$.getScript(theme_path + '/js/jquery.slick.min.js', function () {
carousel.slick({
appendArrows: appendArrowsTo,
draggable: false,
slidesToScroll: 3,
slidesToShow: 3,
responsive: [
{
breakpoint: 960,
settings: {
slidesToScroll: 2,
slidesToShow: 2
}
},
{
breakpoint: 767,
settings: {
slidesToScroll: 1,
slidesToShow: 1
}
}
]
});
});
},
// ---- Cart Summary Controls ---- //
cartSummary: function () {
var marker = $('#js-toggle-cart-summary-contents').find('span'),
clickCount = 0;
$('#js-toggle-cart-summary-contents').on('click', function (e) {
e.preventDefault();
if (clickCount) {
marker.html('▼');
clickCount = 0;
$('#js-cart-summary-contents').slideDown();
}
else {
clickCount = 1;
marker.html('►');
$('#js-cart-summary-contents').slideUp();
}
});
if ($(window).innerWidth() < 768) {
$('#js-toggle-cart-summary-contents').click();
}
},
// ---- Open Forgot Password ---- //
openForgotPassword: function (pageID) {
$('#js-open-forgot-password').magnificPopup({
callbacks: {
open: function () {
if (pageID === 'jsOCST') {
// magnificPopup.close();
}
}
},
focus: '#l-Customer_LoginEmail',
items: {
src: $('#js-forgot-password'),
type: 'inline'
}
});
},
// ---- Conform all subcategory and/or product DIVs to same height ---- //
conformDisplay: function (selector) {
var targetElement = selector || '.category-product';
$(window).on('load', function () {
$(targetElement).conformity({mode: 'height'});
});
$(window).on('resize', function () {
$(targetElement).conformity({mode: 'height'});
});
},
// ---- Open Product Image Gallery ---- //
productGallery: function (trigger) {
trigger.on('click', function (e) {
var startAt = Number($(this).attr('data-index'));
e.preventDefault();
if (gallery.length > 0) {
$.magnificPopup.open({
callbacks: {
open: function () {
$.magnificPopup.instance.goTo(startAt);
}
},
gallery: {
enabled: true
},
items: gallery,
type: 'image'
});
}
else {
$.magnificPopup.open({
items: {
src: $('#js-main-image').attr('data-image')
},
type: 'image'
});
}
});
},
// ---- Quick View Function ---- //
openQuickView: function () {
$('.quick-view, .js-quick-view').on('click', function (e){
var productLink = $(this).data('product-link');
e.preventDefault();
$.magnificPopup.open({
items: {
src: productLink
},
type: 'iframe'
});
});
},
// ---- Miva Google Address Autocomplete ---- //
/*mvGAAC: {
init: function(){
var self = this;
$('.js-geocomplete-input').removeAttr('placeholder');
$(window).on('load', function(){
$('.js-geocomplete-input').removeAttr('placeholder');
});
$.getScript('//cdnjs.cloudflare.com/ajax/libs/geocomplete/1.6.5/jquery.geocomplete.min.js', cornerstoneUX.sharedFunctions.mvGAAC.loaded);
},
loaded: function(){
$('.js-geocomplete-input')
.geocomplete()
.bind('geocode:result', cornerstoneUX.sharedFunctions.mvGAAC.result);
},
result: function(event, result){
var $input = $(this),
$container = $input.closest('.js-geocomplete-container'),
streetNumber = '',
streetName = '',
country = '',
address = '';
result.address_components.reverse();
$.each(result.address_components, function(index, component){
var component_type = component.types[0];
switch (component_type){
case 'street_number':
streetNumber = component.long_name;
address = streetNumber;
if( streetName ){
address += ' ' + streetName;
}
$container.find('[name$="Address1"], [name$="_addr"]').val(address).trigger('input');
break;
case 'route':
streetName = component.long_name;
address = '';
if(streetNumber){
address = streetNumber + ' ' + streetName;
}
$container.find('[name$="Address1"], [name$="_addr"]').val(address).trigger('input');
break;
case 'locality':
$container.find('[name$="City"], [name$="_city"]').val(component.long_name).trigger('input');
break;
case 'administrative_area_level_1':
if( country === 'US' ){
$container.find('[name$="StateSelect"], [name$="_state"]').val(component.short_name).trigger('input');
} else {
$container.find('[name$="State"]').val(component.short_name).trigger('input');
}
break;
case 'country':
country = component.short_name;
$container.find('[name$="Country"], [name$="_cntry"]').val(component.short_name).trigger('change');
break;
case 'postal_code':
$container.find('[name$="Zip"], [name$="_zip"]').val(component.long_name).trigger('input');
break;
default:
break;
}
});
}
},*/
toggle: function(){
$('[data-toggle]').each(function(){
var $trigger = $(this),
target = $trigger.data('toggle'),
$target = $(target);
$trigger.prepend('<span data-icon="L"></span> ');
if( $target.is(':visible') ){
$trigger.addClass('active');
}
});
$('[data-toggle]').on('click', function(e){
e.preventDefault();
var $trigger = $(this),
target = $trigger.data('toggle'),
$target = $(target);
if( $target.is(':visible') ){
$target.slideUp('fast');
$trigger.find('[data-icon]').replaceWith('<span data-icon="L"></span>');
$trigger.removeClass('active');
} else {
$target.slideDown('fast');
$trigger.find('[data-icon]').replaceWith('<span data-icon="K"></span>');
$trigger.addClass('active');
}
});
},
showHide: function(){
$('[data-show]').on('click', function(){
var $this = $(this);
$($this.data('show')).show();
});
$('[data-hide]').on('click', function(){
var $this = $(this);
$($this.data('hide')).hide();
});
},
tabs: function(){
$('.js-tabs').each(function(){
var $container = $(this);
$container.find('.js-tab').first().addClass('tab-active');
$container.find('.js-tab-item:gt(0)').hide();
});
$('.js-tabs').on('click', '.js-tab', function(e){
e.preventDefault();
var $tab = $(this),
index = $tab.index(),
$container = $tab.closest('.js-tabs'),
$tabItem = $container.find('.tab-item:eq(' + index + '), .js-tab-item:eq(' + index + ')');
if( $tabItem.is(':visible') ){
return false;
}
$container.find('.tab-active').removeClass('tab-active');
$container.find('.tab-item, .js-tab-item').fadeOut(200);
$tabItem.fadeIn(200);
$tab.addClass('tab-active');
});
}
},
jsSFNT: function () {
// ---- Product Carousel ---- //
cornerstoneUX.sharedFunctions.productsCarousels('#js-whats-popular-carousel');
// ---- Open Quick View ---- //
cornerstoneUX.sharedFunctions.openQuickView();
function minFeaturedProductsHeight() {
var minHeight = $('#js-featured-products-height').outerHeight();
$('.js-featured-products-height-min').css('min-height', minHeight);
}
minFeaturedProductsHeight();
$(window).on('resize', minFeaturedProductsHeight);
},
jsCTGY: function () {
// ---- Conform all subcategory and/or product DIVs to same height ---- //
cornerstoneUX.sharedFunctions.conformDisplay();
cornerstoneUX.sharedFunctions.conformDisplay('.sub-category');
// ---- Open Quick View ---- //
cornerstoneUX.sharedFunctions.openQuickView();
},
jsPROD: function () {
// ---- Open Product Image Gallery ---- //
cornerstoneUX.sharedFunctions.productGallery($('#js-main-image-zoom'));
var mainImageZoom = $('#js-main-image-zoom'),
thumbnails = $('#js-thumbnails');
//console.log(window['image_data' + productID][0]['image_data'][2]);
thumbnails.on('click', 'div', function () {
var thumbnailIndex = $(this).attr('data-index');
mainImageZoom.attr('data-index', thumbnailIndex);
var clickedLI = parseFloat($(this).attr('data-index'));
if ( thumbnailIndex ) {
$('#js-main-dots li.active').removeClass('active');
$('#js-main-dots li[data-index="' + thumbnailIndex + '"]').addClass('active');
}
});
$.getScript(theme_path + '/js/jquery.slick.min.js', function () {
$('#js-thumbnails').slick({
vertical: true,
draggable: false,
slidesToScroll: 1,
slidesToShow: 4
});
});
// ---- Update Button For "Out Of Stock" ---- //
function outOfStock () {
var button = $('#js-add-to-cart'),
buttonText = button.val();
if (button.is(':disabled') === true) {
button.addClass('bg-gray').val('Sold Out');
}
else {
button.removeClass('bg-gray').val(buttonText);
}
}
outOfStock();
// ---- Set Initial Swatch Name ---- //
$('#js-swatch-name').text($('#js-swatch-select').find('option:first-child').text());
// ---- Add Border to Active Swatch ---- //
function selectedSwatch () {
$('#js-swatches').find('li').each(function () {
var swatchElement = $(this),
swatchColor = swatchElement.attr('data-code');
swatchElement.removeClass('selected-swatch');
if (swatchColor === $('#js-swatch-select').find('option:selected').val() ) {
swatchElement.addClass('selected-swatch');
// swatchColor = swatchColor.replace(/ /g,'');
// swatchColor = swatchColor.toLowerCase();
// var namedColors = {
// aliceblue: 'f0f8ff',antiquewhite: 'faebd7',aqua: '00ffff',aquamarine: '7fffd4',azure: 'f0ffff',beige: 'f5f5dc',bisque: 'ffe4c4',black: '000000',blanchedalmond: 'ffebcd',blue: '0000ff',blueviolet: '8a2be2',brown: 'a52a2a',burlywood: 'deb887',cadetblue: '5f9ea0',chartreuse: '7fff00',chocolate: 'd2691e',coral: 'ff7f50',cornflowerblue: '6495ed',cornsilk: 'fff8dc',crimson: 'dc143c',cyan: '00ffff',darkblue: '00008b',darkcyan: '008b8b',darkgoldenrod: 'b8860b',darkgray: 'a9a9a9',darkgreen: '006400',darkkhaki: 'bdb76b',darkmagenta: '8b008b',darkolivegreen: '556b2f',darkorange: 'ff8c00',darkorchid: '9932cc',darkred: '8b0000',darksalmon: 'e9967a',darkseagreen: '8fbc8f',darkslateblue: '483d8b',darkslategray: '2f4f4f',darkturquoise: '00ced1',darkviolet: '9400d3',deeppink: 'ff1493',deepskyblue: '00bfff',dimgray: '696969',dodgerblue: '1e90ff',feldspar: 'd19275',firebrick: 'b22222',floralwhite: 'fffaf0',forestgreen: '228b22',fuchsia: 'ff00ff',gainsboro: 'dcdcdc',ghostwhite: 'f8f8ff',gold: 'ffd700',goldenrod: 'daa520',gray: '808080',green: '008000',greenyellow: 'adff2f',honeydew: 'f0fff0',hotpink: 'ff69b4',indianred : 'cd5c5c',indigo : '4b0082',ivory: 'fffff0',khaki: 'f0e68c',lavender: 'e6e6fa',lavenderblush: 'fff0f5',lawngreen: '7cfc00',lemonchiffon: 'fffacd',lightblue: 'add8e6',lightcoral: 'f08080',lightcyan: 'e0ffff',lightgoldenrodyellow: 'fafad2',lightgrey: 'd3d3d3',lightgreen: '90ee90',lightpink: 'ffb6c1',lightsalmon: 'ffa07a',lightseagreen: '20b2aa',lightskyblue: '87cefa',lightslateblue: '8470ff',lightslategray: '778899',lightsteelblue: 'b0c4de',lightyellow: 'ffffe0',lime: '00ff00',limegreen: '32cd32',linen: 'faf0e6',magenta: 'ff00ff',maroon: '800000',mediumaquamarine: '66cdaa',mediumblue: '0000cd',mediumorchid: 'ba55d3',mediumpurple: '9370d8',mediumseagreen: '3cb371',mediumslateblue: '7b68ee',mediumspringgreen: '00fa9a',mediumturquoise: '48d1cc',mediumvioletred: 'c71585',midnightblue: '191970',mintcream: 'f5fffa',mistyrose: 'ffe4e1',moccasin: 'ffe4b5',navajowhite: 'ffdead',navy: '000080',oldlace: 'fdf5e6',olive: '808000',olivedrab: '6b8e23',orange: 'ffa500',orangered: 'ff4500',orchid: 'da70d6',palegoldenrod: 'eee8aa',palegreen: '98fb98',paleturquoise: 'afeeee',palevioletred: 'd87093',papayawhip: 'ffefd5',peachpuff: 'ffdab9',peru: 'cd853f',pink: 'ffc0cb',plum: 'dda0dd',powderblue: 'b0e0e6',purple: '800080',red: 'ff0000',rosybrown: 'bc8f8f',royalblue: '4169e1',saddlebrown: '8b4513',salmon: 'fa8072',sandybrown: 'f4a460',seagreen: '2e8b57',seashell: 'fff5ee',sienna: 'a0522d',silver: 'c0c0c0',skyblue: '87ceeb',slateblue: '6a5acd',slategray: '708090',snow: 'fffafa',springgreen: '00ff7f',steelblue: '4682b4',tan: 'd2b48c',teal: '008080',thistle: 'd8bfd8',tomato: 'ff6347',turquoise: '40e0d0',violet: 'ee82ee',violetred: 'd02090',wheat: 'f5deb3',white: 'ffffff',whitesmoke: 'f5f5f5',yellow: 'ffff00',yellowgreen: '9acd32'
// };
// for (var key in namedColors) {
// if (swatchColor === key) {
// swatchElement.css('border-color', '#' + namedColors[key]);
// }
// else {
// swatchElement.addClass('selected-swatch');
// }
// }
}
});
}
selectedSwatch();
// ---- Update Display When Attribute Machine Fires ---- //
MivaEvents.SubscribeToEvent('variant_changed', function () {
gallery.length = 0;
mainImageZoom.attr('data-index', 0);
thumbnailIndex = 0;
outOfStock();
selectedSwatch();
});
// ---- Update Display Price Based on Attribute Selections (If Attribute Machine Is Not Being Used) ---- //
if (typeof attrMachCall === 'undefined' && document.getElementById('js-product-attribute-count').value > 0) {
for(var baseProductPrice=Number(document.getElementById("js-price-value").getAttribute("data-base-price")),regularProductPrice=Number(),productAttributeCount=Number(document.getElementById("js-product-attribute-count").value+1),productAttributes=document.getElementById("js-purchase-product").elements,attributeType=[""],i=0;i<productAttributes.length;i++){var tagName=productAttributes[i].tagName.toLowerCase(),elementType=productAttributes[i].type,type=productAttributes[i].getAttribute("data-attribute-type"), name=productAttributes[i].name;"hidden"==elementType&&null!=type&&attributeType.push(type);productAttributes[i].onchange=function(){updateProductDisplayPrice()}} function updateProductDisplayPrice(){for(var b,a,c=baseProductPrice,f=regularProductPrice,d=1;d<productAttributeCount;d++)if(b=document.getElementsByName("Product_Attributes["+d+"]:value"),"select"==attributeType[d])for(var e=0;e<b.length;e++)a=b.item(e),a=a.options.item(a.selectedIndex),c+=Number(a.getAttribute("data-option-price")),f+=Number(a.getAttribute("data-regular-price"));else if("radio"==attributeType[d]||"checkbox"==attributeType[d])for(e=0;e<b.length;e++)a=b.item(e),a.checked&&(c+=Number(a.getAttribute("data-option-price")), f+=Number(a.getAttribute("data-regular-price")));else if("text"==attributeType[d]||"memo"==attributeType[d])a=b.item(0),a.value&&(c+=Number(a.getAttribute("data-option-price")),f+=Number(a.getAttribute("data-regular-price")));b=document.getElementsByName("Quantity");c*=Number(b.item(0).value);b.item(0);document.getElementById("js-price-value").innerHTML=formatCurrency(c);document.getElementById("js-mobile-price-value")&&(document.getElementById("js-mobile-price-value").innerHTML=formatCurrency(c))} function formatCurrency(b){var a=!1;0>b&&(a=!0,b=Math.abs(b));return(a?"-$":"$")+parseFloat(b,10).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g,"$1,").toString()}updateProductDisplayPrice();
}
// ---- AJAX Add To Cart ---- //
function addToCart () {
$('#js-add-to-cart').on('click', function (e) {
var purchaseForm = $('#js-purchase-product');
// Check the form is not currently submitting
if (purchaseForm.data('formstatus') !== 'submitting') {
// Set up variables
var form = purchaseForm,
formData = form.serialize(),
formUrl = form.attr('action').replace('^https?:', ''),
formMethod = form.attr('method'),
responseMessage = $('#js-purchase-message'),
miniBasket = $('#js-mini-basket-container'),
processingImage = $('#js-processing-purchase'),
purchaseButton = $(this),
purchaseButtonText = purchaseButton.val();
// Add status data to form
form.data('formstatus', 'submitting');
// Show processing message
processingImage.show();
purchaseButton.toggleDisabled().val('Processing...');
responseMessage.html('').hide();
// Send data to server for validation
$.ajax({
url: formUrl,
type: formMethod,
cache: false,
data: formData,
success: function(data, textStatus, jqXHR) {
if (data.search(/id="js-BASK"/i) != -1) {
$('html, body').animate({scrollTop: '0px'}, 250);
var responseMiniBasket = $(data).find('#js-mini-basket-container'),
miniBasketCount = responseMiniBasket.contents()[1].getAttribute('data-itemcount'),
miniBasketSubtotal = ' ' + responseMiniBasket.contents()[1].getAttribute('data-subtotal'),
miniBasketLinkCount = $('#js-mini-basket-count, #js-mobile-basket-button .notification'),
miniBasketLinkSubtotal = $('#js-mini-basket-subtotal');
miniBasketLinkCount.text(miniBasketCount); // Update basket quantity (display only)
miniBasketLinkSubtotal.text(miniBasketSubtotal); // Update basket subtotal (display only)
miniBasket.html(responseMiniBasket.contents()).addClass('open');
setTimeout(function () {
miniBasket.removeClass('open');
}, 5000);
// Re-Initialize Attribute Machine (if it is active)
if (typeof attrMachCall !== 'undefined') {
attrMachCall.Initialize();
}
}
else if(data.search(/id="js-PATR"/i) != -1) {
var missingAttrs = [];
form.find('.required').each(function () {
missingAttrs.push(' ' + $(this).attr('title'));
});
responseMessage.html('All <em class="red">Required</em> options have not been selected.<br />Please review the following options: <span class="red">' + missingAttrs + '</span>.').fadeIn().delay(5000).fadeOut();
}
else if(data.search(/id="js-PLMT"/i) != -1) {
responseMessage.html('We do not have enough of the Size/Color you have selected.<br />Please adjust your quantity.').fadeIn().delay(3000).fadeOut();
}
else if(data.search(/id="js-POUT"/i) != -1) {
responseMessage.html('The Size/Color you have selected is out of stock.<br />Please review your options or check back later.').fadeIn().delay(3000).fadeOut();
}
else {
responseMessage.html('Please review options.').fadeIn().delay(3000).fadeOut();
}
// Hide processing message and reset formstatus
processingImage.hide();
purchaseButton.toggleDisabled().val(purchaseButtonText);
form.data('formstatus', 'idle');
},
error: function (jqXHR, textStatus, errorThrown) {
}
});
}
// Prevent form from submitting
e.preventDefault();
});
}
addToCart();
// ---- Related Products Carousel ---- //
$.getScript(theme_path + '/js/jquery.slick.min.js', function () {
$('#js-related-products-carousel').slick({
draggable: false,
slidesToScroll: 2,
slidesToShow: 2,
});
});
// --- Mobile slider for Images --- //
function mobileImageSlider() {
var totalThumbs = parseFloat($('#js-thumbnails .thumbnail-img-wrap').length - 1 ),
currentImg = parseFloat($('#js-main-image-zoom').attr('data-index'));
if (totalThumbs === -1 ) {
$('.main-image-nav').hide();
} else {
$('#js-main-dots').html('');
$('#js-main-dots').html('<ul class="inline-list np"></ul>');
for (var i = totalThumbs; i >= 0; i--) {
if (i > 0){
$('#js-main-dots ul').prepend('<li data-index="' + i + '"></li>');
} else {
$('#js-main-dots ul').prepend('<li class="active" data-index="' + i + '"></li>');
}
}
}
$('#js-main-dots ul li').on('click', function() {
var clickedLI = parseFloat($(this).attr('data-index'));
$('#js-thumbnails .thumbnail-img-wrap[data-index="' + clickedLI + '"]').click();
$('#js-main-dots ul li.active').removeClass('active');
$(this).addClass('active');
currentImg = clickedLI;
});
function nextMobileImage() {
var currIndex = parseFloat($('#js-main-image-zoom').attr('data-index')),
nextImage = $('#js-main-dots li[data-index="' + (currIndex + 1) + '"]'),
firstImage = $('#js-main-dots li[data-index="0"]');
if ($(nextImage).length > 0) {
$(nextImage).click();
} else {
$(firstImage).click();
}
}
function prevMobileImage() {
var currIndex = parseFloat($('#js-main-image-zoom').attr('data-index')),
prevImage = $('#js-main-dots li[data-index="' + (currIndex - 1) + '"]'),
lastImage = $('#js-main-dots li[data-index="' + totalThumbs + '"]');
if ($(prevImage).length > 0) {
$(prevImage).click();
} else {
$(lastImage).click();
}
}
if (totalThumbs > 1 ) {
$("#js-main-image-zoom").swipe( {
swipeLeft:function(event, direction, distance, duration, fingerCount) {
nextMobileImage();
},
swipeRight:function(event, direction, distance, duration, fingerCount) {
prevMobileImage();
},
threshold:10
});
}
}
mobileImageSlider();
},
jsPLST: function () {
// ---- Conform all subcategory and/or product DIVs to same height ---- //
cornerstoneUX.sharedFunctions.conformDisplay();
// ---- Open Quick View ---- //
cornerstoneUX.sharedFunctions.openQuickView();
},
jsSRCH: function () {
// ---- Conform all subcategory and/or product DIVs to same height ---- //
cornerstoneUX.sharedFunctions.conformDisplay();
// ---- Open Quick View ---- //
cornerstoneUX.sharedFunctions.openQuickView();
},
jsBASK: function () {
// ---- Remove Item From Basket (Compatible down to IE6) ---- //
$('.remove-item').on('click', function () {
$(this).children('input').prop('checked', 'checked');
if ($(this).children('input').is(':checked')) {
$('#js-bask-form').submit();
}
});
// ---- Estimate Shipping Function ---- //
function estimateShipping () {
function resetFields () {
$('#js-shipping-estimate-state-select').prop('selectedIndex', 0);
$('#js-shipping-estimate-country').val('US');
$('#js-shipping-estimate-state, #js-shipping-estimate-zip').val('');
}
$('#js-show-shipping-estimate').on('click', function (e) {
e.preventDefault();
$('#js-shipping-estimate-dialog').fadeToggle();
resetFields();
});
$('#js-shipping-estimate-recalculate').on('click', function (e) {
e.preventDefault();
$(this).hide();
$('#js-shipping-estimate-results').fadeOut(function () {
$('#js-shipping-estimate-fields').fadeIn();
}).empty();
});
$('#js-shipping-estimate-form').on('submit', function (e) {
e.preventDefault();
if ($(this).data('formstatus') !== 'submitting') {
var form = $(this),
formData = form.serialize(),
formUrl = form.attr('action'),
formMethod = form.attr('method');
form.data('formstatus', 'submitting');
$('#js-processing-request').show();
$.ajax({
url: formUrl,
type: formMethod,
data: formData,
success: function(data, textStatus, jqXHR) {
$('#js-shipping-estimate-fields').fadeOut(function () {
$('#js-shipping-estimate-results').html(data).fadeIn();
$('#js-shipping-estimate-recalculate').fadeIn();
});
resetFields ();
form.data('formstatus', 'idle');
$('#js-processing-request').hide();
},
error: function (jqXHR, textStatus, errorThrown) {
console.log(errorThrown);
form.data('formstatus', 'idle');
}
});
}
});
}
estimateShipping();
},
jsACAD: function () {
// ---- Copy Email Address to Shipping or Billing Email ---- //
$('#js-Customer_LoginEmail').on('blur', function () {
var primaryAddress = $(this).attr('data-primary'),
shippingEmail = $('#js-Customer_ShipEmail'),
billingEmail = $('#js-Customer_BillEmail');
if (primaryAddress === 'shipping') {
if (shippingEmail && (shippingEmail.val() === '')) {
shippingEmail.val($(this).val());
}
}
else if (primaryAddress === 'billing') {
if (billingEmail && (billingEmail.val() === '')) {
billingEmail.val($(this).val());
}
}
});
// ---- Toggle Customer Fields Controls ---- //
// cornerstoneUX.sharedFunctions.toggleCustomerFields();
},
jsACED: function () {
// ---- Toggle Customer Fields Controls ---- //
// cornerstoneUX.sharedFunctions.toggleCustomerFields();
},
jsCTUS: function () {
// ---- Additional Server Security To Help Against Spambots ---- //
$.getScript('//ajax.aspnetcdn.com/ajax/jquery.validate/1.13.0/jquery.validate.min.js', function(){
var contactForm = $('#js-contact-form');
$('#js-noscript-warning').remove();
contactForm.show();
var url = theme_path + '/forms/token.php';
$.get(url, function (tkn) {
contactForm.append('<input type="hidden" name="mms" value="' + tkn + '" />');
});
// ---- Form Validation ---- //
contactForm.validate({
errorContainer: '#js-contact-form div.message',
errorLabelContainer: '#js-contact-form div.message small',
errorElement: 'p',
rules: {
contactName: {required: true, minlength: 2},
contactEmail: {required: true, email: true},
contactComment: {required: true, minlength: 2}
},
messages: {
contactName: {required: 'Your Name Is Required', minlength: jQuery.validator.format('Your Name must be a minimum of {0} characters!')},
contactEmail: {required: 'Your Email Address Is Required', email: 'Your Email Address must be formatted like name@domain.com'},
contactComment: {required: 'Comments or Questions Are Required', minlength: jQuery.validator.format('Your Message must be a minimum of {0} characters!')}
},
highlight: function (element, errorClass) {
$(element.form).find('label[for=' + element.id + ']').addClass(errorClass);
},
unhighlight: function (element, errorClass) {
$(element.form).find('label[for=' + element.id + ']').removeClass(errorClass);
},
submitHandler: function (form) {
if ($(this).data('formstatus') !== 'submitting') {
var form = contactForm,
formData = form.serialize(),
formUrl = form.attr('action'),
formMethod = form.attr('method');
form.data('formstatus', 'submitting');
$.ajax({
url: formUrl,
type: formMethod,
data: formData,
success: function(data, textStatus, jqXHR) {
// Show reponse message
if (data.search(/error/i) != -1) {
$('#js-contact-form div.message').fadeOut(200, function () {
$(this).removeClass('message-info').addClass('message-error').text(data).fadeIn(200);
});
}
else {
$('#js-contact-form div.message').removeClass('message-error').addClass('message-success').text(data).fadeIn(200);
}
form.data('formstatus', 'idle');
},
error: function (jqXHR, textStatus, errorThrown) {
console.log(errorThrown);
form.data('formstatus', 'idle');
}
});
}
}
});
});
},
jsAFCL: function () {
// ---- Open Forgot Password ---- //
cornerstoneUX.sharedFunctions.openForgotPassword();
},
jsWLST: function () {
// ---- Open Forgot Password ---- //
cornerstoneUX.sharedFunctions.openForgotPassword();
},
jsLOGN: function () {
// ---- Open Forgot Password ---- //
cornerstoneUX.sharedFunctions.openForgotPassword();
},
jsORDL: function () {
// ---- Open Forgot Password ---- //
cornerstoneUX.sharedFunctions.openForgotPassword();
},
jsORHL: function () {
// ---- Open Forgot Password ---- //
cornerstoneUX.sharedFunctions.openForgotPassword();
},
jsOCST: function () {
// ---- Open Log-In Form ---- //
$('#js-open-ocst-login').magnificPopup({
focus: '#l-Customer_LoginEmail',
items: {
src: $('#js-ocst-login'),
type: 'inline'
}
});
// ---- Open Forgot Password ---- //
cornerstoneUX.sharedFunctions.openForgotPassword('jsOCST');
// ---- Cart Summary Controls ---- //
cornerstoneUX.sharedFunctions.cartSummary();
// ---- Google Address Autocomplete ---- //
// cornerstoneUX.sharedFunctions.mvGAAC.init();
// ---- Show/Hide State Field --- //
(function(){
var $countries = $('#ShipCountry, #BillCountry'),
updateStateFromCountry = function(){
var $select = $(this),
$row = $select.closest('.form-row'),
$next_row = $row.next('.form-row'),
$next_select_row = $next_row.find('.js-state-select-wrapper'),
$next_select = $next_select_row.find('select'),
$next_input_row = $next_row.find('.js-state-input-wrapper'),
$next_input = $next_input_row.find('input');
if( $select.val() === 'US' ){
$next_select_row.show();
$next_input_row.hide();
$next_input.val('');
} else {
$next_select_row.hide();
$next_input_row.show();
$next_select.val('');
}
};
$countries.each( updateStateFromCountry );
$countries.on('change', updateStateFromCountry);
})();
$('#l-ShipEmail').on('input', function(){
var $input = $(this),
email = $input.val();
$('#js-create-customer-email-display').text( email );
$('#js-create-customer-email-input').val( email );
});
(function(){
var updateCreateCustomerFields = function(){
var $toggle = $('#js-create-customer');
if( $toggle.is(':checked') ){
$('#js-create-customer-fields').slideDown('fast');
$('#js-Customer_Password, #js-Customer_VerifyPassword').prop('required', true);
} else {
$('#js-create-customer-fields').slideUp('fast');
$('#js-Customer_Password, #js-Customer_VerifyPassword').val('').trigger('input').prop('required', false);
}
};
$('#js-create-customer').on('change', updateCreateCustomerFields);
updateCreateCustomerFields();
})();
$('#js-Customer_Password, #js-Customer_VerifyPassword').on('input', function(){
var $password = $('#js-Customer_Password'),
password = $password.val(),
$verify_password = $('#js-Customer_VerifyPassword'),
verify_password = $verify_password.val(),
$message = $('#js-password-message');
if( password && password.length && verify_password && verify_password.length ){
if( password === verify_password ){
$message.html('<span class="green"><span data-icon="R"></span> Passwords Match</span>');
} else {
$message.html('<span class="red"><span data-icon="Q"></span> Passwords Do Not Match</span>');
}
} else {
$message.html('');
}
});
(function(){
var createdCustomer = false;
$('#js-ocst-form').on('submit', function(e){
var $form = $(this),
$button = $form.find('input[type="submit"]'),
fields = $form.serializeArray(),
data = '',
screenFound = false;
// Don't submit if we are already submitting
if( $form.data('status') === 'submitting' ) return;
// Let submit proceed if they are not creating customer
if ( !$('#js-create-customer').is(':checked') ) return;
// Let submit proceed we have successfully created a customer using the following AJAX call
if ( createdCustomer ) return;
e.preventDefault();
$form.data('status', 'submitting');
$('#js-messages').html('');
$button.data('value', $button.attr('value') );
$button.prop('disabled', true).attr('value', 'Creating Account...');
if( ToggleDetails.trigger.checked ){
ToggleDetails.CopyFields();
$(ToggleDetails.secondary_inputs, ToggleDetails.secondary_selects).trigger('input');
}
$.each(fields, function(i, field){
// Rename OCST fields to create an account
if( field.name === 'Action' ){
data += '&Action=ICST';
} else if( field.name === 'Screen' ){
data += '&Screen=ACED';
screenFound = true;
} else if( /(Ship|Bill)/.test(field.name) ){
data += '&Customer_' + field.name + '=' + field.value;
} else {
data += '&' + field.name + '=' + field.value;
}
});
if( !screenFound ){
data += '&Screen=ACED';
}
$.ajax({
url: '/mm5/merchant.mvc',
type: 'POST',
dataType: 'json',
data: data + '&api=1',
})
.done(function(response) {
if( response.page_code ==='ACED' ){
createdCustomer = true;
$form.append('<input type="hidden" namme="Customer_Created" value="yes">');
$form.submit();
} else if( response.error_messages.length ){
var html = '<div class="message message-error">';
$.each(response.error_messages, function(i, error){
html += error + '<br>';
});
html += '</div>';
$('#js-messages').html(html);
scrollToDiv( $('#js-messages'), 50);
// TODO: Add better input validation
}
})
.always(function() {
$form.data('status', '');
$button.prop('disabled', false).attr('value', $button.data('value') );
});
});
})();
},
jsOSEL: function () {
// ---- Cart Summary Controls ---- //
cornerstoneUX.sharedFunctions.cartSummary();
},
jsOPAY: function () {
// ---- Cart Summary Controls ---- //
cornerstoneUX.sharedFunctions.cartSummary();
// ---- Make Credit Card Expiration Fields More User-Friendly ---- //
$('#js-cc_exp select').first().find('option:first').text('Month');
$('#js-cc_exp select').last().find('option:first').text('Year');
// ---- CVV Information Function ---- //
$('#js-open-cvv-information').magnificPopup({
items: {
src: $('#js-cvv-information'),
type: 'inline'
}
});
// ---- Secondary Form Submit Button ---- //
$('#js-opay-form-submit').on('click', function () {
$('#js-opay-form').submit();
});
// ---- Opayments ---- //
(function(){
var opayments = {};
opayments.debug = false;
opayments.$form = $('input[name="Action"]').closest('form');
opayments.$actualRows = $('.payment-field-row');
opayments.$proxyInputs = $('.proxy-input');
opayments.init = function(){
if( !$('.proxy-payment-fields').length ){
return;
}
opayments.copyAllActualToProxy();
opayments.$actualRows.on('input keyup blur change', 'input, select', opayments.copyAllActualToProxy);
opayments.$proxyInputs.on('input keyup blur change', opayments.copyProxyInputToActual);
opayments.$form.on('submit', opayments.copyAllProxyToActual );
if( opayments.debug ){
opayments.$actualRows.css('opacity', 0.5);
} else {
opayments.$actualRows.hide();
}
$('.proxy-payment-fields').show();
};
opayments.copyActualRowToProxy = function(){
var $row = $(this),
code = $row.data('code'),
invalid = $row.data('invalid'),
classes = (!!invalid) ? 'invalid red' : '',
$input = $row.find('input');
switch (code) {
case 'cc_exp':
$('.proxy-input-cc_exp_month').closest('.proxy-payment-field-row').addClass(classes);
$('.proxy-input-cc_exp_month').val( $row.find('[name*="Month"], [name*="month"]').val() );
$('.proxy-input-cc_exp_year').val( $row.find('[name*="Year"], [name*="year"]').val() );
break;
case 'cc_name':
case 'cc_fname':
case 'cc_lname':
case 'cc_number':
case 'cc_cvv':
case 'cvv':
default:
$('.proxy-input-' + code).closest('.proxy-payment-field-row').addClass(classes);
$('.proxy-input-' + code).val( $input.val() );
break;
}
};
opayments.copyAllActualToProxy = function(){
opayments.$actualRows.each( opayments.copyActualRowToProxy );
};
opayments.copyProxyInputToActual = function(){
var $input = $(this),
code = $input.data('code'),
$proxy = {};
switch (code) {
case 'cc_exp_month':
$proxy = opayments.$form.find('[name*="Month"], [name*="month"]');
break;
case 'cc_exp_year':
$proxy = opayments.$form.find('[name*="Year"], [name*="year"]');
break;
case 'cc_name':
case 'cc_fname':
case 'cc_lname':
case 'cc_number':
case 'cc_cvv':
case 'cvv':
default:
$proxy = $('.payment-field-row-' + code).find('input');
break;
}
$proxy.val( $input.val() );
};
opayments.copyAllProxyToActual = function(){
opayments.$proxyInputs.each( opayments.copyProxyInputToActual );
};
opayments.init();
})();
(function creditCardFormatting(){
$.getScript('https://cdnjs.cloudflare.com/ajax/libs/jquery.payment/1.3.2/jquery.payment.min.js', function(){
var creditCardTypeMap = {
visa: '.payment-method-selectors input:radio[data-name="Visa"]',
mastercard: '.payment-method-selectors input:radio[data-name="MasterCard"]',
amex: '.payment-method-selectors input:radio[data-name="American Express"]',
discover: '.payment-method-selectors input:radio[data-name="Discove"]r'
},
$form = $('#js-opay-form'),
$paymentMethods = $form.find('input:radio[name="PaymentMethod"]'),
$cc_number = $form.find('.proxy-input-cc_number'),
updatePaymentMethod = function(){
var type = $.payment.cardType( $cc_number.val() ),
$matchingPaymentMethod = $(creditCardTypeMap[type]);
if( $matchingPaymentMethod.length ){
$matchingPaymentMethod.prop('checked', true);
}
};
$cc_number.payment('formatCardNumber').on('input blur', updatePaymentMethod);
$('.proxy-input-cc_cvv, .proxy-input-cvv').payment('formatCardCVC');
updatePaymentMethod();
});
})();
},
jsINVC: function () {
},
jsORDP: function () {
// ---- Launch Printer Dialog ---- //
window.print();
},
jsSMAP: function () {
// ---- Conform all site map DIVs to same height ---- //
cornerstoneUX.sharedFunctions.conformDisplay('.site-map');
},
jsGFTL: function () {
// ---- Open Forgot Password ---- //
cornerstoneUX.sharedFunctions.openForgotPassword();
},
jsWLGN: function () {
// ---- Open Forgot Password ---- //
cornerstoneUX.sharedFunctions.openForgotPassword();
}
};
cornerstoneUX.init();<mvt:if expr="g.Previous_Screen EQ 'OSEL'">
<mvt:item name="customfields" param="Write_Basket('order_instructions', g.order_instructions)" />
<mvt:else>
<mvt:item name="customfields" param="Read_Basket('order_instructions', g.order_instructions)" />
</mvt:if>
<mvt:foreach array="payment:fields" iterator="field">
<mvt:if expr="l.settings:field:code CIN 'cc_fname,cc_lname,cc_name,cc_number,cc_exp,cvv'">
<mvt:assign name="l.settings:payment:proxy:active" value="1" />
</mvt:if>
<mvt:if expr="l.settings:field:code CIN 'cc_fname,cc_lname'">
<mvt:assign name="l.settings:payment:proxy:cc_name_split:active" value="1" />
<mvt:elseif expr="l.settings:field:code CIN 'cc_name'">
<mvt:assign name="l.settings:payment:proxy:cc_name_full:active" value="1" />
<mvt:elseif expr="l.settings:field:code EQ 'cc_number'">
<mvt:assign name="l.settings:payment:proxy:cc_number:active" value="1" />
<mvt:elseif expr="l.settings:field:code EQ 'cc_exp'">
<mvt:assign name="l.settings:payment:proxy:cc_exp:active" value="1" />
<mvt:elseif expr="l.settings:field:code EQ 'cvv'">
<mvt:assign name="l.settings:payment:proxy:cvv:active" value="1" />
</mvt:if>
</mvt:foreach>
<mvt:item name="html_profile" />
<head>
<mvt:if expr="NOT ISNULL l.settings:page:title">
<title>&mvt:page:title;</title>
<mvt:else>
<title>&mvt:store:name;: &mvt:page:name;</title>
</mvt:if>
<mvt:item name="head" param="head_tag" />
<mvt:if expr="l.settings:payment:capabilities:split">
<script type="text/javascript">
function AmountType_Changed( amounttype ){
var balance_amount, amount, additional;
balance_amount = document.getElementById( 'payment-balance-amount' );
amount = document.getElementById( 'payment-amount' );
additional = document.getElementById( 'payment-additional' );
if ( amounttype === 'total' )
{
amount.disabled = true;
additional.style.display = 'none';
if ( balance_amount )
{
balance_amount.disabled = true;
}
}
else if ( amounttype === 'balance' )
{
amount.disabled = true;
additional.style.display = '';
if ( balance_amount )
{
balance_amount.disabled = false;
}
}
else if ( amounttype === 'partial' )
{
amount.disabled = false;
additional.style.display = '';
if ( balance_amount )
{
balance_amount.disabled = true;
}
}
}
</script>
</mvt:if>
</head>
<body id="js-&mvte:page:code;" class="<mvt:eval expr="tolower(l.settings:page:code)" /> single-column">
<mvt:item name="hdft" param="global_header" />
<mvt:item name="html_profile" />
<div class="row hdft-header">
<mvt:item name="hdft" param="header" />
</div>
<div class="row bg-white bottom-shadow main-content-row">
<div class="column whole large-seven-twelfths large-nrp">
<mvt:item name="readytheme" param="contentsection( 'checkout_steps' )" />
<h1>Payment</h1>
<form method="post" action="&mvt:payment:url;" id="js-opay-form" class="clearfix">
<input type="hidden" name="Action" value="AUTH" />
<input type="hidden" name="Screen" value="INVC" />
<input type="hidden" name="Store_Code" value="&mvte:global:Store_Code;" />
<mvt:item name="payment" />
<mvt:if expr="NOT l.settings:payment:proxy:active">
<input type="hidden" name="PaymentMethod" value="&mvte:global:PaymentMethod;" />
</mvt:if>
<input type="hidden" name="SplitPaymentData" value="&mvte:global:SplitPaymentData;" />
<input type="hidden" name="PaymentDescription" value="&mvte:payment:desc;" />
<mvt:comment><div class="row">
<p class="column whole h4 fields-heading uppercase">Payment Method: &mvt:payment:desc;</p>
</div></mvt:comment>
<div class="row">
<div class="column whole medium-four-fifths">
<mvt:if expr="NOT ISNULL l.settings:payment:desc">
<span class="bold"></span>
</mvt:if>
<mvt:if expr="NOT ISNULL l.settings:payment:message">
<p class="column whole">&mvt:payment:message;</p>
</mvt:if>
<mvt:comment>
<!--
<mvt:foreach array="payment:fields" iterator="field">
<div id="js-&mvt:field:code;" class="form-row">
<mvt:if expr="l.settings:field:invalid">
<label class="required error">&mvt:field:prompt;</label>
<mvt:else>
<label class="required">&mvt:field:prompt;</label>
</mvt:if>
<div class="&mvt:field:code;"><mvt:item name="payment" param="field:code" /></div>
</div>
</mvt:foreach>
-->
</mvt:comment>
<div id="payment-fields">
<mvt:foreach array="payment:fields" iterator="field">
<div class="form_row payment-field-row payment-field-row-&mvte:field:code;" data-code="&mvte:field:code;" data-invalid="&mvte:field:invalid;" data-prompt="&mvte:field:prompt;">
<mvt:if expr="l.settings:field:invalid">
<label class="bold red">&mvt:field:prompt;</label>
<mvt:else>
<label class="bold">&mvt:field:prompt;</label>
</mvt:if>
<mvt:item name="payment" param="field:code" />
</div>
</mvt:foreach>
</div>
<mvt:if expr="l.settings:payment:proxy:active">
<div class="proxy-payment-fields" style="display: none;">
<mvt:if expr="l.settings:payment:proxy:cc_name_full:active">
<div class="form-row proxy-payment-field-row">
<div class="floating-placeholder">
<input type="text" id="l-cc_name" class="proxy-input proxy-input-cc_name" data-code="cc_name" class="input">
<label for="l-cc_name">Name on Card</label>
</div>
</div>
</mvt:if>
<mvt:if expr="l.settings:payment:proxy:cc_name_split:active">
<div class="form-row proxy-payment-field-row">
<div class="row">
<div class="column half">
<div class="floating-placeholder">
<input type="text" id="l-cc_fname" class="proxy-input proxy-input-cc_fname" data-code="cc_fname" class="input">
<label for="l-cc_fname">First Name</label>
</div>
</div>
<div class="column half">
<div class="floating-placeholder">
<input type="text" id="l-cc_lname" class="proxy-input proxy-input-cc_lname" data-code="cc_lname" class="input">
<label for="l-cc_lname">Last Name</label>
</div>
</div>
</div>
</div>
</mvt:if>
<mvt:if expr="l.settings:payment:proxy:cc_number:active">
<div class="form-row proxy-payment-field-row">
<div class="floating-placeholder">
<input type="text" id="l-cc_number" class="proxy-input proxy-input-cc_number" data-code="cc_number" class="input">
<label for="l-cc_number">Card Number</label>
</div>
</div>
<div class="form-row payment-method-selectors">
<mvt:foreach array="paymentmethods" iterator="method">
<mvt:if expr="l.settings:method:module NE gettoken( g.PaymentMethod, ':', 1 )">
<mvt:foreachcontinue/>
</mvt:if>
<mvt:assign name="l.paymentmethod_counter" value="l.paymentmethod_counter + 1" />
<mvt:if expr="l.paymentmethod_counter EQ 1">
<mvt:assign name="l.settings:method:checked" value="'checked'" />
<mvt:else>
<mvt:assign name="l.settings:method:checked" value="''" />
</mvt:if>
<mvt:if expr="'am' CIN l.settings:method:code OR 'ax' CIN l.settings:method:code OR '003' CIN l.settings:method:code">
<mvt:assign name="l.settings:method:image" value="g.theme_path $ '/images/icons/logo_amex.png'" />
<mvt:elseif expr="'vi' CIN l.settings:method:code OR '001' CIN l.settings:method:code">
<mvt:assign name="l.settings:method:image" value="g.theme_path $ '/images/icons/logo_visa.png'" />
<mvt:elseif expr="'mc' CIN l.settings:method:code OR 'master' CIN l.settings:method:code OR '002' CIN l.settings:method:code">
<mvt:assign name="l.settings:method:image" value="g.theme_path $ '/images/icons/logo_mastercard.png'" />
<mvt:elseif expr="('di' CIN l.settings:method:code AND NOT ('dinners' CIN l.settings:method:code)) OR '004' CIN l.settings:method:code">
<mvt:assign name="l.settings:method:image" value="g.theme_path $ '/images/icons/logo_discover.png'" />
<mvt:elseif expr="'ach' CIN l.settings:method:code OR 'check' CIN l.settings:method:code">
<mvt:assign name="l.settings:method:image" value="g.theme_path $ '/images/icons/logo_check.png'" />
<mvt:elseif expr="'paypal' CIN l.settings:method:code OR 'pp' CIN l.settings:method:code OR 'pal' CIN l.settings:method:code">
<mvt:assign name="l.settings:method:image" value="g.theme_path $ '/images/icons/logo_paypal.png'" />
<mvt:else>
<mvt:assign name="l.settings:method:image" value="''" />
</mvt:if>
<label for="l-&mvte:method:module;-&mvte:method:code;">
<input type="radio" name="PaymentMethod" id="l-&mvte:method:module;-&mvte:method:code;" data-name="&mvt:method:name;" value="&mvte:method:module;:&mvte:method:code;" &mvt:method:checked;>
<img src="&mvt:method:image;" alt="&mvt:method:name;">
</label>
</mvt:foreach>
</div>
</mvt:if>
<mvt:if expr="l.settings:payment:proxy:cc_exp:active">
<div class="form_row proxy-payment-field-row">
<div class="row">
<div class="column half">
<div class="floating-placeholder">
<select id="l-cc_exp_month" class="proxy-input proxy-input-cc_exp_month input" data-code="cc_exp_month">
<option value="">Select one...</option>
<mvt:while expr="g.cc_exp_month_counter LT 12">
<mvt:assign name="g.cc_exp_month_counter" value="g.cc_exp_month_counter + 1" />
<option value="&mvte:global:cc_exp_month_counter;">&mvte:global:cc_exp_month_counter;</option>
</mvt:while>
</select>
<label for="l-cc_exp_month">Expiration Month</label>
</div>
</div>
<div class="column half">
<div class="floating-placeholder">
<select id="l-cc_exp_year" class="proxy-input proxy-input-cc_exp_year" data-code="cc_exp_year">
<option value="">Select one...</option>
<mvt:assign name="g.cc_exp_year" value="s.dyn_tm_year" />
<mvt:while expr="g.cc_exp_year_counter LT 25">
<option value="&mvte:global:cc_exp_year;">&mvte:global:cc_exp_year;</option>
<mvt:assign name="g.cc_exp_year_counter" value="g.cc_exp_year_counter + 1" />
<mvt:assign name="g.cc_exp_year" value="s.dyn_tm_year + g.cc_exp_year_counter" />
</mvt:while>
</select>
<label for="l-cc_exp_year">Expiration Year</label>
</div>
</div>
</div>
</div>
</mvt:if>
<mvt:if expr="l.settings:payment:proxy:cvv:active">
<div class="form_row proxy-payment-field-row">
<div class="row">
<div class="column half">
<div class="floating-placeholder">
<input type="text" size="4" id="l-cvv" class="proxy-input proxy-input-cvv" data-code="cvv">
<label for="l-cvv">CVV</label>
</div>
</div>
</div>
</div>
</mvt:if>
</div>
</mvt:if>
<mvt:if expr="l.settings:payment:capabilities:split">
<div class="form-row">
<mvt:if expr="g.Amount_Invalid">
<label class="required error">Payment Amount:</label>
<mvt:else>
<label class="required">Payment Amount:</label>
</mvt:if>
<div id="payment-amount-fields">
<mvt:if expr="( NOT l.settings:payment:capabilities:balance ) OR ( l.settings:payment:balance GE l.settings:splitpayment:remaining )">
<mvt:if expr="NOT g.UI_Exception">
<mvt:assign name="g.AmountType" value="'total'" />
<mvt:assign name="g.Amount" value="l.settings:splitpayment:remaining ROUND 2" />
</mvt:if>
<mvt:if expr="g.AmountType EQ 'total'">
<input type="radio" name="AmountType" value="total" onclick="AmountType_Changed( this.value );" checked />
<mvt:else>
<input type="radio" name="AmountType" value="total" onclick="AmountType_Changed( this.value );" />
</mvt:if>
<mvt:if expr="NOT ISNULL l.settings:payment:split_data">
Remaining Order Total (&mvt:payment:formatted_remaining;)<br />
<mvt:else>
Entire Order Total (&mvt:basket:formatted_total;)<br />
</mvt:if>
<mvt:else>
<mvt:if expr="NOT g.UI_Exception">
<mvt:assign name="g.AmountType" value="'balance'" />
<mvt:assign name="g.Amount" value="l.settings:payment:balance ROUND 2" />
</mvt:if>
<mvt:if expr="g.AmountType EQ 'balance'">
<input type="radio" name="AmountType" value="balance" onclick="AmountType_Changed( this.value );" checked />
<input type="hidden" id="payment-balance-amount" name="Amount" value="&mvte:payment:balance;" />
<mvt:else>
<input type="radio" name="AmountType" value="balance" onclick="AmountType_Changed( this.value );" />
<input type="hidden" id="payment-balance-amount" name="Amount" value="&mvte:payment:balance;" disabled />
</mvt:if>
Available Balance (&mvt:payment:formatted_balance;)<br />
</mvt:if>
<mvt:if expr="g.AmountType EQ 'partial'">
<input type="radio" name="AmountType" value="partial" onclick="AmountType_Changed( this.value );" checked />
Partial: <input type="text" id="payment-amount" name="Amount" value="&mvte:global:Amount;" />
<mvt:else>
<input type="radio" name="AmountType" value="partial" onclick="AmountType_Changed( this.value );" />
Partial: <input type="text" id="payment-amount" name="Amount" value="&mvte:global:Amount;" disabled />
</mvt:if>
</div>
</div>
<mvt:if expr="g.AmountType EQ 'total'">
<mvt:assign name="g.totalPayment" value="'display: none;'" />
</mvt:if>
<div id="payment-additional" style="&mvt:global:totalPayment;">
<div class="form_row">
<label class="required">Pay Additional Balance With:</label>
<select name="AdditionalPaymentMethod">
<mvt:foreach array="paymentmethods" iterator="method">
<mvt:if expr="(l.settings:method:module NE 'customercredit') OR ((g.PaymentMethod NE 'customercredit:credit') AND (NOT miva_array_search(l.settings:splitpayment:splits, 1, l.split, 'l.split:module:code EQ l.settings:method:module')))">
<option value="&mvte:method:module;:&mvte:method:code;">&mvt:method:name;</option>
</mvt:if>
</mvt:foreach>
</select>
</div>
</div>
</mvt:if>
</div>
</div>
<div class="breaker"></div>
<div class="row">
<div class="column whole align-center medium-align-right np">
<input type="submit" value="Complete Order" class="button button-primary button-large-font uppercase checkout-button bg-green white nb complete-order-button" />
</div>
</div>
<div class="breaker"></div>
</form>
</div>
<div class="column whole large-offset-one-twelfth large-one-third">
<mvt:item name="basket" />
<br>
<mvt:item name="customer" />
</div>
</div>
<div class="row hdft-footer">
<mvt:item name="hdft" param="footer" />
</div>
<mvt:item name="hdft" param="global_footer" />
</body>
</html>