var templateItemCountyList = '<div class="item">'
        + '<div class="order" ><div class="@ClassCircle@">@i@</div></div>'
        + '<h2><a href="javascript:void(0)" onclick=\'chooseLocation(@LocationId@ , @Latitude@, @Longitude@, @CountyId@)\'>@LocationName@</a></h2>'
        + '@CountyName@ County'
        + '<div class="grades"><span class="@ClassDryText@">@DryGrade@</span> dry, <span class="@ClassWetText@">@WetGrade@</span> wet</div>'
        + '</div>';
var templateMarkerBig = '<div class="order" ><div class="@ClassCircle@">&nbsp;</div></div>';        
var arrCountyListStyles = new Array();
arrCountyListStyles["A+"] = {"circle":"gradeAB", "text":"gradeA", "mapImage":"images/mgrade_a.gif", "gradeIIcon":"images/grade-i-ab.gif", "gradeIHDIcon":"images/grade-i-ab-hd.gif", "gradeIcon":"images/grade_a+.gif", "esIcon":"images/blue_es.gif"}; 
arrCountyListStyles["A"] = {"circle":"gradeAB", "text":"gradeA", "mapImage":"images/mgrade_a.gif", "gradeIIcon":"images/grade-i-ab.gif", "gradeIHDIcon":"images/grade-i-ab-hd.gif", "gradeIcon":"images/grade_a.gif", "esIcon":"images/blue_es.gif"};
arrCountyListStyles["B"] = {"circle":"gradeAB", "text":"gradeA", "mapImage":"images/mgrade_a.gif", "gradeIIcon":"images/grade-i-ab.gif", "gradeIHDIcon":"images/grade-i-ab-hd.gif", "gradeIcon":"images/grade_b.gif", "esIcon":"images/blue_es.gif"};
arrCountyListStyles["C"] = {"circle":"gradeC", "text":"gradeC", "mapImage":"images/mgrade_c.gif", "gradeIIcon":"images/grade-i-c.gif", "gradeIHDIcon":"images/grade-i-c-hd.gif", "gradeIcon":"images/grade_c.gif", "esIcon":"images/yellow_es.gif"};
arrCountyListStyles["D"] = {"circle":"gradeDF", "text":"gradeD", "mapImage":"images/mgrade_d.gif", "gradeIIcon":"images/grade-i-fd.gif", "gradeIHDIcon":"images/grade-i-df-hd.gif", "gradeIcon":"images/grade_d.gif", "esIcon":"images/red_es.gif"};
arrCountyListStyles["F"] = {"circle":"gradeDF", "text":"gradeD", "mapImage":"images/mgrade_d.gif", "gradeIIcon":"images/grade-i-fd.gif", "gradeIHDIcon":"images/grade-i-df-hd.gif", "gradeIcon":"images/grade_f.gif", "esIcon":"images/red_es.gif"};
arrCountyListStyles["ns"] = {"circle":"gradeNS", "text":"gradeNS", "mapImage":"images/mgrade_ns.gif", "gradeIIcon":"images/grade-i-ns.gif", "gradeIHDIcon":"images/grade-i-ns-hd.gif", "gradeIcon":"images/grade_ns.gif", "esIcon":"images/gray_es.gif"};
arrCountyListStyles["close"] = {"circle":"gradeClosed", "text":"gradeD", "mapImage":"images/mgrade_close.gif", "gradeIIcon":"images/grade-i-fd.gif", "gradeIHDIcon":"images/grade-i-closed-hd.gif", "gradeIcon":"images/grade_f.gif", "esIcon":"images/closure_es.gif"};

var arrPopupRainImage = new Array();
arrPopupRainImage["close"] = "images/beach_closed.gif";      
arrPopupRainImage["rain"] = "images/rain_adv.gif";      
var templatePopup = '<div style="width: 418px;"><div class="tabsPopup" id="tabsPopup">'
     +  '<ul>'
     +   '<li id="ltab1"><a href="#tab-popup1"><span><b><i>Overview</i></b></span></a></li>'
     +   '<li id="ltab2" style="display:none"><a href="#tab-popup2" onclick="loadFacts(@LocationId@)"><span><b><i>Facts and Resources</i></b></span></a></li>'
     +   '<li id="ltab3" style="display:none"><a href="#tab-popup3" onclick="loadMultimedia(@LocationId@)"><span><b><i>Multimedia</i></b></span></a></li>'
     +   '<li id="ltab4"><a href="#tab-popup4" onclick="loadComments(@LocationId@)"><span><b><i>User Comments</i></b></span></a></li>'
     +   '<li id="ltab5"><a href="#tab-popup5" id="historicalLink" onclick="loadHistoricalData(@LocationId@)"><span><b><i>Historical Data</i></b></span></a></li>'
     +   '<li id="ltab6" style="display:none"><a href="#tab-popup6" onclick="loadGetInvolved(@LocationId@)"><span><b><i>Get Involved</i></b></span></a></li>'
     +  '</ul>'
     +  '<div id="tab-popup1">'
     +  '</div> '
     +  '<div id="tab-popup2"></div>'
     +  '<div id="tab-popup3"  ></div>'
     +  '<div id="tab-popup4"></div>'
     +  '<div id="tab-popup5"></div>'
     +  '<div id="tab-popup6"  ></div>'
     + '</div>'
     + '</div>';
var templateTab1 = '<div class="right-set">'
     +    '<span class="txtBtn">[<a href="javascript:void(0)" onclick="maxZoom(@Latitude@, @Longitude@)">max zoom</a>]</span> <span class="txtBtn" id="setDefault">[@SetDefaultLink@]</span> '
     +    '<span class="txtBtn">[<a href="javascript:void(0)" onclick="closeLocationWindow()">close</a>]</span>'
     +   '</div><br />'     
     +   '<h2>@LocationName@</h2>'
     +   '<div class="infoDate">Grades based on a 30-day period ending @GradeDate@</div>@TMDLViolation@ @RainPanel@'
     +   '<table  width="100%" border="0" cellspacing="0" cellpadding="0">'
     +    '<tr>'
     +     '<td valign="top" width="50%">'
     +      '<div class="weather1">@NormalDry@'
     +      '<h3>Location</h3>'
     +      '@LocationAddress@'
     +      '@LocationCity@<br /><span id="choosenCounty">@CountyName@ County</span><br />CA @LocationZipcode@<br />'
     +      '<br />'
     +      '<a href="http://maps.google.com/maps?f=d&hl=en&saddr=&daddr=@Latitude@,@Longitude@" target="_blank">Get Directions</a>'
     +      '</div>'
     +     '</td>'
     +     '<td width="50%" valign="top">'
     +      '<div class="weather2">@NormalWet@'
     +      '<h3>Current Condition</h3>'
     +      '<div class="condition sunny" id="weatherImage">'
     +       '@WeatherTemp@, @WeatherCondition@<br />'
     +       '<b>Wind:</b> @WeatherWind@<br />&nbsp;'
     //+       '<br /><b>Surf:</b> 3ft'
     +      '</div>'
     //+      '<a href="#">Tide</a><br />'
     +      '<br /><a href="http://www.weather.com/weather/local/@LocationZipcode@" target="_blank">Extended Forecast</a>'
     +      '</div>'
     +     '</td>'
     +    '</tr>'
     +   '</table>'
     +   '<div class="dottedSep"></div>'
     +   '<ul class="options menu-list">'
     +    '<li><a class="rss" href="javascript:void(0)" onclick="showRss()">Get Updates via RSS</a></li>'
     +    '<li><a class="widget" href="javascript:void(0)" onclick="showWidget()">Add a widget to my site</a></li><br />'     
     +   '</ul>'
     +   '<div class="report"><span class="txtBtnRed">[<a href="javascript:void(0)" onclick="reportIssue(@LocationId@)">Report an Issue with this Beach</a>]</span></div>'
     // +    '<li><a class="mobile" href="javascript:void(0)" onclick="showPopup(\'\',\'help.aspx?id=18&keyword=@Comments@\')">Text <b>@Comments@</b> to 23907 for mobile updates</a></li>'
var templateTab1HD = '<div class="right-set">'
     +    '<span class="txtBtn">[<a href="javascript:void(0)" onclick="maxZoom(@Latitude@, @Longitude@)">max zoom</a>]</span> <span class="txtBtn" id="setDefault">[@SetDefaultLink@]</span> '
     +    '<span class="txtBtn">[<a href="javascript:void(0)" onclick="closeLocationWindow()">close</a>]</span>'
     +   '</div><br />'     
     +   '<h2>@LocationName@</h2>'
     +   '<div class="infoDate">@CommentDate@</div>@TMDLViolation@ @RainPanel@'
     +   '<table  width="100%" border="0" cellspacing="0" cellpadding="0">'
     +    '<tr>'
     +     '<td valign="top" width="33%" >'
     +      '<div class="weather1">@NormalDry@'
     +      '<h3>Location</h3>'
     +      '@LocationAddress@'
     +      '@LocationCity@<br /><span id="choosenCounty">@CountyName@ County</span><br />CA @LocationZipcode@<br />'
     +      '<br />'
     +      '<a href="http://maps.google.com/maps?f=d&hl=en&saddr=&daddr=@Latitude@,@Longitude@" target="_blank">Get Directions</a>'
     +      '</div>'
     +     '</td>'
     +     '<td valign="top" width="33%" >'
     +      '<div class="weather2">@NormalWet@'
     +      '</div>'
     +     '</td>'
     +     '<td valign="top" id="cellAB411Overview" >'
     +      '<div class="weather2">@NormalAB411@'
     +      '</div>'
     +     '</td>'
     +    '</tr>'
     +   '</table>'
     +   '<div class="dottedSep"></div>'
     +   '<ul class="options menu-list">'
     +    '<li><a class="rss" href="javascript:void(0)" onclick="showRss()">Get Updates via RSS</a></li>'
     +    '<li><a class="widget" href="javascript:void(0)" onclick="showWidget()">Add a widget to my site</a></li><br />'     
     +   '</ul>'
     +   '<div class="report"><span class="txtBtnRed">[<a href="javascript:void(0)" onclick="reportIssue(@LocationId@)">Report an Issue with this Beach</a>]</span></div>'
     //+    '<li><a class="mobile" href="javascript:void(0)" onclick="showPopup(\'\',\'help.aspx?id=18&keyword=@Comments@\')">Text <b>@Comments@</b> to 23907 for mobile updates</a></li>'
var templateTab1Rain = '<table width="100%" class="bordered advisory" cellspacing="0" cellpadding="0">'
         +'<tr>'
          +'<td rowspan="2" class="image"><img src="@RainImage@"></td>'
          +'<td colspan="2">@TemplateLabel@'
          +'</td>'
         +'</tr>'
         +'<tr>'
         + '<td>'
         +  '<div class="right"><span class="txtBtn"><a href="javascript:void(0)" onclick="showPopup(\'\',\'help.aspx?id=6\')">[?]</a></span></div>'
         +  '<span class="@DryClass@">@DryGrade@</span> dry</td>'
         + '<td>'
         +  '<div class="right"><span class="txtBtn"><a href="javascript:void(0)" onclick="showPopup(\'\',\'help.aspx?id=7\')">[?]</a></span></div>'
         +  '<span class="@WetClass@">@WetGrade@</span> wet</td>'
        + '</tr>'
       + '</table>';
var templateRainLabel = '<h3>@LabelType@</h3>';
var templateClosedLabel = '<table width="100%" cellpadding="0" cellspacing="0" class="closedTable"><tr><td align="left" width="1%"><h3>@LabelType@</h3></td><td align="left" valign="middle" ><div class="closedComment">@MostRelevantComment@</div></td></tr></table>';       
var templateTab1NormalDry = '<div class="weatherKiosk">'
     +       '<h3><div class="right"><span class="txtBtn"><a href="javascript:void(0)" onclick="showPopup(\'\',\'help.aspx?id=6\')" >[?]</a></span></div>Dry Weather </h3>'
     +       '<table  border="0" cellspacing="0" cellpadding="0"><tr><td class="grade"><img src="@DryImage@"></td><td width="1"><img src="@DryIImage@"></td></tr></table>'
     +      '</div>';
var TempalteTab2NormalWet = '<div class="weatherKiosk">'
     +       '<h3><div class="right"><span class="txtBtn"><a href="javascript:void(0)" onclick="showPopup(\'\',\'help.aspx?id=7\')">[?]</a></span></div>Wet Weather </h3>'
     +       '<table border="0" cellspacing="0" cellpadding="0"><tr><td  class="grade"><img src="@WetImage@"></td><td width="1"><img src="@WetIImage@"></td></tr></table>'
     +      '</div>';
var templateTab1NormalDryHD = '<div class="weatherKiosk" >'
     +       '<h3><div class="right"><span class="txtBtn"><a href="javascript:void(0)" onclick="showPopup(\'\',\'help.aspx?id=6\')" >[?]</a></span></div>Dry Weather </h3>'
     +       '<table border="0" cellspacing="0" cellpadding="0" height="70px"><tr valign="middle" align="middle" ><td class="grade"><img src="@DryImage@"><td width="1"><img src="@DryIHDImage@"></td></td></tr></table>'
     +      '</div>';
var TempalteTab2NormalWetHD = '<div class="weatherKiosk" >'
     +       '<h3><div class="right"><span class="txtBtn"><a href="javascript:void(0)" onclick="showPopup(\'\',\'help.aspx?id=7\')">[?]</a></span></div>Wet Weather </h3>'
     +       '<table border="0" cellspacing="0" cellpadding="0" height="70px"><tr valign="middle" align="middle" ><td  class="grade"><img src="@WetImage@"></td><td width="1"><img src="@WetIHDImage@"></td></tr></table>'
     +      '</div>';
var TempalteTab2NormalAB411HD = '<div class="weatherKiosk" >'
     +       '<h3><div class="right"><span class="txtBtn"><a href="javascript:void(0)" onclick="showPopup(\'\',\'help.aspx?id=7\')">[?]</a></span></div>AB411 </h3>'
     +       '<table border="0" cellspacing="0" cellpadding="0" height="70px"><tr valign="middle" align="middle" ><td  class="grade"><img src="@AB411Image@"></td></tr></table>'
     +      '</div>';
var templateLoading = '<br /><center><img src="images/loading_icon.gif"></center><br />';
var templateLoadingBig = '<br /><center><img src="images/loading.gif"></center><br />';
var templateLoadingT = '<br /><center><img src="images/loading_t.gif"></center><br />';
var pathToBigMarker = 'images/bigBlueMarker.png';
var templateTab2 = '        <div class="right-set">'
    +     '<span class="txtBtn">[<a href="javascript:void(0)" onclick="closeLocationWindow()">close</a>]</span>'
    +    '</div><br />'
    +    '<h2>@LocationName@</h2>'
    +    '<div class="contentScroll"><div class="contentScroll-in" id="factsPanel">'
    +    '<div id="locationDescription">'
    +    ' <h3>Description</h3><table width="350px"><tr><td>@LocationDescription@</td></tr></table>'
    +    ' <div class="dottedSep"></div>'
    +    '</div>'
    +    '<div id="factorsAffectingWater">'
    +    ' <h3>Factors Affecting Water Quality</h3><table width="350px"><tr><td>@FactorsAffectingWater@</td></tr></table>'
    +    ' <div class="dottedSep"></div>'
    +    '</div>'
    +    '<div id="precautions">'
    +    ' <h3>Water Contact Precautions</h3><table width="350px"><tr><td>@Precautions@</td></tr></table>'
    +    ' <div class="dottedSep"></div>'
    +    '</div>'
    +    '<div id="relatedLinksPanel">'
    +    ' <h3>Related Links</h3><table width="350px"><tr><td><ul class="links menu-list">@LinkList@</ul></td></tr></table>'
    +    ' <div class="dottedSep"></div>'
    +    '</div>'
    +    '<div id="relatedDocumentsPanel">'
    +    ' <h3>Water Contact Precautions</h3><table width="350px"><tr><td><ul class="links menu-list">@DocumentList@</ul></td></tr></table>'
    +    ' <div class="dottedSep"></div>'
    +    '</div>'
    +   ' @FactsContent@'
    +   ' </div></div>';
var templateTab4 = '<div class="right-set">'
       +  '<span class="txtBtn">[<a href="javascript:void(0)" onclick="closeLocationWindow()">close</a>]</span>'
       + '</div><br />'
       + '<h2>@LocationName@</h2>'
       + '<div class="contentScroll"><div class="contentScroll-in"><div id="commentList">@CommentList@</div>'
       + '<br />'
      +  '<div id="commentPanel"><a href="#" onclick="$(\'#commentPanel\').html(panelAddComment.replace(/@insertLocationId@/,\'@LocationId@\')); $(\'#commentList\').hide(); ">Submit a Comment About This Beach</a></div>'
       + '</div></div>';
var viewCommentLink = '<a href="javascript:void(0)" onclick="$(\'#commentList\').show();$(\'#commentPanel\').hide();">View Comments</a>';       
var panelAddComment = '<table><tr><td align=left>First Name</td><td align=right> <input id="uFN" onclick="focus()"></td></tr><tr><td>Last Name</td><td> <input id="uLN" onclick="focus()"></td></tr><tr><td>Email</td><td><input id="uEmail" onclick="focus()"></td></tr></table>Comment<br /> <textarea id="uText" rows="6" cols="40" onclick="focus()"></textarea><br /><input type="hidden" id="uLId" value="@insertLocationId@"><br /><a href="javascript:void(0)" onclick="sendComment(0)"><img border=0 src="images/post_my_comment.png" alt="Send"></a>';
var templateTab5 = '<div class="right-set">'
  +       '<span class="txtBtn">[<a href="javascript:void(0)" onclick="closeLocationWindow()">close</a>]</span>'
  +      '</div><br />'
  +      '<h2>@LocationName@</h2>'
  +      '<div class="tabsSimple">'
  +      '<ul class="menu-list">'
  +      ' <li><a href="#histd1"><span>Weekly</span></a></li>'
  +      ' <li><a href="#histd2" onclick="loadHistoricalData(@LocationId@, 2)"><span>Summer</span></a></li>'
  +      ' <li><a href="#histd3" onclick="loadHistoricalData(@LocationId@, 1)"><span>Annual</span></a></li>'
  +      ' <li id="lhistd5" style="display:none" ><a href="#histd5" id="TMDLLink" onclick="loadHistoricalData(@LocationId@, 6)"><span>TMDL Violations</span></a></li>'
  +      ' <li><a href="#histd4" onclick="loadActivity(@LocationId@)"><span>Closures & Rain Adv.</span></a></li>'
  +     ' </ul>'
  +      '<div id="histd1">'
  +      '@Chart1@'
  +     '</div>'
  +     ' <div id="histd2">@Chart2@</div>'
  +     ' <div id="histd3">@Chart3@</div>'
  +     ' <div id="histd5">@Chart5@</div>'
  +     ' <div id="histd4">@CloseList@</div>'
  +     '</div>';
var templateTab3 = '<div class="right-set">'
  +       '<span class="txtBtn">[<a href="javascript:void(0)" onclick="closeLocationWindow()">close</a>]</span>'
  +      '</div><br />'
  +      '<h2>@LocationName@</h2>'
    +'<div id="dhtmlgoodies_slideshow">'
	+'<div id="previewPane" title="Click to enlarge">'
	+'	<img src="@FirstImagePath@" width="@ImageWidth@px" height="@ImageHeight@px" onclick="showBigImage(\'@ImageViewPath@\', @ImageViewWidth@, @ImageViewHeight@, \'@ImageViewDescription@\')" style="cursor:pointer">'
	+'	<div id="waitMessage">'+templateLoadingT+'</div>'
	+'	<div id="largeImageCaption">@FirstImageDescription@</div>'
	+'</div>'
	+'<div id="galleryContainer">'
	+'	<div id="arrow_left"><img src="images/arrow_left.jpg"></div>'
	+'	<div id="arrow_right"><img src="images/arrow_right.jpg"></div>'
	+'	<div id="theImages">'
	+'          @PreviewList@'
	+'          @DescriptionList@'
	+'			<div id="slideEnd"></div>'
	+'	</div>'
    +'	</div>'
    +'</div>'
    +'<a href="javascript:void(0)" onclick="$(\'#uploadForm\').show();$(\'#dhtmlgoodies_slideshow\').hide();$(this).hide();">Submit a Photo of this Beach</a>'
    +'<div id="uploadLoading" style="display:none;">'+templateLoadingBig+'</div>'
    +'<div id="uploadForm" style="display:none">'
    +'<form action=""  method="POST" enctype="multipart/form-data">'
    +'<table><tr><td>'
    +'First Name'
    +'</td><td>'
    +'Last Name'
    +'</td></tr><tr><td>'
    +'<input id="pFirstName" onclick="focus()"/>'
    +'</td><td>'
    +'<input id="pLastName" onclick="focus()"/>'
    +'</td></tr><tr><td>'
    +'Email'
    +'</td><td>'
    +'Date of Photo'
    +'</td></tr><tr><td>'
    +'<input id="pEmail" onclick="focus()"/>'
    +'</td><td nowrap>'
    +'<input id="date-pick" />'
    +'</td></tr><tr><td colspan="2">'
    +'Description'
    +'</td></tr><tr><td colspan="2">'
    +'<input id="uploadDescription" onclick="focus()" size="45">'
    +'</td></tr><tr><td colspan="2">'
    +'<input id="fileToUpload" type="file" size="45" name="fileToUpload" onclick="focus()">'
    +'</td></tr><tr><td colspan="2">'
    +'Please select a image and click Upload button'
    +'</td></tr><tr><td colspan="2">'
    +'<a href="javascript:void(0)" onclick="return ajaxFileUpload(@LocationId@);" ><img border="0" src="images/upload.png" alt="Upload"/></a>'
    +'</td></tr></table>'
    +'</form>'
    +'</div>';
var templateChartTableRow = '<tr><td>@Date@</td><td><span class="@DryClass@">@DryGrade@</span></td><td><span class="@WetClass@">@WetGrade@</span></td><td>@Comment@</td></tr>'    
var templateChartTableRowTMDL = '<tr><td>@SamplingPeriod@</td><td>@TMDLViolationCount@</td></tr>'    
var templateNoData = '<div class="contentScroll"><div class="contentScroll-in"><br /><p style="padding-left:10px">No Data</p></div></div>';
var templateChart = ' <div class="contentScroll"><div class="contentScroll-in">'
  +      ' <div class="chart"><img src="temp/@FileName@@LocationId@" id="img@FileName@"></div><span id="@FileName@Note" style="display:none">TMDL\'s are in effect from 4/1 through 10/31 of each year.</span>'
  +      ' <table cellpadding="0" cellspacing="0" width="100%" ><tr><td align="left"><h3>@Label@</h3></td><td align="right">&nbsp;<a href="javascript:void(0)" id="@FileName@SummaryLink" style="display:none" onclick="loadTmdlViolation(@CountyId@)" >County TMDL Summary</a></td></tr></table>'
  +     '  <table class="bordered beachData" cellspacing="0" cellpadding="0">'
  +     '   <tr>'
  +     '    <th class="date">Date</th>'
  +      '   <th>Dry</th>'
  +      '   <th>Wet</th>'
  +     '    <th>Notes</th>'
  +     '   </tr>'
  +     '   @ROWS@'
  +     '  </table>'
  +     ' </div></div>';
var templateCloseTableRow = '<tr><td>@Type@</td><td>@StartDate@</td><td>@EndDate@</td><td>@Comments@</td></tr>'    
var templateCloseTableRowRed = '<tr><td><span class="redLabel">@Type@</span></td><td><span class="redLabel">@StartDate@</span></td><td><span class="redLabel">@EndDate@</span></td><td><span class="redLabel">@Comments@</span></td></tr>'    
var templateCloseList = ' <div class="contentScroll"><div class="contentScroll-in">'
  +     '  <table class="bordered beachData" cellspacing="0" cellpadding="0">'
  +     '   <tr>'
  +     '    <th class="date">Type</th>'
  +      '   <th>Start</th>'
  +      '   <th>End</th>'
  +     '    <th>Comments</th>'
  +     '   </tr>'
  +     '   @ROWS@'
  +     '  </table>'
  +     ' </div></div>';
var templateReportForm = '<div class="popupForm" style="width: 500px"><h1>Report an Issue with this Beach</h1><div style="padding-left:10px" id="commentPanel"><table><tr><td align=left>First Name</td><td align=right> <input id="uFN" onclick="focus()"></td></tr><tr><td>Last Name</td><td> <input id="uLN" onclick="focus()"></td></tr><tr><td>Email</td><td><input id="uEmail" onclick="focus()"></td></tr></table>Issue<br /> <textarea id="uText" rows="6" cols="40" onclick="focus()"></textarea><br /><input type="hidden" id="uLId" value="@insertLocationId@"><br /><a href="javascript:void(0)" onclick="sendComment(1)"><img border="0" src="images/send.png" alt="Send"></a></div></div>';
var templateWelcome = '<div class="kioskWelcome">'
      +'<div class="intro">Welcome to the</div>'
      +'<h2>California Beach Report Card</h2>'
      +'Lorem ipsum dolor sit amet consectetuer Curabitur Donec felis lacinia malesuada. Tellus egestas at at nunc sem justo platea sodales elit tellus.'
      +'</div>';
var templateEmailPage = '<div class="popupForm" style="width: 500px;">'
        +'<h1>E-mail the Beach Report Card to a Friend</h1> <form> <table cellspacing="0" cellpadding="0">'
        +'<tr> <td> <div><b>Send To:</b></div>'
        +'<input size="23" type="text" id="emailTo"> </td> <td style="padding-left:5px">'
        +'<div><b>From:</b></div> <input size="23" type="text" id="emailFrom"> </td> </tr>'
        +'<tr> <td><div class="comment">Separate emails by comma</div></td> <td style="padding-left:5px"><div class="comment"><input type="checkbox" id="sendMe"> Send a copy to my email</div></td> </tr> </table>'
        +'<br /> <div><b>Message:</b></div> <textarea rows="7" cols="45" id="mailBody">Check out the California Beach Report Card at @Link@</textarea>'
        +'<div class="buttons"> <a href="javascript:void(0)" onclick="sendLinkToPage()"><img border="0" src="images/send.png"></a> </div> </form> </div>';
var templatePrintHeader = '<h2>BeachReportCard</h2>';
var templateRss = '<div class="popupForm" style="width: 500px"><h1>Subscribe To RSS Feed</h1>To view the Beach Report Card feeds in your RSS aggregator: '
        +'<ol><li>Click on the RSS icon.  - OR - </li><li>Copy and paste the URL into your reader. </li></ol>'
        +'<div id="panelGeneralFeed" style="width:500px"><h2>General Beach Report Card feed</h2>Subscribe to the General Beach Report Card feed to recieve rain advisories, closure and spill alerts, updates on scheduled clean-ups and upcoming legislation, and news updates for all beaches tracked by Heal The Bay.<br/><table cellpadding="0" cellspacing="5"><tr><td align="left"><a href="@GeneralLink@" target="_blank"><img src="images/icon_rss.gif" border="0"></a></td><td align="right"><a href="@GeneralLink@" target="_blank">@GeneralLink@</a></td></tr></table></div>'
        +'<div id="panelCountyFeed" style="width:500px"><h2>@CountyName@ feed</h2>Subscribe to this feed to get grade updates, rain advisories, closure and spill alerts, updates on scheduled clean-ups and upcoming legislation, and news updates for @CountyName@.<br/><table cellpadding="0" cellspacing="5"><tr><td align="left"><a href="@CountyLink@" target="_blank"><img src="images/icon_rss.gif" border="0"></a></td><td align="right"><a href="@CountyLink@" target="_blank">@CountyLink@</a></td></tr></table></div>'
        +'<div id="panelLocationFeed" style="width:500px"><h2>@LocationName@ feed</h2>Subscribe to this feed to get grade updates, rain advisories, closure and spill alerts, updates on scheduled clean-ups and upcoming legislation, and news updates for this specific beach.<br/><table cellpadding="0" cellspacing="5"><tr><td align="left"><a href="@LocationLink@" target="_blank"><img src="images/icon_rss.gif" border="0"></a></td><td align="right"><a href="@LocationLink@" target="_blank">@LocationLink@</a></td></tr></table></div>'
        +'</div>';
var templateLinkToPage = '<div class="popupForm" style="width: 500px"><h1>Link to this Page</h1>'
        +'Copy/Paste this URL to link to or share the Beach Report Card<br />'
        +'<div id="panelGeneralLink" style="width:400px"><h2>Beach Report Card link</h2><input type="text" value="@GeneralLink@" size="50" /></div><br />'
        +'<div id="panelCountyLink" style="width:400px"><h2>@CountyName@ link</h2><input type="text" value="@CountyLink@" size="50" /><br></div>'
        +'<div id="panelLocationLink" style="width:400px"><h2>@LocationName@ link</h2><input type="text" value="@LocationLink@" size="50" /></div>'
        +'</div>';
var templateTab6 = '<div class="right-set">'
        +'<span class="txtBtn">[<a href="javascript:void(0)" onclick="closeLocationWindow()">close</a>]</span>'
        +'</div><br />'
        +'<h2>@LocationName@</h2>'
        +'<div class="contentScroll"><div class="contentScroll-in">'
        +'@Tables@'
        +'@HtmlInfo@'
        +'</div></div>';
var templateShUpTable = '<h3>@TableName@</h3>'
        +'<table class="bordered" cellspacing="0" cellpadding="0">'
        +'@Rows@'
        +'</table>';
var templateShUpRow = '<tr><td class="date">@Date@</td><td>@Comment@</td></tr>';               
var templateTMDLViolation = '<div class="TMDLViolationBlock"><span class="TMDLViolation">Bacteria limit exceeded in previous week.<a href="javascript:void(0)" onclick="showTMDLTab(@LocationId@)" >Total</a> in Season: @TMDLViolationCount@</span><span class="txtBtn"><a href="javascript:void(0)" onclick="showPopup(\'\',\'help.aspx?id=16\')">[?]</a></span></div>';
var templateBummerFlags = '<div class="TMDLViolationBlock"><span class="TMDLViolation">@Flags@</span></div>';
var templateSummaryHead = '<div class="summaryHeadLeft">County</div><div class="summaryHeadRight">Number of Grades</div><br><br><br>';
var templateStateSummaryHead = '<div class="summaryHeadLeft">State</div><div class="summaryHeadRight">Number of Grades</div><br><br><br>';
var templateSummaryHeadHD = '<br>';
var templateCountyCharts = '<div class="topPanel"><div class="leftTopPanel"><a href="javascript:void(0)" onclick="$(\'#loading\').show(); setTimeout(\'recenterMap()\', 500)">[Recenter Map]</a></div><div class="rightTopPanel"><a href="javascript:void(0)" onclick="hideDetails()">[Hide Details]</a></div></div>'  
        +'    <h2>@CountyName@</h2><div class="pieChartContent" ><span class="dateUpdated">Grades updated: @UpdateDate@</span>'
        +'    <table width="100%" cellspacing="0" cellpadding="0">'
        +'     <tr>'
        +'      <th width="50%"><a href="javascript:void(0)" onclick="if (currentAction!=\'\') $(\'#locationList\').html(templateLoadingBig); changeGradeType(\'dry\')" >Dry: @DryCount@</a></th>'
        +'      <th><a href="javascript:void(0)" onclick="if (currentAction!=\'\') $(\'#locationList\').html(templateLoadingBig); changeGradeType(\'wet\')" >Wet: @WetCount@</a></th>'
        +'     </tr>'
        +'     <tr>'
        +'      <td ><a href="javascript:void(0)" onclick="if (currentAction!=\'\') $(\'#locationList\').html(templateLoadingBig); changeGradeType(\'dry\')" ><img src="temp/piechart-dry-county-@CountyId@.png" border="0" id="dryCountyChart" /></a></td>'
        +'      <td><a href="javascript:void(0)" onclick="if (currentAction!=\'\') $(\'#locationList\').html(templateLoadingBig); changeGradeType(\'wet\')" ><img src="temp/piechart-wet-county-@CountyId@.png" border="0" id="wetCountyChart" /></a></td>'
        +'     </tr>'
        +'     <tr>'
        +'      <td colspan="2" align="center">' 
        +'    <ul class="menu-list summaryLegend" >'
        +'     <li class="gradeAB">A or B</li>'
        +'     <li class="gradeC">C</li>'
        +'     <li class="gradeDF">D or F</li>'
        +'    </ul>'  
        +'    </td></tr>'      
        +'    </table>'
        +'    <div><span class="pieChartInfo">Rollover charts for number of grades</span></div><div id="tmdlInfo" ><a href="javascript:void(0)" onclick="loadTmdlViolation(@CountyId@)" >[TMDL Summary]</a></div><ul class="options menu-list"><li><a class="rss" href="javascript:void(0)" onclick="showRss()">Get Updates via RSS</a></li></ul></div>';
var templateCountyChartsHD = '<div><div class="topPanel"><div class="leftTopPanel"><a href="javascript:void(0)" onclick="$(\'#loading\').show(); setTimeout(\'recenterMap()\', 500)">[Recenter Map]</a></div><div class="rightTopPanel"></div></div>'  
        +'    <h2>@CountyName@</h2>'        
        +'    </div>';
var templateCountyTMDLViolation =  ' <div style="width:100%;height:100%; max-height:400px; overflow:scroll; overflow-x:hidden"><div class="tmdl-in">'
  +      ' <h2 >@CountyName@</h2><h3 >Bacteria Limits (TMDL) Violations</h3><div id="TMDLNotice">TMDL\'s are in effect from 4/1 through 10/31 of each year.</div>'
  +     '  <table class="bordered beachData" cellspacing="0" cellpadding="0" width="100%">'
  +     '   <tr valign="center" align="center">'
  +     '    <th class="date">Exceeded This Week</th>'
  +      '   <th>Beach Name</th>'
  +      '   <th>Violations in AB411 @CurrentDate@</th>'
  +     '    <th>Total Violations Since Compliance Deadline</th>'
  +     '   </tr>'
  +     '   @ROWS@'
  +     '  </table>'
  +     ' </div></div>';
var templateCountyTMDLViolationRow = '<tr><td align="center" >@ExceededIcon@</td><td><a href="javascript:void(0)" onclick="popup.remove();$(\'#loading\').show();curLId=@LocationId@;curLat=@Latitude@;curLng=@Longitude@;curCId=@CountyId@;setTimeout(\'openLocation()\', 500)">@LocationName@</a></td><td>@Summary@</td><td>@PriorSummary@</td></tr>';
var templateExceededIcon = '<img border=0 src="images/exceededIcon.gif">';