
var draw_data = function() {
    getFullPanel(0, 0, 4, 4, "tab-page-data_capture", "sec-data-1", "FLOW PULSE VS STEPS OPEN VS PRESSURE", "", "VER 1.0");
    var panel = document.getElementById("sec-data-1");
    panel.innerHTML += '<div style="height:250px; width: 100%; float:left;" id="device-medlinechart-1"></div>';
    var row = '<td><div class="ai-cell ai-cell-danger" id="capture-data-1" onclick="CaptureData(1);">CAPTURE DATA</div></td>';
    var rows = getInfoRow(row);
    var html = getTabel(rows);
    panel.innerHTML += html;
    
    getFullPanel(5, 0, 4, 4, "tab-page-data_capture", "sec-data-2", "FLOW RATE VS STEPS OPEN VS PRESSURE", "", "VER 1.0");
    var panel = document.getElementById("sec-data-2");
    panel.innerHTML += '<div style="height:250px; width: 100%; float:left;" id="device-medlinechart-2"></div>';
    row = '<td><div class="ai-cell ai-cell-danger" id="capture-data-2" onclick="CaptureData(2);">START</div></td>';
    rows = getInfoRow(row);
    html = getTabel(rows);
    panel.innerHTML += html;
    
    getFullPanel(0, 4, 4, 4, "tab-page-data_capture", "sec-data-3", "RPM VS PWM VS PRESSURE", "", "VER 1.0");
    var panel = document.getElementById("sec-data-3");
    panel.innerHTML += '<div style="height:250px; width: 100%; float:left;" id="device-medlinechart-3"></div>';
    row = '<td><div class="ai-cell ai-cell-danger" id="capture-data-3" onclick="CaptureData(3);">START</div></td>';
    rows = getInfoRow(row);
    html = getTabel(rows);
    panel.innerHTML += html;
    
    getFullPanel(5, 4, 4, 4, "tab-page-data_capture", "sec-data-4", "RPM VS FLOW TARGET VS PRESSURE", "", "VER 1.0");
    var panel = document.getElementById("sec-data-4");
    panel.innerHTML += '<div style="height:250px; width: 100%; float:left;" id="device-medlinechart-4"></div>';
    row = '<td><div class="ai-cell ai-cell-danger" id="capture-data-4" onclick="CaptureData(4);">START</div></td>';
    rows = getInfoRow(row);
    html = getTabel(rows);
    panel.innerHTML += html;
}

draw_data();

var CaptureData = function(id)
{
    var classs = document.getElementById("capture-data-" + id).className;
    if (classs == "ai-cell ai-cell-success") {
        document.getElementById("capture-data-" + id).className = "ai-cell ai-cell-danger";
    } else {
        document.getElementById("capture-data-" + id).className = "ai-cell ai-cell-success";
    }
}