Changeset 304 in tmcsimulator


Ignore:
Timestamp:
03/10/2019 07:50:12 PM (7 years ago)
Author:
jdalbey
Message:

cptms_map.html Added cctv icons

Location:
trunk/src/cptms
Files:
5 added
2 edited

Legend:

Unmodified
Added
Removed

  • trunk/src/cptms/cptms_map.html

    r303 r304  
    126126  <body> 
    127127    <!--  
     128         Version 5.7 integrates CCTV icons and button (but empty click handler) 
    128129         Version 5.6 integrates CMS features 
    129130         Version 5.5 renames title to CPTMS, loads static data on startup and dynamic data 
    … …  
    146147    <!--The div element where the buttons appears --> 
    147148    <div id="ctrButton" class="unstyled-button">&#x2295;</div> 
    148     <button id="cmsButton" class="unstyled-button"><img id="cmsBtnImg" src="images/CPTMSImages/btnDepressed_CMS.png"></button> 
     149    <button id="cctvButton" class="unstyled-button"><img id="cctvBtnImg" src="images/CPTMSImages/btnReady_CCTV.png"></button> 
     150    <button id="cmsButton" class="unstyled-button"><img id="cmsBtnImg" src="images/CPTMSImages/btnReady_CMS.png"></button> 
    149151    <button id="vdsButton" class="unstyled-button"><img id="vdsBtnImg" src="images/CPTMSImages/btnDepressed_VDS.png"></button> 
    150152    <!-- The div element for the popup dialog --> 
    … …  
    195197    var colorZvalues = {"white":5,"lime":10,"yellow":20,"red":30}; 
    196198var kCMSstartupFile = "cmsStatusD12.json"; 
     199var kCCTVfile = "cctv_locations_D12.json"; 
    197200var blueFlag = "images/CPTMSImages/icon_cmsBlue.png"; 
    198201var yellowFlag = "images/CPTMSImages/icon_cmsYellow.png"; 
     202var cctvIcon = "images/CPTMSImages/icon_cctvBlue.png"; 
    199203var messageList; 
    200204var cms_info; 
    201 var markerList = []; 
    202 var cms_showing = true; 
     205var cmsList = []; 
     206var cctvList = []; 
     207var cms_showing = false; 
    203208var vds_showing = true; 
    204  
     209var cctv_showing = false; 
    205210    // Build a solid colored icon to use instead of the classic pin 
    206211    // Use a diamond on N and E directions, circle on S and W directions 
    … …  
    436441function initButton() 
    437442{ 
     443    var cctvBtnDiv = document.getElementById('cctvButton'); 
     444    map.controls[google.maps.ControlPosition.LEFT_BOTTOM].push(cctvBtnDiv) 
     445    cctvBtnDiv.title = 'Click to toggle cctv view'; 
     446    // Setup the click event listeners to toggle icon display 
     447    cctvBtnDiv.addEventListener('click', function() { 
     448            cctv_showing = !cctv_showing; 
     449            // reveal or hide all the icons 
     450            for (var i = 0; i < cctvList.length; i++) 
     451            { 
     452                cctvList[i].setVisible(cctv_showing); 
     453            } 
     454            // Determine which button image to show 
     455            if (cctv_showing) 
     456            { 
     457                pic = "images/CPTMSImages/btnDepressed_CCTV.png" 
     458            } 
     459            else 
     460            { 
     461                pic = "images/CPTMSImages/btnReady_CCTV.png" 
     462            } 
     463            document.getElementById('cctvBtnImg').src=pic; 
     464    }); 
     465 
    438466    var cmsBtnDiv = document.getElementById('cmsButton'); 
    439467    map.controls[google.maps.ControlPosition.LEFT_BOTTOM].push(cmsBtnDiv) 
    440468    cmsBtnDiv.title = 'Click to toggle cms view'; 
    441  
    442469    // Setup the click event listeners to toggle icon display 
    443470    cmsBtnDiv.addEventListener('click', function() { 
    444471            cms_showing = !cms_showing; 
    445472            // reveal or hide all the icons 
    446             for (var i = 0; i < markerList.length; i++) 
    447             { 
    448                 markerList[i].setVisible(cms_showing); 
     473            for (var i = 0; i < cmsList.length; i++) 
     474            { 
     475                cmsList[i].setVisible(cms_showing); 
    449476            } 
    450477            // Determine which button image to show 
    … …  
    459486            document.getElementById('cmsBtnImg').src=pic; 
    460487    }); 
     488 
    461489    var vdsBtnDiv = document.getElementById('vdsButton'); 
    462490    map.controls[google.maps.ControlPosition.LEFT_BOTTOM].push(vdsBtnDiv) 
    … …  
    483511    }); 
    484512} 
    485 function setMarkers() 
     513function setCMSmarkers() 
    486514{ 
    487515    var simpleImage = ""; 
    488     loadcmsJSON(function(response) 
     516    loadJSON(kCMSstartupFile, function(response) 
    489517    { 
    490518        // Parse JSON string into object 
    491519        cms_info = JSON.parse(response); 
    492         console.log(cms_info.data[0].cms); 
     520        //console.log(cms_info.data[0].cms); 
    493521        // Process each new marker  
    494522        for (var i = 0; i < cms_info.data.length; i++) 
    … …  
    506534                .route + " " + cms.location.postmile + " " + cms 
    507535                .location.locationName 
    508             markerList[i] = new google.maps.Marker( 
     536            cmsList[i] = new google.maps.Marker( 
    509537            { 
    510538                position: 
    … …  
    519547                location: locationInfo 
    520548            }); 
    521             google.maps.event.addListener(markerList[i], 'click', 
     549            cmsList[i].setVisible(false); // initially hidden 
     550            google.maps.event.addListener(cmsList[i], 'click', 
    522551                function() 
    523552                { 
    … …  
    545574    }); 
    546575} 
    547  
    548 function loadcmsJSON(callback) 
     576function setCCTVmarkers() 
    549577{ 
    550     var xobj = new XMLHttpRequest(); 
    551     xobj.overrideMimeType("application/json"); 
    552     xobj.open('GET', kCMSstartupFile, true); 
    553     xobj.onreadystatechange = function() 
    554     { 
    555         if (xobj.readyState == 4 && xobj.status == "200") 
     578    loadJSON(kCCTVfile, function(response) 
     579    { 
     580        // Parse JSON string into object 
     581        cctv_info = JSON.parse(response); 
     582        // Process each new marker  
     583        for (var i = 0; i < cctv_info.data.length; i++) 
    556584        { 
    557             callback(xobj.responseText); 
    558         } 
    559     }; 
    560     // We want ajax to ignore any cached responses 
    561     xobj.setRequestHeader('If-Modified-Since', 'Sat, 01 Jan 2000 01:01:01 GMT') 
    562     xobj.send(null); 
     585            var cctv = cctv_info.data[i].cctv; 
     586            var currLat = Number(cctv.location.latitude); 
     587            var currLong = Number(cctv.location.longitude); 
     588            var locationInfo = cctv.location.locationName; 
     589            cctvList[i] = new google.maps.Marker( 
     590            { 
     591                position: 
     592                { 
     593                    lat: currLat, 
     594                    lng: currLong 
     595                }, 
     596                map: map, 
     597                icon: cctvIcon, 
     598                title: "#"+i+" " +locationInfo, 
     599                cctvid: "" + i, 
     600                location: locationInfo, 
     601                index: cctv.index, 
     602                nearVDS: cctv.location.nearVDS 
     603            }); 
     604            cctvList[i].setVisible(false); // initially hidden 
     605            google.maps.event.addListener(cctvList[i], 'click', 
     606                function() 
     607                { 
     608                    // fetch the sequential msg # 
     609                    cctvIndex = this.index; 
     610                    alert("here will be the view of cctv: " + cctvIndex); 
     611                }); 
     612        } 
     613    }); 
    563614} 
     615 
     616 
     617 
    564618 
    565619function handleSubmit() 
    … …  
    621675    // Change icon if something was saved 
    622676    if (outMessage == "||") 
    623         markerList[cmsID].setIcon(yellowFlag); 
     677        cmsList[cmsID].setIcon(yellowFlag); 
    624678    else 
    625         markerList[cmsID].setIcon(blueFlag); 
     679        cmsList[cmsID].setIcon(blueFlag); 
    626680 
    627681    var xhttp = new XMLHttpRequest(); 
    … …  
    655709        initButton(); 
    656710        getMessage(1); // load the current message file 
    657         setMarkers(); 
    658  
     711        setCMSmarkers(); 
     712        setCCTVmarkers(); 
    659713 
    660714        // Start a timer to refresh the map every 10 seconds 

  • trunk/src/cptms/prep_postmiles.py

    r284 r304  
    4444def loadHighways(): 
    4545 
    46 #    f = open("pm_coords_uniq_sorted.csv",'r') 
    4746    f = open(postmileFile,'r') 
    4847    lines = [line.split(',') for line in f.readlines()] 
Note: See TracChangeset for help on using the changeset viewer.