From 3eb4c922cba32786cbf0b9967d7d9e98296a8f28 Mon Sep 17 00:00:00 2001 From: AndrewCRMartin Date: Wed, 23 Sep 2015 17:17:07 +0100 Subject: [PATCH] Added option to make the sequence labels clickable --- JSAV.css | 2 +- JSAV.js | 57 +++++++++++++++++++++++++++++++++++++++++------------ index3.html | 2 ++ 3 files changed, 47 insertions(+), 14 deletions(-) diff --git a/JSAV.css b/JSAV.css index 5b95e70..92b91a4 100644 --- a/JSAV.css +++ b/JSAV.css @@ -69,7 +69,7 @@ /*** Things the user is LIKELY to want to change ***/ /***********************************************************************/ /* Text colour for the sequence ID labels */ -.JSAV .idCell {color: #333399;} +.JSAV .idCell, .JSAV .idCell a:link, .JSAV .idCell a:visited {color: #333399; } /* Colour for the region marked for sorting */ .JSAV .marked {background-color: #AAAAAA;} /* Colour for regions marked as highlighted with options.highlight */ diff --git a/JSAV.js b/JSAV.js index 190d065..260d7e3 100644 --- a/JSAV.js +++ b/JSAV.js @@ -68,6 +68,7 @@ V1.7 23.09.15 Added options.toggleDotifyLabel Added options.toggleNocolourLabel and options.toggleNocolorLabel Added options.deleteLabel + Added options.idSubmit By: ACRM TODO: @@ -118,6 +119,10 @@ Where 'mySeqDisplay' is the name of a div that will be created @property {int[]} options.highlight - Array of ranges to highlight @property {string} options.submit - URL for submitting selected sequences @property {string} options.submitLabel - Label for submit button +@property {string} options.idSubmit - URL for submitting a single sequence where its + id/label has been clicked +@property {bool} options.idSubmitClean - Remove non-alpha characters from sequence + before submitting @property {string} options.action - Function to call using selected sequences. This is passed the seqId and array of currently selected sequence objects @@ -174,6 +179,7 @@ Where 'mySeqDisplay' is the name of a div that will be created Added toggleNocolourLabel/toggleNocolorLabel Added deleteLabel Move FASTA before submit and action buttons + Added idSubmit and idSubmitClean By: ACRM */ function printJSAV(divId, sequences, options) @@ -296,13 +302,13 @@ function printJSAV(divId, sequences, options) JSAV_modifyCSS(divId); } - // Ensure buttons etc match the data - window.onload = function(){JSAV_refreshSettings(divId);}; + // Ensure buttons etc match the data + window.onload = function(){JSAV_refreshSettings(divId);}; - if(options.callback != undefined) - { - window[options.callback](divId); - } + if(options.callback != undefined) + { + window[options.callback](divId); + } } // --------------------------------------------------------------------- @@ -911,6 +917,9 @@ separate tag with a class to indicate the amino acid type @param {bool} dotify Dotify the sequence @param {bool} nocolour Don't colour dotified residues @param {bool} isConsensus This is the consensus sequence +@param {string} idSubmit URL to visit when sequence label clicked +@param {bool} idSubmitClean Remove non-alpha characters from sequence + before submitting it @returns {string} text HTML snippet @author @@ -918,9 +927,10 @@ separate tag with a class to indicate the amino acid type - 16.06.14 Added dotify and nocolour - now takes prevSequence parameter - 17.06.14 Added isConsensus and colourScheme - 18.06.14 Added tooltip +- 23.09.15 Added idSubmit/idSubmitClean */ function JSAV_buildASequenceHTML(id, sequence, prevSequence, selectable, dotify, nocolour, - isConsensus, colourScheme) + isConsensus, colourScheme, idSubmit, idSubmitClean) { var seqArray = sequence.split(""); var prevSeqArray = undefined; @@ -939,7 +949,23 @@ function JSAV_buildASequenceHTML(id, sequence, prevSequence, selectable, dotify, { tableLine = ""; } - tableLine += "" + id + ""; + + if(idSubmit == null) + { + tableLine += "" + id + ""; + } + else + { + var url = idSubmit; + var submitSeq; + if(idSubmitClean) + { + submitSeq = sequence.replace(/[^A-Za-z]/g, ''); + } + + url += submitSeq; + tableLine += "" + id + ""; + } if(selectable) { @@ -1024,8 +1050,8 @@ i.e. the whole sequence length @param {string} height The height of the slider (text size) @author -- 06.06.14 Original By: ACRM -- 10.06.14 Removed redundant variable and changed divs to spans +- 06.06.14 Original By: ACRM +- 10.06.14 Removed redundant variable and changed divs to spans - 15.06.14 Added height */ function JSAV_printSlider(divId, seqLen, width, height) @@ -1170,13 +1196,18 @@ function JSAV_buildSequencesHTML(divId, sequences, sortable, selectable, highlig if(i>0) { prevSequence = sequences[i-1].sequence; } html += JSAV_buildASequenceHTML(sequences[i].id, sequences[i].sequence, prevSequence, selectable, dotify, nocolour, false, - gOptions[divId].colourScheme) + "\n"; + gOptions[divId].colourScheme, + gOptions[divId].idSubmit, + gOptions[divId].idSubmitClean) + "\n"; } if(consensus != undefined) { - html += JSAV_buildASequenceHTML('Consensus', gConsensus[divId], undefined, selectable, - dotify, nocolour, true, gOptions[divId].colourScheme) + "\n"; + html += JSAV_buildASequenceHTML('Consensus', gConsensus[divId], undefined, + selectable, dotify, nocolour, true, + gOptions[divId].colourScheme, + null, + false) + "\n"; } if(highlight != undefined) diff --git a/index3.html b/index3.html index 9e8485b..f1d8004 100644 --- a/index3.html +++ b/index3.html @@ -87,6 +87,8 @@

JavaScript Sequence Alignment Viewer (JSAV)

MyOptions.selectColour = true; MyOptions.callback = "enableTooltipster"; MyOptions.colourChoices = ["Taylor", "Clustal", "Zappo", "HPhob"]; +MyOptions.idSubmit = "http://www.bioinf.org.uk/cgi-bin/echo.pl?seq="; +MyOptions.idSubmitClean = true; printJSAV('sequenceDisplay', MySeqs, MyOptions);