Commit 07726c68 authored by Porter Libby's avatar Porter Libby
Browse files

finish the backbone of readings

parent 0b80f5a4
......@@ -251,26 +251,27 @@ function getReadings(spot_id){
url: '/readings',
data: {spotid: spot_id, sectorid: query_selection[2], siteid: query_selection[1], tripid: query_selection[0]},
success: function(response) {
var streamings = [];
var readings = [];
for(x = 0; x < response.length; x++){
streamings.push(response[x]);
readings.push(response[x]);
}
console.info('DATA - STREAMINGS');
console.info('Loaded ' + streamings.length + " points.");
console.info('DATA - readings');
console.info('Loaded ' + readings.length + " points.");
var color = getRandomColor();
query_data = streamings;
query_data = readings;
createReading(streamings,'test',color);
createPoints([readings[0]], color);
createGraphReading(readings, "DATE", color);
var dataview = document.getElementById("dataView")
dataview.querySelector("#nav-button-graph").classList.add("new_data_button");
dataview.querySelector("#nav-button-map").classList.add("new_data_button");
document.getElementById('reading').innerHTML = "";
document.getElementById('data-prompt').innerHTML = "Loaded "+streamings.length+" points to the graph and map!";
document.getElementById('data-prompt').innerHTML = "Loaded "+readings.length+" points to the graph and map!";
document.getElementById("button_permalink").disabled = false;
document.getElementById("button_csv").disabled = false;
......@@ -365,7 +366,7 @@ function getStreamings(date){
query_data = streamings;
if (streamings.length != 0){
createGraph(streamings,date,color);
createGraphStreaming(streamings,date,color);
createPoints(streamings,color);
var dataview = document.getElementById("dataView")
......@@ -502,14 +503,6 @@ function renderStreamingsDates(dates){
togglediv('#streamingsplatforms-ls','streamingsplatforms-button');
}
}
function createReading(data,title,color){
createPoints([data[0]], color);
for(x=0;x<data.length;x++){
console.log(data[x]);
}
}
/*
Other
......
......@@ -24,7 +24,29 @@ $( document ).ready(function() {
}
});
});
function createGraph(dataset, title,color){
function createGraphReading(dataset, title, color){
//reset containers
document.getElementById('readingStats').style.display = 'block';
document.getElementById('line-chart').style.display = 'none';
//prepare active container
var parent = document.getElementById('readingStats');
parent.innerHTML = "";
//fill with content
for (x=0;x<dataset.length;x++){
console.log(dataset[x]);
var textElem = document.createElement('p');
textElem.innerHTML = dataset[x].sensorid + ": " + dataset[x].value;
parent.append(textElem);
}
}
function createGraphStreaming(dataset, title,color){
// reset some containers
document.getElementById('line-chart').style.display = 'block';
document.getElementById('readingStats').style.display = 'none';
title = ''
times_arr = []; // x axis ticks (timestamps)
data = [[]]; // this array will each set of data (split by sensor)
......@@ -70,6 +92,7 @@ function addData(chart,times,data,types,color,title) {
if (chart){
chart.destroy(); // clear old information so it doesnt overflow
}
chart = new Chart(document.getElementById("line-chart"), { // create new chart structure for streaming data
type: 'scatter',
data: {},
......
......@@ -43,64 +43,47 @@ function switchToData(){
setTimeout(function(){ document.getElementById("loading").style.display = "none"; }, 10);}
// TEAMPLATES FOR DOM PIECES
function createRadioElementTrips( mode, name, checked, label, id ) {
var radioHtml = '<div class="elem-div elem-' + mode + '"><input class="data-radio form-radio" onchange="getSites(' + id + ')" type="radio" name="' + name + '" id="' + label + '"';
if ( checked ) {
radioHtml += ' checked="checked"';
function createRadioElement(name, id, label, f){
console.log(name,id,label);
var radioHtml = '<div class="elem-div elem-0">'
if (typeof id === 'string' || id instanceof String){
radioHtml += '<input class="data-radio form-radio" onchange="'+ f +'(';
radioHtml += "'" + id + "'";
radioHtml +=')" type="radio" name="' + name + '" id="' + label + '" />';
}else{
radioHtml += '<input class="data-radio form-radio" onchange="'+ f +'(' + id + ')" type="radio" name="' + name + '" id="' + label + '" />';
}
radioHtml += '/>';
radioHtml += '<label for="' + label + '"><strong>'+ label + "</strong><span class='detailed_info'> (ID: " + id +')</span></label></div>';
radioHtml += '<label for="' + label + '">';
radioHtml += '<strong>'+ label + "</strong>";
radioHtml += '<span class="detailed_info"> (ID: ' + id +')</span>';
radioHtml += '</label></div>';
return radioHtml;
}
function createRadioElementSites( mode, name, checked, label, siteid ) {
var radioHtml = '<div class="elem-div elem-' + mode + '"><input class="data-radio form-radio" onchange="getSectors('+ siteid + ')" type="radio" name="' + name + '" id="' + label + '"';
if ( checked ) {
radioHtml += ' checked="checked"';
}
radioHtml += '/>';
radioHtml += '<label for="' + label + '"><strong>'+ label +"</strong><span class='detailed_info'> (ID: " + siteid +')</span></label></div>';
return radioHtml;
function createRadioElementTrips( mode, name, checked, label, id ) {
var f = "getSites";
return createRadioElement(name, id, label, f);
}
function createRadioElementSectors( mode, name, checked, label,sectorid ) {
var radioHtml = '<div class="elem-div elem-' + mode + '"><input class="data-radio form-radio" '
// switch for streaming
if (query_type == 1){
radioHtml += 'onchange="getStreamingsPlatforms('+ sectorid + ')"';
}else{
radioHtml += 'onchange="getSpots('+ sectorid + ')"';
}
radioHtml += ' type="radio" name="' + name + '" id="' + label + '"';
if ( checked ) {
radioHtml += ' checked="checked"';
}
radioHtml += '/>';
radioHtml += '<label for="' + label + '"><strong>'+ label +"</strong><span class='detailed_info'> (ID: " + sectorid +')</span></label></div>';
return radioHtml;
function createRadioElementSites( mode, name, checked, label, id ) {
var f = "getSectors";
return createRadioElement(name, id, label, f);
}
function createRadioElementSpots( mode, name, checked, label,spotid ) {
var radioHtml = '<div class="elem-div elem-' + mode + '"><input class="data-radio form-radio" onchange="getReadings('+ spotid + ')" type="radio" name="' + name + '" id="' + label + '"';
if ( checked ) {
radioHtml += ' checked="checked"';
function createRadioElementSectors( mode, name, checked, label, id ) {
var f = "getSpots";
if (query_type == 1){
f = "getStreamingsPlatforms";
}
radioHtml += '/>';
radioHtml += '<label for="' + label + '"><strong>Spot #'+ label +'</strong></label></div>';
return radioHtml;
return createRadioElement(name, id, label, f);
}
function createRadioElementStreamingsPlatforms( mode, name, checked, id,name ) {
var radioHtml = '<div class="elem-div elem-' + mode + '"><input class="data-radio form-radio" onchange="getStreamingsDates('+ "'" +id.toString()+ "'" +')"type="radio" name="' + 'streamingplatforms' + '" id="' + name + '"';
if ( checked ) {
radioHtml += ' checked="checked"';
}
radioHtml += '/>';
radioHtml += '<label for="' + name + '"><strong>'+ name + "</strong><span class='detailed_info'> (ID: " + id + ")" +'</span></label></div>';
function createRadioElementSpots( mode, name, checked, label,id ) {
var f = "getReadings";
return createRadioElement(name, id, label, f);
return radioHtml;
}
function createRadioElementStreamingsPlatforms( mode, name, checked, id, label ) {
var f = "getStreamingsDates";
return createRadioElement(name, id, label, f);
}
function createRadioElementStreamingsDates( mode, name, checked, date ) {
var radioHtml = '<div class="elem-div elem-' + mode + '"><input class="data-radio form-radio" onchange="getStreamings('+ "'" + date + "'" +')"type="radio" name="' + name + '" id="' + date + '"';
......@@ -113,22 +96,12 @@ function createRadioElementStreamingsDates( mode, name, checked, date ) {
return radioHtml;
}
function createRadioElementStreamings( mode, name, checked, label ) {
var radioHtml = '<div class="elem-div elem-' + mode + '"><input class="data-radio form-radio" onclick="displayStreamings(' + "'" + label + "'" + ')" type="radio" name="' + name + '" id="' + label + '"';
if ( checked ) {
radioHtml += ' checked="checked"';
}
radioHtml += '/>';
radioHtml += '<label for="' + label + '"><strong>Set '+ label +'</strong></label></div>';
return radioHtml;
var f = "displayStreamings";
return createRadioElement(name, name, label, f);
}
function createRadioElementReadings( mode, name, checked, label ) {
var radioHtml = '<div class="elem-div elem-' + mode + '"><input class="data-radio form-radio" onclick="displayReadings(' + "'" + label + "'" + ')" type="radio" name="' + name + '" id="' + label + '"';
if ( checked ) {
radioHtml += ' checked="checked"';
}
radioHtml += '/>';
radioHtml += '<label for="' + label + '"><strong>Set '+ label +'</strong></label></div>';
return radioHtml;
var f = "displayReadings";
return createRadioElement(name, label, label, f);
}
function getRandomColor() {
......
......@@ -68,6 +68,7 @@
<div id='graphView'>
<div id='graph'>
<canvas id="line-chart"></canvas>
<div id='readingStats' style='position:absolute;z-index: 10;width: 100%; height: 100%;'></div>
</div>
<div id='navcontrols'>
<div class='tooltip2'>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment