<html>
-<head>
-<style>
-.biojs_msa_stage {
- cursor: default;
- line-height: normal; }
-
-.biojs_msa_labels {
- color: black;
- display: inline-block;
- white-space: nowrap;
- cursor: pointer;
- vertical-align: top; }
-
-.biojs_msa_seqblock {
- cursor: move; }
-
-.biojs_msa_layer {
- display: block;
- white-space: nowrap; }
-
-.biojs_msa_labelblock::-webkit-scrollbar, .biojs_msa_header::-webkit-scrollbar {
- -webkit-appearance: none;
- width: 7px;
- height: 7px; }
-
-.biojs_msa_labelblock::-webkit-scrollbar-thumb, .biojs_msa_header::-webkit-scrollbar-thumb {
- border-radius: 4px;
- background-color: rgba(0, 0, 0, 0.5);
- box-shadow: 0 0 1px rgba(255, 255, 255, 0.5); }
-
-.biojs_msa_marker {
- color: grey;
- white-space: nowrap;
- cursor: pointer; }
-
-.biojs_msa_marker span {
- text-align: center; }
-
-.biojs_msa_menubar .biojs_msa_menubar_alink {
- background: #3498db;
- background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
- background-image: -moz-linear-gradient(top, #3498db, #2980b9);
- background-image: -ms-linear-gradient(top, #3498db, #2980b9);
- background-image: -o-linear-gradient(top, #3498db, #2980b9);
- background-image: linear-gradient(to bottom, #3498db, #2980b9);
- -webkit-border-radius: 28;
- -moz-border-radius: 28;
- border-radius: 28px;
- font-family: Arial;
- color: #ffffff;
- padding: 3px 10px 3px 10px;
- margin-left: 10px;
- text-decoration: none; }
-
-.biojs_msa_menubar .biojs_msa_menubar_alink:hover {
- cursor: pointer; }
-
-/* jquery dropdown CSS */
-.dropdown {
- position: absolute;
- z-index: 9999999;
- display: none; }
-
-.dropdown .dropdown-menu,
-.dropdown .dropdown-panel {
- min-width: 160px;
- max-width: 360px;
- list-style: none;
- background: #FFF;
- border: solid 1px #DDD;
- border: solid 1px rgba(0, 0, 0, 0.2);
- border-radius: 6px;
- box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
- overflow: visible;
- padding: 4px 0;
- margin: 0; }
-
-.dropdown .dropdown-panel {
- padding: 10px; }
-
-.dropdown.dropdown-scroll .dropdown-menu,
-.dropdown.dropdown-scroll .dropdown-panel {
- max-height: 358px;
- overflow: auto; }
-
-.dropdown .dropdown-menu LI {
- list-style: none;
- padding: 0 0;
- margin: 0;
- line-height: 18px; }
-
-.dropdown .dropdown-menu LI,
-.dropdown .dropdown-menu LABEL {
- display: block;
- color: #555;
- text-decoration: none;
- line-height: 18px;
- padding: 3px 15px;
- white-space: nowrap; }
-
-.dropdown .dropdown-menu LI:hover,
-.dropdown .dropdown-menu LABEL:hover {
- background-color: #08C;
- color: #FFF;
- cursor: pointer; }
-
-.dropdown .dropdown-menu .dropdown-divider {
- font-size: 1px;
- border-top: solid 1px #E5E5E5;
- padding: 0;
- margin: 5px 0; }
-</style>
-</head>
+<!--
+ * Jalview - A Sequence Alignment Editor and Viewer ($$Version-Rel$$)
+ * Copyright (C) $$Year-Rel$$ The Jalview Authors
+ *
+ * This file is part of Jalview.
+ *
+ * Jalview is free software: you can redistribute it and/or
+ * modify it under the terms of the GNU General Public License
+ * as published by the Free Software Foundation, either version 3
+ * of the License, or (at your option) any later version.
+ *
+ * Jalview is distributed in the hope that it will be useful, but
+ * WITHOUT ANY WARRANTY; without even the implied warranty
+ * of MERCHANTABILITY or FITNESS FOR A PARTICULAR
+ * PURPOSE. See the GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with Jalview. If not, see <http://www.gnu.org/licenses/>.
+ * The Jalview Authors are detailed in the 'AUTHORS' file.
+ -->
<header><title>BioJS viewer</title></header>
<body>
<!-- include MSA js + css -->
<!-- <script src="https://s3-eu-west-1.amazonaws.com/biojs/msa/latest/msa.js"></script> -->
<!-- <link type=text/css rel=stylesheet href=https://s3-eu-west-1.amazonaws.com/biojs/msa/latest/msa.css /> -->
-
-
-<div id="menuDiv"></div>
-<div id="yourDiv">press "Run with JS"</div>
-<input type='hidden' id='seqData' name='seqData' value='[{"id":"1","name":"FER_CAPAA/1-97","seq":"----------------------------------------------------------ASYKVKLITPDGPIEFDCPDDVYILDQAEEAGHDLPYSCRAGSCSSCAGKIAGGAVDQTDGNFLDDDQLEEGWVLTCVAYPQSDVTIETHKEAELVG-"},{"id":"2","name":"FER_CAPAN/1-144","seq":"------MASVSATMISTSFMPRKPAVTSLKPIP-NVG-EALFGLKS---ANGGKVTCMASYKVKLITPDGPIEFDCPDNVYILDQAEEAGHDLPYSCRAGSCSSCAGKIAGGAVDQTDGNFLDDDQLEEGWVLTCVAYPQSDVTIETHKEAELVG-"},{"id":"3","name":"FER1_SOLLC/1-144","seq":"------MASISGTMISTSFLPRKPAVTSLKAIS-NVG-EALFGLKS---GRNGRITCMASYKVKLITPEGPIEFECPDDVYILDQAEEEGHDLPYSCRAGSCSSCAGKVTAGSVDQSDGNFLDEDQEAAGFVLTCVAYPKGDVTIETHKEEELTA-"},{"id":"4","name":"Q93XJ9_SOLTU/1-144","seq":"------MASISGTMISTSFLPRKPVVTSLKAIS-NVG-EALFGLKS---GRNGRITCMASYKVKLITPDGPIEFECPDDVYILDQAEEEGHDLPYSCRAGSCSSCAGKVTAGTVDQSDGKFLDDDQEAAGFVLTCVAYPKCDVTIETHKEEELTA-"},{"id":"5","name":"FER1_PEA/1-149","seq":"---MATTPALYGTAVSTSFLRTQPMPMSVTTTKAFSN--GFLGLKT-SLKRGDLAVAMASYKVKLVTPDGTQEFECPSDVYILDHAEEVGIDLPYSCRAGSCSSCAGKVVGGEVDQSDGSFLDDEQIEAGFVLTCVAYPTSDVVIETHKEEDLTA-"},{"id":"6","name":"Q7XA98_TRIPR/1-152","seq":"---MATTPALYGTAVSTSFMRRQPVPMSVATTTTTKAFPSGFGLKSVSTKRGDLAVAMATYKVKLITPEGPQEFDCPDDVYILDHAEEVGIELPYSCRAGSCSSCAGKVVNGNVNQEDGSFLDDEQIEGGWVLTCVAFPTSDVTIETHKEEELTA-"},{"id":"7","name":"FER1_MESCR/1-148","seq":"--MAATTAALSGATMSTAFAPKT--PPMTAALPTNVG-RALFGLKS--SASRGRVTAMAAYKVTLVTPEGKQELECPDDVYILDAAEEAGIDLPYSCRAGSCSSCAGKVTSGSVNQDDGSFLDDDQIKEGWVLTCVAYPTGDVTIETHKEEELTA-"},{"id":"8","name":"FER1_SPIOL/1-147","seq":"----MAATTTTMMGMATTFVPKPQAPPMMAALPSNTG-RSLFGLKT--GSRGGRMT-MAAYKVTLVTPTGNVEFQCPDDVYILDAAEEEGIDLPYSCRAGSCSSCAGKLKTGSLNQDDQSFLDDDQIDEGWVLTCAAYPVSDVTIETHKEEELTA-"},{"id":"9","name":"FER3_RAPSA/1-96","seq":"----------------------------------------------------------ATYKVKFITPEGEQEVECDDDVYVLDAAEEAGIDLPYSCRAGSCSSCAGKVVSGSVDQSDQSFLDDDQIAEGFVLTCAAYPTSDVTIETHREEDMV--"},{"id":"10","name":"FER1_ARATH/1-148","seq":"----MASTALSSAIVGTSFIRRSPAPISLRSLPSANT-QSLFGLKS-GTARGGRVTAMATYKVKFITPEGELEVECDDDVYVLDAAEEAGIDLPYSCRAGSCSSCAGKVVSGSVDQSDQSFLDDEQIGEGFVLTCAAYPTSDVTIETHKEEDIV--"},{"id":"11","name":"FER_BRANA/1-96","seq":"----------------------------------------------------------ATYKVKFITPEGEQEVECDDDVYVLDAAEEAGIDLPYSCRAGSCSSCAGKVVSGFVDQSDESFLDDDQIAEGFVLTCAAYPTSDVTIETHKEEELV--"},{"id":"12","name":"FER2_ARATH/1-148","seq":"----MASTALSSAIVSTSFLRRQQTPISLRSLPFANT-QSLFGLKS-STARGGRVTAMATYKVKFITPEGEQEVECEEDVYVLDAAEEAGLDLPYSCRAGSCSSCAGKVVSGSIDQSDQSFLDDEQMSEGYVLTCVAYPTSDVVIETHKEEAIM--"},{"id":"13","name":"Q93Z60_ARATH/1-118","seq":"----MASTALSSAIVSTSFLRRQQTPISLRSLPFANT-QSLFGLKS-STARGGRVTAMATYKVKFITPEGEQEVECEEDVYVLDAAEEAGLDLPYSCRAGSCSSCAGKVVSGSIDQSDQSFLDD--------------------------------"},{"id":"14","name":"FER1_MAIZE/1-150","seq":"MATVLGSPRAPAFFFSSSSLRAAPAPTAVALPAAKVG---IMGRSA---SSRRRLRAQATYNVKLITPEGEVELQVPDDVYILDQAEEDGIDLPYSCRAGSCSSCAGKVVSGSVDQSDQSYLDDGQIADGWVLTCHAYPTSDVVIETHKEEELTGA"},{"id":"15","name":"O80429_MAIZE/1-140","seq":"---------MAATALSMSILRAPP-PCFSSPLRLRVAVAKPLAAPM----RRQLLRAQATYNVKLITPEGEVELQVPDDVYILDFAEEEGIDLPFSCRAGSCSSCAGKVVSGSVDQSDQSFLNDNQVADGWVLTCAAYPTSDVVIETHKEDDLL--"}]'/>
-</br>
-</br>
-<div> This html page was generated from Jalview, to import the data back to Jalview, please drag the generated html file and drop it unto the Jalview workbench.<div>
-</br>
-<div> Alternatively, you could copy the url from the address bar and use Jalview's url importer (main menu-> File-> Input Alignment-> from URL) to import back the alignment jalview.
+
+ <img src="http://www.jalview.org/help/html/Jalview_Logo.png" alt="Jalview Logo" title="This html page was generated from Jalview, to import the data back to Jalview, please drag the generated html file and drop it unto the Jalview workbench.
+
+ Alternatively, you could copy the url from the address bar and use Jalview's url importer (main menu-> File-> Input Alignment-> from URL) to import back the alignment jalview." >
+
</br>
</br>
+<input type="button" name="divToggleButton" id="divToggleButton" onclick="javascipt:toggleMenuVisibility();" value="Show Menu"></input>
<button onclick="javascipt:openJalviewUsingCurrentUrl();">Launch in Jalview</button>
+</br>
+</br>
+
+<div id="yourDiv">press "Run with JS"</div>
+<input type='hidden' id='seqData' name='seqData' value='{"globalColorScheme":"zappo","seqs":[{"id":"1","start":1,"name":"FER_CAPAA/1-97","seq":"----------------------------------------------------------ASYKVKLITPDGPIEFDCPDDVYILDQAEEAGHDLPYSCRAGSCSSCAGKIAGGAVDQTDGNFLDDDQLEEGWVLTCVAYPQSDVTIETHKEAELVG-","features":[],"end":97},{"id":"2","start":1,"name":"FER_CAPAN/1-144","seq":"------MASVSATMISTSFMPRKPAVTSLKPIP-NVG-EALFGLKS---ANGGKVTCMASYKVKLITPDGPIEFDCPDNVYILDQAEEAGHDLPYSCRAGSCSSCAGKIAGGAVDQTDGNFLDDDQLEEGWVLTCVAYPQSDVTIETHKEAELVG-","features":[{"text":"feature_1","xEnd":46,"fillColor":"#8c25cd","xStart":16}],"end":144},{"id":"3","start":1,"name":"FER1_SOLLC/1-144","seq":"------MASISGTMISTSFLPRKPAVTSLKAIS-NVG-EALFGLKS---GRNGRITCMASYKVKLITPEGPIEFECPDDVYILDQAEEEGHDLPYSCRAGSCSSCAGKVTAGSVDQSDGNFLDEDQEAAGFVLTCVAYPKGDVTIETHKEEELTA-","features":[],"end":144},{"id":"4","start":1,"name":"Q93XJ9_SOLTU/1-144","seq":"------MASISGTMISTSFLPRKPVVTSLKAIS-NVG-EALFGLKS---GRNGRITCMASYKVKLITPDGPIEFECPDDVYILDQAEEEGHDLPYSCRAGSCSSCAGKVTAGTVDQSDGKFLDDDQEAAGFVLTCVAYPKCDVTIETHKEEELTA-","features":[],"end":144},{"id":"5","start":1,"name":"FER1_PEA/1-149","seq":"---MATTPALYGTAVSTSFLRTQPMPMSVTTTKAFSN--GFLGLKT-SLKRGDLAVAMASYKVKLVTPDGTQEFECPSDVYILDHAEEVGIDLPYSCRAGSCSSCAGKVVGGEVDQSDGSFLDDEQIEAGFVLTCVAYPTSDVVIETHKEEDLTA-","features":[],"end":149},{"id":"6","start":1,"name":"Q7XA98_TRIPR/1-152","seq":"---MATTPALYGTAVSTSFMRRQPVPMSVATTTTTKAFPSGFGLKSVSTKRGDLAVAMATYKVKLITPEGPQEFDCPDDVYILDHAEEVGIELPYSCRAGSCSSCAGKVVNGNVNQEDGSFLDDEQIEGGWVLTCVAFPTSDVTIETHKEEELTA-","features":[{"text":"feature_2","xEnd":24,"fillColor":"#0000cc","xStart":8}],"end":152},{"id":"7","start":1,"name":"FER1_MESCR/1-148","seq":"--MAATTAALSGATMSTAFAPKT--PPMTAALPTNVG-RALFGLKS--SASRGRVTAMAAYKVTLVTPEGKQELECPDDVYILDAAEEAGIDLPYSCRAGSCSSCAGKVTSGSVNQDDGSFLDDDQIKEGWVLTCVAYPTGDVTIETHKEEELTA-","features":[],"end":148},{"id":"8","start":1,"name":"FER1_SPIOL/1-147","seq":"----MAATTTTMMGMATTFVPKPQAPPMMAALPSNTG-RSLFGLKT--GSRGGRMT-MAAYKVTLVTPTGNVEFQCPDDVYILDAAEEEGIDLPYSCRAGSCSSCAGKLKTGSLNQDDQSFLDDDQIDEGWVLTCAAYPVSDVTIETHKEEELTA-","features":[],"end":147},{"id":"9","start":1,"name":"FER3_RAPSA/1-96","seq":"----------------------------------------------------------ATYKVKFITPEGEQEVECDDDVYVLDAAEEAGIDLPYSCRAGSCSSCAGKVVSGSVDQSDQSFLDDDQIAEGFVLTCAAYPTSDVTIETHREEDMV--","features":[],"end":96},{"id":"10","start":1,"name":"FER1_ARATH/1-148","seq":"----MASTALSSAIVGTSFIRRSPAPISLRSLPSANT-QSLFGLKS-GTARGGRVTAMATYKVKFITPEGELEVECDDDVYVLDAAEEAGIDLPYSCRAGSCSSCAGKVVSGSVDQSDQSFLDDEQIGEGFVLTCAAYPTSDVTIETHKEEDIV--","features":[],"end":148},{"id":"11","start":1,"name":"FER_BRANA/1-96","seq":"----------------------------------------------------------ATYKVKFITPEGEQEVECDDDVYVLDAAEEAGIDLPYSCRAGSCSSCAGKVVSGFVDQSDESFLDDDQIAEGFVLTCAAYPTSDVTIETHKEEELV--","features":[],"end":96},{"id":"12","start":1,"name":"FER2_ARATH/1-148","seq":"----MASTALSSAIVSTSFLRRQQTPISLRSLPFANT-QSLFGLKS-STARGGRVTAMATYKVKFITPEGEQEVECEEDVYVLDAAEEAGLDLPYSCRAGSCSSCAGKVVSGSIDQSDQSFLDDEQMSEGYVLTCVAYPTSDVVIETHKEEAIM--","features":[{"text":"feature_3","xEnd":32,"fillColor":"#ffff00","xStart":4}],"end":148},{"id":"13","start":1,"name":"Q93Z60_ARATH/1-118","seq":"----MASTALSSAIVSTSFLRRQQTPISLRSLPFANT-QSLFGLKS-STARGGRVTAMATYKVKFITPEGEQEVECEEDVYVLDAAEEAGLDLPYSCRAGSCSSCAGKVVSGSIDQSDQSFLDD--------------------------------","features":[],"end":118},{"id":"14","start":1,"name":"FER1_MAIZE/1-150","seq":"MATVLGSPRAPAFFFSSSSLRAAPAPTAVALPAAKVG---IMGRSA---SSRRRLRAQATYNVKLITPEGEVELQVPDDVYILDQAEEDGIDLPYSCRAGSCSSCAGKVVSGSVDQSDQSYLDDGQIADGWVLTCHAYPTSDVVIETHKEEELTGA","features":[],"end":150},{"id":"15","start":1,"name":"O80429_MAIZE/1-140","seq":"---------MAATALSMSILRAPP-PCFSSPLRLRVAVAKPLAAPM----RRQLLRAQATYNVKLITPEGEVELQVPDDVYILDFAEEEGIDLPFSCRAGSCSSCAGKVVSGSVDQSDQSFLNDNQVADGWVLTCAAYPTSDVVIETHKEDDLL--","features":[],"end":140}],"webStartUrl":"http://www.jalview.org/services/launchApp","jalviewVersion":"Test"}'/>
+
</body>
</html>
<script>
+
+function toggleMenuVisibility(){
+ var menu = document.getElementsByClassName("biojs_msa_menubar");
+ var divToggleButton = document.getElementById("divToggleButton");
+ if(menu[0].style.display == 'block'){
+ menu[0].style.display = 'none';
+ divToggleButton.value="Show Menu";
+ }else{
+ menu[0].style.display = 'block';
+ divToggleButton.value="Hide Menu";
+ }
+}
+
+
function openJalviewUsingCurrentUrl(){
- var url = "http://webservices.compbio.dundee.ac.uk:38080/jalviewServlet/services/launchAppDev";
+ var jalviewData = JSON.parse(document.getElementById("seqData").value)
+ var jalviewVersion = jalviewData['jalviewVersion'];
+ var url = jalviewData['webStartUrl'];
var myForm = document.createElement("form");
myForm.action = url;
- var myInput = document.createElement("input") ;
- myInput.setAttribute("name", "jvm-max-heap") ;
- myInput.setAttribute("value", "2G");
- myForm.appendChild(myInput) ;
+ var heap = document.createElement("input") ;
+ heap.setAttribute("name", "jvm-max-heap") ;
+ heap.setAttribute("value", "2G");
+ myForm.appendChild(heap) ;
- var myInput1 = document.createElement("input") ;
- myInput1.setAttribute("name", "open") ;
- myInput1.setAttribute("value", document.URL);
- myForm.appendChild(myInput1) ;
+ var target = document.createElement("input") ;
+ target.setAttribute("name", "open") ;
+ target.setAttribute("value", document.URL);
+ myForm.appendChild(target) ;
+
+ var jvVersion = document.createElement("input") ;
+ jvVersion.setAttribute("name", "version") ;
+ jvVersion.setAttribute("value", jalviewVersion);
+ myForm.appendChild(jvVersion) ;
-
document.body.appendChild(myForm) ;
myForm.submit() ;
document.body.removeChild(myForm) ;
// this is a way how you use a bundled file parser
biojs.io.clustal.read("#", function(seqs){
-
var opts = {};
// set your custom properties
// @see: https://github.com/greenify/biojs-vis-msa/tree/master/src/g
-opts.seqs = JSON.parse(document.getElementById("seqData").value);
+var jalviewData = JSON.parse(document.getElementById("seqData").value);
+opts.seqs = jalviewData['seqs'];
opts.el = document.getElementById("yourDiv");
-opts.vis = {conserv: false, overviewbox: false, labelid: false};
+opts.vis = {conserv: false, overviewbox: false, labelId: false};
opts.zoomer = {alignmentHeight: 225, labelWidth: 130,labelFontsize: "13px",labelIdLength: 20, menuFontsize: "12px",menuMarginLeft: "3px", menuPadding: "3px 4px 3px 4px", menuItemFontsize: "14px", menuItemLineHeight: "14px"};
// init msa
var m = new msa.msa(opts);
-m.g.colorscheme.set("scheme", "zappo");
+m.g.colorscheme.set("scheme", jalviewData['globalColorScheme']);
+
+var x = 0;
+jalviewData.seqs.forEach( function (seq)
+{
+m.seqs.at(x++).set("features", new msa.model.featurecol(seq.features));
+});
// the menu is independent to the MSA container
var menuOpts = {};
// call render at the end to display the whole MSA
m.render();
-
+toggleMenuVisibility();
+toggleMenuVisibility();
});
</script>
git://source.jalview.org / jalview.git / blobdiff