From 73a6e187e7c6bca4111ab1dff9c1440865a9b716 Mon Sep 17 00:00:00 2001 From: Olaotan Lawal Date: Sun, 25 Jun 2023 15:23:32 +0100 Subject: [PATCH] #743 Commit introduce json to geneview --- .../webapp/html/GeneView/summary-legend.js | 32 ++-- .../src/main/webapp/html/css/style.css | 8 +- .../main/webapp/html/javascript/gene-table.js | 179 ++++++------------ 3 files changed, 76 insertions(+), 143 deletions(-) diff --git a/client-base/src/main/webapp/html/GeneView/summary-legend.js b/client-base/src/main/webapp/html/GeneView/summary-legend.js index 16ad6baba..ed969b1eb 100644 --- a/client-base/src/main/webapp/html/GeneView/summary-legend.js +++ b/client-base/src/main/webapp/html/GeneView/summary-legend.js @@ -54,13 +54,15 @@ function filterGeneTableByType ( event, conceptType ) { const rowFilterPred = ( selectedTypes, tableRow ) => { - const rowEvidencesString = tableRow [ 9 ] - if ( !rowEvidencesString ) return false // just in case + const { conceptEvidences } = tableRow + if ( !conceptEvidences ) return false // just in case // Splits the gene evidences string in the gene table into an array of evidences. // See the API for details about this format - const evidenceCountStrings = rowEvidencesString.split ( "||" ) - const rowEvidences = evidenceCountStrings.map ( evStr => evStr.split('__')[ 0 ] ) - return selectedTypes.every ( t => rowEvidences.includes ( t ) ) + let evidences = [] + for(let evidence in conceptEvidences){ + evidences.push(evidence) + } + return selectedTypes.every ( t => evidences.includes ( t ) ) } _filterKnetTableByType ( @@ -72,7 +74,7 @@ function filterGeneTableByType ( event, conceptType ) function filterEvidenceTableByType ( event, conceptType ) { const rowFilterPred = ( selectedTypes, tableRow ) => { - const rowEvidencesString = tableRow [ 0 ] + const rowEvidencesString = tableRow.conceptType return selectedTypes.some ( t => t == rowEvidencesString ) } @@ -82,7 +84,7 @@ function filterEvidenceTableByType ( event, conceptType ) ) } -// function updates, store and checks for non-active legend keys +// function updates, store and checks for non-active legend keys function updateLegendsKeys(key, location, event) { const currentTable = $(`#${location}`) @@ -151,19 +153,9 @@ function toggleKnetTablesDisplay ( displayOn ) // names/variables/objects that manage genes and evidence tables separately, as if there were // TWO instances of them?!? // NEEDS serious review for coherence! - - if ( displayOn ) - { - $('#filterMessage').hide(); - $('#tablesorter').show(); - $('.num-genes-container').show(); - return - } - - // else, turn it off - $('#tablesorter').hide() - $('#filterMessage').show(); - $('.num-genes-container').hide(); + $('#filterMessage').toggleClass('show-block',!displayOn); + $('.num-genes-container').toggleClass('show-block',displayOn); + $('#tablesorter').toggleClass('hide',!displayOn); } diff --git a/client-base/src/main/webapp/html/css/style.css b/client-base/src/main/webapp/html/css/style.css index a41a84a5d..9b0ad09ce 100644 --- a/client-base/src/main/webapp/html/css/style.css +++ b/client-base/src/main/webapp/html/css/style.css @@ -2770,9 +2770,15 @@ background-color:#EEF0F3; color: #C0C0C0; } -.show{ +.show-flex{ display: flex; } +.hide{ + display: none; +} +.show-block{ + display: block; +} .limit-border{ border-color: red; diff --git a/client-base/src/main/webapp/html/javascript/gene-table.js b/client-base/src/main/webapp/html/javascript/gene-table.js index 05f60dcc3..b599aab7b 100644 --- a/client-base/src/main/webapp/html/javascript/gene-table.js +++ b/client-base/src/main/webapp/html/javascript/gene-table.js @@ -116,18 +116,18 @@ function createGenesTable ( tableData, keyword ) var numResults = tableData.length; var targetClass = $(this).hasClass('checked') - for (var i = 1; i < numResults; i++) { - var values = e.data.x[i]; + for (var i = 0; i < numResults; i++) { + var {isUserGene, conceptEvidences} = e.data.x[i]; - if (values[7] === "yes") { + + if (isUserGene) { // Check which input buttons are selected. - if ($(this).val() === "Linked Genes") { // Select Known Targets. - if (values[9].length > 0) { - $("#checkboxGene_" + i + ":visible").prop('checked', !targetClass); - } - } - else if ($(this).val() === "Unlinked Genes") { // Select Novel Targets. - if (values[9].length === 0) { + // Select Known Targets. + if (conceptEvidences && ($(this).val() === "Linked Genes") ) $("#checkboxGene_" + i + ":visible").prop('checked', !targetClass); + + + if ($(this).val() === "Unlinked Genes") { // Select Novel Targets. + if (!conceptEvidences) { $("#checkboxGene_" + i + ":visible").prop('checked', !targetClass); } } @@ -281,7 +281,7 @@ function generateMultiGeneNetwork_forNewNetworkViewer(keyword) { // update selected genes count whenever a Gene View or evidence table entry is clicked or Known/ Novel targets options in gene view are selected. // Arne 18/01/23 added viewName which requests a name (probably either Term or Gene). function updateSelectedGenesCount(inputName, countContainer, viewName) { - var count = returnCheckInputCount(inputName); + var count = knetTableUserCountSize(inputName); var viewCount = count > 1 ? viewName + 's' : viewName // >1 testing $('' + countContainer + ' span').text(count + ' ' + viewCount + ' selected'); // update $(countContainer).next().toggleClass('non-active', count < 1); @@ -302,7 +302,7 @@ function updateSelectedGenesCount(inputName, countContainer, viewName) { * (or *Count, but count is more coomonly used for a count that is updated during a loop or alike). * */ -function returnCheckInputCount ( inputName ) +function knetTableUserCountSize ( inputName ) { return $('input:checkbox[name=' + inputName + ']:checked').length } @@ -373,121 +373,74 @@ function createGeneTableBody ( tableData, doAppend = false ) // Main loop over the resulting genes. for (var row = fromRow; row < toRow; row++) - { - var [geneId, geneAccessions,geneName,chr,chrStart,taxId,score,,withinQTLs,evidence ] = tableData[row] + { + var {ondexId, accession,chromosome, conceptEvidences, geneBeginBP,name,score} = tableData[row]; + // var [geneId, geneAccessions,geneName,chr,chrStart,taxId,score,,withinQTLs,evidence ]= tableData[row] // if (row > rows /*&& values[7]=="no"*/) continue; table += ''; - var upperCasedAccessions = geneAccessions.toUpperCase(); // always display gene ACCESSION in uppercase + var upperCasedAccessions = accession.toUpperCase(); // always display gene ACCESSION in uppercase var geneAccNorm = upperCasedAccessions.replace(".", "_"); // Gene accession - var geneTd = `${upperCasedAccessions}`; + var geneTd = `${upperCasedAccessions}`; - var geneNameTd = geneName.toUpperCase() == geneAccessions + var geneNameTd = name.toUpperCase() == accession // In this case, the API has found one accession only as name, so we're sure we don't have synonyms to expand ? '' // else, gene name column, with synonym expansion - : '' + geneName + '
'; - - var taxIdTd = '' + taxId + ''; + : '' + name + '
'; // Currently not shown - var scoreTd = '' + score + ''; + var scoreTd = '' + Number(score).toFixed(2) + ''; var chrTd = ''; var chrStartTd = ''; - var chrTd = '' + chr + ''; - var chrStartTd = '' + chrStart + ''; - - // QTL column with information box - var qtlTd = ''; - if (withinQTLs.length > 1) { - var withinQTLs = withinQTLs.split("||"); - //Shows the icons - qtlTd = '
' + withinQTLs.length + ''; - - //Builds the evidence box - qtlTd += '
'; - qtlTd += '

' + "QTLs" + '

'; - - var uniqueQTLs = new Object(); - var uniqueTraits = new Object(); - - for (var iqtl = 0; iqtl < withinQTLs.length; iqtl++) { - var withinQTLElems = withinQTLs[iqtl].split("//"); - if (withinQTLElems[1].length > 0) { - if (uniqueTraits[withinQTLElems[1]] == null) - uniqueTraits[withinQTLElems[1]] = 1; - else - uniqueTraits[withinQTLElems[1]]++; - } - else { - if (uniqueQTLs[withinQTLElems[0]] == null) - uniqueQTLs[withinQTLElems[0]] = 1; - else - uniqueQTLs[withinQTLElems[0]]++; - } - } + var chrTd = '' + chromosome + ''; + var chrStartTd = '' + geneBeginBP + ''; - var unique = ""; - for (var iqtl = 0; iqtl < withinQTLs.length; iqtl++) { - var withinQTLElems = withinQTLs[iqtl].split("//"); - if (withinQTLElems[1].length > 0) { - if (unique.indexOf(withinQTLElems[1] + ";") == -1) { - unique += withinQTLElems[1] + ";"; - qtlTd += '

' + uniqueTraits[withinQTLElems[1]] + ' ' + withinQTLElems[1] + '

'; - } - } - else { - if (unique.indexOf(withinQTLElems[0] + ";") == -1) { - unique = unique + withinQTLElems[0] + ";"; - qtlTd += '

' + uniqueQTLs[withinQTLElems[0]] + ' ' + withinQTLElems[0] + '

'; - } - } - } - } // if ( withinQTLs.length ) - qtlTd += ''; // For each evidence show the images - start var evidenceTd = '
'; - if (evidence.length > 0) { - var evidences = evidence.split("||"); - for (var iev = 0; iev < evidences.length; iev++) { - //Shows the icons - var evidenceElems = evidences[iev].split("__"); - - var evidenceCC = evidenceElems[0]; - var evidenceSize = evidenceElems[1]; - var evidenceNodes = evidenceElems[2].split("//"); - evidenceTd += '
'; + + } + // for iev + + + } // if evidence.length evidenceTd += '
'; // Foreach evidence show the images - end - var selectTd = ``; - table += geneTd + geneNameTd + /*taxIdTd +*/ chrTd + chrStartTd + evidenceTd + /*usersList +*/ /*qtlTd +*/ scoreTd + selectTd; + var selectTd = ``; + table += geneTd + geneNameTd + /*taxIdTd +*/ chrTd + chrStartTd + evidenceTd + scoreTd + selectTd; table += ''; }// for row @@ -530,41 +483,23 @@ function createGeneTableBody ( tableData, doAppend = false ) function getInteractiveSummaryLegend(geneViewData) { var evidencesArr= new Array(); - for(var i=1; i < geneViewData.length; i++) { - var evi_value= geneViewData[i][9].trim(); - if(evi_value !== "") { - evidencesArr.push(evi_value); - } - } - - var con_legend= new Map(); - // Iterate through evidences and get counts for each evidence Concept Type. - evidencesArr.forEach(function(evi) { - var row_values= evi.trim().split("||"); - row_values.forEach(function(rv) { - var conType= rv.trim().split("__")[0].trim(); - var conCount= Number(rv.trim().split("__")[1].trim()); - // check/add unique concept types to Map - if(con_legend.has(conType)) { - // update if this count is greater than old, stored count - var old_count= con_legend.get(conType); - if(Number(conCount) > Number(old_count)) { con_legend.set(conType, conCount); } - } - else { // add new conType to Map - con_legend.set(conType, conCount); - } - }); - }); + + geneViewData.forEach((geneData) => { + var key = Object.keys(geneData.conceptEvidences)[0]; + if (!evidencesArr.includes(key)) evidencesArr.push(key) + }) + // Display evidence icons with count and name in legend. - //var legend= '
'+ '
'; + var legend= '
'; var summaryText = ''; - con_legend.forEach(function(value, key, map) + evidencesArr.forEach(function(evidence) { - var contype= key.trim(); - + var key = evidence + var contype= key.trim(); + summaryText += `