Index: trunk/webapps/cptms.html
===================================================================
--- trunk/webapps/cptms.html	(revision 326)
+++ trunk/webapps/cptms.html	(revision 327)
@@ -25,5 +25,5 @@
       }
         /* A line of the CMS message display */
-        textarea {
+        .cms_sign {
            height: 33px;
            width: 272px;
@@ -35,8 +35,15 @@
         }
         /* Field for entering CMS Message line */
-       input {
+       .cms-input {
            border: thin solid #333;
            padding: 2px;
            font-family: "Lucida Console", Monaco, monospace;
+           font-size: medium;
+           width: 163px;
+        }
+        /* Field for entering HAR Message line */
+       .har-input {
+           border: thin solid #333;
+           padding: 2px;
            font-size: medium;
         }
@@ -71,12 +78,15 @@
        }
       #message-display {
-           height: 172px;
+           height: 300px;
            width: 300px;
            overflow: hidden;
            float: left;
        }
+      #har-msgdisplay1 {
+            background-color: darkgray;
+      }
       #message-input {
            height: 122px;
-           width: 165px;
+           width: 170px;
            background-color: #729FFF;
            float: left;
@@ -85,7 +95,6 @@
        #buttonPanel {
            height: 122px;
-           width: 130px;
+           width: 125px;
            background-color: #729FFF;
-           border-left: none;
            float: left;
            padding: 20px;
@@ -95,5 +104,5 @@
         }
         /* CMS Edit Message Dialog */
-       #dialog {
+       .dialog {
           position: absolute;
           top: 10%;
@@ -104,4 +113,5 @@
           border: 1px solid #888;
           width: 680px;
+          height: 360px;
           display: none;           
         }
@@ -155,28 +165,55 @@
     <div id="mapdiv"></div>
     <!-- The div element for the popup dialog. Best results when placed here. -->
-    <div id="dialog" style="display:none;">
-        <span class="close">&#x2612;</span>  <!-- close button symbol -->
+    <div id="cms-dialog" class="dialog">
+        <span id="cms-close" class="close">&#x2612;</span>  <!-- close button symbol -->
         <br>
         <div id="cms-info-label" style="font-family:'Courier New'">CMS ID: xxx LOCATION: </div>
         <br>
         <input id='cmsID' value="" type='hidden'/>
-        <div id="message-input">Proposed:
-        <input id="msgcontent1"  maxlength="16" type="text"/><br><br>
-        <input id="msgcontent2"  maxlength="16" type="text"/><br><br>
-        <input id="msgcontent3"  maxlength="16" type="text"/>
+        <div id="message-input">Phase 1:
+        <input id="msgcontent1" class="cms-input"  maxlength="16" type="text"/><br><br>
+        <input id="msgcontent2" class="cms-input"  maxlength="16" type="text"/><br><br>
+        <input id="msgcontent3" class="cms-input"  maxlength="16" type="text"/><br><br>
+        Phase 2:
+        <input id="msgcontent4" class="cms-input"  maxlength="16" type="text"/><br><br>
+        <input id="msgcontent5" class="cms-input"  maxlength="16" type="text"/><br><br>
+        <input id="msgcontent6" class="cms-input"  maxlength="16" type="text"/><br><br>
         </div>        
-        <div id="buttonPanel"    style="display: block;">
-        <button onclick="handleCMSsubmit();">Send >></button><br>
-        <button onclick="handleCMSclear();">Clear >></button><br>
-        <button onclick="handleDialogClose();">Close </button>
+        <div id="buttonPanel"    style="display: block;"><br><br>
+        <button onclick="handleCMSsubmit();">Send >></button><br><br>
+        <button onclick="handleCMSclear();">Clear >></button><br><br>
+        <button onclick="handleDialogClose('cms-dialog');">Close </button>
         </div>
         <div id="message-display"  style="display: block;">Current:
-         <textarea readonly id="msgdisplay1" maxlength="16" rows="1" cols="16"></textarea>
-         <textarea readonly id="msgdisplay2" maxlength="16" rows="1" cols="16"></textarea>
-         <textarea readonly id="msgdisplay3" maxlength="16" rows="1" cols="16"></textarea>
+         <textarea class="cms_sign" readonly id="msgdisplay1" maxlength="16" rows="1" cols="16"></textarea>
+         <textarea class="cms_sign" readonly id="msgdisplay2" maxlength="16" rows="1" cols="16"></textarea>
+         <textarea class="cms_sign" readonly id="msgdisplay3" maxlength="16" rows="1" cols="16"></textarea>
+         <br><br><br>
+         <textarea class="cms_sign" readonly id="msgdisplay4" maxlength="16" rows="1" cols="16"></textarea>
+         <textarea class="cms_sign" readonly id="msgdisplay5" maxlength="16" rows="1" cols="16"></textarea>
+         <textarea class="cms_sign" readonly id="msgdisplay6" maxlength="16" rows="1" cols="16"></textarea>
+        </div>
+    </div>
+    <div id="har-dialog" class="dialog">
+        <span id="har-close" class="close">&#x2612;</span>  <!-- close button symbol -->
+        <div id="har-info-label" style="font-family:'Courier New'">HAR ID: xxx LOCATION: </div>
+        <br>
+        <input id='harID' value="" type='hidden'/>
+        <!--div id="har-message-input"-->Proposed:<br>
+        <input id="har-msgcontent1" class="har-input" type="text" size="50"><br>
+        <!--textarea id="har-msgcontent1" maxlength="150" rows="2" cols="50"/><br><br-->
+
+        <div id="har-buttonPanel" style="display: block;"><br>
+        <button onclick="handleHARsubmit();">Send >></button>
+        <button onclick="handleHARclear();">Clear >></button>
+        <button onclick="handleDialogClose('har-dialog');">Close </button><br><br>
+        </div>
+        <div id="har-message-display"  style="display: block;">Current:<br>
+         <textarea readonly id="har-msgdisplay1" maxlength="150" rows="3" cols="50"></textarea>
         </div>
     </div>
     <!--The div elements where the buttons appear  -->
     <div id="ctrButton"><img width="30" src="images/btn_mapcenter.png"</div>
+    <button id="harButton" class="unstyled-button"><img id="harBtnImg" src="images/btnReady_HAR.png"></button>
     <button id="cctvButton" class="unstyled-button"><img id="cctvBtnImg" src="images/btnReady_CCTV.png"></button>
     <button id="cmsButton" class="unstyled-button"><img id="cmsBtnImg" src="images/btnReady_CMS.png"></button>
@@ -192,4 +229,6 @@
     // the cms message local dictionary
     var messageDict = {}; 
+    // the har message local dictionary
+    var HARmessageDict = {}; 
     // Constant for map center location: The John Wayne Airport
     //var centerPoint = {lat: 33.687228, lng: -117.872148};
@@ -215,4 +254,5 @@
     var kCMSfile = "data_layers/cms_locations_D12.gjson"; // CMS locations 
     var kCCTVfile = "data_layers/cctv_locations_D12.gjson"; // CCTV locations
+    var kHARfile = "data_layers/har_locations_D12.gjson"; // CMS locations 
     var blueFlag = "images/icon_cmsBlue.png";
     var yellowFlag = "images/icon_cmsYellow.png";
@@ -222,7 +262,9 @@
     var vdsIconYellow = "images/circle-yellow.png"
     var vdsIconRed = "images/circle-red.png"
+    var harActive = "images/icon_harActive.png";
     var cms_showing = false;
     var vds_showing = true;
     var cctv_showing = false;
+    var har_showing = false;
     var cctv_infowindow; // We create just a single instance of info window.
 
@@ -231,4 +273,5 @@
     function initLayerButtons()
     {
+        initHARbutton();
         initCCTVbutton();
         initCMSbutton();
@@ -256,4 +299,5 @@
         loadCMSlayer();
         loadCCTVlayer();
+        loadHARlayer();
 
         initLayerButtons(); // setup the show/hide layer buttons
@@ -262,5 +306,9 @@
         var myTimer = setInterval(updateVDSlayer, 10000);
         // start an interval timer to refresh the cms icons every 10 seconds
-        var cmsTimer = setInterval(loadAllMessages, 10000);
+        var cmsTimer = setInterval(loadAllcmsMessages, 10000);
+
+        // start an interval timer to refresh the har icons every 10 seconds
+        var harTimer = setInterval(loadAllharMessages, 10000);
+
         // Listen for zoom changes and move the vds dots so as to keep a nice
         // visual distance between them appropriate to the zoom factor
@@ -284,4 +332,5 @@
     <script  src="js/cmsLayer.js"></script>
     <script  src="js/cctvLayer.js"></script>
+    <script  src="js/harLayer.js"></script>
     <script  src="js/controls.js"></script>
     <script  src="js/night_mode.js"></script>