| 1 | function initHARbutton() |
|---|
| 2 | { |
|---|
| 3 | var harBtnDiv = document.getElementById('harButton'); |
|---|
| 4 | map.controls[google.maps.ControlPosition.LEFT_BOTTOM].push(harBtnDiv) |
|---|
| 5 | harBtnDiv.title = 'Click to toggle har view'; |
|---|
| 6 | // Setup the click event listeners to toggle icon display |
|---|
| 7 | harBtnDiv.addEventListener('click', function() |
|---|
| 8 | { |
|---|
| 9 | har_showing = !har_showing; |
|---|
| 10 | // Determine which button image to show |
|---|
| 11 | if (har_showing) |
|---|
| 12 | { |
|---|
| 13 | pic = "images/btnDepressed_HAR.png" |
|---|
| 14 | // It's nice when icons become visible that the messages have been refreshed. |
|---|
| 15 | loadAllharMessages(); |
|---|
| 16 | } |
|---|
| 17 | else |
|---|
| 18 | { |
|---|
| 19 | pic = "images/btnReady_HAR.png" |
|---|
| 20 | } |
|---|
| 21 | document.getElementById('harBtnImg').src = pic; |
|---|
| 22 | // reveal or hide all the icons |
|---|
| 23 | harLayer.forEach(function(feature) |
|---|
| 24 | { |
|---|
| 25 | harLayer.overrideStyle(feature, |
|---|
| 26 | { |
|---|
| 27 | visible: har_showing |
|---|
| 28 | }); |
|---|
| 29 | }); |
|---|
| 30 | }); |
|---|
| 31 | } |
|---|
| 32 | function loadHARlayer() |
|---|
| 33 | { |
|---|
| 34 | harLayer = new google.maps.Data(); |
|---|
| 35 | harLayer.setMap(map); |
|---|
| 36 | harLayer.loadGeoJson(kHARfile); |
|---|
| 37 | harLayer.setStyle(function(feature) |
|---|
| 38 | { |
|---|
| 39 | // return the StyleOptions |
|---|
| 40 | return { |
|---|
| 41 | icon: iconHARactive, |
|---|
| 42 | title: feature.getId()+ " " +feature.getProperty("location")+ " " |
|---|
| 43 | + feature.getProperty("street"), |
|---|
| 44 | visible: false |
|---|
| 45 | }; |
|---|
| 46 | }); |
|---|
| 47 | |
|---|
| 48 | harLayer.addListener('click', function(event) |
|---|
| 49 | { |
|---|
| 50 | var dialog = document.getElementById('har-dialog'); |
|---|
| 51 | // Note: If the dialog is already being displayed when someone else |
|---|
| 52 | // updates the message, it won't be reflected in the dialog, until |
|---|
| 53 | // you close and reopen it. |
|---|
| 54 | dialog.style.display = 'block'; |
|---|
| 55 | harID = event.feature.getId(); |
|---|
| 56 | // Assign to the hidden field |
|---|
| 57 | document.getElementById('harID').value = harID; |
|---|
| 58 | showHARMessage(harID); // note: this is async |
|---|
| 59 | document.getElementById('har-info-label').innerHTML = "HAR ID: " + |
|---|
| 60 | harID + " LOCATION: " + event.feature.getProperty("location") |
|---|
| 61 | + " " + event.feature.getProperty("street"); |
|---|
| 62 | // clear input fields |
|---|
| 63 | document.getElementById('har-msgcontent1').value = ""; |
|---|
| 64 | document.getElementById('har-msgcontent1').focus(); |
|---|
| 65 | var span = document.getElementById('har-close'); |
|---|
| 66 | // When the user clicks on <span> (x), close the modal |
|---|
| 67 | span.addEventListener('click',function() |
|---|
| 68 | { |
|---|
| 69 | handleDialogClose('har-dialog'); |
|---|
| 70 | }); |
|---|
| 71 | }); |
|---|
| 72 | } |
|---|
| 73 | |
|---|
| 74 | function handleHARsubmit() |
|---|
| 75 | { |
|---|
| 76 | // recover the user's response |
|---|
| 77 | var response1 = document.getElementById('har-msgcontent1').value.trim(); |
|---|
| 78 | |
|---|
| 79 | var newMsg = response1; |
|---|
| 80 | if (newMsg.length == 0) |
|---|
| 81 | { |
|---|
| 82 | alert("Nothing to Send ... input fields are empty."); |
|---|
| 83 | } |
|---|
| 84 | else |
|---|
| 85 | { |
|---|
| 86 | document.getElementById('har-msgdisplay1').value = response1; |
|---|
| 87 | |
|---|
| 88 | saveHARMessage(response1); |
|---|
| 89 | } |
|---|
| 90 | } |
|---|
| 91 | |
|---|
| 92 | function handleHARclear() |
|---|
| 93 | { |
|---|
| 94 | document.getElementById('har-msgdisplay1').value = ""; |
|---|
| 95 | saveMessage(""); |
|---|
| 96 | } |
|---|
| 97 | |
|---|
| 98 | // Save an updated har message to the file |
|---|
| 99 | function saveHARMessage(outMessage) |
|---|
| 100 | { |
|---|
| 101 | // Fetch harID from hidden field where it was put when dialog opened. |
|---|
| 102 | var harID = document.getElementById('harID').value; |
|---|
| 103 | HARmessageDict[harID].har.message.phase1.Line1 = outMessage; |
|---|
| 104 | |
|---|
| 105 | // TODO Set icon to reflect message state |
|---|
| 106 | if (outMessage == "") |
|---|
| 107 | { |
|---|
| 108 | } |
|---|
| 109 | else |
|---|
| 110 | { |
|---|
| 111 | } |
|---|
| 112 | //harLayer.overrideStyle(harLayer.getFeatureById(harID), currentIcon) |
|---|
| 113 | // break the json string into lines for readability |
|---|
| 114 | jsonstring = JSON.stringify(Object.values(HARmessageDict)); |
|---|
| 115 | outString = "{\"data\":" + jsonstring + "}"; |
|---|
| 116 | |
|---|
| 117 | var xhttp = new XMLHttpRequest(); |
|---|
| 118 | xhttp.open("GET", "cgi-bin/saveHARmessage.py?msg=" + outString, true); |
|---|
| 119 | xhttp.send(); |
|---|
| 120 | // Using POST might be a better idea ... haven't tried this yet |
|---|
| 121 | // var xhr = new XMLHttpRequest(); |
|---|
| 122 | // xhr.open("POST", "/cgi-bin/saveMessage.py?", true); |
|---|
| 123 | // xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8'); |
|---|
| 124 | // send the collected data as JSON |
|---|
| 125 | // xhr.send(JSON.stringify(messageList)); |
|---|
| 126 | } |
|---|
| 127 | |
|---|
| 128 | // retrieve the current har message file |
|---|
| 129 | function showHARMessage(harID) |
|---|
| 130 | { |
|---|
| 131 | loadAllharMessages(); // because someone else may have made a recent update |
|---|
| 132 | // lookup the message for this har ID |
|---|
| 133 | var message = HARmessageDict[harID].har.message; |
|---|
| 134 | // show the message in the display |
|---|
| 135 | document.getElementById('har-msgdisplay1').value = message.phase1.Line1.toUpperCase(); |
|---|
| 136 | |
|---|
| 137 | } |
|---|
| 138 | function loadAllharMessages() |
|---|
| 139 | { |
|---|
| 140 | loadJSON("har_messages.json", function(response) |
|---|
| 141 | { |
|---|
| 142 | // Parse JSON string into object |
|---|
| 143 | messagejson = JSON.parse(response); |
|---|
| 144 | // Add each message to a lookup dictionary |
|---|
| 145 | for (var i = 0; i < messagejson.data.length; i++) |
|---|
| 146 | { |
|---|
| 147 | var item = messagejson.data[i]; |
|---|
| 148 | HARmessageDict[item.har.index] = item; |
|---|
| 149 | // TODO Set the appropriate icon on the har icon |
|---|
| 150 | // if there's currently no message |
|---|
| 151 | if (item.har.message.phase1.Line1 == "") |
|---|
| 152 | { |
|---|
| 153 | } |
|---|
| 154 | else |
|---|
| 155 | { |
|---|
| 156 | } |
|---|
| 157 | } |
|---|
| 158 | }); |
|---|
| 159 | } |
|---|
| 160 | |
|---|
| 161 | |
|---|