JSFiddle - React, Tailwind, and code Playground

by Alex Cowan

JavaScript

//these are constants- handy for porting this over to WordPress, for instance
const homeURL = 'https://staginghinh.wpengine.com/?';
const partDetailURL = 'http://staginghinh.wpengine.com/parts-detail/?';
const checkoutURL = 'http://staginghinh.wpengine.com/order-page/?';

jQuery(document).ready(function($) {
  //this code sorts out what's in the shopping cart
  var startURL = top.location;
  console.log(startURL);
  var startQuery = decodeURIComponent(top.location.search.substring(1));
  console.log('the deal w/ the4 start query is that it is now ' + startQuery);
  var pnArgs = getQueryArgs();
  orderItems = [];
  var orderItems = getPNs(pnArgs);
  console.log('the order is this big  ' + orderItems.length);

  //set menu items in WP theme to be same as coming from JSFiddle 
  $('#menu-item-152').attr('id', 'cart');
  $('#cart a').attr('id', 'count');
  $('#cart').hide();


  //this calls the read stuff (which calls the draw stuff) and gets an array of part numbers for use in auto-complete
  //**need to refactor so works
  //  var partNumList = readData($("#parts-content"));



  if (orderItems.length > 0) {
    console.log('I am trying with the shopping cart and I have ' + orderItems.length);
    $('#cart').show();
    $('#count').show();
    $('#count').html('(' + orderItems.length + ')');
    //to deal w/ nav.
    $('#menu-item-107').css({
      "margin-right": 60
    });
  }

  //Code to Deal with Parts Search
  $("#pn-search-btn").on("click", function() {
    var pn = $('#pn-input').val();
    doga('search', 'free', pn, 'none');

    $('#pn-text').html(pn);
    $('#pn-term').css('display', 'inline-block');
    if (partNumList.includes(pn)) {
      console.log('found');
      $('.catalog-part').each(function() {
        console.log('doing this new thing');
        if ($(this).attr('pn') != pn) {
          $(this).hide();
        } //inner if statement ends here
      });
    } else {
      console.log('not found');
      $('#no-parts').show();
     ...