multiple readings working

public/js/data.js

@@ -147,6 +147,7 @@ function getSectors(site_id){
     });
 }
 function getSpots(sector_id){
+    current_spots = [];
     document.getElementById('data-prompt').innerHTML = "Pick a spot."
     document.getElementById('spots').innerHTML = placeholderHTML;
 
@@ -239,10 +240,19 @@ function getReadingsDates(platformid){
         }
     });
 }
-function getReadings(spot_id){
-    if (!current_spots.includes(spot_id)){
-        current_spots.push(spot_id);
+function getReadings(spot_id,value){
+    if (value == true){ // add spot to list
+        if (!current_spots.includes(spot_id)){
+            current_spots.push(spot_id);
+        }
+    }else{
+        if (current_spots.includes(spot_id)){
+            var index = current_spots.indexOf(spot_id);
+            if (index !== -1) current_spots.splice(index, 1);
+        }
     }
+    console.log("CURRENT SPOTS: " + current_spots);
+    
     document.getElementById('data-prompt').innerHTML = "Pick some spots to compare";
     document.getElementById("button_permalink").disabled = true;
     document.getElementById("button_csv").disabled = true;
@@ -267,8 +277,8 @@ function getReadings(spot_id){
             var color = getRandomColor();
             query_data = processReadings(readings);
 
-            //createPoints([readings[0]], color);
-            //createGraphReading(readings, query_selection,  color);
+            //createPoints(query_data, color);
+            createGraphReading(query_data, query_selection,  color);
 
             var dataview = document.getElementById("dataView")
             dataview.querySelector("#nav-button-graph").classList.add("new_data_button");

public/js/graph.js

@@ -26,7 +26,7 @@ $( document ).ready(function() {
 });
 function createGraphReading(dataset, q_arr, color){
     console.log("TABLE INFO");
-    console.log(dataset,q_arr);
+    console.log(dataset);
     //reset containers
     document.getElementById('readingStats').style.display = 'block';
     document.getElementById('line-chart').style.display = 'none';
@@ -39,50 +39,41 @@ function createGraphReading(dataset, q_arr, color){
     var trip = q_arr[0];
     var site = q_arr[1];
     var sector = q_arr[2];
-    var spot = q_arr[3];
 
     var title = document.createElement('h');
     title.innerHTML = "Trip " + trip + ", Site " + site + ", Sector " + sector; 
     parent.append(title);
 
     const table = document.createElement('table');
+    var tableHTML = "";
+    var keys = Object.keys(dataset[0]);
+    tableHTML += createTableRow(keys);
 
-    // create headings
-    var table_arr = [['spot','latitude','longitude','elevation','accuracy']];
-    for (x=0;x<dataset[0].length;x++){
-        if (!table_arr.includes(dataset[0][x].sensortype)){
-            table_arr[0].push(dataset[0][x].sensortype);
+    console.log(dataset);
+    for ( x = 0 ; x < dataset.length ; x++){
+        console.log(x);
+        prop_arr = [];
+        for (y=0;y<keys.length;y++){
+            prop_arr.push(dataset[x][keys[y]]);
         }
+        tableHTML += createTableRow(prop_arr);
     }
-    
-    for (x=0;x<dataset.length;x++){
-        current_dataset = dataset[x];
-        new_row = [];
-        new_row.push(current_dataset[0].spotid);
-        new_row.push(current_dataset[0].latitude);
-        new_row.push(current_dataset[0].longitude);
-        new_row.push(current_dataset[0].elevation);
-        new_row.push(current_dataset[0].accuracy);
-        for (y=0;y<current_dataset.length;y++){
-            current_record = current_dataset[y];
-            for(t in table_arr[0]){
-                if (current_record.sensortype == table_arr[0][t] && !new_row[t]){
-                    new_row.push(current_record.value);
-                }
-            }
-        }
-        
-        table_arr.push(new_row);
-    }
-    console.log('data to render')
-    console.log(table_arr);
-    
 
     // append table to parent
-    //table.innerHTML = tableHTML;
-    //parent.append(table);
+    console.log(tableHTML);
+    table.innerHTML = tableHTML;
+    parent.append(table);
     
 }
+function createTableRow(arr){
+    console.log(arr);
+    text = '<tr>';
+    for (j=0;j<arr.length;j++){
+        text += "<td>" + arr[j] + "</td>"
+    }
+    text += '</tr>';
+    return text;
+}
 function createGraphStreaming(dataset, title,color){
     // reset some containers
     document.getElementById('line-chart').style.display = 'block';

public/js/util.js

@@ -91,7 +91,7 @@ function createRadioElementSpots( mode, name, checked, label,id ) {
         radioHtml += "'" + id + "'";
         radioHtml +=')" type="checkbox" name="' + name + '" id="' + label + '" />';
     }else{
-        radioHtml += '<input class="data-radio form-radio" onchange="'+ f +'(' + id + ')" type="checkbox" name="' + name + '" id="' + label + '" />';
+        radioHtml += '<input class="data-radio form-radio" onchange="'+ f +'(' + id + ',this.checked)" type="checkbox" name="' + name + '" id="' + label + '" />';
     }
     radioHtml += '<label for="' + label + '">';
     radioHtml += '<strong>'+ label + "</strong>";