From f5691fd82a9d877ff1796e0bde01b9d075d41fcc Mon Sep 17 00:00:00 2001
From: Manos Psychogyiopoulos
Date: Fri, 31 Jul 2015 14:04:55 +0300
Subject: [PATCH] animate variations script markup changes
---
assets/js/frontend/add-to-cart-variation.js | 81 ++++++++++++++++---
.../js/frontend/add-to-cart-variation.min.js | 2 +-
2 files changed, 73 insertions(+), 10 deletions(-)
diff --git a/assets/js/frontend/add-to-cart-variation.js b/assets/js/frontend/add-to-cart-variation.js
index 822740c0985..755a19c7308 100644
--- a/assets/js/frontend/add-to-cart-variation.js
+++ b/assets/js/frontend/add-to-cart-variation.js
@@ -48,7 +48,7 @@
$el.text( $el.attr( 'data-' + data_attribute ) );
}
});
- $form.find( '.woocommerce-variation-description' ).remove();
+ $form.wc_variations_description_update( '' );
$form.trigger( 'reset_image' );
$form.find( '.single_variation_wrap' ).slideUp( 200 ).trigger( 'hide_variation' );
} )
@@ -165,7 +165,6 @@
variation_caption = variation.image_caption,
variation_title = variation.image_title;
- $form.find( '.variations_button' ).show();
$form.find( '.single_variation' ).html( variation.price_html + variation.availability_html );
if ( o_src === undefined ) {
@@ -241,10 +240,11 @@
$dimensions.text( $dimensions.attr( 'data-o_dimensions' ) );
}
- $single_variation_wrap.find( '.quantity' ).show();
+ var hide_qty = false;
+ var hide_qty_button = false;
if ( ! variation.is_purchasable || ! variation.is_in_stock || ! variation.variation_is_visible ) {
- $form.find( '.variations_button' ).hide();
+ hide_qty_button = true;
}
if ( ! variation.variation_is_visible ) {
@@ -265,16 +265,37 @@
if ( variation.is_sold_individually === 'yes' ) {
$single_variation_wrap.find( '.quantity input.qty' ).val( '1' );
+ hide_qty = true;
+ }
+
+ // Show/hide qty container
+ if ( hide_qty ) {
$single_variation_wrap.find( '.quantity' ).hide();
+ } else {
+ // No need to hide it when hiding its container
+ if ( ! hide_qty_button ) {
+ $single_variation_wrap.find( '.quantity' ).show();
+ }
}
- // display variation description
- $form.find( '.woocommerce-variation-description' ).remove();
-
- if ( variation.variation_description ) {
- $form.find( '.single_variation_wrap' ).prepend( '' + variation.variation_description + '
' );
+ // Show/hide qty & button container
+ if ( hide_qty_button ) {
+ if ( $single_variation_wrap.is( ':visible' ) ) {
+ $form.find( '.variations_button' ).slideUp( 200 );
+ } else {
+ $form.find( '.variations_button' ).hide();
+ }
+ } else {
+ if ( $single_variation_wrap.is( ':visible' ) ) {
+ $form.find( '.variations_button' ).slideDown( 200 );
+ } else {
+ $form.find( '.variations_button' ).show();
+ }
}
+ // Refresh variation description
+ $form.wc_variations_description_update( variation.variation_description );
+
$single_variation_wrap.slideDown( 200 ).trigger( 'show_variation', [ variation ] );
})
@@ -469,6 +490,48 @@
}
};
+ /**
+ * Performs animated variation description refreshes
+ */
+ $.fn.wc_variations_description_update = function( variation_description ) {
+ var $form = this;
+ var $variations_description = $form.find( '.woocommerce-variation-description' );
+
+ if ( $variations_description.length === 0 ) {
+ if ( variation_description ) {
+ // add transparent border to allow correct height measurement when children have top/bottom margins
+ $form.find( '.single_variation_wrap' ).prepend( $( '' + variation_description + '
' ).hide() );
+ $form.find( '.woocommerce-variation-description' ).slideDown( 200 );
+ }
+ } else {
+ var load_height = $variations_description.outerHeight( true );
+ var new_height = 0;
+ var animate_height = false;
+
+ // lock height
+ $variations_description.css( 'height', load_height );
+ // replace html
+ $variations_description.html( variation_description );
+ // measure height
+ $variations_description.css( 'height', 'auto' );
+
+ new_height = $variations_description.outerHeight( true );
+
+ if ( Math.abs( new_height - load_height ) > 1 ) {
+ animate_height = true;
+ // lock height
+ $variations_description.css( 'height', load_height );
+ }
+
+ // animate height
+ if ( animate_height ) {
+ $variations_description.animate( { 'height' : new_height }, { duration: 200, queue: false, always: function() {
+ $variations_description.css( { 'height' : 'auto' } );
+ } } );
+ }
+ }
+ };
+
$( function() {
if ( typeof wc_add_to_cart_variation_params !== 'undefined' ) {
$( '.variations_form' ).each( function() {
diff --git a/assets/js/frontend/add-to-cart-variation.min.js b/assets/js/frontend/add-to-cart-variation.min.js
index fc36d5a1a2e..21f662b05d7 100644
--- a/assets/js/frontend/add-to-cart-variation.min.js
+++ b/assets/js/frontend/add-to-cart-variation.min.js
@@ -1,4 +1,4 @@
/*!
* Variations Plugin
*/
-!function(a,b,c,d){a.fn.wc_variation_form=function(){var c=this,f=c.closest(".product"),g=parseInt(c.data("product_id"),10),h=c.data("product_variations"),i=h===!1,j=!1,k=c.find(".reset_variations");return c.unbind("check_variations update_variation_values found_variation"),c.find(".reset_variations").unbind("click"),c.find(".variations select").unbind("change focusin"),c.on("click",".reset_variations",function(){return c.find(".variations select").val("").change(),c.trigger("reset_data"),!1}).on("reload_product_variations",function(){h=c.data("product_variations"),i=h===!1}).on("reset_data",function(){var b={".sku":"o_sku",".product_weight":"o_weight",".product_dimensions":"o_dimensions"};a.each(b,function(a,b){var c=f.find(a);c.attr("data-"+b)&&c.text(c.attr("data-"+b))}),c.find(".woocommerce-variation-description").remove(),c.trigger("reset_image"),c.find(".single_variation_wrap").slideUp(200).trigger("hide_variation")}).on("reset_image",function(){var a=f.find("div.images img:eq(0)"),b=f.find("div.images a.zoom:eq(0)"),c=a.attr("data-o_src"),e=a.attr("data-o_title"),g=a.attr("data-o_title"),h=b.attr("data-o_href");c!==d&&a.attr("src",c),h!==d&&b.attr("href",h),e!==d&&(a.attr("title",e),b.attr("title",e)),g!==d&&a.attr("alt",g)}).on("change",".variations select",function(){if(c.find('input[name="variation_id"], input.variation_id').val("").change(),c.find(".wc-no-matching-variations").remove(),i){j&&j.abort();var b=!0,d=!1,e={};c.find(".variations select").each(function(){var c=a(this).data("attribute_name")||a(this).attr("name");0===a(this).val().length?b=!1:d=!0,e[c]=a(this).val()}),b?(e.product_id=g,j=a.ajax({url:wc_cart_fragments_params.wc_ajax_url.toString().replace("%%endpoint%%","get_variation"),type:"POST",data:e,success:function(a){a?(c.find('input[name="variation_id"], input.variation_id').val(a.variation_id).change(),c.trigger("found_variation",[a])):(c.trigger("reset_data"),c.find(".single_variation_wrap").after(''+wc_add_to_cart_variation_params.i18n_no_matching_variations_text+"
"),c.find(".wc-no-matching-variations").slideDown(200))}})):c.trigger("reset_data"),d?"hidden"===k.css("visibility")&&k.css("visibility","visible").hide().fadeIn():k.css("visibility","hidden")}else c.trigger("woocommerce_variation_select_change"),c.trigger("check_variations",["",!1]),a(this).blur();c.trigger("woocommerce_variation_has_changed")}).on("focusin touchstart",".variations select",function(){i||(c.trigger("woocommerce_variation_select_focusin"),c.trigger("check_variations",[a(this).data("attribute_name")||a(this).attr("name"),!0]))}).on("found_variation",function(a,b){var e=f.find("div.images img:eq(0)"),g=f.find("div.images a.zoom:eq(0)"),h=e.attr("data-o_src"),i=e.attr("data-o_title"),j=e.attr("data-o_alt"),k=g.attr("data-o_href"),l=b.image_src,m=b.image_link,n=b.image_caption,o=b.image_title;c.find(".variations_button").show(),c.find(".single_variation").html(b.price_html+b.availability_html),h===d&&(h=e.attr("src")?e.attr("src"):"",e.attr("data-o_src",h)),k===d&&(k=g.attr("href")?g.attr("href"):"",g.attr("data-o_href",k)),i===d&&(i=e.attr("title")?e.attr("title"):"",e.attr("data-o_title",i)),j===d&&(j=e.attr("alt")?e.attr("alt"):"",e.attr("data-o_alt",j)),l&&l.length>1?(e.attr("src",l).attr("alt",o).attr("title",o),g.attr("href",m).attr("title",n)):(e.attr("src",h).attr("alt",j).attr("title",i),g.attr("href",k).attr("title",i));var p=c.find(".single_variation_wrap"),q=f.find(".product_meta").find(".sku"),r=f.find(".product_weight"),s=f.find(".product_dimensions");q.attr("data-o_sku")||q.attr("data-o_sku",q.text()),r.attr("data-o_weight")||r.attr("data-o_weight",r.text()),s.attr("data-o_dimensions")||s.attr("data-o_dimensions",s.text()),b.sku?q.text(b.sku):q.text(q.attr("data-o_sku")),b.weight?r.text(b.weight):r.text(r.attr("data-o_weight")),b.dimensions?s.text(b.dimensions):s.text(s.attr("data-o_dimensions")),p.find(".quantity").show(),b.is_purchasable&&b.is_in_stock&&b.variation_is_visible||c.find(".variations_button").hide(),b.variation_is_visible||c.find(".single_variation").html(""+wc_add_to_cart_variation_params.i18n_unavailable_text+"
"),""!==b.min_qty?p.find(".quantity input.qty").attr("min",b.min_qty).val(b.min_qty):p.find(".quantity input.qty").removeAttr("min"),""!==b.max_qty?p.find(".quantity input.qty").attr("max",b.max_qty):p.find(".quantity input.qty").removeAttr("max"),"yes"===b.is_sold_individually&&(p.find(".quantity input.qty").val("1"),p.find(".quantity").hide()),c.find(".woocommerce-variation-description").remove(),b.variation_description&&c.find(".single_variation_wrap").prepend(''+b.variation_description+"
"),p.slideDown(200).trigger("show_variation",[b])}).on("check_variations",function(c,d,f){if(!i){var g=!0,j=!1,k={},l=a(this),m=l.find(".reset_variations");l.find(".variations select").each(function(){var b=a(this).data("attribute_name")||a(this).attr("name");0===a(this).val().length?g=!1:j=!0,d&&b===d?(g=!1,k[b]=""):k[b]=a(this).val()});var n=e.find_matching_variations(h,k);if(g){var o=n.shift();o?(l.find('input[name="variation_id"], input.variation_id').val(o.variation_id).change(),l.trigger("found_variation",[o])):(l.find(".variations select").val(""),f||l.trigger("reset_data"),b.alert(wc_add_to_cart_variation_params.i18n_no_matching_variations_text))}else l.trigger("update_variation_values",[n]),f||l.trigger("reset_data"),d||l.find(".single_variation_wrap").slideUp(200).trigger("hide_variation");j?"hidden"===m.css("visibility")&&m.css("visibility","visible").hide().fadeIn():m.css("visibility","hidden")}}).on("update_variation_values",function(b,d){i||(c.find(".variations select").each(function(b,c){var e,f=a(c);f.data("attribute_options")||f.data("attribute_options",f.find("option:gt(0)").get()),f.find("option:gt(0)").remove(),f.append(f.data("attribute_options")),f.find("option:gt(0)").removeClass("attached"),f.find("option:gt(0)").removeClass("enabled"),f.find("option:gt(0)").removeAttr("disabled"),e="undefined"!=typeof f.data("attribute_name")?f.data("attribute_name"):f.attr("name");for(var g in d)if("undefined"!=typeof d[g]){var h=d[g].attributes;for(var i in h)if(h.hasOwnProperty(i)){var j=h[i];if(i===e){var k="";d[g].variation_is_active&&(k="enabled"),j?(j=a("").html(j).text(),j=j.replace(/'/g,"\\'"),j=j.replace(/"/g,'\\"'),f.find('option[value="'+j+'"]').addClass("attached "+k)):f.find("option:gt(0)").addClass("attached "+k)}}}f.find("option:gt(0):not(.attached)").remove(),f.find("option:gt(0):not(.enabled)").attr("disabled","disabled")}),c.trigger("woocommerce_update_variation_values"))}),c.trigger("wc_variation_form"),c};var e={find_matching_variations:function(a,b){for(var c=[],d=0;d'+wc_add_to_cart_variation_params.i18n_no_matching_variations_text+"
"),c.find(".wc-no-matching-variations").slideDown(200))}})):c.trigger("reset_data"),d?"hidden"===k.css("visibility")&&k.css("visibility","visible").hide().fadeIn():k.css("visibility","hidden")}else c.trigger("woocommerce_variation_select_change"),c.trigger("check_variations",["",!1]),a(this).blur();c.trigger("woocommerce_variation_has_changed")}).on("focusin touchstart",".variations select",function(){i||(c.trigger("woocommerce_variation_select_focusin"),c.trigger("check_variations",[a(this).data("attribute_name")||a(this).attr("name"),!0]))}).on("found_variation",function(a,b){var e=f.find("div.images img:eq(0)"),g=f.find("div.images a.zoom:eq(0)"),h=e.attr("data-o_src"),i=e.attr("data-o_title"),j=e.attr("data-o_alt"),k=g.attr("data-o_href"),l=b.image_src,m=b.image_link,n=b.image_caption,o=b.image_title;c.find(".single_variation").html(b.price_html+b.availability_html),h===d&&(h=e.attr("src")?e.attr("src"):"",e.attr("data-o_src",h)),k===d&&(k=g.attr("href")?g.attr("href"):"",g.attr("data-o_href",k)),i===d&&(i=e.attr("title")?e.attr("title"):"",e.attr("data-o_title",i)),j===d&&(j=e.attr("alt")?e.attr("alt"):"",e.attr("data-o_alt",j)),l&&l.length>1?(e.attr("src",l).attr("alt",o).attr("title",o),g.attr("href",m).attr("title",n)):(e.attr("src",h).attr("alt",j).attr("title",i),g.attr("href",k).attr("title",i));var p=c.find(".single_variation_wrap"),q=f.find(".product_meta").find(".sku"),r=f.find(".product_weight"),s=f.find(".product_dimensions");q.attr("data-o_sku")||q.attr("data-o_sku",q.text()),r.attr("data-o_weight")||r.attr("data-o_weight",r.text()),s.attr("data-o_dimensions")||s.attr("data-o_dimensions",s.text()),b.sku?q.text(b.sku):q.text(q.attr("data-o_sku")),b.weight?r.text(b.weight):r.text(r.attr("data-o_weight")),b.dimensions?s.text(b.dimensions):s.text(s.attr("data-o_dimensions"));var t=!1,u=!1;b.is_purchasable&&b.is_in_stock&&b.variation_is_visible||(u=!0),b.variation_is_visible||c.find(".single_variation").html(""+wc_add_to_cart_variation_params.i18n_unavailable_text+"
"),""!==b.min_qty?p.find(".quantity input.qty").attr("min",b.min_qty).val(b.min_qty):p.find(".quantity input.qty").removeAttr("min"),""!==b.max_qty?p.find(".quantity input.qty").attr("max",b.max_qty):p.find(".quantity input.qty").removeAttr("max"),"yes"===b.is_sold_individually&&(p.find(".quantity input.qty").val("1"),t=!0),t?p.find(".quantity").hide():u||p.find(".quantity").show(),u?p.is(":visible")?c.find(".variations_button").slideUp(200):c.find(".variations_button").hide():p.is(":visible")?c.find(".variations_button").slideDown(200):c.find(".variations_button").show(),c.wc_variations_description_update(b.variation_description),p.slideDown(200).trigger("show_variation",[b])}).on("check_variations",function(c,d,f){if(!i){var g=!0,j=!1,k={},l=a(this),m=l.find(".reset_variations");l.find(".variations select").each(function(){var b=a(this).data("attribute_name")||a(this).attr("name");0===a(this).val().length?g=!1:j=!0,d&&b===d?(g=!1,k[b]=""):k[b]=a(this).val()});var n=e.find_matching_variations(h,k);if(g){var o=n.shift();o?(l.find('input[name="variation_id"], input.variation_id').val(o.variation_id).change(),l.trigger("found_variation",[o])):(l.find(".variations select").val(""),f||l.trigger("reset_data"),b.alert(wc_add_to_cart_variation_params.i18n_no_matching_variations_text))}else l.trigger("update_variation_values",[n]),f||l.trigger("reset_data"),d||l.find(".single_variation_wrap").slideUp(200).trigger("hide_variation");j?"hidden"===m.css("visibility")&&m.css("visibility","visible").hide().fadeIn():m.css("visibility","hidden")}}).on("update_variation_values",function(b,d){i||(c.find(".variations select").each(function(b,c){var e,f=a(c);f.data("attribute_options")||f.data("attribute_options",f.find("option:gt(0)").get()),f.find("option:gt(0)").remove(),f.append(f.data("attribute_options")),f.find("option:gt(0)").removeClass("attached"),f.find("option:gt(0)").removeClass("enabled"),f.find("option:gt(0)").removeAttr("disabled"),e="undefined"!=typeof f.data("attribute_name")?f.data("attribute_name"):f.attr("name");for(var g in d)if("undefined"!=typeof d[g]){var h=d[g].attributes;for(var i in h)if(h.hasOwnProperty(i)){var j=h[i];if(i===e){var k="";d[g].variation_is_active&&(k="enabled"),j?(j=a("").html(j).text(),j=j.replace(/'/g,"\\'"),j=j.replace(/"/g,'\\"'),f.find('option[value="'+j+'"]').addClass("attached "+k)):f.find("option:gt(0)").addClass("attached "+k)}}}f.find("option:gt(0):not(.attached)").remove(),f.find("option:gt(0):not(.enabled)").attr("disabled","disabled")}),c.trigger("woocommerce_update_variation_values"))}),c.trigger("wc_variation_form"),c};var e={find_matching_variations:function(a,b){for(var c=[],d=0;d'+b+"").hide()),c.find(".woocommerce-variation-description").slideDown(200));else{var e=d.outerHeight(!0),f=0,g=!1;d.css("height",e),d.html(b),d.css("height","auto"),f=d.outerHeight(!0),Math.abs(f-e)>1&&(g=!0,d.css("height",e)),g&&d.animate({height:f},{duration:200,queue:!1,always:function(){d.css({height:"auto"})}})}},a(function(){"undefined"!=typeof wc_add_to_cart_variation_params&&a(".variations_form").each(function(){a(this).wc_variation_form().find(".variations select:eq(0)").change()})})}(jQuery,window,document);
\ No newline at end of file