Changeset 327 in tmcsimulator for trunk/webapps/cptms.html


Ignore:
Timestamp:
03/17/2019 07:00:07 PM (7 years ago)
Author:
jdalbey
Message:

Add HAR layer.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/webapps/cptms.html

    r326 r327  
    2525      } 
    2626        /* A line of the CMS message display */ 
    27         textarea { 
     27        .cms_sign { 
    2828           height: 33px; 
    2929           width: 272px; 
     
    3535        } 
    3636        /* Field for entering CMS Message line */ 
    37        input { 
     37       .cms-input { 
    3838           border: thin solid #333; 
    3939           padding: 2px; 
    4040           font-family: "Lucida Console", Monaco, monospace; 
     41           font-size: medium; 
     42           width: 163px; 
     43        } 
     44        /* Field for entering HAR Message line */ 
     45       .har-input { 
     46           border: thin solid #333; 
     47           padding: 2px; 
    4148           font-size: medium; 
    4249        } 
     
    7178       } 
    7279      #message-display { 
    73            height: 172px; 
     80           height: 300px; 
    7481           width: 300px; 
    7582           overflow: hidden; 
    7683           float: left; 
    7784       } 
     85      #har-msgdisplay1 { 
     86            background-color: darkgray; 
     87      } 
    7888      #message-input { 
    7989           height: 122px; 
    80            width: 165px; 
     90           width: 170px; 
    8191           background-color: #729FFF; 
    8292           float: left; 
     
    8595       #buttonPanel { 
    8696           height: 122px; 
    87            width: 130px; 
     97           width: 125px; 
    8898           background-color: #729FFF; 
    89            border-left: none; 
    9099           float: left; 
    91100           padding: 20px; 
     
    95104        } 
    96105        /* CMS Edit Message Dialog */ 
    97        #dialog { 
     106       .dialog { 
    98107          position: absolute; 
    99108          top: 10%; 
     
    104113          border: 1px solid #888; 
    105114          width: 680px; 
     115          height: 360px; 
    106116          display: none;            
    107117        } 
     
    155165    <div id="mapdiv"></div> 
    156166    <!-- The div element for the popup dialog. Best results when placed here. --> 
    157     <div id="dialog" style="display:none;"> 
    158         <span class="close">&#x2612;</span>  <!-- close button symbol --> 
     167    <div id="cms-dialog" class="dialog"> 
     168        <span id="cms-close" class="close">&#x2612;</span>  <!-- close button symbol --> 
    159169        <br> 
    160170        <div id="cms-info-label" style="font-family:'Courier New'">CMS ID: xxx LOCATION: </div> 
    161171        <br> 
    162172        <input id='cmsID' value="" type='hidden'/> 
    163         <div id="message-input">Proposed: 
    164         <input id="msgcontent1"  maxlength="16" type="text"/><br><br> 
    165         <input id="msgcontent2"  maxlength="16" type="text"/><br><br> 
    166         <input id="msgcontent3"  maxlength="16" type="text"/> 
     173        <div id="message-input">Phase 1: 
     174        <input id="msgcontent1" class="cms-input"  maxlength="16" type="text"/><br><br> 
     175        <input id="msgcontent2" class="cms-input"  maxlength="16" type="text"/><br><br> 
     176        <input id="msgcontent3" class="cms-input"  maxlength="16" type="text"/><br><br> 
     177        Phase 2: 
     178        <input id="msgcontent4" class="cms-input"  maxlength="16" type="text"/><br><br> 
     179        <input id="msgcontent5" class="cms-input"  maxlength="16" type="text"/><br><br> 
     180        <input id="msgcontent6" class="cms-input"  maxlength="16" type="text"/><br><br> 
    167181        </div>         
    168         <div id="buttonPanel"    style="display: block;"> 
    169         <button onclick="handleCMSsubmit();">Send >></button><br> 
    170         <button onclick="handleCMSclear();">Clear >></button><br> 
    171         <button onclick="handleDialogClose();">Close </button> 
     182        <div id="buttonPanel"    style="display: block;"><br><br> 
     183        <button onclick="handleCMSsubmit();">Send >></button><br><br> 
     184        <button onclick="handleCMSclear();">Clear >></button><br><br> 
     185        <button onclick="handleDialogClose('cms-dialog');">Close </button> 
    172186        </div> 
    173187        <div id="message-display"  style="display: block;">Current: 
    174          <textarea readonly id="msgdisplay1" maxlength="16" rows="1" cols="16"></textarea> 
    175          <textarea readonly id="msgdisplay2" maxlength="16" rows="1" cols="16"></textarea> 
    176          <textarea readonly id="msgdisplay3" maxlength="16" rows="1" cols="16"></textarea> 
     188         <textarea class="cms_sign" readonly id="msgdisplay1" maxlength="16" rows="1" cols="16"></textarea> 
     189         <textarea class="cms_sign" readonly id="msgdisplay2" maxlength="16" rows="1" cols="16"></textarea> 
     190         <textarea class="cms_sign" readonly id="msgdisplay3" maxlength="16" rows="1" cols="16"></textarea> 
     191         <br><br><br> 
     192         <textarea class="cms_sign" readonly id="msgdisplay4" maxlength="16" rows="1" cols="16"></textarea> 
     193         <textarea class="cms_sign" readonly id="msgdisplay5" maxlength="16" rows="1" cols="16"></textarea> 
     194         <textarea class="cms_sign" readonly id="msgdisplay6" maxlength="16" rows="1" cols="16"></textarea> 
     195        </div> 
     196    </div> 
     197    <div id="har-dialog" class="dialog"> 
     198        <span id="har-close" class="close">&#x2612;</span>  <!-- close button symbol --> 
     199        <div id="har-info-label" style="font-family:'Courier New'">HAR ID: xxx LOCATION: </div> 
     200        <br> 
     201        <input id='harID' value="" type='hidden'/> 
     202        <!--div id="har-message-input"-->Proposed:<br> 
     203        <input id="har-msgcontent1" class="har-input" type="text" size="50"><br> 
     204        <!--textarea id="har-msgcontent1" maxlength="150" rows="2" cols="50"/><br><br--> 
     205 
     206        <div id="har-buttonPanel" style="display: block;"><br> 
     207        <button onclick="handleHARsubmit();">Send >></button> 
     208        <button onclick="handleHARclear();">Clear >></button> 
     209        <button onclick="handleDialogClose('har-dialog');">Close </button><br><br> 
     210        </div> 
     211        <div id="har-message-display"  style="display: block;">Current:<br> 
     212         <textarea readonly id="har-msgdisplay1" maxlength="150" rows="3" cols="50"></textarea> 
    177213        </div> 
    178214    </div> 
    179215    <!--The div elements where the buttons appear  --> 
    180216    <div id="ctrButton"><img width="30" src="images/btn_mapcenter.png"</div> 
     217    <button id="harButton" class="unstyled-button"><img id="harBtnImg" src="images/btnReady_HAR.png"></button> 
    181218    <button id="cctvButton" class="unstyled-button"><img id="cctvBtnImg" src="images/btnReady_CCTV.png"></button> 
    182219    <button id="cmsButton" class="unstyled-button"><img id="cmsBtnImg" src="images/btnReady_CMS.png"></button> 
     
    192229    // the cms message local dictionary 
    193230    var messageDict = {};  
     231    // the har message local dictionary 
     232    var HARmessageDict = {};  
    194233    // Constant for map center location: The John Wayne Airport 
    195234    //var centerPoint = {lat: 33.687228, lng: -117.872148}; 
     
    215254    var kCMSfile = "data_layers/cms_locations_D12.gjson"; // CMS locations  
    216255    var kCCTVfile = "data_layers/cctv_locations_D12.gjson"; // CCTV locations 
     256    var kHARfile = "data_layers/har_locations_D12.gjson"; // CMS locations  
    217257    var blueFlag = "images/icon_cmsBlue.png"; 
    218258    var yellowFlag = "images/icon_cmsYellow.png"; 
     
    222262    var vdsIconYellow = "images/circle-yellow.png" 
    223263    var vdsIconRed = "images/circle-red.png" 
     264    var harActive = "images/icon_harActive.png"; 
    224265    var cms_showing = false; 
    225266    var vds_showing = true; 
    226267    var cctv_showing = false; 
     268    var har_showing = false; 
    227269    var cctv_infowindow; // We create just a single instance of info window. 
    228270 
     
    231273    function initLayerButtons() 
    232274    { 
     275        initHARbutton(); 
    233276        initCCTVbutton(); 
    234277        initCMSbutton(); 
     
    256299        loadCMSlayer(); 
    257300        loadCCTVlayer(); 
     301        loadHARlayer(); 
    258302 
    259303        initLayerButtons(); // setup the show/hide layer buttons 
     
    262306        var myTimer = setInterval(updateVDSlayer, 10000); 
    263307        // start an interval timer to refresh the cms icons every 10 seconds 
    264         var cmsTimer = setInterval(loadAllMessages, 10000); 
     308        var cmsTimer = setInterval(loadAllcmsMessages, 10000); 
     309 
     310        // start an interval timer to refresh the har icons every 10 seconds 
     311        var harTimer = setInterval(loadAllharMessages, 10000); 
     312 
    265313        // Listen for zoom changes and move the vds dots so as to keep a nice 
    266314        // visual distance between them appropriate to the zoom factor 
     
    284332    <script  src="js/cmsLayer.js"></script> 
    285333    <script  src="js/cctvLayer.js"></script> 
     334    <script  src="js/harLayer.js"></script> 
    286335    <script  src="js/controls.js"></script> 
    287336    <script  src="js/night_mode.js"></script> 
Note: See TracChangeset for help on using the changeset viewer.