  const char HOME_SCRIPT[] =
  "<SCRIPT>"
  "var xmlHttp=createXmlHttpObject();"

  "function createXmlHttpObject(){"
  " if(window.XMLHttpRequest) {"
      //code for modern browsers
  "   xmlHttp=new XMLHttpRequest();"
  " } else {"
      //code for IE6, IE5
  "    xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');"
  " }"
  " return xmlHttp;"
  "}"

  "function process(){"
  " if(xmlHttp.readyState==0 || xmlHttp.readyState==4){"
  "   xmlHttp.open('PUT','lamboData',true);"
  "   xmlHttp.onreadystatechange=updateDisplayValues;" 
  "   xmlHttp.send(null);"
  " }"
  " setTimeout('process()',500);"
  "}"

  "function updateDisplayValues(){"
  " if(xmlHttp.readyState==4 && xmlHttp.status==200){"
  "   xmlResponse=xmlHttp.responseXML;"
  "   xmldoc = xmlResponse.getElementsByTagName('lamboData');"
  
  "   var HomeHtml='<p>MPH Left: ' +"
  "   xmldoc[0].getElementsByTagName('MPHL')[0].childNodes[0].nodeValue + "

  "   '<br>MPH Right: ' +"
  "   xmldoc[0].getElementsByTagName('MPHR')[0].childNodes[0].nodeValue + "

  "   '<br>RPM Left:' + "
  "   xmldoc[0].getElementsByTagName('RPML')[0].childNodes[0].nodeValue + "

  "   '<br>RPM Right:' + "
  "   xmldoc[0].getElementsByTagName('RPMR')[0].childNodes[0].nodeValue + "

  "   '<br>Tick Left:' + "
  "   xmldoc[0].getElementsByTagName('TICKL')[0].childNodes[0].nodeValue + "

  "   '<br>Tick Right:' + "
  "   xmldoc[0].getElementsByTagName('TICKR')[0].childNodes[0].nodeValue + "

  "   '<br>Duty Cycle:' + "
  "   xmldoc[0].getElementsByTagName('DC')[0].childNodes[0].nodeValue + "

  "   '<br>Battery Voltage:' + "
  "   xmldoc[0].getElementsByTagName('BV')[0].childNodes[0].nodeValue + "

  "   '<br>TCS:' + "
  "   xmldoc[0].getElementsByTagName('TCS')[0].childNodes[0].nodeValue + "

  "   '<br>Gear:' + "
  "   xmldoc[0].getElementsByTagName('GEAR')[0].childNodes[0].nodeValue + '</p>';"

  "   document.getElementById('HomeDisplay').innerHTML=HomeHtml;"
  " }"
  "}"
  "</SCRIPT>";

const char GAUGE_SCRIPT[] =
"<script>"
"var gauge1 = document.getElementById('MphGauge');"
"var ctx1 = gauge1.getContext('2d');"
"var radius1 = gauge1.height / 2;"
"ctx1.translate(radius1, radius1);"
"radius1 = radius1 * 0.90;"
""
"var gauge2 = document.getElementById('RpmGauge');"
"var ctx2 = gauge2.getContext('2d');"
"var radius2 = gauge2.height / 2;"
"ctx2.translate(radius2, radius2);"
"radius2 = radius2 * 0.90;"
""
"var gauge3 = document.getElementById('PowerGauge');"
"var ctx3 = gauge3.getContext('2d');"
"var radius3 = gauge3.height / 2;"
"ctx3.translate(radius3, radius3);"
"radius3 = radius3 * 0.90;"
"var xmlHttp=createXmlHttpObject();"

  "function createXmlHttpObject(){"
  " if(window.XMLHttpRequest) {"
      //code for modern browsers
  "   xmlHttp=new XMLHttpRequest();"
  " } else {"
      //code for IE6, IE5
  "    xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');"
  " }"
  " return xmlHttp;"
  "}"

 "function process(){"
  " if(xmlHttp.readyState==0 || xmlHttp.readyState==4){"
  "   xmlHttp.open('PUT','lamboData',true);"
  "   xmlHttp.onreadystatechange=drawGauges;" 
  "   xmlHttp.send(null);"
  " }"
  " setTimeout('process()',500);"
  "}"

"function drawGauges() {"
 " if(xmlHttp.readyState==4 && xmlHttp.status==200){"
  "   xmlResponse=xmlHttp.responseXML;"
  "   xmldoc = xmlResponse.getElementsByTagName('lamboData');"
  
  "   var tempHtml='<br>Battery Voltage:' + "
  "   xmldoc[0].getElementsByTagName('BV')[0].childNodes[0].nodeValue + "

  "   '<br>Gear:' + "
  "   xmldoc[0].getElementsByTagName('GEAR')[0].childNodes[0].nodeValue +"

  "   '<br>TCS:' + "
  "   xmldoc[0].getElementsByTagName('TCS')[0].childNodes[0].nodeValue +"

  "   '<br>Meters:' + "
  "   xmldoc[0].getElementsByTagName('OD')[0].childNodes[0].nodeValue;"

  "   document.getElementById('GaugeDisplay').innerHTML=tempHtml;"

  //MPH
  "drawGauge(ctx1, radius1, 0, 12, 1);"
  "drawHand(ctx1, radius1, xmldoc[0].getElementsByTagName('MAXMPH')[0].childNodes[0].nodeValue, 12, 1, '#000000');"
  "drawHand(ctx1, radius1, xmldoc[0].getElementsByTagName('MPHL')[0].childNodes[0].nodeValue, 12, 1, '#0000FF');"
  "drawHand(ctx1, radius1, xmldoc[0].getElementsByTagName('MPHR')[0].childNodes[0].nodeValue, 12, 1, '#FF0000');"

  //RPM
  "drawGauge(ctx2, radius2, 0, 500, 50);"
  "drawHand(ctx2, radius2, xmldoc[0].getElementsByTagName('RPML')[0].childNodes[0].nodeValue, 500, 50, '#0000FF');"
  "drawHand(ctx2, radius2, xmldoc[0].getElementsByTagName('RPMR')[0].childNodes[0].nodeValue, 500, 50, '#FF0000');"

  //Power
  "drawGauge(ctx3, radius3, 0, 100, 10);"
  "drawHand(ctx3, radius3, xmldoc[0].getElementsByTagName('DC')[0].childNodes[0].nodeValue, 100, 10, '#FF0000');"
" }"
"}"
""
"function drawFace(ctx, radius) {"
  "var grad;"
"  "
  //White Full Circle
  "ctx.beginPath();"
  "ctx.arc(0, 0, radius, 0, 2*Math.PI);"
  "ctx.fillStyle = 'white';"
  "ctx.fill();"
"  "
  //Rim Color
  "grad = ctx.createRadialGradient(1,2,radius*0.95," "0,0,radius*1.05);"
  "grad.addColorStop(0, '#555');"
  "grad.addColorStop(0.5, 'white');"
  "grad.addColorStop(1, '#222');"
  "ctx.strokeStyle = grad;"
  "ctx.lineWidth = radius*0.1;"
  "ctx.stroke();"
"  "
  //Center Circle
  "ctx.beginPath();"
  "ctx.arc(0, 0, radius*0.05, 0, 2*Math.PI);"
  "ctx.fillStyle = '#555';"
  "ctx.fill();"
"}"
""
"function drawGauge(ctx, radius, min, max, space) {"
  "var ang;"
  "var num;"
  "var step;"
  "var count = max - min;"
  "var next = ((max - min + 1) / (count + 1));"
"  "
  "drawFace(ctx, radius);"
"  "
  "ctx.font = radius*0.15 + 'px arial';"
  "ctx.textBaseline='middle';"
  "ctx.textAlign='center';"
"  "
  "step = ((Math.PI * 2) - (Math.PI / 2)) / (count);"
  "ang = (Math.PI);"//start angle
"  "
  "for(num = min; num <= max; num = num + next){"
""
    "if(num % space == 0)"
    "{"
"      ctx.rotate(ang);"
      "ctx.translate(0, -radius*0.80);"
""
      "ctx.rotate(-ang);"
      "ctx.fillText(num.toString(), 0, 0);"
""
      "ctx.rotate(ang);"
      "ctx.translate(0, radius*0.80);"
      "ctx.rotate(-ang);"
    "}"
    "ang += step;"
  "}"
"}"
""
"function drawHand(ctx, radius, value, max, space, color)"
"{"
"  value=(value*Math.PI/(((max * 1.25) + space)) * 2.0) +" "Math.PI;"
""
    "ctx.beginPath();"
    "ctx.lineWidth = radius*0.05;"
    "ctx.lineCap = 'round';"
"    "
    "ctx.moveTo(0,0);"
    "ctx.rotate(value);"
    "ctx.lineTo(0, -radius*0.725);"
    "ctx.strokeStyle=color;"
    "ctx.stroke();"
    "ctx.rotate(-value);"
    "ctx.fill();"
"}"
""
""
"</script>";

