This repository has been archived by the owner on May 22, 2022. It is now read-only.
/
test.html
79 lines (63 loc) · 2.07 KB
/
test.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
<html>
<head>
<meta charset="UTF-8">
<meta name="description" content="Simple BioJS example" />
<!-- include MSA js + css -->
<script src="./dist/msa.js"></script>
</head>
<body>
<div>some text</div>
<div>more text</div>
<div>of your awesome website</div>
<br>
<!--A simple website with left and right bars-->
<div>
<span> Left bar </span>
<div style="width: 70%; display: inline-block">
<div id="menuDiv"></div>
<div id="yourDiv">Loading ... </div>
<script>
// this is a way how you use a bundled file parser
//msa = require("msa");
//msa = window.msa;
var opts = {};
// set your custom properties
// @see: https://github.com/wilzbach/biojs-vis-msa/tree/master/src/g
opts.el = document.getElementById("yourDiv");
opts.vis = {
conserv: false,
overviewbox: false,
seqlogo: true
};
opts.conf = {
dropImport: true
};
opts.zoomer = {
menuFontsize: "12px",
autoResize: true
};
// init msa
var m = new msa(opts);
var defaultURL = "./snippets/data/fer1.clustal";
function getURLParameter(name) {
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search) || [, ""])[1].replace(/\+/g, '%20')) || null;
}
var url = getURLParameter('seq') || defaultURL;
m.u.file.importURL(url, renderMSA);
function renderMSA() {
// the menu is independent to the MSA container
var menuOpts = {};
menuOpts.el = document.getElementById('div');
menuOpts.msa = m;
menuOpts.menu = "small";
var defMenu = new msa.menu.defaultmenu(menuOpts);
m.addView("menu", defMenu);
// call render at the end to display the whole MSA
m.render();
}
</script>
</div>
<span> Right bar</span>
</div>
</body>
</html>