var dataShowing = false 

function toggleDataShow(lines) {
  if (dataShowing) {
    removeData()
  }
  else {
    showData(lines)
  }
  return false
}

function removeData() {
  var dataNode = document.getElementById("dataNode")
  if (dataNode) {
    dataNode.parentNode.removeChild(dataNode)
  }
  dataShowing = false
  setLabelsTo("Shot Info.")  
}

function showData(nameValuePairs) {
  var dataNode, table, tbody, name, value;
  var insertPoint = document.getElementById("insertPoint")
  if (!dataNode) {
    dataNode = document.createElement("DIV")
    dataNode.id = "dataNode"
    dataNode.setAttribute("class", "shotInfo")
    table = document.createElement("TABLE")
    dataNode.appendChild(table)
    tbody = document.createElement("TBODY")
    table.appendChild(tbody)
    // addNameValueRowToTable(tbody, "hello", "world");
    for (var i = 0; i < nameValuePairs.length; i++) {
      if (data[i]) {
	name = nameValuePairs[i][0]
	value = nameValuePairs[i][1]
	addNameValueRowToTable(tbody, name, value);
      }
    }
    insertPoint.parentNode.appendChild(dataNode)
  }
  dataShowing = true
  setLabelsTo("Hide Shot Info.")  
}

function addNameValueRowToTable(tbody, name, value)
{
  var row, nameCell, valueCell;
  row = document.createElement("TR")
  tbody.appendChild(row)
  
  nameCell = document.createElement("TD")
  nameCell.setAttribute("class", "shotInfoNameCell")
  nameCell.appendChild(document.createTextNode(name + ":"))
  row.appendChild(nameCell)
  
  valueCell = document.createElement("TD")
  valueCell.setAttribute("class", "shotInfoValueCell");
  valueCell.appendChild(document.createTextNode(value))
  row.appendChild(valueCell)
}


function setLabelsTo(label)
{
  var labelContainer = document.getElementById("shotInfoLabel")
  labelContainer.replaceChild(document.createTextNode(label), labelContainer.firstChild)
}