/* global wc_cart_params */ jQuery( function( $ ) { // wc_cart_params is required to continue, ensure the object exists if ( typeof wc_cart_params === 'undefined' ) { return false; } // Utility functions for the file. /** * Gets a url for a given AJAX endpoint. * * @param {String} endpoint The AJAX Endpoint * @return {String} The URL to use for the request */ var get_url = function( endpoint ) { return wc_cart_params.wc_ajax_url.toString().replace( '%%endpoint%%', endpoint ); }; /** * Check if a node is blocked for processing. * * @param {JQuery Object} $node * @return {bool} True if the DOM Element is UI Blocked, false if not. */ var is_blocked = function( $node ) { return $node.is( '.processing' ); }; /** * Block a node visually for processing. * * @param {JQuery Object} $node */ var block = function( $node ) { $node.addClass( 'processing' ).block( { message: null, overlayCSS: { background: '#fff', opacity: 0.6 } } ); }; /** * Unblock a node after processing is complete. * * @param {JQuery Object} $node */ var unblock = function( $node ) { $node.removeClass( 'processing' ).unblock(); }; /** * Update the .woocommerce div with a string of html. * * @param {String} html_str The HTML string with which to replace the div. */ var update_wc_div = function( html_str ) { var $html = $.parseHTML( html_str ); var $new_form = $( 'table.shop_table.cart', $html ).closest( 'form' ); if ( $new_form.length === 0 ) { // No items to display now! Replace all cart content. var $cart_html = $( '.cart-empty', $html ).closest( '.woocommerce' ); $( 'table.shop_table.cart' ).closest( '.woocommerce' ).replaceWith( $cart_html ); } else { var $error = $( '.woocommerce-error', $html ); var $message = $( '.woocommerce-message', $html ); if ( $error.length > 0 ) { show_notice( $error ); } else if ( $message.length > 0 ) { show_notice( $message ); } else { // No new message/error, just remove existing one. $( '.woocommerce-error, .woocommerce-message' ).remove(); } $( 'table.shop_table.cart' ).closest( 'form' ).replaceWith( $new_form ); $( 'table.shop_table.cart' ).closest( 'form' ).find( 'input[name="update_cart"]' ).prop( 'disabled', true ); } }; /** * Clear previous notices and shows new one above form. * * @param {Object} The Notice HTML Element in string or object form. */ var show_notice = function( html_element ) { var $form = $( 'table.shop_table.cart' ).closest( 'form' ); $( '.woocommerce-error, .woocommerce-message' ).remove(); $form.before( html_element ); }; /** * Object to handle AJAX calls for cart shipping changes. */ var cart_shipping = { /** * Initialize event handlers and UI state. */ init: function( cart ) { this.cart = cart; this.toggle_shipping = this.toggle_shipping.bind( this ); this.shipping_method_selected = this.shipping_method_selected.bind( this ); this.shipping_calculator_submit = this.shipping_calculator_submit.bind( this ); $( document ).on( 'click', '.shipping-calculator-button', this.toggle_shipping ); $( document ).on( 'change', 'select.shipping_method, input[name^=shipping_method]', this.shipping_method_selected ); $( document ).on( 'submit', 'form.woocommerce-shipping-calculator', this.shipping_calculator_submit ); $( '.shipping-calculator-form' ).hide(); }, /** * Toggle Shipping Calculator panel */ toggle_shipping: function() { $( '.shipping-calculator-form' ).slideToggle( 'slow' ); return false; }, /** * Handles when a shipping method is selected. * * @param {Object} evt The JQuery event. */ shipping_method_selected: function( evt ) { var target = evt.target; var shipping_methods = []; $( 'select.shipping_method, input[name^=shipping_method][type=radio]:checked, input[name^=shipping_method][type=hidden]' ).each( function() { shipping_methods[ $( target ).data( 'index' ) ] = $( target ).val(); } ); block( $( 'div.cart_totals' ) ); var data = { security: wc_cart_params.update_shipping_method_nonce, shipping_method: shipping_methods }; $.post( get_url( 'update_shipping_method' ), data, function( response ) { $( 'div.cart_totals' ).replaceWith( response ); $( document.body ).trigger( 'updated_shipping_method' ); } ); }, /** * Handles a shipping calculator form submit. * * @param {Object} evt The JQuery event. */ shipping_calculator_submit: function( evt ) { evt.preventDefault(); var cart = this.cart; var $form = $( evt.target ); block( $form ); // Provide the submit button value because wc-form-handler expects it. $( '' ).attr( 'type', 'hidden' ) .attr( 'name', 'calc_shipping' ) .attr( 'value', 'x' ) .appendTo( $form ); // Make call to actual form post URL. $.ajax( { type: $form.attr( 'method' ), url: $form.attr( 'action' ), data: $form.serialize(), dataType: 'html', success: function( response ) { update_wc_div(response ); }, complete: function() { unblock( $form ); cart.update_cart_totals(); } } ); } }; /** * Object to handle cart UI. */ var cart = { /** * Initialize cart UI events. */ init: function() { this.update_cart_totals = this.update_cart_totals.bind( this ); this.cart_submit = this.cart_submit.bind( this ); this.submit_click = this.submit_click.bind( this ); this.apply_coupon = this.apply_coupon.bind( this ); this.remove_coupon_clicked = this.remove_coupon_clicked.bind( this ); this.quantity_update = this.quantity_update.bind( this ); this.item_remove_clicked = this.item_remove_clicked.bind( this ); $( document ).on( 'click', 'div.woocommerce > form input[type=submit]', this.submit_click ); $( document ).on( 'submit', 'div.woocommerce > form', this.cart_submit ); $( document ).on( 'click', 'a.woocommerce-remove-coupon', this.remove_coupon_clicked ); $( document ).on( 'click', 'td.product-remove > a', this.item_remove_clicked ); $( document ).on( 'change input', 'div.woocommerce > form .cart_item :input', this.input_changed ); $( 'div.woocommerce > form input[name="update_cart"]' ).prop( 'disabled', true ); }, /** * After an input is changed, enable the update cart button. */ input_changed: function() { $( 'div.woocommerce > form input[name="update_cart"]' ).prop( 'disabled', false ); }, /** * Update the cart after something has changed. */ update_cart_totals: function() { block( $( 'div.cart_totals' ) ); $.ajax( { url: get_url( 'get_cart_totals' ), dataType: 'html', success: function( response ) { $( 'div.cart_totals' ).replaceWith( response ); } } ); }, /** * Handle cart form submit and route to correct logic. * * @param {Object} evt The JQuery event */ cart_submit: function( evt ) { evt.preventDefault(); var $form = $( evt.target ); var $submit = $( document.activeElement ); var $clicked = $( 'input[type=submit][clicked=true]' ); if ( 0 === $form.find( 'table.shop_table.cart' ).length ) { return false; } if ( is_blocked( $form ) ) { return false; } if ( $clicked.is( '[name="update_cart"]' ) || $submit.is( 'input.qty' ) ) { this.quantity_update( $form ); } else if ( $clicked.is( '[name="apply_coupon"]' ) || $submit.is( '#coupon_code' ) ) { this.apply_coupon( $form ); } }, /** * Special handling to identify which submit button was clicked. * * @param {Object} evt The JQuery event */ submit_click: function( evt ) { $( 'input[type=submit]', $( evt.target ).parents( 'form' ) ).removeAttr( 'clicked' ); $( evt.target ).attr( 'clicked', 'true' ); }, /** * Apply Coupon code * * @param {JQuery Object} $form The cart form. */ apply_coupon: function( $form ) { block( $form ); var cart = this; var $text_field = $( '#coupon_code' ); var coupon_code = $text_field.val(); var data = { security: wc_cart_params.apply_coupon_nonce, coupon_code: coupon_code }; $.ajax( { type: 'POST', url: get_url( 'apply_coupon' ), data: data, dataType: 'html', success: function( response ) { show_notice( response ); }, complete: function() { unblock( $form ); $text_field.val( '' ); cart.update_cart_totals(); } } ); }, /** * Handle when a remove coupon link is clicked. * * @param {Object} evt The JQuery event */ remove_coupon_clicked: function( evt ) { evt.preventDefault(); var cart = this; var $tr = $( evt.target ).parents( 'tr' ); var coupon = $( evt.target ).attr( 'data-coupon' ); block( $tr.parents( 'table' ) ); var data = { security: wc_cart_params.remove_coupon_nonce, coupon: coupon }; $.ajax( { type: 'POST', url: get_url( 'remove_coupon' ), data: data, dataType: 'html', success: function( response ) { show_notice( response ); unblock( $tr.parents( 'table' ) ); }, complete: function() { cart.update_cart_totals(); } } ); }, /** * Handle a cart Quantity Update * * @param {JQuery Object} $form The cart form. */ quantity_update: function( $form ) { var cart = this; // Provide the submit button value because wc-form-handler expects it. $( '' ).attr( 'type', 'hidden' ) .attr( 'name', 'update_cart' ) .attr( 'value', 'Update Cart' ) .appendTo( $form ); block( $form ); // Make call to actual form post URL. $.ajax( { type: $form.attr( 'method' ), url: $form.attr( 'action' ), data: $form.serialize(), dataType: 'html', success: update_wc_div, complete: function() { unblock( $form ); cart.update_cart_totals(); } } ); }, /** * Handle when a remove item link is clicked. * * @param {Object} evt The JQuery event */ item_remove_clicked: function( evt ) { evt.preventDefault(); var cart = this; var $a = $( evt.target ); var $form = $a.parents( 'form' ); block( $form ); $.ajax( { type: 'GET', url: $a.attr( 'href' ), dataType: 'html', success: update_wc_div, complete: function() { unblock( $form ); cart.update_cart_totals(); } } ); } }; cart_shipping.init( cart ); cart.init(); } );