-
Notifications
You must be signed in to change notification settings - Fork 4
/
index.html
143 lines (114 loc) · 5.48 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="IE=edge" http-equiv="X-UA-Compatible">
<meta content="width=device-width, initial-scale=1" name="viewport">
<title>Drug Data | Field Lab | Perelman School of Medicine at the
University of Pennsylvania</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<link href=
"https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.css"
rel="stylesheet" type="text/css">
<link href="heatmap-styles.css" rel="stylesheet" type="text/css">
</head>
<body>
<header>
<a href="http://www.med.upenn.edu/" target=
"_blank">
<img alt="Perelman School of Medicine at the University of Pennsylvania"
class="psom-logo-blue" height="60"
src="https://www.med.upenn.edu/images/psom_logo_blue.svg"
width="213"
>
</a>
</header>
<main>
<div class="grid">
<h1 class="page-title">Drug Data</h1>
<h3>Filters: </h3>
<!-- <select id="pathwaySel" multiple="multiple"></select>-->
<!-- <h4>Select Target(s)</h4>-->
<form action="#" method="post" id="demoForm" class="demoForm">
<fieldset>
<legend>Select Pathway(s)</legend>
<p>
<select name="demoSel[]" id="pathwaySel" size="4" multiple="multiple"></select>
<textarea name="display" id="display" placeholder="view select list value(s) onchange" cols="20" rows="4" readonly></textarea>
</p>
</fieldset>
</form>
<!-- <select id="targetSel"></select>-->
<form action="#" method="post" id="demoForm1" class="demoForm">
<fieldset>
<legend>Select Target(s)</legend>
<p>
<select name="demoSel1[]" id="targetSel" size="4" multiple="multiple"></select>
<textarea name="display_1" id="display1" placeholder="view select list value(s) onchange" cols="10" rows="4" readonly></textarea>
</p>
</fieldset>
</form>
<!-- <h4>Select Compound Name(s)</h4>-->
<!-- <select id="compoundSel"></select>-->
<form action="#" method="post" id="demoForm2" class="demoForm">
<fieldset>
<legend>Select Compound Name(s)</legend>
<p>
<select name="demoSel2[]" id="compoundSel"size="4" multiple="multiple"></select>
<textarea name="display_2" id="display2" placeholder="view select list value(s) onchange" cols="20" rows="4" readonly></textarea>
</p>
</fieldset>
<input type="button" name="clear_button" value="Clear Selection(s)" id="clear_button" />
</form>
<p>Search: <input data-highlight="false" data-list=
"#heatmap tbody" data-min_chars="3" data-nodata=
"No results found" data-toggle="hideseek" id=
"heatmap-search" name="heatmap-search" placeholder=
"Search in table" type="text"></p>
<div data-heatmap-dir="data/example-heatmap/"
id="heatmap">
<i class="fas fa-3x fa-spinner fa-spin"></i>
</div>
<div id="dose-graph-wrapper">
<svg height="550" id="dose-graph" width=
"500"></svg>
</div>
</div>
</main>
<div class="copyright">
<div class="grid">
<div class="unit whole">
<p>© The Trustees of the University of Pennsylvania |
Site Design: <a href=
"https://www.med.upenn.edu/pmacswebteam/">PMACS Web
Team.</a>
</div>
</div>
</div>
</div>
<script crossorigin="anonymous" integrity=
"sha256-45YA33UQCDcJsntBst2bhka2t/LBNHP7RNvpllHPkQ0=" src=
"https://cdnjs.cloudflare.com/ajax/libs/es6-promise/4.1.1/es6-promise.min.js">
</script>
<script crossorigin="anonymous" integrity=
"sha256-OI3N9zCKabDov2rZFzl8lJUXCcP7EmsGcGoP6DMXQCo=" src=
"https://cdnjs.cloudflare.com/ajax/libs/es6-promise/4.1.1/es6-promise.auto.min.js">
</script>
<script crossorigin="anonymous" integrity=
"sha256-eOUokb/RjDw7kS+vDwbatNrLN8BIvvEhlLM5yogcDIo=" src=
"https://cdnjs.cloudflare.com/ajax/libs/fetch/2.0.4/fetch.min.js">
</script>
<script src="https://d3js.org/d3.v5.min.js">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/stupidtable/1.1.3/stupidtable.min.js" integrity="sha512-T2dqwCYHuN8dbqIgYhwdGm+VtfUBecC06wUrciItlLJsteoe07db34cbmp/GZGIrC5/q1xy1V96BuvPiMXnedA==" crossorigin="anonymous"></script>
<script src=
"https://cdnjs.cloudflare.com/ajax/libs/hideseek/0.8.0/jquery.hideseek.min.js">
</script> <!-- jQuery Modal -->
<script src=
"https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.js">
</script>
<script src="heatmap.js">
</script>
</body>
</html>