| 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 | hideElementById('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.replace(/[;:",]/gi, ""); // remove semicolons from input |
|---|
| 80 | |
|---|
| 81 | if (newMsg.length == 0) |
|---|
| 82 | { |
|---|
| 83 | alert("Nothing to Send ... input fields are empty."); |
|---|
| 84 | } |
|---|
| 85 | else |
|---|
| 86 | { |
|---|
| 87 | document.getElementById('har-msgdisplay1').value = newMsg; |
|---|
| 88 | |
|---|
| 89 | saveHARMessage(newMsg); |
|---|
| 90 | } |
|---|
| 91 | } |
|---|
| 92 | |
|---|
| 93 | function handleHARclear() |
|---|
| 94 | { |
|---|
| 95 | document.getElementById('har-msgdisplay1').value = ""; |
|---|
| 96 | saveHARMessage(""); |
|---|
| 97 | } |
|---|
| 98 | |
|---|
| 99 | // Save an updated har message to the file |
|---|
| 100 | function saveHARMessage(outMessage) |
|---|
| 101 | { |
|---|
| 102 | // Fetch harID from hidden field where it was put when dialog opened. |
|---|
| 103 | var harID = document.getElementById('harID').value; |
|---|
| 104 | HARmessageDict[harID].har.message.phase1.Line1 = outMessage; |
|---|
| 105 | // Set icon to reflect message state |
|---|
| 106 | if (outMessage == "") |
|---|
| 107 | { |
|---|
| 108 | currentIcon = {icon: iconHARidle}; |
|---|
| 109 | } |
|---|
| 110 | else |
|---|
| 111 | { |
|---|
| 112 | currentIcon = {icon: iconHARactive}; |
|---|
| 113 | } |
|---|
| 114 | harLayer.overrideStyle(harLayer.getFeatureById(harID), currentIcon) |
|---|
| 115 | |
|---|
| 116 | // Examine each message in the dict and convert to json format |
|---|
| 117 | var lineOut = ""; |
|---|
| 118 | for (var id in HARmessageDict) |
|---|
| 119 | { |
|---|
| 120 | // convert and append to output string |
|---|
| 121 | lineOut += JSON.stringify(HARmessageDict[id]) + ',\n'; |
|---|
| 122 | } |
|---|
| 123 | // remove trailing comma |
|---|
| 124 | lineOut = lineOut.substring(0,lineOut.length-2); |
|---|
| 125 | outString = "{\"data\":[\n" + lineOut + "\n]}"; |
|---|
| 126 | |
|---|
| 127 | // Using POST to send the data |
|---|
| 128 | var xhr = new XMLHttpRequest(); |
|---|
| 129 | xhr.open("POST", "../cgi-bin/saveHARmessage.py", true); |
|---|
| 130 | xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8'); |
|---|
| 131 | // send the collected data as JSON |
|---|
| 132 | xhr.send("msg="+outString); |
|---|
| 133 | } |
|---|
| 134 | |
|---|
| 135 | // retrieve the current har message file |
|---|
| 136 | function showHARMessage(harID) |
|---|
| 137 | { |
|---|
| 138 | loadAllharMessages(); // because someone else may have made a recent update |
|---|
| 139 | // lookup the message for this har ID |
|---|
| 140 | var message = HARmessageDict[harID].har.message; |
|---|
| 141 | // show the message in the display |
|---|
| 142 | document.getElementById('har-msgdisplay1').value = message.phase1.Line1.toUpperCase(); |
|---|
| 143 | |
|---|
| 144 | } |
|---|
| 145 | function loadAllharMessages() |
|---|
| 146 | { |
|---|
| 147 | loadJSON("../dynamicdata/har_messages.json", function(response) |
|---|
| 148 | { |
|---|
| 149 | // Parse JSON string into object |
|---|
| 150 | messagejson = JSON.parse(response); |
|---|
| 151 | // Add each message to a lookup dictionary |
|---|
| 152 | for (var i = 0; i < messagejson.data.length; i++) |
|---|
| 153 | { |
|---|
| 154 | var item = messagejson.data[i]; |
|---|
| 155 | HARmessageDict[item.har.index] = item; |
|---|
| 156 | // Set the appropriate icon on the har icon |
|---|
| 157 | // if there's currently no message |
|---|
| 158 | if (item.har.message.phase1.Line1 == "") |
|---|
| 159 | { |
|---|
| 160 | harLayer.overrideStyle(harLayer.getFeatureById(item.har.index), {icon: iconHARidle}) |
|---|
| 161 | } |
|---|
| 162 | else |
|---|
| 163 | { |
|---|
| 164 | harLayer.overrideStyle(harLayer.getFeatureById(item.har.index), {icon: iconHARactive}) |
|---|
| 165 | } |
|---|
| 166 | } |
|---|
| 167 | }); |
|---|
| 168 | } |
|---|
| 169 | |
|---|
| 170 | |
|---|