-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
150 lines (137 loc) · 6.6 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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>LHC-Forms</title>
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-59GQ6JK');</script>
<!-- End Google Tag Manager -->
<style id="antiClickjack">
body{display:none !important;}
</style>
<script type="text/javascript">
if (self === top) {
var antiClickjack = document.getElementById("antiClickjack");
antiClickjack.parentNode.removeChild(antiClickjack);
} else {
top.location = self.location;
}
</script>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<link href="https://fonts.googleapis.com/css?family=Droid+Sans:400,700"
rel="stylesheet" type="text/css">
<script>
function turnRed() {
var stuffDiv = document.getElementById('stuffId');
stuffDiv.style.color = "red";
}
</script>
</head>
<body>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-59GQ6JK" height="0" width="0" style="display:none;visibility:hidden" title="googletagmanager" sandbox></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<!--[if lt IE 9]>
<p class=alert><b>Note:</b> It appears you are using an unsupported
version of the IE browser. This website will not work properly with
IE 8 or below.</p>
<![endif]-->
<!-- page header -->
<div id="sharedHeader"></div>
<div id="header">
<a href="https://lhcforms.nlm.nih.gov" title="LHC FHIR Tools" id="site-logo">
<img src="projectLogo.svg" alt="LHC FHIR Tools" />
</a>
<div id="siteNameBox">
<span id=siteName>HGVS Expression Validator</span><br>
<!-- don't feel it's necessary to use a tagline here, but if needed, uncomment and change.
<span id=tagline>TBD</span>
-->
</div>
</div>
<!-- end page header -->
<div id="sharedNavLinks"></div>
<script src="https://lhcforms.nlm.nih.gov/shared/loadSharedNavLinks.js"></script>
<div class="page-content">
<h2 style="text-align: center">The HGVS Expression Validator</h2>
<div class="summary">
This HGVS validator can be used to validate HGVS expressions, and the results may optionally include NCBI's
<a href="https://www.ncbi.nlm.nih.gov/variation/notation/">SPDI</a> (Sequence Position Deletion Insertion)
if available. The validation may have 3 possible outcomes:
</div>
<div id="show-more-less">
<div class="summary">
<ul style="margin: 5pt">
<li><b>Valid</b>, if the HGVS expression is valid</li>
<li><b>Invalid</b>, if the HGVS expression is invalid</li>
<li><b>Unknown</b>, if the validity of the HGVS expression could not be determined, for example, due to system limitations or errors</li>
</ul>
Behind the scenes, this validator is powered by the LHC FHIR API for HGVS Validation and Lookup,
which, in turn, is backed by the NCBI's
<a href="https://www.ncbi.nlm.nih.gov/variation/services">Variation Service</a> with
the <a href="https://mutalyzer.nl/webservices">Mutalyzer</a> as a fall back when NCBI's
Variation service couldn't decide the validity of the given HGVS expression.
The NCBI's variation service is used to translate the HGVS expression into SPDI if possible.
</div>
<div class="summary">
There are two ways to use this validator:
use the interactive user interface for checking individual HGVS expressions or
use the LHC FHIR API for HGVS Validation and Lookup from your applications.
The interactive user interface is backed by the
<a href="https://clinicaltables.nlm.nih.gov/hgvs.html">service API</a>.
</div>
</div>
<p>
<a style="text-decoration: underline; color:navy;" href="javascript:void(0);"
onclick="app.showMoreOrLess(this, 'show-more-less');">Show more...</a>
</p>
<div class="sectionBox">
<h3>HGVS Expression Validation</h3>
<table class="input">
<tr id="errorAlertBox" style="display: none">
<th class="input-label"></th>
<td id="errorAlertMsg" style="color:red; font-weight: bold"></td>
</tr>
<tr>
<th class="input-label">HGVS to Validate:</th>
<td><input type="text" id="hgvsInput" placeholder = "HGVS Expression" style="width: 100%"/>
<span style="font-weight:normal">(e.g., NM_001127897.4:c.3642A>G)</span></td>
</tr>
<tr>
<th class="input-label"></th>
<td><input type="checkbox" id="includeSPDI"/><label for="includeSPDI">Include SPDI in results (if available)</label></td>
</tr>
<tr>
<th class="input-label"></th>
<td><button id="Validate" onclick="app.validateHGVS(); return true;"
><b>Validate</b></button></td>
</tr>
<tr id="validationResultBox">
<th class="input-label">Validation Result:</th>
<td id="validationResult" class="results"></td>
</tr>
<tr id="spdiResultBox" style="display: none">
<th class="input-label">SPDI Result:</th>
<td id="spdiResult" class="results"></td>
</tr>
</table>
</div>
<div class="sectionBox">
<h3>The LHC FHIR API for HGVS Validation and Lookup</h3>
<div class="summary">
The <a href="https://clinicaltables.nlm.nih.gov/hgvs.html">LHC FHIR API for HGVS Validation and Lookup</a>
supports two FHIR operations for HGVS expressions:
the $validate-code operation for HGVS expression validation and
the $lookup operation that currently only returns NCBI's
<a href="https://www.ncbi.nlm.nih.gov/variation/notation/">SPDI</a> (Sequence Position Deletion Insertion)
string if available. For more details, please refer to the API's
<a href="https://clinicaltables.nlm.nih.gov/hgvs.html">documentation</a>.
</div>
</div>
</div>
<div id="sharedFooter"></div>
<script src="https://clinicaltables.nlm.nih.gov/shared/loadShared.min.js"></script>
</body>
</html>