table.js

"use strict";
var ticktext = require('./ticks.js');
var utils = require('./utils.js');

/* 
 * Build a table in the specified div with a row for each trace in plotsInfo
 * Stores metadata for each trace using $.data, which is retrieved
 * and used by requestTableUpdate
 */
function initTable(div_id, plotOrder, plotsInfo) {
    var div = $('#'+div_id);
    var table = $('<table class="met_table text-left" align="center"><tbody></tbody></table>');
    var tbody = table.children('tbody');

    var plot_info;
    var plot_key;
    for (var plot_idx=0; plot_idx < plotOrder.length; plot_idx++) {
        plot_key = plotOrder[plot_idx];
        plot_info = plotsInfo.plots[plot_key];
        //extract the necessary variables
        for (var trace_info_idx=0; trace_info_idx < plot_info.traces.length; trace_info_idx++) {
            var trace_info = plot_info.traces[trace_info_idx];
            if(trace_info.type=='contour'){
                add_contour_rows(tbody,plot_key,trace_info_idx,trace_info,plot_info);
            }else{
                var info_td = $('<td>N/A</td>');
                info_td.addClass('met_data');
                info_td.data('info', {key:plot_key,idx:trace_info_idx});
                var row = $('<tr></tr>');
                var name = trace_info.short_name || trace_info.name;
                if (name == 'Wind Direction Card') {
                    continue
                }
                row.append('<td>'+name+'</td>');
                row.append(info_td);
                row.append('<td class="convert"></td>');
                tbody.append(row);
                //add rows for our ancillary variables that normally only show up in tags
                if(trace_info.anc_variables)
                    add_anc_rows(tbody,plot_key,trace_info_idx,trace_info);
            }
        };
    }
    div.append('<h3 style="text-align:center">'+plotsInfo.title+'</h3>');
    div.append(table);
    div.append('<span id="timestamp" style="text-align:center"></span>');
};

function add_anc_rows(tbody,plot_key,idx,trace_info){
    for(var anc_info_idx = 0; anc_info_idx < trace_info.anc_variables.length; anc_info_idx++){
        var anc_info = trace_info.anc_info[trace_info.anc_variables[anc_info_idx]];
        var info_td = $('<td>N/A</td>');
        info_td.addClass('met_data');
        info_td.data('info', {key:plot_key,idx:idx,anc_idx:anc_info_idx});
        var row = $('<tr></tr>');
        var name = anc_info.short_name || anc_info.name;
        row.append('<td>'+name+'</td>');
        row.append(info_td);
        row.append('<td class="convert"></td>');
        tbody.append(row);
    }

}

function add_contour_rows(tbody,plot_key,idx,trace_info,plot_info){
    var name = trace_info.short_name||trace_info.name;
    var title_row=('<tr><td colspan="2">'+name+'</td><td></td>');
    tbody.append(title_row);
    for(var hightlight_idx = 0;hightlight_idx< trace_info.y_highlight.length;hightlight_idx++){
        var hightlight_idx_idx = trace_info.y_highlight[hightlight_idx];
        var row = $('<tr></tr>');
        var name = trace_info.y[hightlight_idx_idx] + plot_info.yaxis.units;
        row.append('<td class="subtitle text-center">'+name+'</td>');
        var info_td = $('<td>N/A</td>');
        info_td.addClass('met_data');
        info_td.data('info', {key:plot_key,idx:idx,hl_idx:hightlight_idx_idx});
        row.append(info_td);
        row.append('<td class="convert"></td>');
        tbody.append(row);
    }

}

/*
 * Build a datastream request from the data tags in div_id's existing meteorogram table,
 * then add labels and alternate units based on the axes objects in plotsInfo
 */
function requestTableUpdate(div_id,plotsInfo) {
    var div = $('#'+div_id);
    var varNames = [];
    var plotOrder = [];
    var data_cells = $('#'+div_id+' .met_data');
    var convert_cells = $('#'+div_id+' .convert');
    var varName;
    data_cells.each(function(){
            var key = $(this).data('info').key;
            var trace_idx = $(this).data('info').idx;
            var anc_idx = $(this).data('info').anc_idx;
            var hl_idx = $(this).data('info').hl_idx;
            var trace = plotsInfo.plots[key].traces[trace_idx];
            if(plotOrder.indexOf(key)==-1)
                plotOrder.push(key);
            if(anc_idx !== undefined)
                varName = trace.anc_variables[0];
            else if(hl_idx !== undefined)
                varName = trace.var_names[hl_idx];
            else
                varName = trace.var_names[0];
            if (!varNames.includes(varName))
                varNames.push(varName);
    });
    var stream_string = varNames.join(':'); 
    //Use a set time that has both buoy and tower records for testing
    var url = utils.buildRequestUrl('json', '1m', '', '', 'column', '&begin=-00:04:00', stream_string);
    $.ajax({
            type: 'GET',
            url: url,
            jsonp: "callback",
            dataType: "jsonp",
            success: function(dataObj){
                dataObj.div_id = div_id;
                dataObj.plotOrder = plotOrder;
                dataObj.data_cells = data_cells;
                dataObj.convert_cells = convert_cells;
                updateTable(dataObj,plotsInfo);
            }
    });
}

function updateTable(dataObj,plotsInfo) {
    var data = dataObj.results.data;
    var plot_info;
    var plot_key;
    var td_idx = 0;
    var div_id = dataObj.div_id;
    var plotOrder = dataObj.plotOrder;
    var data_cells = dataObj.data_cells;
    var convert_cells = dataObj.convert_cells;
    if(dataObj.num_results==0){
        $('#'+div_id+' #timestamp').html('No recent data');
        return;
    }
    $('#'+div_id+' #timestamp').html('Last updated: '+ dataObj.results.timestamps[0]);
    for (var plot_idx=0; plot_idx < plotOrder.length; plot_idx++) {
        plot_key = plotOrder[plot_idx];
        plot_info = plotsInfo.plots[plot_key];
        //Fill in a row for each trace in the plot
        for (var trace_info_idx=0; trace_info_idx < plot_info.traces.length; trace_info_idx++) {
            var trace_info = plot_info.traces[trace_info_idx];
            if (trace_info.name == 'Wind Direction Card') {
                continue
            }
            if (trace_info.type=='contour') {
                td_idx=update_contour_cells(data,data_cells,convert_cells,trace_info,td_idx);
            } else {
                ticktext.preConvertValue(data[trace_info['var_names'][0]], plot_info.yaxis);
                var update_val = data[trace_info['var_names'][0]][0];
                if(update_val || update_val==0){
                    var units = plot_info.yaxis.units;
                    var convert = '';
                    var old_precision = plot_info.yaxis.precision;
                    plot_info.yaxis.precision=Math.min(old_precision,1);
                    var orig_val = ticktext.getTickText([update_val],plot_info.yaxis);
                    plot_info.yaxis.precision = old_precision;
                    if(plot_info.yaxis2 && plot_info.yaxis2.convert_value != plot_info.yaxis.convert_value){
                        var convert_units = plot_info.yaxis2.units;
                        var old_precision = plot_info.yaxis2.precision;
                        plot_info.yaxis2.precision= Math.min(old_precision,1);
                        var convert_val = ticktext.getTickText([update_val],plot_info.yaxis2);
                        plot_info.yaxis2.precision = old_precision;
                        convert = convert_val+convert_units;
                    }
                    data_cells[td_idx].innerHTML=orig_val+units;
                    convert_cells[td_idx].innerHTML=convert;
                } else {
                    data_cells[td_idx].innerHTML='N/A';
                    convert_cells[td_idx].innerHTML='';
                }
                td_idx+=1;
                //Fill in a row for each anc_var in the plot
                if (trace_info.anc_variables) {
                    td_idx=update_anc_cells(data,data_cells,trace_info,td_idx);
                }
            }
        }
    }
}


function update_contour_cells(data,data_cells,convert_cells,trace_info,td_idx){
    for(var hightlight_idx = 0;hightlight_idx< trace_info.y_highlight.length;hightlight_idx++){
        var hightlight_idx_idx = trace_info.y_highlight[hightlight_idx];
        var update_val = data[trace_info['var_names'][hightlight_idx_idx]][0];
        var units = trace_info.zprobe.units;
        var orig_val = ticktext.getTickText([update_val],trace_info.zprobe);
        var convert = '';
        if(trace_info.zprobe2 && trace_info.zprobe2.convert_value){
            var convert_units = trace_info.zprobe2.units;
            var convert_val = ticktext.getTickText([update_val],trace_info.zprobe2);
            convert = convert_val+convert_units;
        }
        data_cells[td_idx].innerHTML=orig_val+units;
        convert_cells[td_idx].innerHTML=convert;
        td_idx+=1;
    }
    return td_idx;
}

function update_anc_cells(data,data_cells,trace_info,td_idx){
    for(var anc_info_idx = 0; anc_info_idx < trace_info.anc_variables.length; anc_info_idx++){
        var anc_key = trace_info.anc_variables[anc_info_idx];
        var anc_info = trace_info.anc_info[anc_key];
        var update_val = data[anc_key][0];
        var orig_val = ticktext.getTickText([update_val],anc_info);
        if(update_val || update_val==0)
            data_cells[td_idx].innerHTML=orig_val+anc_info.units;
        else
            data_cells[td_idx].innerHTML='N/A';
        td_idx+=1;
    }
    return td_idx;
}
module.exports.initTable = initTable; 
module.exports.requestTableUpdate = requestTableUpdate;