Changeset 530 in tmcsimulator for trunk/webapps/visualizer/index.html


Ignore:
Timestamp:
11/23/2019 05:18:32 PM (6 years ago)
Author:
jdalbey
Message:

Visualizer updated with Back button and code comments added

File:
1 edited

Legend:

Unmodified
Added
Removed

  • trunk/webapps/visualizer/index.html

    r528 r530  
    55<!-- map center button icon from http://icons8.com/.  (Obligatory backlink, don't remove ) --> 
    66  <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> 
    7     <title>Visualizer</title>  
     7    <title>Visualizer </title>  
    88<link rel="icon"  
    99      type="image/png"  
    … …  
    1414  <body> 
    1515    <!--  
    16          Version 6.5 Adjust cms dialog dimensions for Chrome. 
    17              Version 6.4 Remove fullscreen control. (Use Browser F11 instead). 
    18          Version 6.3 decomposed into modules for each layer 
    19          Version 6.2 puts cctv and cms and vds in separate data layers.    
    20          Version 6.1 Puts cms messages in json formatted file.  Polls for updates. 
    21          Version 6.0 Adds speed-dependent images to infowindow for cctv icons 
    22          Version 5.8 Adds an infowindow with a static image for all cctv icons 
    23          Version 5.7 integrates CCTV icons and button (but empty click handler) 
    24          Version 5.6 integrates CMS features 
    25          Version 5.5 renames title to CPTMS, loads static data on startup and dynamic data 
    26          every ten seconds.   
    27          Version 5.4 adds Search box and Center button 
    28          Version 5.3 fixed dot color update defect, increased refresh rate to 10 sec. 
    29          Version 5.2 places red dots overlapping yellow dots. 
    30          Version 5.1 removes the map and street view buttons and the H3 tag. 
    31          Version 5 uses precomputed perpendicular vector in dot adjustment function 
    32          Version 4 Adjust the spacing between dots when the map is zoomed. 
    33          Version 3 does loadGeoJson only once, and subsequently does an ajax load 
    34          of the highways file, and selectively updates only those placePins whose 
    35          color has changed.  
    36          @author jdalbey  2019.2.17 
     16         Visualizer created from CPTMS 
     17         @author tkumar and jdalbey 2019.11.23 
    3718    --> 
    38     <!-- The text area input for the Search Box --> 
    39     <input id="search-input" class="controls" type="text" placeholder="Search Box"> 
    4019    <!--The div element where the map appears. --> 
    4120    <div id="mapdiv"></div> 
    … …  
    4423   <!--The div elements where the buttons appear--> 
    4524    <div id="ctrButton"><img width="30" src="images/btn_mapcenter.png"></div> 
    46     <!-- <button id="harButton" class="unstyled-button"><img id="harBtnImg" src="images/btnReady_HAR.png"></button> 
    47     <button id="cctvButton" class="unstyled-button"><img id="cctvBtnImg" src="images/btnReady_CCTV.png"></button> 
    48     <button id="cmsButton" class="unstyled-button"><img id="cmsBtnImg" src="images/btnReady_CMS.png"></button>--> 
    49     <button id="vdsButton" class="unstyled-button"><img id="vdsBtnImg" src="images/btnDepressed_VDS.png"></button> 
    5025    <p id="time">00:00:00</p> 
    51     <button id="start" >Beginning</button> 
     26    <button id="beginning" >Beginning</button> 
    5227    <button id="forward" >Next</button> 
    5328        <button id="backward" >Back</button> 
    … …  
    9469    var iconVDSwhite = "images/circle_white.png" 
    9570    var vds_showing = true; 
    96     var filters = []; //array to hold markers for visualizer 
    97     var times = []; //array to hold times of each traffic event 
    98     times[0] = "00:00:00"; 
    99     var diff_arr = []; // array to hold difference in target markers 
    100     var index = -1; //to index into above array 
     71    var targetDots = []; // 2d array containing targetDots parsed from each line in traffic events file 
     72    var eventTimes = []; //array to hold times of each traffic event 
     73    eventTimes[0] = "00:00:00"; 
     74    var diff_arr = []; // 2d array containing difference in map state between each event 
     75    var eventIndex = -1; //to index into above array 
    10176 
    10277    // Use larger VDS icons if we're being displayed on the video wall 
    … …  
    125100    } 
    126101 
    127     // Initialize the view/hide buttons  
    128     function initLayerButtons() 
    129     { 
    130         initVDSbutton(); 
    131         initForwardbutton(); 
    132         initVDSicons(); 
    133     } 
    134  
    135102    // Initialize the map and load the points 
    136103    function initMap() 
    … …  
    148115 
    149116        // setup the search box and center button 
    150         initSearch(); 
     117        //initSearch(); 
    151118        initCenter(); 
    152119         
    153         loadVDSlayer(); // go load the map data 
    154         processVDS(); 
     120        initializeVDSlayer(); // go load the map data 
    155121 
    156         initLayerButtons(); // setup the show/hide layer buttons 
    157  
    158         updateVDSlayer(); 
    159         setTimeout(function() { 
    160             buildDiff(); 
    161             updateVDSlayer(); 
    162         }, 3000); 
     122        initControlButtons(); 
     123        initVDSicons() 
    163124 
    164125        // Listen for zoom changes and move the vds dots so as to keep a nice 
Note: See TracChangeset for help on using the changeset viewer.