search.js

// this function executes our search via an AJAX call
function runSearch( term ) {
    // hide and clear the previous results, if any
    $('#results').hide();
//   $('#donutchart').hide();
    $('tbody').empty();
    
    // transforms all the form parameters into a string we can send to the server
    //var frmStr = $('#gene_search').serialize();
    
    var query = $("#search_term").val();
    var queryType = $("#search_type option:selected").val();
    $.ajax({
        url: './search_GeneSymbol.cgi',
        dataType: 'json',
        data:{
                     search_term: query,  
                     search_type: queryType,
                   },
        success: function(data, textStatus, jqXHR) {
            processJSON(data);
        },
        error: function(jqXHR, textStatus, errorThrown){
            alert("Failed to perform gene search! textStatus: (" + textStatus +
                  ") and errorThrown: (" + errorThrown + ")");
        }
    });
}


// this processes a passed JSON structure representing gene matches and draws it
//  to the result table
function processJSON( data ) {
    // set the span that lists the match count
    $('#match_count').text( data.match_count );
   google.charts.load("current", {packages:["corechart"]}); 
    // this will be used to keep track of row identifiers
    var next_row_num = 1;
    var num_Likely_benign =0;
    var num_benign=0;
    var num_uncertain_significance=0;
    var num_Likely_pathogenic=0;
    var num_risk_factor=0;
    for (var i=0; i < data.match_count; i++)
    {
        if (data.matches[i].ClinicalSignificance =="Likely benign") 
             num_Likely_benign +=1;
        else if 
           (data.matches[i].ClinicalSignificance =="Benign")
             num_benign +=1;
        else if
           (data.matches[i].ClinicalSignificance =="Uncertain significance")
             num_uncertain_significance +=1;
        else if
           (data.matches[i].ClinicalSignificance =="Likely pathogenic")
             num_Likely_pathogenic +=1;
        else if
           (data.matches[i].ClinicalSignificance =="risk factor")
             num_risk_factor +=1;
     }
     var pieChartData=google.visualization.arrayToDataTable([
         ['Gene','Pathegenocity'],
         ['Likely benign',num_Likely_benign],
         ['benign',num_benign],
         ['Uncertain significance',num_uncertain_significance],
         ['Likely pathogenic',num_Likely_pathogenic], 
         ['risk factor',num_risk_factor]
      ]);
     var options = {
          title: 'Gene Chart',
          pieHole: 0.4,
        };
     var chart = new google.visualization.PieChart(document.getElementById('donutchart'));
        chart.draw(pieChartData, options);
     
    //$('#donutchart').show();

    // iterate over each match and add a row to the result table for each
    $.each( data.matches, function(i, item) {
        var this_row_id = 'result_row_' + next_row_num++;
    
        // create a row and append it to the body of the table
        $('<tr/>', { "id" : this_row_id } ).appendTo('tbody');
        
        // add the locus column
        $('<td/>', { "text" : item.GeneSymbol } ).appendTo('#' + this_row_id);
        
        // add the locus column
        $('<td/>', { "text" : item.Chromosome } ).appendTo('#' + this_row_id);

        // add the locus column
        $('<td/>', { "text" : item.Start } ).appendTo('#' + this_row_id);

        // add the locus column
        $('<td/>', { "text" : item.Stop } ).appendTo('#' + this_row_id);

        // add the product column
        $('<td/>', { "text" : item.ClinicalSignificance } ).appendTo('#' + this_row_id);

        // add the locus column
        $('<td/>', { "text" : item.PhenotypeList } ).appendTo('#' + this_row_id);

        // add the locus column
        $('<td/>', { "text" : item.RCVaccession } ).appendTo('#' + this_row_id);
    });
    
    // now show the result section that was previously hidden
    $('#results').show();
}



// run our javascript once the page is ready
$(document).ready( function() {
    // define what should happen when a user clicks submit on our search form
    $('#submit').click( function() {
        runSearch();
        return false;  // prevents 'normal' form submission
    });
});