By tasmaniaman on

Hey,

I've got a weird issue with one of my drupal 6 sites.

When you load a product page the orange Pre-order and Add to Cart buttons flash on the page before jquery hides one of them.

Can any one point me in the direction to make it so that jquery does its work before the page is displayed so that the user doesn't get the weird flashing thing happening?

Have a look at one of the pages (and code source) here: http://www.coolthings.com.au/doctor-who-tardis-blue-laptop-case.html

Maybe there's another way to do this? i.e. maybe hide the pre-order button in the css and then let jquery swap it out if needed?

Thanks,

TasmanianMan.

⋅ Categories: Drupal 6.x

Comments

Chasen’s picture

Chasen commented

You could do it via CSS and use jQuery to modify the hidden value as needed or you could run the jQuery commands before the page content loads (but after the doc structure loads) by this:

$(document).ready(function() {
   //code here
});

Can you paste your jQuery code that you're executing? (I didn't have time to search through your source for the code - non-minified if possible)

tasmaniaman’s picture

tasmaniaman commented

Hey Chasen,

Here's the unminified code:



/**
 * Shows/hides preorder/buy now buttons on product node pages, based on whether the product has stock or not
 */
Drupal.behaviors.ucx_preorder = function(context) {

  var nodes = Drupal.settings.ucx_preorder_stock;


  //var select_prefered = Drupal.ucx_preorder_stock_settings.automatically_select_prefered_sku;

  var update = function(nid) {

    var node = nodes[nid];
    var anid = nid.substr(1);

    if (node == undefined) {
      return;
    }

    // info contains the aggreate info of constituant products
    var info = {
      'price': node.default_price,
      'skus': [],
      'stock': true,
      'date': false,
      'date_human': false,
      'date_css_class': false,
      'first': true
    };


    $.each(node.products, function(cnid, product) {
      if (typeof product != 'object') {
        return;
      }


      var acnid = (cnid.substr(1)).split(/-/)[0];
      var combo_id = '.' + acnid;


      $.each(product.attributes, function(aid, attrib) {

        var aaid = aid.substr(1);

        var select = $(attrib.css);

        if (select.length === 0) {
          //var css = attrib.css.replace('#node-', '#uc-product-add-to-cart-form-');
          css = '#uc-product-add-to-cart-form-' + anid + " select[name='attributes[" + aaid + "]']";
          select = $(css);
        }

        if (!attrib.init_done) {


          if (typeof attrib.set_value == 'undefined' || select.val() != attrib.set_value) {
            select.val(attrib.default_value);
          }


          // remove "Please select" option
          select.find('option[value=]').remove();

          select.change(function() { update(nid); } );

          attrib.init_done = true;
        }

        var aaid = aid.substr(1);
        var oid = select.val()
      
        combo_id += '|' + aaid + '=' + oid;
      });



      combo = product.combos[combo_id];

      if (typeof combo != 'object') {
        combo_id = '.' + acnid;
        combo = product['combos'][combo_id];
      }
      

      info.price += combo.price_change;

      info.price_human = '$' + Drupal.ucx_utils.round(info.price);

      if (info.first || info.stock || (!combo.stock && combo.date > info.date)) {

        info.stock = combo.stock;
        info.date = combo.date;
        info.date_human = combo.date_human;
        info.date_css_class = combo.date_css_class;

        info.first = false;
      }

      info.skus.push(combo.sku);
    });

    if (info.skus.length == 1) {
      info.sku = info.skus[0];
    }
    else {
      info.sku = 'PK-' + anid + ': ' + info['skus'].join(' / ');
    }

    // ok, we've got the info, so display it! (node version)
    var ctext = $('#node-' + anid)

    if (ctext.length !== 0) {
      ctext.find('.model').html(info.sku);
      ctext.find('.uc-price-sell').html('Price: ' + info.price_human);
      ctext.find('.uc-price-display').html(info.price_human);
      //ctext.find('.ucx-available').html(info.date_human);
      ctext.find('.ucx-available').html('<div class="' + info.date_css_class + '">' + info.date_human + '</div>');


      if (info.stock) {
        ctext.find('.node-add-to-cart-buy-button').show();
        ctext.find('.node-add-to-cart-preorder-button').hide();

        if (Drupal.settings.ucx_preorder_stock_settings.hide_available_label_when_in_stock) {
          ctext.find('.add-to-cart-form-availability label').hide();
        }
      }
      else {
        ctext.find('.node-add-to-cart-buy-button').hide();
        ctext.find('.node-add-to-cart-preorder-button').show();

        if (Drupal.settings.ucx_preorder_stock_settings.hide_available_label_when_in_stock) {
          ctext.find('.add-to-cart-form-availability label').show();
        }
      }
    }
    else {
      // ok, we've got the info, so display it! (catalog version)

      ctext = $('#uc-product-add-to-cart-form-' + anid);


      var cell = ctext.parent().parent();

      cell.find('.uc-price').html(info.price_human);


      //ctext.find('.ucx-available').html(info.date_human);
      ctext.find('.ucx-available').html('<div class="' + info.date_css_class + '">' + info.date_human + '</div>');

      if (info.stock) {
        ctext.find('.node-add-to-cart-buy-button').show();
        ctext.find('.node-add-to-cart-preorder-button').hide();

        if (Drupal.settings.ucx_preorder_stock_settings.hide_available_label_when_in_stock) {
          ctext.find('.add-to-cart-form-availability label').hide();
        }
      }
      else {
        ctext.find('.node-add-to-cart-buy-button').hide();
        ctext.find('.node-add-to-cart-preorder-button').show();

        if (Drupal.settings.ucx_preorder_stock_settings.hide_available_label_when_in_stock) {
          ctext.find('.add-to-cart-form-availability label').show();
        }
      }
    }

  };




  var update_all = function() {
    $.each(nodes, function(nid, node) {

      if (typeof node != 'object') {
        return;
      }

      update(nid);
    });
  }

  update_all();

};