-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
executable file
·399 lines (340 loc) · 16.8 KB
/
index.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
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
<!DOCTYPE html>
<html lang="en">
<head>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-67015622-2', 'auto');
ga('send', 'pageview');
</script>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="assets/img/favicon.ico">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<title>Systems Genetics - Duke NUS - Singapore</title>
<!-- Bootstrap core CSS -->
<link href="assets/css/bootstrap.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="assets/css/ionicons.min.css" rel="stylesheet">
<link href="assets/css/style.css" rel="stylesheet">
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="assets/js/ie10-viewport-bug-workaround.js"></script>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div id="h">
<div class="logo">Systems Genetics Singapore</div>
<div class="social hidden-xs">
<a href="https://twitter.com/SysGenNet"><i class="ion-social-twitter"></i></a>
</div>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2 centered">
<h1>Systems Genetics Group</h1><h2>Duke-NUS Medical School</h2>
<div class="mtb">
<button class="btn btn-conf-2 btn-green" id="tellmemore" name="tellmemore">What we do</button>
<button class="btn btn-conf-2 btn-green" id="whowearebtn" name="whowearebtn">Who we are</button>
<button class="btn btn-conf-2 btn-green" id="ourpapersbtn" name="ourpapersbtn">Our Papers</button>
<script>
$("#whowearebtn").click(function() {
var offset = 20; //Offset of 20px
$('html, body').animate({
scrollTop: $("#whoweare").offset().top + offset
}, 2000);
});
$("#ourpapersbtn").click(function() {
var offset = 20; //Offset of 20px
$('html, body').animate({
scrollTop: $("#papers").offset().top + offset
}, 2000);
});
$("#tellmemore").click(function() {
var offset = 20; //Offset of 20px
$('html, body').animate({
scrollTop: $("#whatwedo").offset().top + offset
}, 2000);
});
</script>
</div><!--/mt-->
</div>
</div><!--/row-->
</div><!--/container-->
</div><!-- /H -->
<div class="container ptb">
<div class="row" name="whatwedo" id="whatwedo">
<div class="col-md-6">
<h2>What we do.</h2>
<p class="mt"> Understanding how genetic information is decoded to produce the complex regulatory systems driving disease remains a great challenge in biomedical sciences. However, the increasing availability of high-dimensional molecular, cellular and phenotypic data now allows a comprehensive investigation of the complex genetic and regulatory mechanisms that underlie the disease process.</p>
</div>
<div class="col-md-6">
<img src="assets/img/layers.jpg" class="img-responsive mt" alt="our plan">
</div>
</div>
<div class="row">
<div class="col-md-6">
<img src="assets/img/combine.jpg" class="img-responsive mt" alt="">
</div>
<div class="col-md-6">
<h2>How we do it.</h2>
<p class="mt"> Our research lab focuses on the systems-level integration of genetic, functional genomic and phenotypic data to identify causal determinants and pathways of complex traits and disease, with a focus on cardio-metabolic, inflammatory and neuropsychiatric disorders. To this aim, we have developed an integrated genetic and gene-network approach, called Systems-Genetics, to determine the consequences of key genetic variants ('master genetic regulators') on functional gene-networks in disease.</p>
</div>
<div class="mtb">
<button class="btn btn-conf-2 btn-green" id="ourwork" name="ourwork">Tell me more</button>
<script>
$("#ourwork").click(function() {
var offset = 20; //Offset of 20px
$('html, body').animate({
scrollTop: $("#workexamples").offset().top + offset
}, 2000);
});
</script>
</div><!--/mt-->
</div><!--/row-->
</div><!--/container-->
<div id="green">
<div class="container">
<div class="row" id="whoweare" name="whoweare">
<div class="col-md-12 centered">
<h2>Who we are.</h2>
<div class="col-md-3 centered">
<a href="">
<img src="assets/img/enrico.jpg" class="img-responsive mt center-block img-rounded" width=80% alt="Enrico">
</a>
<h3>Associate Professor</h3>
<h5><tgr>ENRICO PETRETTO</tgr></h5>
<h5>enrico.petretto@duke-nus.edu.sg</h5>
</div>
<div class="col-md-3 centered">
<a href="owen.html">
<img src="assets/img/owen_face.jpg" class="img-responsive mt center-block img-rounded" width=80% alt="Owen">
</a>
<h3>Senior Research Fellow</h3>
<h5><tgr>OWEN RACKHAM</tgr></h5>
<h5>owen.rackham@duke-nus.edu.sg</h5>
</div>
<div class="col-md-3 centered">
<a href="sarah.html">
<img src="assets/img/sarah.png" class="img-responsive mt center-block img-rounded" width=80% alt="Sarah">
</a>
<h3>Senior Research Fellow</h3>
<h5><tgr>SARAH LANGLEY</tgr></h5>
<h5>sarah.r.langley@duke-nus.edu.sg</h5>
</div>
<div class="col-md-3 centered">
<a href="nathan.html">
<img src="assets/img/nathan.jpg" class="img-responsive mt center-block img-rounded" width=80% alt="Nathan">
</a>
<h3>Senior Research Fellow</h3>
<h5><tgr>NATHAN HARMSTON</tgr></h5>
<h5>nathan.harmston@duke-nus.edu.sg</h5>
</div>
<div class="col-md-12 centered">
<div class="col-md-3 centered">
<a href="amelia.html">
<img src="assets/img/amelia.png" class="img-responsive mt center-block img-rounded" width=80% alt="Amelia">
</a>
<h3>PhD Student</h3>
<h5><tgr>AMELIA TAN LI MIN</tgr></h5>
<h5>amelia.tlm@u.nus.edu</h5>
</div>
<div class="col-md-3 centered">
<a href="uma.html">
<img src="assets/img/uma.jpg" class="img-responsive mt center-block img-rounded" width=80% alt="Uma">
</a>
<h3>PhD Student</h3>
<h5><tgr>UMA SANGUMATHI KAMARAJ</tgr></h5>
<h5>e0011403@nus.edu.sg</h5>
</div>
<div class="col-md-3 centered">
<a href="Shiyang.html">
<img src="assets/img/Shiyang.jpg" class="img-responsive mt center-block img-rounded" width=80% alt="Shiyang">
</a>
<h3>MD/PhD Student</h3>
<h5><tgr>SHIYANG LIU</tgr></h5>
<h5>shiyang_liu@u.duke.nus.edu</h5>
</div>
</div>
</div>
</div><!--/Carousel-->
</div>
</div><!--/row-->
</div><!--/container-->
</div><!--/green-->
<div class="container ptb">
<hr>
<div class="row centered" id="workexamples" name="workexamples">
<h2 class="mb">Some of our work.</h2>
<div class="row centered">
<p class="mt">
To date, using Systems-Genetics we have uncovered several genes regulating functional gene-networks underling disease processes, including EBI2 regulating an anti-viral expression network and type 1 diabetes risk, KCNN4 and its co-regulatory network underlying cell multinucleation in inflammatory disease and SESN3 as a master genetic regulator of a proconvulsant gene network in human epileptic hippocampus. Our Systems-Genetics strategy will be further developed to study cardio-metabolic traits and disease, with the aim of deciphering the primary genetic factors and regulatory networks underlying hypertrophy, remodeling and fibrosis in the human heart.
</p>
</div>
<div class="col-md-4">
<div class="price-table">
<div class="p-head">
Software
</div>
<div class="p-body">
<ul class="features">
<li>EvoTol: a protein-sequence based evolutionary intolerance framework for disease-gene prioritization</li>
</ul>
<a href="http://nar.oxfordjournals.org/content/43/5/e33" class="btn btn-conf-2 btn-green">Read the paper</a>
<a href="http://www.evotol.co.uk" class="btn btn-conf-2 btn-green">Use the tool</a>
</div><!--/p-body-->
</div><!--/price-table-->
</div><!--/col-md-4-->
<div class="col-md-4">
<div class="price-table">
<div class="p-head">
Software
</div>
<div class="p-body">
<ul class="features">
<li>Web-based Gene Pathogenicity Analysis (WGPA): A web platform to interpret gene pathogenicity from personal genomes data</li>
</ul>
<a href="" class="btn btn-conf-2 btn-green">Read the paper</a>
<a href="http://wgpa.systems-genetics.net" class="btn btn-conf-2 btn-green">Use the tool</a>
</div><!--/p-body-->
</div><!--/price-table-->
</div><!--/col-md-4-->
<div class="col-md-4">
<div class="price-table">
<div class="p-head">
Software
</div>
<div class="p-body">
<ul class="features">
<li>WGBSSuite: simulating whole-genome bisulphite sequencing data and benchmarking differential DNA methylation analysis tools.</li>
</ul>
<a href="http://bioinformatics.oxfordjournals.org/content/31/14/2371.long" class="btn btn-conf-2 btn-green">Read the paper</a>
<a href="http://www.wgbssuite.org.uk/"class="btn btn-conf-2 btn-green">Use the tool</a>
</div><!--/p-body-->
</div><!--/price-table-->
</div><!--/col-md-4-->
<div class="mtb">
<button class="btn btn-conf-2 btn-green" id="showthemtome" name="showthemtome">Who are we?</button>
<script>
$("#showthemtome").click(function() {
var offset = 20; //Offset of 20px
$('html, body').animate({
scrollTop: $("#whoweare").offset().top + offset
}, 2000);
});
</script>
</div><!--/mt-->
</div><!--/row-->
<div name="papers" id="papers">
<h2 class="mb">Bibliography</h2>
Retreiving papers from PubMed.
</div>
<script>
var HTMLpublication = '<div class="references"><b>%title%</b><br> %authors%. <i>%journal%</i>,%volume%%issue%%pages%%date% <a href="%data%" target="_blank"> [pubmed] </a><hr></hr></div>'
//create a template for your reference formatting
var publications, idStringList;
var pubmedSearchAPI = 'http://eutils.ncbi.nlm.nih.gov/entrez/eutils/esearch.fcgi?';
var pubmedSummaryAPI = 'http://eutils.ncbi.nlm.nih.gov/entrez/eutils/esummary.fcgi?';
var database = 'db=pubmed&'
var returnmode = '&retmode=json';
var returnmax = '&retmax=100';
var searchterm = '&term=petretto,enrico[author] OR rackham,owen[author] OR langley,sarah[author] OR harmston,nathan[author] OR moreno-moral,aida[author] OR liu,shiyang[author] NOT Muscle moment arms in the first dorsal extensor compartment after radial malunion. A cadaver study[Title]';
var returntype = '&rettype=abstract';
var idURL = pubmedSearchAPI + database + returnmode + returnmax + searchterm
console.log(idURL);
var getPubmed = function(url) {//passed url
return new Promise(function(resolve, reject) {
var xhr = new XMLHttpRequest();
xhr.open('get', url, true);
xhr.responseType = 'json';
xhr.onload = function() {
var status = xhr.status;
if (status == 200) {//status 200 signifies OK (http://www.w3schools.com/ajax/ajax_xmlhttprequest_onreadystatechange.asp)
resolve(xhr.response);
} else {
reject(status);
}
};
xhr.send();
});
};
getPubmed(idURL).then(function(data) {
var idList = data.esearchresult.idlist;
idStringList = idList.toString(); //converts the idlist to a string to be appended to the search url
idStringList = '&id=' + idStringList;
summaryURL = pubmedSummaryAPI + database + returnmode + returntype + idStringList;
getPubmed(summaryURL).then(function(summary) {
publications = formatReferences(summary);
console.log(publications); //print your publications in the console window
$(papers).html('');
$(papers).append(publications);
}, function(status) {
publications = 'Something went wrong getting the ids.';
});
}, function(status) {
publications = 'Something went wrong getting the ids.';
}
);
function formatReferences(summary) {
var publicationList ='';
for(refs in summary.result) {
if(refs !== 'uids') {
var authors = '';
var publication = '';
var authorCount = ((summary.result[refs].authors).length);
var i=0;
while (i<authorCount-1) {
authors += summary.result[refs].authors[i].name + ', ';
i++;
}
publication = HTMLpublication.replace('%data%','http://www.ncbi.nlm.nih.gov/pubmed/'+refs)
authors += summary.result[refs].lastauthor;
publication = publication.replace('%authors%',authors);
publication = publication.replace('%title%',summary.result[refs].title);
publication = publication.replace('%journal%',summary.result[refs].source);
//Alter formatting if article is In Press
if(summary.result[refs].volume!=='') {
publication = publication.replace('%volume%',' ' + summary.result[refs].volume);
publication = publication.replace('%issue%','(' + summary.result[refs].issue + ')');
publication = publication.replace('%pages%',': ' + summary.result[refs].pages +', ');
var date = summary.result[refs].pubdate.slice(0,4);
publication = publication.replace('%date%',date + '.');
}
else {
publication = publication.replace('%volume%',' In Press');
publication = publication.replace('%issue%','.');
publication = publication.replace('%pages%','');
publication = publication.replace('%date%','');
}
publicationList = publication + publicationList;
}
}
return(publicationList);
}
</script>
</div>
<div id="f">
<div class="container">
<div class="row centered">
<p class="mt">
Centre for Computational Biology, 8 College Road, Singapore, 169857
</p>
<h6 class="mt"></h6>
</div><!--/row-->
</div><!--/container-->
</div><!--/F-->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/retina-1.1.0.js"></script>
</body>
</html>