/********************************************************************************
                        APPAREL VARIABLES SCRIPT
 *******************************************************************************/
// Collect all form fields and tabs into collections
let attributesArray = document.getElementsByClassName('form-field');
let productTabArray = document.getElementsByClassName('tab-title');
// Set repeated strings as variables to be more DRY and less spaghetti
let valueStyle = `<div style="float:left;max-width:400px;text-align:left;verticalAlign:bottom;">`;
let canvas3001url = `https://www.bellacanvas.com/product/3001u/3001-cv-ss-tee-usa.html`;
let bayside5040url = `https://www.usabayside.com/system/files/product/spec/5040_Bayside.pdf?download=1`;
let canvas6005url = `https://www.bellacanvas.com/product/6005/6005-be-jrsy-ss-v-neck-tee.html`;
// Iterate through form field collection
Array.prototype.forEach.call(attributesArray, attribute => {
  // Initialize reusable loop variables
  let fieldControl = attribute.getElementsByClassName('form-field-control')[0];
  let formFieldTitle = attribute.getElementsByClassName('form-field-title')[0];
  let formData = attribute.getElementsByClassName('form-input')[0];
  let optionZero = attribute.getElementsByTagName('option')[0];
  let optionOne = attribute.getElementsByTagName('option')[1];
  let hiddenField;
  let attributeValue;
  let hiddenFieldHTML;
  let descriptionHTML;

  // Ignore empty form field elements
  if (formFieldTitle != undefined) {

    hiddenField = formFieldTitle.innerHTML;

    // APPAREL STYLE
    if (hiddenField.includes('Apparel Style')) {

      formFieldTitle.innerHTML = `Apparel Style`;
      // Attribute Value is the option i.e. 'Unisex' or 'Ladies Cut'
      attributeValue = optionOne.innerHTML;
      // Set Attribute Value styling and display Attribute Value
      hiddenFieldHTML = `${valueStyle}<b>${attributeValue}</b></div>`;
      // Hide Dropdown selector in lieu of Attribute Value display above
      hiddenFieldHTML += `<input type="hidden" name="${formData.name}" id="${formData.id}" value="${formData.value}"
        data-product-attribute-value="${formData.value}">
        <br clear="all">`;
      // Inject hiddenFieldHTML into form-field-control span element
      fieldControl.innerHTML = hiddenFieldHTML;
    }

    // APPAREL COLOR
    if (hiddenField.includes('Apparel Color')) {

      formFieldTitle.innerHTML = `Apparel Color`;

      // If Apparel Color form field contains dropdown or select element, set optionOne as Attribute Value
      if (optionZero.innerHTML.includes('Pick One')) {
        optionOne.selected = true;
        attributeValue = optionOne.innerHTML;
      } else {
        // If no dropdown/select element, set optionZero as Attribute Value
        attributeValue = optionZero.innerHTML;
      }

      hiddenFieldHTML = `${valueStyle}<b>${attributeValue}</b></div>`;
      hiddenFieldHTML += `<input type="hidden" name="${formData.name}" id="${formData.id}" value="${formData.value}"
        data-product-attribute-value="${formData.value}">
        <br clear="all">`;
      fieldControl.innerHTML = hiddenFieldHTML;
    }

    // APPAREL BRAND
    if (hiddenField.includes('Apparel Brand')) {

      formFieldTitle.innerHTML = `Apparel Brand`;
      // Apparel Brand is dropdown so set optionOne as default value
      attributeValue = optionOne.innerHTML;
      descriptionHTML = `${valueStyle}${attributeValue}`;

      if (descriptionHTML.includes('Canvas Jersey Tee (3001U) Made in USA')) {
        // Canvas 3001U
        descriptionHTML = `${valueStyle}<b>${attributeValue}:</b>
          100% combed and ring-spun cotton, 30 single 4.2oz. fabric (Heather Grey is 10% polyester).
          For sizing and fit information, click here:
          <b><a href=${canvas3001url} target="_blank">Bella + Canvas</a></b>
          </div><br clear="all">`;
      } else if (descriptionHTML.includes('Bayside 5040 Unisex Tee')) {
        // Bayside 5040
        descriptionHTML = `${valueStyle}<b>${attributeValue}:</b>
          100% cotton, 5.4oz. fabric, Made-In-USA tee. For sizing and fit information, download product specs here:
          <b><a href=${bayside5040url} target="_blank">5040_Bayside.pdf</a></b>
          </div><br clear="all">`;
      } else if (descriptionHTML.includes('Bella 6005 Ladies V-Neck Tee')) {
        // Canvas 6005
        descriptionHTML = `${valueStyle}<b>${attributeValue}:</b>
          100% combed and ring-spun cotton, 30 single 4.2oz. fabric. For sizing and fit information, click here:
          <b><a href=${canvas6005url} target="_blank">Bella + Canvas</a></b>
          </div><br clear="all">`;
      } else {
        descriptionHTML = `${valueStyle}<b>${attributeValue}</b></div><br clear="all">`;
      }

      hiddenFieldHTML = `<input type="hidden" name="${formData.name}" id="${formData.id}" value="${formData.value}"
        data-product-attribute-value="${formData.value}">`;
      fieldControl.innerHTML = descriptionHTML + hiddenFieldHTML;
    }

    // APPAREL SIZE
    if (hiddenField.includes('Apparel Size')) {
      fieldControl.style.marginLeft = '57px';
    }

    // PRODUCT TYPE
    if (hiddenField.includes('Product Type')) {

      attributeValue = optionOne.innerHTML;
      descriptionHTML = attributeValue;
      formFieldTitle.innerHTML = `Product Type`;

      if (descriptionHTML.includes('Direct-To-Garment Imprinted T-Shirt')) {
        // DTG Production
        descriptionHTML = `${valueStyle}<b>${attributeValue}:</b>
          Dupont Artistri® textile ink for superior washability and a soft hand-feel.
          Union printed by <b><a href="http://bumperactive.com" target="_blank"
          title="Bumperactive custom stickers + tees!">Bumperactive.com</a></b></div>`;
      } else if (descriptionHTML.includes('Screen Printed Apparel')) {
        // Screenprint Production
        descriptionHTML = `${valueStyle}<b>${attributeValue}:</b>
          High-durability BPA-free plastisol ink.
          Union printed by <b><a href="http://bumperactive.com" target="_blank"
          title="Bumperactive custom stickers + tees!">Bumperactive.com</a></b></div>`;
      } else if (descriptionHTML.includes('Screenprinted Baseball Cap')) {
        // Screenprint Cap
        descriptionHTML = `${valueStyle}<b>${attributeValue}:</b>
          High-durability BPA-free plastisol ink.
          Five-panel unstructured cotton fabric baseball cap.
          Union printed by <b><a href="http://bumperactive.com" target="_blank"
          title="Bumperactive custom stickers + tees!">Bumperactive.com</a></b></div>`;
      } else {
        descriptionHTML = `${valueStyle}<b>${attributeValue}</b></div>`;
      }

      hiddenFieldHTML = `<input type="hidden" name="${formData.name}" id="${formData.id}" value="${formData.value}"
        data-product-attribute-value="${formData.value}"><br clear="all">`;
      fieldControl.innerHTML = descriptionHTML + hiddenFieldHTML;
    }
  }
})
// Hide Reviews tab
Array.prototype.forEach.call(productTabArray, tab => {
  if (tab.innerHTML.includes('Reviews')) {
    tab.innerHTML = '';
  }
})