/* JavaScript functionality for the web store. */

/* According to http://blog.easy-designs.net/archives/2005/09/02/death-to-bad-dom-implementations/, IE cannot
   name elements at runtime... */
document.createNamedElement = function(type, name) {
  var element;
  try {
    element = document.createElement('<'+type+' name="'+name+'">');
  } catch (e) { }
  if (!element || !element.name) {
    // Not in IE, then
    element = document.createElement(type)
    element.name = name;
  }
  return element;
}

// Google Checkout functionality
var isSandbox = false;			// Set to true to enter sandbox mode
var merchantId = "150858588868882";	// ECG's Google Checkout merchant ID
var sandboxId = "873686390170134";	// Test sandbox ID
var checkoutButtonURL = "https://" + (isSandbox ? "sandbox" : "checkout") + ".google.com/" + (isSandbox ? "checkout/" : "") +
                        "buttons/checkout.gif?merchant_id=" + (isSandbox ? sandboxId : merchantId) +
                        "&w=168&h=44&style=white&loc=en_US&variant=";
var checkoutURL = "https://" + (isSandbox ? "sandbox" : "checkout") + ".google.com/" + (isSandbox ? "checkout/" : "") +
                  "api/checkout/v2/checkoutForm/Merchant/" + (isSandbox ? sandboxId : merchantId);

// Item list
var itemNames  = {sweatshirt2011:"ECG Sweatshirt",
                  hoodie2011:"ECG Hoodie",
                  tshirt2011plain:"ECG Black T-shirt",
                  tshirt2011champ:"ECG White T-shirt",
                  polo2011:"ECG Polo Shirt",
                  warmup:"ECG Warmup Suit",
                  singlet:"ECG Singlet",
                  tshirt2010champ:"*ECG T-shirt",
                  tshirt2008plain:"*ECG T-shirt",
                  tshirt2008champ:"*ECG T-shirt",
                  polo2010:"*ECG Polo Shirt",
                  warmup2000:"*ECG Warmup Suit",
                  singlet2005:"*ECG Singlet",
                  singlet2000:"*ECG Singlet",
                  pcleandvd:"Power Clean DVD",
                  psnatchdvd:"Power Snatch DVD",
                  mentalcds:"Mental Training 2-CD Set"};
var itemPrices = {sweatshirt2011:35,
                  hoodie2011:40,
                  tshirt2011plain:20,
                  tshirt2011champ:20,
                  polo2011:30,
                  warmup:105,
                  singlet:60,
                  tshirt2010champ:1000000,
                  tshirt2008plain:1000000,
                  tshirt2008champ:1000000,
                  polo2010:1000000,
                  warmup2000:1000000,
                  singlet2005:1000000,
                  singlet2000:1000000,
                  pcleandvd:39,
                  psnatchdvd:39,
                  mentalcds:25};
var itemSizes = {sweatshirt2011:Array("Small","Medium","Large","X-Large","XX-Large"),
                 hoodie2011:Array("Small","Medium","Large","X-Large","XX-Large"),
                 tshirt2011plain:Array("Small","Medium","Large","X-Large","XX-Large"),
                 tshirt2011champ:Array("Small","Medium","Large","X-Large","XX-Large"),
                 polo2011:Array("Small","Medium","Large","X-Large","XX-Large (+$3.00)"),
                 warmup:Array("Small","Medium","Large","X-Large"),
                 singlet:Array("Small","Medium","Large","X-Large"),
                 tshirt2010champ:Array("Small","Medium","Large","X-Large"),
                 tshirt2008plain:Array("Small","Medium","Large","X-Large"),
                 tshirt2008champ:Array("Small","Medium","Large","X-Large"),
                 polo2010:Array("Small","Medium","Large","X-Large"),
                 warmup2005:Array("Small","Medium","Large","X-Large"),
                 singlet2005:Array("Small","Medium","Large","X-Large"),
                 singlet2000:Array("Small","Medium","Large","X-Large")};

// Display an item's name on the main page of the store.
function displayItemName(key) {
  document.write("<h3>" + itemNames[key] + "</h3>");
}

// Display an item's image on the main page of the store.
function displayItem(key) {
  document.write("<a href=\"" + key + ".php\"><img style=\"border: 0px;\" src=\"../images/store/default/" + key + ".jpg\"></a>");
}

// Display an item's price and a link to an ordering page.
function displayPriceLink(key) {
  document.write("<strong>Price: $" + itemPrices[key] + "</strong><br/>" +
                 "<a href=\"" + key + ".php\">Details/purchase...</button>");
}

// Create price and inputs for size/quantity of an item.
function createItemPriceSizeQuantityInput(key, showSize) {
  document.write("<form action=\"cart.php\" onsubmit=\"addNewItemToCart(itemNames['" + key + "'], " +
                 (showSize ? "document.getElementById('" + key + "size').value" : "''") + ", " +
                 "checkNumber(document.getElementById('" + key + "quantity')), itemPrices['" + key + "']); " + 
                 "resetQuantityElement('" + key + "quantity'); return true;\">\n" +
                 "<h3>Price: $" + itemPrices[key] + "</h3>\n");
  document.write("<table>\n");
  if (showSize) {
    document.write("<tr><td><strong>Size: </strong></td><td><select id=" + key + "size>");
    for (i in itemSizes[key]) {
      document.write("<option value=\"" + itemSizes[key][i] + "\">" + itemSizes[key][i] + "</option>");
    }
    document.write("</select></td></tr>");
  }
  document.write("<tr><td><strong>Qty: </strong></td><td>\n" +
                 "<input id=" + key + "quantity onfocus=\"this.style.color='black'; this.value='';\" " +
                 "size=11 style=\"color:grey;\" type=text value=\"Enter quantity\" pattern=\"^[1-9][0-9]*?$\" required></td></tr>\n" +
                 "<tr><td colspan=\"2\"><input type=submit value=\"Add to cart\"></td></tr></table></form>\n");
}

// Create the layout for an individual item's page.
function createItemLayout(key, description, numSwatches, showSizes, swatchesPerLine) {
  loadCookies(false);
  document.write("    <h1 style=\"margin-top: 18px;\">" + itemNames[key] + "</h1>\n" +
                 "    <div style=\"float: right; width: 301px;\">\n" +
                 "     <p style=\"margin-top: 0;\">\n" +
                 "      " + description + "\n" +
                 "     </p>\n");
  for (var i = 0 ; i < numSwatches ; i++) {
    if (typeof swatchesPerLine == 'number' && i > 0 && i % swatchesPerLine == 0)
      document.write("     <br/>\n");
    var imgSrc = "../images/store/" + key + "-" + (i+1) + ".jpg";
    document.write("     <img class=\"swatch\" onmouseover=\"switchProductImage(this);\" " +
                   "src=\"" + imgSrc + "\" width=\"23%\" style=\"border: 1px solid " + (i == -1 ? "#222387" : "#FFFFFF") + ";\">\n");
  }
  createItemPriceSizeQuantityInput(key, showSizes);
  document.write("     <p>\n" +
                 "      <a href=\"store.php\" style=\"text-decoration: none;\">Continue shopping...</a>\n" +
                 "     </p>\n" +
                 "    </div>\n" +
                 "    <div id=\"productimagediv\">\n" +
                 "     <center>\n" +
                 "      <img style=\"border: 0;\" id=\"productimage\" src=\"../images/store/" + key + "-1.jpg\"><br/>\n" +
                 "     </center>\n" +
                 "    </div>\n");
}

function switchProductImage(srcElement) {
  var productImageDiv = document.getElementById('productimagediv');
  var minHeight = productImageDiv.offsetHeight;
  document.getElementById('productimage').src = srcElement.src;
  if (productImageDiv.offsetHeight < minHeight)
    productImageDiv.style.height = minHeight + "px";
  var swatches = document.getElementsByClassName('swatch');
/*
  srcElement.style.border = "2px solid #222387";
  for (var i = 0 ; i < swatches.length ; i++) {
    if (swatches[i] != srcElement)
      swatches[i].style.border = "2px solid #FFFFFF";
  }
*/
}

// Shopping cart
var nextId = 0;
var cartItemNames = {};
var cartItemDescriptions = {};
var cartItemQuantities = {};
var cartItemPrices = {};

// Cookie code from http://www.w3schools.com/js/js_cookies.asp
function setCookie(c_name, value, exdays) {
  var exdate = new Date();
  exdate.setDate(exdate.getDate() + exdays);
  var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString()) + "; path=/";
  document.cookie = c_name + "=" + c_value;
}
function getCookie(c_name) {
  var i, x, y, ARRcookies = document.cookie.split(";");
  for (i = 0 ; i < ARRcookies.length ; i++) {
    x = ARRcookies[i].substr(0, ARRcookies[i].indexOf("="));
    y = ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
    x = x.replace(/^\s+|\s+$/g, "");
    if (x == c_name)
      return unescape(y);
  }
}
function deleteCookie(c_name) {
  setCookie(c_name, "", -1);
}

// Store the keys for each item in the cart.
function setIdCookie() {
  var activeIds = "";
  for (key in cartItemNames)
    activeIds += key + ";";
  if (activeIds == "")
    deleteCookie("ids");
  else
    setCookie("ids", activeIds.substring(0, activeIds.length-1), 1);
}

// Load cart data.
function loadCookies(isCartPage) {
  // Clear existing items in cart.
  for (key in cartItemNames) {
    delete cartItemNames[key];
    delete cartItemDescriptions[key];
    delete cartItemQuantities[key];
    delete cartItemPrices[key];
  }

  var idCookie = getCookie("ids");
  // No id cookie was set so we're definitely not ready to checkout.
  if (typeof idCookie == 'undefined') {
    if (isCartPage)
      setCheckoutEnabled(false);
    return;
  }

  // For each stored item ID grab the associated details.
  var ids = idCookie.split(";");
  for (var i = 0 ; i < ids.length ; i++)
    if (isCartPage)
      addItemToCartPage(getCookie(ids[i] + "name"), getCookie(ids[i] + "description"),
                getCookie(ids[i] + "quantity"), getCookie(ids[i] + "price"));
    else
      addItemToCart(getCookie(ids[i] + "name"), getCookie(ids[i] + "description"),
                getCookie(ids[i] + "quantity"), getCookie(ids[i] + "price"));
}

// Returns a string representing the number of items in the cart ("n items").
function getNumItemsInCart() {
  var idCookie = getCookie("ids");
  if (typeof idCookie == 'undefined')
    return "0 items";
  var numItems = idCookie.split(";").length;
  if (numItems == 1)
    return "1 item";
  else
    return numItems + " items";
}

// Update the number of items displayed in the "View Cart" link in the header.
function updateNumItemsInCart() {
  var viewCartNode = document.getElementById("storelinks").firstChild;
  viewCartNode.removeChild(document.getElementById("numitems"));
  var newNode = document.createElement('span');
  newNode.setAttribute('id', 'numitems');
  newNode.appendChild(document.createTextNode(getNumItemsInCart() + ")"));	// Add a ")" because it was included in the original div.
  viewCartNode.appendChild(newNode);
}

// Check if user input is a valid quantity.
function checkNumber(quantityInput) {
  var value = parseInt(quantityInput.value);
  if (isNaN(value) || value <= 0) {
    alert("Please enter a valid quantity!");
    quantityInput.focus();
    return 0;
  }
  return value;
}

// Reset a quantity input to empty.
function resetQuantityElement(id) {
  var quantityElement = document.getElementById(id);
  quantityElement.value = "Enter quantity";
  quantityElement.style.color = "grey";
}

// Add a newly entered item to the shopping cart. Necessary if the price has a modifier.
function addNewItemToCart(name, description, quantity, price) {
  var extraCostMatch = new RegExp('\\(\\+\\$\\d*(\\.\\d\\d)?').exec(description);
  if (extraCostMatch != null) {
    price += parseFloat(extraCostMatch[0].substr(3));
  }

  addItemToCart(name, description, quantity, price);
}

// Add an item to the page's cart arrays and set/refresh cart cookies.
function addItemToCart(name, description, quantity, price) {
  if (quantity < 1)
    return false;

  var newId = 'item' + nextId++;

  cartItemNames[newId] = name;
  cartItemDescriptions[newId] = description;
  cartItemQuantities[newId] = quantity;
  cartItemPrices[newId] = price;
  setCookie(newId + "name", name, 1);
  setCookie(newId + "description", description, 1);
  setCookie(newId + "quantity", quantity, 1);
  setCookie(newId + "price", price, 1);
  setIdCookie();
}

// Add an item to the shopping cart page.
function addItemToCartPage(name, description, quantity, price) {
  var newId = 'item' + nextId;
  addItemToCart(name, description, quantity, price);

  var newItemRow = document.createElement('tr');
  newItemRow.setAttribute('id', newId);
  var newCol = document.createElement('td');
  var newStrong = document.createElement('strong');
  newStrong.appendChild(document.createTextNode(name + (description != '' ? ":" : "")));
  newCol.appendChild(newStrong);
  if (description != '') {
    newCol.appendChild(document.createElement('br'));
    newCol.appendChild(document.createTextNode(description));
  }
  newItemRow.appendChild(newCol);
  newCol = document.createElement('td');
  newCol.setAttribute('align', 'right');
  newCol.appendChild(document.createTextNode(quantity));
  newItemRow.appendChild(newCol);
  newCol = document.createElement('td');
  newCol.setAttribute('align', 'right');
  newCol.appendChild(document.createTextNode('$' + (price*quantity)));
  newItemRow.appendChild(newCol);
  newCol = document.createElement('td');
  newCol.setAttribute('align', 'right');
  var newItemForm = document.createElement('form');
  newItemForm.setAttribute('onsubmit', "removeItemFromCart('" + newId + "'); return false;");
  var newItemButton = document.createElement('input');
  newItemButton.setAttribute('type', 'submit');
  newItemButton.setAttribute('value', 'Remove');
  newItemForm.appendChild(newItemButton);
  newCol.appendChild(newItemForm);
  newItemRow.appendChild(newCol);
  document.getElementById("cartitems").lastChild.insertBefore(newItemRow, document.getElementById("cartspan"));
  updateTotal();
  document.getElementById("clearbutton").disabled = false;
  setCheckoutEnabled(true);
}

// Remove an item from the cart.
function removeItemFromCart(id) {
  document.getElementById("cartitems").lastChild.removeChild(document.getElementById(id));
  delete cartItemNames[id];
  delete cartItemDescriptions[id];
  delete cartItemQuantities[id];
  delete cartItemPrices[id];
  deleteCookie(id + "name");
  deleteCookie(id + "description");
  deleteCookie(id + "quantity");
  deleteCookie(id + "price");
  setIdCookie();
  updateTotal();
  document.getElementById("clearbutton").disabled = isCartEmpty();
  setCheckoutEnabled(!isCartEmpty());
}

// Empty the cart.
function clearCart() {
  var cartNode = document.getElementById("cartitems").lastChild;
  while (!isCartEmpty())
    cartNode.removeChild(cartNode.childNodes[2]);
  for (key in cartItemNames) {
    delete cartItemNames[key];
    delete cartItemDescriptions[key];
    delete cartItemQuantities[key];
    delete cartItemPrices[key];
    deleteCookie(key + "name");
    deleteCookie(key + "description");
    deleteCookie(key + "quantity");
    deleteCookie(key + "price");
  }
  setIdCookie();
  nextId = 0;
  updateTotal();
  document.getElementById("clearbutton").disabled = true;
  setCheckoutEnabled(false);
}

// Return true if the cart has no items in it and false otherwise.
function isCartEmpty() {
  return document.getElementById("cartitems").lastChild.childNodes[2].isSameNode(document.getElementById("cartspan"));
}

// Update the cart total based on the items in it.
function updateTotal() {
  document.getElementById("carttotal").removeChild(document.getElementById("carttotal").lastChild);
  var cartTotal = 0;
  for (key in cartItemPrices)
    cartTotal += cartItemPrices[key] * cartItemQuantities[key];
  document.getElementById("carttotal").appendChild(document.createTextNode('$' + cartTotal));
  updateNumItemsInCart();
}

// Enable or disable the Google Checkout button.
function setCheckoutEnabled(enabled) {
  document.getElementById("checkoutbutton").src = checkoutButtonURL + (enabled ? "text" : "disabled");
  document.getElementById("checkoutbutton").disabled = !enabled;
}

// Return a new hidden input object.
function createHiddenInput(name, value) {
  var newInput = document.createNamedElement('input', name);
  newInput.setAttribute('type', 'hidden');
  newInput.setAttribute('value', value);
  return newInput;
}

// Set items in a form for posting to Google Checkout.
function setCheckoutItems(checkoutFormId) {
  var numItems = cartItemNames.length;
  if (numItems == 0 || cartItemDescriptions.length != numItems ||
      cartItemQuantities.length != numItems || cartItemPrices.length != numItems) {
    alert("Error with selected items for Google Checkout: cannot proceed.");
    return false;
  }

  try {
    var i = 1;
    var checkoutForm = document.getElementById(checkoutFormId);
    for (key in cartItemNames) {
      checkoutForm.appendChild(createHiddenInput('item_name_' + i, cartItemNames[key]));
      checkoutForm.appendChild(createHiddenInput('item_description_' + i, cartItemDescriptions[key]));
      checkoutForm.appendChild(createHiddenInput('item_quantity_' + i, cartItemQuantities[key]));
      checkoutForm.appendChild(createHiddenInput('item_price_' + i, cartItemPrices[key]));
      checkoutForm.appendChild(createHiddenInput('item_currency_' + i++, "USD"));
    }
  } catch (e) {
    alert(e);
    return false;
  }

  return true;
}