summaryrefslogtreecommitdiff
path: root/dashboard_website/static/js
diff options
context:
space:
mode:
Diffstat (limited to 'dashboard_website/static/js')
-rw-r--r--dashboard_website/static/js/dashboard.js117
1 files changed, 96 insertions, 21 deletions
diff --git a/dashboard_website/static/js/dashboard.js b/dashboard_website/static/js/dashboard.js
index 3ff0de9..43c07f3 100644
--- a/dashboard_website/static/js/dashboard.js
+++ b/dashboard_website/static/js/dashboard.js
@@ -25,12 +25,27 @@ var baseIcon = L.Icon.extend({
var homeIcon = new baseIcon({iconUrl: 'static/img/marker-home.png'}),
activeBikeIcon = new baseIcon({iconUrl: 'static/img/marker-bike-active.png', className:"leaflet-bike-marker"}),
inactiveBikeIcon = new baseIcon({iconUrl: 'static/img/marker-bike-inactive.png'}),
- visitedIcon = new baseIcon({iconUrl: 'static/img/marker-icon-grey.png'}),
- unvisitedIcon = new baseIcon({iconUrl: 'static/img/marker-icon-blue.png'}), // generic, becomes colored when assigned to route
- orangeIcon = new baseIcon({iconUrl: 'static/img/marker-icon-orange.png'}),
- redIcon = new baseIcon({iconUrl: 'static/img/marker-icon-red.png'}),
- greenIcon = new baseIcon({iconUrl: 'static/img/marker-icon-green.png'}),
- yellowIcon = new baseIcon({iconUrl: 'static/img/marker-icon-yellow.png'});
+ visitedIcon = new baseIcon({iconUrl: 'static/img/marker-icon-green.png'}),
+ disabledIcon = new baseIcon({iconUrl: 'static/img/marker-icon-black.png'}),
+ unvisitedIcon = new baseIcon({iconUrl: 'static/img/marker-icon-grey.png'}), // generic, becomes colored when assigned to route
+ visitedIconReq = new baseIcon({iconUrl: 'static/img/marker-icon-green-req.png'}),
+ disabledIconReq = new baseIcon({iconUrl: 'static/img/marker-icon-black-req.png'}),
+ unvisitedIconReq = new baseIcon({iconUrl: 'static/img/marker-icon-grey-req.png'}); // generic, becomes colored when assigned to route
+var teamIcons = [ unvisitedIcon,
+ new baseIcon({iconUrl: 'static/img/marker-icon-orange.png'}),
+ new baseIcon({iconUrl: 'static/img/marker-icon-red.png'}),
+ new baseIcon({iconUrl: 'static/img/marker-icon-green.png'}),
+ new baseIcon({iconUrl: 'static/img/marker-icon-yellow.png'}) ];
+var teamIconsReq = [ disabledIconReq,
+ new baseIcon({iconUrl: 'static/img/marker-icon-orange-req.png'}),
+ new baseIcon({iconUrl: 'static/img/marker-icon-red-req.png'}),
+ new baseIcon({iconUrl: 'static/img/marker-icon-green-req.png'}),
+ new baseIcon({iconUrl: 'static/img/marker-icon-yellow-req.png'}) ];
+
+ team1IconReq = new baseIcon({iconUrl: 'static/img/marker-icon-orange.png'}),
+ team2IconReq = new baseIcon({iconUrl: 'static/img/marker-icon-red.png'}),
+ team3IconReq = new baseIcon({iconUrl: 'static/img/marker-icon-green.png'}),
+ team4Icon = new baseIcon({iconUrl: 'static/img/marker-icon-yellow.png'});
var bikeIcons = {'ACTIVE' : activeBikeIcon, 'INACTIVE' : inactiveBikeIcon}
function zoomToBike(team_name){
@@ -121,41 +136,83 @@ function drawClues(){
unvisited_clues_m.clearLayers();
visited_clues_m.clearLayers();
for (var i = 0; i < clues.length; i++) {
- var tempIcon = visitedIcon;
- if (clues[i]['clue_status'] == "UNVISITED") tempIcon = unvisitedIcon;
+ var tempIcon = teamIcons[clues[i]['assigned_team']];
+ if(clues[i]['clue_required']){
+ tempIcon = teamIconsReq[clues[i]['assigned_team']];
+ if (clues[i]['clue_status'] == "UNVISITED") tempIcon = unvisitedIconReq;
+ if (clues[i]['clue_status'] == "VISITED") tempIcon = visitedIconReq;
+ }
+ else{
+ if (clues[i]['clue_status'] == "UNVISITED") tempIcon = unvisitedIcon;
+ if (clues[i]['clue_status'] == "VISITED") tempIcon = visitedIcon;
+ }
+
var popupdiv = document.createElement('p');
var toggleVisitText = clues[i]['clue_status'] == "UNVISITED" ? "Visit" : "Unvisit";
var toggleDisableText = clues[i]['clue_status'] != "DISABLED" ? "Disable" : "Enable";
- popupdiv.innerHTML = "<span style='color:black'>" + clues[i]['clue_name'] + ": " + clues[i]['clue_info'] + "</span>";
- popupdiv.innerHTML += "<button id=\"visitbutton_"+clues[i]['clue_name']+"style='margin-left:2px' onclick=\"toggleVisitClue('"+clues[i]['clue_name']+"')\""+(clues[i]['clue_status'] == "DISABLED" ? "disabled" : "")+">"+toggleVisitText+"</button>";
- popupdiv.innerHTML += "<button id=\"enablebutton_"+clues[i]['clue_name']+"style='margin-left:2px' onclick=\"toggleEnableClue('"+clues[i]['clue_name']+"')\""+(clues[i]['clue_status'] == "VISITED" ? "disabled" : "")+">"+toggleDisableText+"</button>";
- var clueMarker = L.marker([clues[i]['latitude'], clueVisits[i]['longitude']], {icon: tempIcon}).bindPopup(popupdiv);
+ popupdiv.innerHTML = "<span style='color:black'>" + clues[i]['clue_name'] + ": </span><span style='color:grey'>" + clues[i]['clue_info'] + "</span><br/>";
+ popupdiv.innerHTML += "<button id=\"visitbutton_"+clues[i]['clue_name']+"\" style='margin-left:2px' onclick=\"toggle_visit_clue('"+clues[i]['clue_name']+"')\""+(clues[i]['clue_status'] == "DISABLED" ? "disabled" : "")+">"+toggleVisitText+"</button>";
+ popupdiv.innerHTML += "<button id=\"enablebutton_"+clues[i]['clue_name']+"\" style='margin-left:2px' onclick=\"toggle_enable_clue('"+clues[i]['clue_name']+"')\""+(clues[i]['clue_status'] == "VISITED" ? "disabled" : "")+">"+toggleDisableText+"</button>";
+ popupdiv.innerHTML += "<button id=\"requirebutton_"+clues[i]['clue_name']+"\" style='margin-left:2px' onclick=\"toggle_required_clue('"+clues[i]['clue_name']+"')\">"+(clues[i]['clue_required'] ? "Un-require" : "Require")+"</button></br>";
+ popupdiv.innerHTML += "<div style='color:grey'>Assigned team: <select style='color:grey' id='assignedteam_"+clues[i]['clue_name']+"'><option value='0'>None</option> <option value='1'>Team 1</option> <option value='2'>Team 2</option> <option value='3'>Team 3</option> <option value='4'>Team 4</option></select></span>";
+ var clueMarker = L.marker([clues[i]['longitude'], clues[i]['latitude']], {icon: tempIcon}).bindPopup(popupdiv);
clue_rels[clues[i]['clue_name']] = clueMarker;
if (clues[i]['clue_status'] == "UNVISITED") unvisited_clues_m.addLayer(clueMarker);
else visited_clues_m.addLayer(clueMarker);
+ popupdiv.querySelector("#assignedteam_"+clues[i]['clue_name']).selectedIndex = clues[i]['assigned_team'];
}
}
-function toggleVisitClue(clue_name){
+function toggle_visit_clue(clue_name){
if(!confirm("Are you sure you want to visit/unvisit this clue?")) return;
console.log("toggling visited status for "+clue_name);
- document.getElementById("visitbutton_"+clues[i]['clue_name']).disabled = true; // temporarily disable buttons until new server frame received
- document.getElementById("enablebutton_"+clues[i]['clue_name']).disabled = true;
+ var clue = get_clue_by_name(clue_name);
+ document.getElementById("visitbutton_"+clue['clue_name']).disabled = true; // temporarily disable buttons until new server frame received
+ document.getElementById("enablebutton_"+clue['clue_name']).disabled = true;
+ document.getElementById("requirebutton_"+clue['clue_name']).disabled = true;
fetch(host+'/visitClueGeneric', {
method: "POST",
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
- body: JSON.stringify({ "clue_name" : clue_name })})
+ body: JSON.stringify({ "clue_name" : clue_name, "unvisit": true})}) // unvisit (if appropriate)
.then((response) => response.json())
.then((json) => console.log(json));
}
-function toggleEnableClue(clue_name){
+function toggle_required_clue(clue_name){
+ if(!confirm("Are you sure you want to mark/unmark this clue?")) return;
+ console.log("toggling visited status for "+clue_name);
+ var clue = get_clue_by_name(clue_name);
+ document.getElementById("visitbutton_"+clue['clue_name']).disabled = true; // temporarily disable buttons until new server frame received
+ document.getElementById("enablebutton_"+clue['clue_name']).disabled = true;
+ document.getElementById("requirebutton_"+clue['clue_name']).disabled = true;
+ fetch(host+'/requireClue', {
+ method: "POST",
+ headers: {
+ 'Accept': 'application/json',
+ 'Content-Type': 'application/json'
+ },
+ body: JSON.stringify({ "clue_name" : clue_name, "unvisit": true})}) // unvisit (if appropriate)
+ .then((response) => response.json())
+ .then((json) => console.log(json));
+}
+
+function get_clue_by_name(clue_name){
+ for (var i = 0; i < clues.length; i++)
+ if(clues[i]['clue_name'] == clue_name)
+ return clues[i];
+ return NaN;
+}
+
+function toggle_enable_clue(clue_name){
+ if(!confirm("Are you sure you want to enable/disable this clue?")) return;
console.log("toggling enabled status for "+clue_name);
- document.getElementById("visitbutton_"+clues[i]['clue_name']).disabled = true; // temporarily disable buttons until new server frame received
- document.getElementById("enablebutton_"+clues[i]['clue_name']).disabled = true;
+ var clue = get_clue_by_name(clue_name);
+ document.getElementById("visitbutton_"+clue['clue_name']).disabled = true; // temporarily disable buttons until new server frame received
+ document.getElementById("enablebutton_"+clue['clue_name']).disabled = true;
+ document.getElementById("requirebutton_"+clue['clue_name']).disabled = true;
fetch(host+'/enableClue', {
method: "POST",
headers: {
@@ -168,6 +225,8 @@ function toggleEnableClue(clue_name){
}
function addClue(){
+ var clue_name = document.getElementById("new_clue_name").value;
+ var clue_info = document.getElementById("new_clue_info").value;
var long = parseFloat(document.getElementById("new_clue_longitude").value);
var lat = parseFloat(document.getElementById("new_clue_latitude").value);
if (isNaN(long) || isNaN(lat)){
@@ -175,12 +234,28 @@ function addClue(){
return;
}
if(confirm("Are you sure this is the right location?")){
- console.log("yes");
+ console.log("adding clue...");
+ fetch(host+'/addClue', {
+ method: "POST",
+ headers: {
+ 'Accept': 'application/json',
+ 'Content-Type': 'application/json'
+ },
+ body: JSON.stringify({ "clue_name" : clue_name, "clue_info" : clue_info, "latitude" : lat, "longitude" : long})})
+ .then((response) => response.json())
+ .then((json) => {
+ console.log(json);
+ if(json['status'] != "OK")
+ alert(json['status']);
+ else
+ alert("Clue added successfully.");
+ });
}
}
// run every x seconds to get latest info from server
function requestLatestInfo(){
+ console.log("requesting update");
function handleLatestInfo(json){
if(json['status'] != "OK") return;
latest_timestamp = json['timestamp'];
@@ -278,7 +353,7 @@ window.onload = function() {
}).addTo(previewmap);
//homemarker = L.marker([homebase['latitude'], homebase['longitude']], {icon: homeIcon}).addTo(map).bindPopup("Home is where the club is.");
- previewmarker = L.marker([0,0], {icon: greenIcon}).addTo(previewmap);
+ previewmarker = L.marker([0,0], {icon: visitedIcon}).addTo(previewmap);
map.addLayer(visited_clues_m);
map.addLayer(unvisited_clues_m);
map.addLayer(bikes_m);
generated by cgit v1.2.3 (git 2.25.1) at 2025-12-21 10:00:41 +0000