diff --git a/mutalyzer/website/templates/batch-job-progress.html b/mutalyzer/website/templates/batch-job-progress.html index bed41e1265caa6c3a2b3b66479742bf37e0105ec..7f64c01fd0bcb95029c71e732da60fec3b4546a0 100644 --- a/mutalyzer/website/templates/batch-job-progress.html +++ b/mutalyzer/website/templates/batch-job-progress.html @@ -16,6 +16,7 @@ <a href="{{ url_for('.batch_job_result', result_id=result_id) }}">batch-job-{{ result_id }}.txt</a> </p> </div> + {% if items_left %} <script type="text/javascript"> function check_items_left() { @@ -38,8 +39,8 @@ function check_items_left() { } check_items_left(); </script> - {% endif %} -{% else %} + {% endif %}{# items_left #} +{% else %}{# result_id #} <p>Unknow batch job.</p> {% endif %} diff --git a/mutalyzer/website/templates/batch-jobs.html b/mutalyzer/website/templates/batch-jobs.html index 36876544b07a1147fcde977260d0642562dc2df3..f428b69cfc7bf946d661a9118394bc9294270c84 100644 --- a/mutalyzer/website/templates/batch-jobs.html +++ b/mutalyzer/website/templates/batch-jobs.html @@ -10,101 +10,106 @@ {% block content %} - <form action="{{ url_for('.batch_jobs_submit') }}" method="post" enctype="multipart/form-data"> - <!-- BatchType --> - <div class="form-group"> - <label>Batch job type</label> - <div class="radio"> - <label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="name-checker"{% if job_type == "name-checker" %} checked{% endif %} />Name Checker</label> - </div> - <div class="radio"> - <label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="syntax-checker"{% if job_type == "syntax-checker" %} checked{% endif %} />Syntax Checker</label> - </div> - <div class="radio"> - <label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="position-converter"{% if job_type == "position-converter" %} checked{% endif %} />Position Converter</label> - </div> - <div class="radio"> - <label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="snp-converter"{% if job_type == "snp-converter" %} checked{% endif %} />SNP Converter</label> - </div> - - <div id="assembly_name_or_alias" style="display:none" class="form-group"> - <label>Assembly</label> - <select name="assembly_name_or_alias" class="form-control"> - {% for assembly in assemblies %} - <option value="{{ assembly.name }}"{% if assembly_name_or_alias in (assembly.name, assembly.alias) %} selected="selected"{% endif %}>{{ assembly.taxonomy_common_name }} — {{ assembly.name }}{% if assembly.alias %} ({{ assembly.alias }}){% endif %}</option> - {% endfor %} - </select> - </div> - - <div class="form-group"> - <label for="email">Email address</label> - <input name="email" type="email" class="form-control" placeholder="Email address" required value="{{ email }}"> - </div> - - <div class="form-group"> - <label for="file">File</label> - <input type="file" name="file"> - </div> - </div> - - <div class="form-group"> - <input type="submit" class="btn btn-primary" value="Submit"> - <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/BatchCheckers" target="new" class="btn btn-default pull-right">Help</a> - <a href="#" onclick="toggle_visibility('help');" class="btn btn-default pull-right">File format help <span class="caret"></span></a> - - </div> - </form> - -<div id='help' style="display:none"> - <h3>Help</h3> +<form class="form" action="{{ url_for('.batch_jobs_submit') }}" method="post" enctype="multipart/form-data"> + <!-- BatchType --> + <div class="form-group"> + <label>Batch job type</label> + <div class="radio"> + <label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="name-checker"{% if job_type == "name-checker" %} checked{% endif %} />Name Checker</label> + </div> + <div class="radio"> + <label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="syntax-checker"{% if job_type == "syntax-checker" %} checked{% endif %} />Syntax Checker</label> + </div> + <div class="radio"> + <label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="position-converter"{% if job_type == "position-converter" %} checked{% endif %} />Position Converter</label> + </div> + <div class="radio"> + <label><input onchange="return changeBatch(this);" type="radio" name="job_type" value="snp-converter"{% if job_type == "snp-converter" %} checked{% endif %} />SNP Converter</label> + </div> + + <div id="assembly_name_or_alias" style="display:none" class="form-group"> + <label>Assembly</label> + <select name="assembly_name_or_alias" class="form-control"> + {% for assembly in assemblies %} + <option value="{{ assembly.name }}"{% if assembly_name_or_alias in (assembly.name, assembly.alias) %} selected="selected"{% endif %}>{{ assembly.taxonomy_common_name }} — {{ assembly.name }}{% if assembly.alias %} ({{ assembly.alias }}){% endif %}</option> + {% endfor %} + </select> + </div> + + <div class="form-group"> + <label for="email">Email address</label> + <input name="email" type="email" class="form-control" placeholder="Email address" required value="{{ email }}"> + </div> + + <div class="form-group"> + <label for="file">File</label> + <input type="file" name="file"> + </div> + </div> + + <div class="form-group"> + <input type="submit" class="btn btn-primary" value="Submit"> + <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/BatchCheckers" target="new" class="btn btn-default pull-right">Help</a> + <a href="#" onclick="toggle_visibility('help');" class="btn btn-default pull-right">File format help <span class="caret"></span></a> + </div> +</form> + +<div id="help" style="display:none"> + <hr> <p>The mutalyzer batch checker accepts the following file formats:</p> - <ul> - <li>Tab delimited text file / CSV file</li> - <li>Microsoft Excel file</li> - <li>OpenOffice ODS file</li> - </ul> - <p> + <ul> + <li>Tab delimited text file / CSV file</li> + <li>Microsoft Excel file</li> + <li>OpenOffice ODS file</li> + </ul> + <p> The maximum file size is {{ max_file_size }} megabytes, and the maximum length per entry (variant description) is 200 characters. - </p> - We accept two types of input files, you can download examples below. + </p> - <h4>New Style</h4> - <p>This file format has no header-row. Each row consists of one or more tab delimited fields, where every field contains a single variant description (or dbSNP rs number in case of the SNP Converter). Note that all rows must have the same number of fields.</p> - <table class="table"> - <tr><td>AB026906.1:c.274G>T</td></tr> - <tr><td>AL449423.14(CDKN2A_v002):c.5_400del</td></tr> - </table> - <a href="{{ url_for('.downloads', filename='batchtestnew.txt') }}">Download new style example file</a> + <p>We accept two types of input files, you can download examples below.</p> + <h4>New Style</h4> + <p>This file format has no header-row. Each row consists of one or more tab delimited fields, where every field contains a single variant description (or dbSNP rs number in case of the SNP Converter). Note that all rows must have the same number of fields.</p> + <table class="table"> + <tr><td>AB026906.1:c.274G>T</td></tr> + <tr><td>AL449423.14(CDKN2A_v002):c.5_400del</td></tr> + </table> - <h4>Old Style</h4> - <p >This file format has a header-row, which consists of - three tab delimited fields. In each following row the - corressponding data is also tab delimited.</p> - <table class="table"> - <thead> - <th>AccNo</th> - <th>Genesymbol</th> - <th>Mutation</th> - </thead> - <tr> - <td>AB026906.1</td><td>SDHD</td><td>g.7872G>T</td> - </tr> - </table> - - <a href="{{ url_for('.downloads', filename='batchtestold.txt') }}">Download old style example file</a> + <p><a href="{{ url_for('.downloads', filename='batchtestnew.txt') }}">Download new style example file</a></p> + <h4>Old Style</h4> + <p>This file format has a header-row, which consists of + three tab delimited fields. In each following row the + corressponding data is also tab delimited.</p> + <table class="table"> + <thead> + <tr> + <th>AccNo</th> + <th>Genesymbol</th> + <th>Mutation</th> + </tr> + </thead> + <tbody> + <tr> + <td>AB026906.1</td><td>SDHD</td><td>g.7872G>T</td> + </tr> + </tbody> + </table> + + <p><a href="{{ url_for('.downloads', filename='batchtestold.txt') }}">Download old style example file</a></p> <h4>Output Format</h4> - <p> - The output of a Mutalyzer Batch run is a tab delimited CSV file, - which has a header-row to clarify the results. We recommend opening - the file in a spreadsheet program, such as OpenOffice Calc or - Microsoft Excel.<BR /> - Note that empty lines are removed from the batch input file. - </p> -</div> + + <p> + The output of a Mutalyzer Batch run is a tab delimited CSV file, + which has a header-row to clarify the results. We recommend opening + the file in a spreadsheet program, such as OpenOffice Calc or + Microsoft Excel. + </p> + <p>Note that empty lines are removed from the batch input file.</p> +</div>{# id="help" #} + <script language="javascript"> oldload = window.onload initpage = function() { @@ -115,29 +120,15 @@ initpage = function() { window.onload = initpage; </script> -{% if errors %} - <div class="alert alert-danger"> - <h4>Batch not started</h4> - <p>The batch process was not started due to the following errors:</p> - <ul> - {% for m in errors %} - <li class="{{ m.class }}" title="{{ m.level }} (origin: {{ m.origin - }})">{{ m.description }}</li> - {% endfor %} - </ul> - </div> -{% endif %} - {% if messages %} - <p> - <b>Messages:</b> - </p> - <div class="messages"> - {% for m in messages %} - <p class="{{ m.class }}" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> - {% endfor %} - <p>{{ summary }}</p> - </div> + <hr> + {% for m in messages %} + {% if m.class == "error" %} + <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> + {% elif m.class == "warning" %} + <p class="alert alert-warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> + {% endif %} + {% endfor %} {% endif %} {% endblock content %} diff --git a/mutalyzer/website/templates/description-extractor.html b/mutalyzer/website/templates/description-extractor.html index 4f41354cba2be09c532e2a9226102a75a12a2c54..98efb347370f6147a62ff6ea55c1d9b5dad63de0 100644 --- a/mutalyzer/website/templates/description-extractor.html +++ b/mutalyzer/website/templates/description-extractor.html @@ -5,12 +5,12 @@ {% block content %} -<p> -<b style="color: red">Note that this is an experimental service.</b> -</p> +<p class="alert alert-warning">Note that this is an experimental service.</p <p> -Extract the HGVS variant description from a reference sequence and an observed sequence. For now, we require the user to fill in two sequences. After the testing phase, we plan to use the underlying algorithm for: +Extract the HGVS variant description from a reference sequence and an observed +sequence. For now, we require the user to fill in two sequences. After the +testing phase, we plan to use the underlying algorithm for: </p> <ul> @@ -26,84 +26,76 @@ Extract the HGVS variant description from a reference sequence and an observed s </ul> <p> - Please supply a reference sequence and an observed sequence. +Please supply a reference sequence and an observed sequence. </p> - <form action="{{ url_for('.description_extractor') }}" method="get" class="form"> - <div class="form-group"> - <h3>Reference sequence</h3> - <p>Example: <code class="example-input">ATGATTTGATCAGATACATGTGATACCGGTAGTTAGGACAA</code></p> - <input type="text" name="reference_sequence" value="{{ reference_sequence }}" class="form-control form-pre example-target" placeholder="Reference sequence"> - <!-- <input type="button" value="Clear field" onclick="clearField(this.form, 'reference_sequence');" class="btn"> --> - </div> - <div class="form-group"> - <h3>Observed sequence</h3> - - <p>Example: <code class="example-input-2">ATGATTTGATCAGATACATGTGATACCGGTAGTTAGGACAA</code></p> - <input type="text" name="variant_sequence" value="{{ variant_sequence }}" class="form-control form-pre example-target-2" placeholder="Observed sequence"> - <!-- <input type="button" value="Clear field" onclick="clearField(this.form, 'variant_sequence');" class="btn"> --> - </div> - - <div class="form-group"> - <input type="submit" class="btn btn-primary" value="Submit"> - <input type="reset" class="btn btn-default pull-right" value="Undo"> - <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/DescriptionExtractor" target="new" class="btn btn-default pull-right">Help</a> - </div> - </form> +<form action="{{ url_for('.description_extractor') }}" method="get" class="form"> + <div class="form-group"> + <label for="reference_sequence">Reference sequence</label> + <input type="text" name="reference_sequence" value="{{ reference_sequence }}" class="form-control form-pre example-target" placeholder="Reference sequence"> + <p>Example: <code class="example-input">ATGATTTGATCAGATACATGTGATACCGGTAGTTAGGACAA</code></p> + </div> + <div class="form-group"> + <label for="variant_sequence">Observed sequence</label> + <input type="text" name="variant_sequence" value="{{ variant_sequence }}" class="form-control form-pre example-target-2" placeholder="Observed sequence"> + <p>Example: <code class="example-input-2">ATGATTTGATCAGATACATGTGATACCGGTAGTTAGGACAA</code></p> + </div> + <div class="form-group"> + <input type="submit" class="btn btn-primary" value="Submit"> + <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/DescriptionExtractor" target="new" class="btn btn-default pull-right">Help</a> + </div> +</form> {% if description %} - <h3>Variant Description Extractor results:</h3> - -<table class="table"> - {% for m in messages %} - {% if m.class == "error" %} - <tr><td class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</td></tr> - {% elif m.class == "warning" %} - <tr><td class="warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</td></tr> - {% endif %} - {% endfor %} - - {% if summary == "0 Errors, 0 Warnings."%} - <tr><td class="success summary">{{ summary }}</td> - {% endif %} -</table> + <hr> + {% for m in messages %} + {% if m.class == "error" %} + <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> + {% elif m.class == "warning" %} + <p class="alert warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> + {% endif %} + {% endfor %} + {% if summary == "0 Errors, 0 Warnings." %} + <p class="alert alert-success summary">{{ summary }}</p> + {% else %} + <p>{{summary}}</p> + {% endif %} {% if not errors %} - <p> - <b>Genomic description:</b> - </p> - <p> - <pre>g.{{ description }}</pre> - </p> - <p> - <b>Overview of the raw variants:</b> - </p> + <hr> + + <h4>Genomic description</h4> + <p><code>g.{{ description }}</code></p> + + <h4>Overview of the raw variants</h4> <table class="table"> - <thead><tr> - <th>Start</th> - <th>End</th> - <th>Type</th> - <th>Deleted</th> - <th>Inserted</th> - <th>Shift</th> - <th>Description</th> - </tr></thead> - {% for raw_var in raw_vars %} - <tbody> - <tr> - <td>{{ raw_var.start }}</td> - <td>{{ raw_var.end }}</td> - <td>{{ raw_var.type }}</td> - <td>{{ raw_var.deleted }}</td> - <td>{{ raw_var.inserted }}</td> - <td>{{ raw_var.shift }}</td> - <td>{{ raw_var.hgvs }}</td> + <thead> + <tr> + <th>Start</th> + <th>End</th> + <th>Type</th> + <th>Deleted</th> + <th>Inserted</th> + <th>Shift</th> + <th>Description</th> </tr> - </tbody> - {% endfor %} + </thead> + <tbody> + {% for raw_var in raw_vars %} + <tr> + <td>{{ raw_var.start }}</td> + <td>{{ raw_var.end }}</td> + <td>{{ raw_var.type }}</td> + <td>{{ raw_var.deleted }}</td> + <td>{{ raw_var.inserted }}</td> + <td>{{ raw_var.shift }}</td> + <td>{{ raw_var.hgvs }}</td> + </tr> + {% endfor %} + </tbody> </table> - {% endif %} -{% endif %} + {% endif %}{# not errors #} +{% endif %}{# description #} {% endblock content %} diff --git a/mutalyzer/website/templates/name-checker.html b/mutalyzer/website/templates/name-checker.html index fc697e432cbd13fb1764e799d0cafe1a882d9654..94549c1180c0a2137b8ad3dd2760edeb62f047cf 100644 --- a/mutalyzer/website/templates/name-checker.html +++ b/mutalyzer/website/templates/name-checker.html @@ -1,5 +1,5 @@ {% if not standalone %} - {% extends "base.html" %} + {% extends "base.html" %} {% endif -%} <!DOCTYPE html> @@ -29,287 +29,285 @@ <body> - <h1>Name Checker</h1> +<h1>Name Checker</h1> - {% set active_page = "name-checker" %} - {% set page_title = "Name Checker" %} +{% set active_page = "name-checker" %} +{% set page_title = "Name Checker" %} - <div class="container-fluid" > +<div class="container-fluid" > {% block content %} - {% if parse_error %} - <div class="alert alert-danger"> - <h4>Parse error</h4> - <p>The "^" indicates the position where the error occurred:</p> - <pre>{{ parse_error[0] }}<br>{{ parse_error[1] }}</pre> - </div><!-- alert alert-danger --> - {% endif %} <!-- if parse_error --> - - {% if messages %} - {% for m in messages %} - {% if m.class == "error" %} - <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> - {% elif m.class == "warning" %} - <p class="alert alert-warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> - {% endif %} - {% endfor %} - {% endif %} <!-- messages --> - - {% if summary == "0 Errors, 0 Warnings."%} - <p class="alert alert-success summary">{{ summary }}</p> - {% else %} - <p>{{summary}}</p> - <hr /> +{% if not standalone %} + <p> + Please insert the mutation name using + the <a href="http://www.hgvs.org/mutnomen" title="Human Genome Variation + Society standard variant nomenclature" alt="Human Genome Variation Society + standard variant nomenclature">HGVS</a> format: + </p> + + <pre><accession number>.<version number>(<gene symbol>):<sequence type>.<variant description></pre> + + <form class="form" action="{{ url_for('.name_checker') }}" method="get"> + <div class="form-group"> + <label for="description">HGVS Description</label> + <input class="form-control form-pre example-target" type="text" name="description" id="hgvs" value="{{ description }}" placeholder="Mutation name using HGVS format"> + <p>Example: <code class="example-input">AB026906.1:c.274G>T</code></p> + </div> + + <div class="form-group button-group"> + <input type="submit" class="btn btn-primary" value="Check name"> + <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/NameChecker" target="new" class="btn btn-default pull-right">Help</a> + </div> + </form> + + {% if description %} + <hr> + {% endif %} +{% endif %}{# not standalone #} + +{% if description %} + {% if parse_error %} + <div class="alert alert-danger"> + <h4>Parse error</h4> + <pre>{{ parse_error[0] }}<br>{{ parse_error[1] }}</pre> + <p>The "^" indicates the position where the error occurred.</p> + </div> + {% endif %} + + {% if messages %} + {% for m in messages %} + {% if m.class == "error" %} + <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> + {% elif m.class == "warning" %} + <p class="alert alert-warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> + {% endif %} + {% endfor %} + {% endif %} + + {% if summary == "0 Errors, 0 Warnings." %} + <p class="alert alert-success summary">{{ summary }}</p> + {% else %} + <p>{{summary}}</p> + {% endif %} + + {% if not parse_error %} + <hr> + + <div class="row"> + <div class="col-md-8 name-checker-left-column"> + {% if visualisation %} + <h4>Overview of the raw variants</h4> + {% for i in visualisation %} + <p>Raw variant {{ loop.index }}: {{ i[0] }}</p> + <pre>{{ i[1] }}<br>{{ i[2] }}</pre> + {% endfor %} {% endif %} - {% if not standalone %} - <p> - Please insert the mutation name using the <a href="http://www.hgvs.org/mutnomen" title="Human Genome Variation Society standard variant nomenclature" alt="Human Genome Variation Society standard variant nomenclature">HGVS</a> format: <br/> + {% if browserLink %} + <p><a href="{{ browserLink }}">View original variant in UCSC Genome Browser</a></p> + {% endif %} - <code><accession number>.<version number>(<gene symbol>):<sequence type>.<variant description></code> - </p> + {% if genomicDescription %} + {% if genomicDNA %} + <h4>Genomic description</h4> + {% else %} + <h4>Description relative to transcription start</h4> + <p>(Not for use in LSDBs in case of protein-coding transcripts).</p> + {% endif %} + <p><code><a href="{{ url_for('.name_checker', description=genomicDescription) }}">{{ genomicDescription }}</a></code></p> + {% endif %} + + {% if chromDescription %} + <h4>Alternative chromosomal position</h4> + <p><code>{{ chromDescription }}</code></p> + {% endif %} - <p>Example: <code class="example-input">AB026906.1:c.274G>T</code> </p> + {% if descriptions %} + <h4>Affected transcripts</h4> + {% for i in descriptions %} + {% if i.endswith('?') %} + <p><code>{{ i }}</code></p> + {% else %} + <p><code><a href="{{ url_for('.name_checker', description=i) }}">{{ i }}</a></code></p> + {% endif %} + {% endfor %} + {% endif %} - <form class="form" action="{{ url_for('.name_checker') }}" method="get"> - <div class="form-group"> - <label for="description">HGVS Description</label> - <input class="form-control form-pre example-target" type="text" name="description" id="hgvs" value="{{ description }}" placeholder="Mutation name using HGVS format"> - </div> + {% if protDescriptions %} + <h4>Affected proteins</h4> + {% for i in protDescriptions %} + <p><code>{{ i }}</code></p> + {% endfor %} + {% endif %} + + {% if transcriptInfo %} + {% if oldProtein %} + <h4>Reference protein</h4> + <pre> + {%- for i in oldProtein -%} + {{-i |safe -}}<br> + {%- endfor -%} + </pre> + + <h4>Protein codedicted from variant coding sequence</h4> + {% if newProtein %} + <pre> + {%- for i in newProtein -%} + {{- i|safe -}}<br> + {%- endfor -%} + </pre> + {% else %} + <p>No change: codedicted protein (not shown) equals reference protein.</p> + {% endif %} + + {% if altStart %} + <h4>Alternative protein using start codon {{ altStart }}</h4> + {% if altProtein %} + <pre> + {%- for i in altProtein -%} + {{- i|safe -}}<br> + {%- endfor -%} + </pre> + {% else %} + <p>No change: codedicted protein (not shown) equals reference protein.</p> + {% endif %} + {% endif %} + {% endif %} + {% endif %}{# transcriptInfo #} + + {% if restrictionSites %} + <h4>Effects on Restriction sites</h4> + <table class="table"> + <thead> + <tr> + <th>Raw variant</th> + <th>Created</th> + <th>Deleted</th> + </tr> + </thead> + <tbody> + {% for i in restrictionSites %} + <tr> + <td>{{ loop.index }}</td> + <td> + {% for j in i[0] %} + {{ j }}{{ ',' if not loop.last }} + {% endfor %} + </td> + <td> + {% for j in i[1] %} + {{ j }}{{ ',' if not loop.last }} + {% endfor %} + </td> + </tr> + {% endfor %} + </tbody> + </table> + {% endif %} - <div class="form-group button-group"> - <input type="submit" class="btn btn-primary" value="Check name"> - <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/NameChecker" target="new" class="btn btn-default pull-right">Help</a> - <input type="reset" class="btn btn-default pull-right" value="Undo"> - </div> - </form> + {% if extractedDescription %} + <h4>Experimental services</h4> + <p>Genomic description: <code>{{ extractedDescription }}</code></p> + <p>Protein description: <code>{{ extractedProtein }}</code></p> {% endif %} + </div>{# class="col-md-8 name-checker-left-column" #} + + <div class="col-md-4"> + {% if transcriptInfo %} + <h4>Exon information</h4> + <table class="table table2"> + <thead> + <tr> + <th>Number</th> + <th>Start (g.)</th> + <th>Stop (g.)</th> + <th>Start {{ '(c.)' if transcriptCoding else '(n.)' }}</th> + <th>Stop {{ '(c.)' if transcriptCoding else '(n.)' }}</th> + </tr> + </thead> + <tbody> + {% for i in exonInfo %} + <tr> + <td>{{ loop.index }}</td> + {% for j in i %} + <td>{{ j }}</td> + {% endfor %} + </tr> + {% endfor %} + </tbody> + </table> + + {% if transcriptCoding %} + <h4><span class="helper" title="Coding Sequence">CDS</span> information</h4> + <table class="table"> + <thead> + <tr> + <th></th> + <th>g.</th> + <th>c.</th> + </tr> + </thead> + <tbody> + <tr> + <td>Start</td> + <td>{{ cdsStart_g }}</td> + <td>{{ cdsStart_c }}</td> + </tr> + <tr> + <td>Stop</td> + <td>{{ cdsStop_g }}</td> + <td>{{ cdsStop_c }}</td> + </tr> + </tbody> + </table> + {% endif %} + {% endif %}{# transcriptInfo #} + + {% if reference_filename and not standalone %} + <h4>Links</h4> + <p> + Download this reference sequence file: + <a href="{{ url_for('.reference', filename=reference_filename) }}">{{ reference_filename }}</a> + </p> + {% endif %} + </div>{# class="col-md-4" #} + </div>{# class="row" #} + + <div class="row"> + <div class="col-md-12"> + <hr /> + {% if legends %} + <h4>Legend</h4> + <table class="table table3"> + <thead> + <tr> + <th>Name</th> + <th>ID</th> + <th>Locus tag</th> + <th>Product</th> + <th>Link method</th> + </tr> + </thead> + <tbody> + {% for i in legends %} + <tr> + {% for j in i %} + <td>{{ j if j else '' }}</td> + {% endfor %} + </tr> + {% endfor %} + </tbody> + </table> + {% endif %} + </div> + </div> + {% endif %}{# not parse_error #} +{% endif %}{# description #} - <hr /> - <div class="row"> - <div class="col-md-8 name-checker-left-column"> - {% if visualisation %} - <h3>Overview of the raw variants</h3> - {% for i in visualisation %} - <p>Raw variant {{ loop.index }}: {{ i[0] }}</p> - <pre>{{ i[1] }}<br>{{ i[2] }}</pre> - {% endfor %} - {% endif %} <!-- if visualisation --> - - {% if browserLink %} - <p> - <a href="{{ browserLink }}">View original variant in UCSC Genome Browser</a> - </p> - {% endif %} <!-- if browserLink --> - - {% if not parse_error %} - {% if description %} - <h3>Name checker results</h3> - - {% if genomicDescription %} - {% if genomicDNA %} - <h4>Genomic description</h4> - {% else %} <!-- if genomicDNA --> - <h4>Description relative to transcription start</h4> - (Not for use in LSDBs in case of protein-coding transcripts). - {% endif %} <!-- if genomicDNA --> - <code><a href="{{ url_for('.name_checker', description=genomicDescription) }}">{{ genomicDescription }}</a></code> - {% endif %} <!-- if genomicDescription --> - - {% if chromDescription %} - <p>Alternative chromosomal position:</p> - <code>{{ chromDescription }}</code> - {% endif %} <!-- if chromDescription --> - - {% if descriptions %} - <h4>Affected transcripts:</h4> - {% for i in descriptions %} - {% if i.endswith('?') %} - <code>{{ i }}</code> - {% else %} - <code><a href="{{ url_for('.name_checker', description=i) }}">{{ i }}</a></code> - {% endif %} <!-- if endswith --> - {% endfor %} <!-- for i in descriptions --> - {% endif %} <!-- if descriptions --> - - {% if protDescriptions %} - <h4>Affected proteins:</h4> - <p> - {% for i in protDescriptions %} - <code>{{ i }}</code> - {% endfor %} <!-- for i in protDescriptions --> - </p> - {% endif %} <!-- if protDescriptions --> - - {% if transcriptInfo %} - {% if oldProtein %} - <h4>Reference protein</h4> - <pre> - {%- for i in oldProtein -%} - {{-i |safe -}}<br> - {%- endfor -%} - </pre> - - <h4>Protein codedicted from variant coding sequence</h4> - {% if newProtein %} - <pre> - {%- for i in newProtein -%} - {{- i|safe -}}<br> - {%- endfor -%} <!-- for i in newProtein --> - </pre> - {% else %} <!-- if newProtein --> - <p> - No change: codedicted protein (not shown) equals reference - protein. - </p> - {% endif %} <!-- if newProtein --> - - {% if altStart %} - <h4>Alternative protein using start codon {{ altStart }}</h4> - {% if altProtein %} - <pre> - {%- for i in altProtein -%} - {{- i|safe -}}<br> - {%- endfor -%} <!-- for i in altProtein --> - </pre> - {% else %} <!-- if altProtein --> - <p>No change: codedicted protein (not shown) equals reference protein.</p> - {% endif %} <!-- if altProtein --> - {% endif %} <!-- if altStart --> - {% endif %} <!-- if transcriptInfo --> - - {% if restrictionSites %} - <h4>Effects on Restriction sites</h4> - <div class="code"> - <table class="table table3"> - <thead> - <th>Raw variant</th> - <th>Created</th> - <th>Deleted</th> - </thead> - {% for i in restrictionSites %} - <tr> - <td>{{ loop.index }}</td> - <td> - {% for j in i[0] %} - {{ j }}{{ ',' if not loop.last }} - {% endfor %} - </td> - <td> - {% for j in i[1] %} - {{ j }}{{ ',' if not loop.last }} - {% endfor %} - </td> - </tr> - {% endfor %} - </table> - </div> - {% endif %} <!-- if restrictionSites --> - - {% if extractedDescription %} - <h4>Experimental services</h4> - <p>Genomic description: <code>{{ extractedDescription }}</code></p> - <p>Protein description: <code>{{ extractedProtein }}</code></p> - {% endif %} <!-- if extractedDescription --> - {% endif %} <!-- description --> - {% endif %} <!-- parse_error --> - </div><!-- col-md-8 --> - - <div class="col-md-4"> - {% if description %} - <h4>Exon information</h4> - <div class="code"> - <table class="table table2"> - <thead> - <th>Number</th> - <th>Start (g.)</th> - <th>Stop (g.)</th> - <th>Start {{ '(c.)' if transcriptCoding else '(n.)' }}</th> - <th>Stop {{ '(c.)' if transcriptCoding else '(n.)' }}</th> - </thead> - - {% for i in exonInfo %} - <tr> - <td>{{ loop.index }}</td> - {% for j in i %} - <td>{{ j }}</td> - {% endfor %} - </tr> - {% endfor %} - </table> - </div> - - {% if transcriptCoding %} - <h4><span class = "helper" title = "Coding Sequence">CDS</span> information:</h4> - <div class="code"> - <table class="table table3"> - <thead> - <th></th> - <th>g.</th> - <th>c.</th> - </thead> - <tr> - <td>Start</td> - <td>{{ cdsStart_g }}</td> - <td>{{ cdsStart_c }}</td> - </tr> - <tr> - <td>Stop</td> - <td>{{ cdsStop_g }}</td> - <td>{{ cdsStop_c }}</td> - </tr> - <tr> - </tr> - </table> - </div> - {% endif %} <!-- if transcriptCoding --> - <!-- {% endif %} --> <!-- ??? --> - - - {% if reference_filename and not standalone %} - <h4>Links</h4> - <p> - Download this reference sequence file: - <a href="{{ url_for('.reference', filename=reference_filename) }}">{{ reference_filename }}</a> - </p> - {% endif %} - - {% endif %} <!-- description --> - </div><!-- col-md-4 --> - </div><!-- row --> - - {% if not parse_error %} - <div class="row"> - <div class="col-md-12"> - <hr /> - {% if legends %} - <h4>Legend</h4> - <div class="code"> - <table class="table table3"> - <thead> - <th>Name</th> - <th>ID</th> - <th>Locus tag</th> - <th>Product</th> - <th>Link method</th> - </thead> - {% for i in legends %} - <tr> - {% for j in i %} - <td>{{ j if j else '' }}</td> - {% endfor %} - </tr> - {% endfor %} - </table> - </div> - {% endif %} - </div><!-- col-md-12 --> - </div><!-- row --> - {% endif %} {% endblock content %} - </div> +</div> {% if piwik %} <!-- Piwik --> diff --git a/mutalyzer/website/templates/name-generator.html b/mutalyzer/website/templates/name-generator.html index 0467603ce2466d175d2bdcbcd9abf81e1d54b576..fcf152e3fe7c96c80bce135eb20c3591288e780b 100644 --- a/mutalyzer/website/templates/name-generator.html +++ b/mutalyzer/website/templates/name-generator.html @@ -1,156 +1,156 @@ - {% extends "base.html" %} {% set active_page = "name-generator" %} {% set page_title = "Name Generator" %} {% block content %} - <div class="form"> - - <p>Construct the mutation from a reference by adding variants to it. The HGVS name is constructed instantly <a href="#constructed_name">below</a>. - - <hr/> - - <form id="mainform" onkeyup="update();" onchange="update();" style="padding: 0;" class="form-horizontal" role="form"> - - <h4>Reference</h4> - <div class="form-group"> - <label for="refe" class="col-sm-2 control-label">Reference sequence</label> - <div class="col-sm-10"> - <input type="text" name="refe" value=""class="form-control" placeholder="Reference" > - </div> - </div> - - <div class="form-group"> - <label for="seqT" class="col-sm-2 control-label">Sequence Type</label> - <div class="col-sm-10"> - <select name="seqT" class="form-control"> - <option value="g">Genomic</option> - <option value="c" selected="1">Coding DNA</option> - <option value="n">NonCoding DNA</option> - <option value="r">RNAcss</option> - <option value="m">Mitochondrial DNA</option> - <option value="p" disabled="true">Protein</option> - <!-- Protein Naming not yet implemented--> - <option value="e">EST</option> - </select> - </div> - </div> - - - <div id="tlc" style="display: none; " class="form-group"> - <label class="label-left">TLC</label> - <div class="radio"> - <label class="label-left"><input type="radio" name="tlc" value="0"class="form-control" > One Letter Code</label> - </div> - <div class="radio"> - <label class="label-left"><input type="radio" name="tlc" value="1" checked=""class="form-control" > Three Letter Code</label> - </div> - </div> - - <div id="gSym" class="form-group"> - <label for="gSym" class="col-sm-2 control-label">Gene symbol</label> - <div class="col-sm-10"> - <input type="text" name="gSym" size="20" value=""class="form-control" placeholder="Gene symbol"> - </div> - </div> - - <div id="tVar" class="form-group"> - <label for="tVar" class="col-sm-2 control-label">Transcript</label> - <div class="col-sm-10"> - <input type="text" name="tVar" size="20" value=""class="form-control form-control-small" placeholder="Transcript"> - </div> - </div> - - <div class="form-group small text-danger"> - <div class="col-sm-offset-2 col-sm-10"> - <div id="seqTerror" style="display: none;"></div> - <div id="refeerror"></div> - <div id="gSymerror"></div> - <div id="tVarerror"></div> - </div> - </div> - - <div id="variants"> - <!-- This is where the mutations will be arriving --> - </div> - -<!-- <div id="optional"> - <sup>*</sup> This field is optional - </div> --> - + + <div class="form"> + + <p>Construct the mutation from a reference by adding variants to it. The HGVS name is constructed instantly <a href="#constructed_name">below</a>. + + <hr/> + + <form id="mainform" onkeyup="update();" onchange="update();" style="padding: 0;" class="form-horizontal" role="form"> + + <h4>Reference</h4> + <div class="form-group"> + <label for="refe" class="col-sm-2 control-label">Reference sequence</label> + <div class="col-sm-10"> + <input type="text" name="refe" value=""class="form-control" placeholder="Reference" > + </div> + </div> + + <div class="form-group"> + <label for="seqT" class="col-sm-2 control-label">Sequence Type</label> + <div class="col-sm-10"> + <select name="seqT" class="form-control"> + <option value="g">Genomic</option> + <option value="c" selected="1">Coding DNA</option> + <option value="n">NonCoding DNA</option> + <option value="r">RNAcss</option> + <option value="m">Mitochondrial DNA</option> + <option value="p" disabled="true">Protein</option> + <!-- Protein Naming not yet implemented--> + <option value="e">EST</option> + </select> + </div> + </div> + + + <div id="tlc" style="display: none; " class="form-group"> + <label class="label-left">TLC</label> + <div class="radio"> + <label class="label-left"><input type="radio" name="tlc" value="0"class="form-control" > One Letter Code</label> + </div> + <div class="radio"> + <label class="label-left"><input type="radio" name="tlc" value="1" checked=""class="form-control" > Three Letter Code</label> + </div> + </div> + + <div id="gSym" class="form-group"> + <label for="gSym" class="col-sm-2 control-label">Gene symbol</label> + <div class="col-sm-10"> + <input type="text" name="gSym" size="20" value=""class="form-control" placeholder="Gene symbol"> + </div> + </div> + + <div id="tVar" class="form-group"> + <label for="tVar" class="col-sm-2 control-label">Transcript</label> + <div class="col-sm-10"> + <input type="text" name="tVar" size="20" value="" class="form-control" placeholder="Transcript"> + </div> + </div> + + <div class="form-group small text-danger"> + <div class="col-sm-offset-2 col-sm-10"> + <div id="seqTerror" style="display: none;"></div> + <div id="refeerror"></div> + <div id="gSymerror"></div> + <div id="tVarerror"></div> + </div> + </div> + + <div id="variants"> + <!-- This is where the mutations will be arriving --> + </div> + +<!-- <div id="optional"> + <sup>*</sup> This field is optional + </div> --> + <!-- Variant Template --> - <div id="varianttemplate" style="display: none"> - <div class="row form-horizontal-inline"> - <div class="form-group col-md-6" id="V{NMBR}mutTrow"> - <label for="V{NMBR}mutT" id="V{NMBR}mutTname">Mutation Type</label> - <select name="V{NMBR}mutT" onchange="update();"class="form-control input-sm" > - <option value="1">Substitution</option> - <option value="2">Deletion</option> - <option value="3">Insertion</option> - <option value="4">Duplication</option> - <option value="5">Insertion/Deletion</option> - <option value="6">Inversion</option> - </select> - <div class="text-danger small" id="{NMBR}mutTerror" class="errors"></div> - </div> - - <div class="form-group col-md-6" id="V{NMBR}P1row"> - <label id="V{NMBR}P1name">Start Position</label> - <input type="text" name="V{NMBR}P1" value="" class="form-control input-sm"> - <div class="text-danger small" id="V{NMBR}P1error"></div> - </div> - - <div class="form-group col-md-6" id="V{NMBR}P2row"> - <label id="V{NMBR}P2name">End Position</label> - <input type="text" name="V{NMBR}P2" size="20" value="" class="form-control input-sm" > - <div class="text-danger small" id="V{NMBR}P2error"></div> - </div> - </div> - <div class="row form-horizontal-inline"> - <div class="col-md-6" id="V{NMBR}S1row"> - <div class="form-group" name="S1"> - <label id="V{NMBR}S1name">Old Sequence</label> - <input type="text" name="V{NMBR}S1" size="20" value=""class="form-control input-sm"> - <div class="text-danger small" id="V{NMBR}S1error"></div> - </div> - </div> - - <div class="col-md-6" id="V{NMBR}S2row"> - <div class="form-group" name="S2"> - <label id="V{NMBR}S2name">New Sequence</label> - <input type="text" name="V{NMBR}S2" size="20" value=""class="form-control input-sm"> - <div class="text-danger small" id="V{NMBR}S2error"></div> - </div> - </div> - </div> - <hr/> - </div><!-- varianttemplate --> - - - - <div class="form-group"> - <div class="col-sm-12"> - <input type="button" onclick="addVariant();" class="btn btn-success" value="Add variant +"> - <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/NameGenerator" target="new" class="btn btn-default pull-right">Help</a> - <input type="button" onclick="if(confirm('This action will clear all input fields'))javascript:location.reload(true);" value="Clear form" class="btn btn-default pull-right"> - </div> - </div> - - - - </form> - - <hr/> - - <a id="constructed_name"><h4>Constructed HGVS Name</h4></a> - <pre id="output" > - <!-- Empty PlaceHolder --> - </pre> - <p class="text-muted">Please click the link to check with the Name Checker</p> - - </div><!-- form --> + <div id="varianttemplate" style="display: none"> + <div class="row form-horizontal-inline"> + <div class="form-group col-md-6" id="V{NMBR}mutTrow"> + <label for="V{NMBR}mutT" id="V{NMBR}mutTname">Mutation Type</label> + <select name="V{NMBR}mutT" onchange="update();"class="form-control input-sm" > + <option value="1">Substitution</option> + <option value="2">Deletion</option> + <option value="3">Insertion</option> + <option value="4">Duplication</option> + <option value="5">Insertion/Deletion</option> + <option value="6">Inversion</option> + </select> + <div class="text-danger small" id="{NMBR}mutTerror" class="errors"></div> + </div> + + <div class="form-group col-md-6" id="V{NMBR}P1row"> + <label id="V{NMBR}P1name">Start Position</label> + <input type="text" name="V{NMBR}P1" value="" class="form-control input-sm"> + <div class="text-danger small" id="V{NMBR}P1error"></div> + </div> + + <div class="form-group col-md-6" id="V{NMBR}P2row"> + <label id="V{NMBR}P2name">End Position</label> + <input type="text" name="V{NMBR}P2" size="20" value="" class="form-control input-sm" > + <div class="text-danger small" id="V{NMBR}P2error"></div> + </div> + </div> + <div class="row form-horizontal-inline"> + <div class="col-md-6" id="V{NMBR}S1row"> + <div class="form-group" name="S1"> + <label id="V{NMBR}S1name">Old Sequence</label> + <input type="text" name="V{NMBR}S1" size="20" value=""class="form-control input-sm"> + <div class="text-danger small" id="V{NMBR}S1error"></div> + </div> + </div> + + <div class="col-md-6" id="V{NMBR}S2row"> + <div class="form-group" name="S2"> + <label id="V{NMBR}S2name">New Sequence</label> + <input type="text" name="V{NMBR}S2" size="20" value=""class="form-control input-sm"> + <div class="text-danger small" id="V{NMBR}S2error"></div> + </div> + </div> + </div> + <hr/> + </div><!-- varianttemplate --> + + + + <div class="form-group"> + <div class="col-sm-12"> + <input type="button" onclick="addVariant();" class="btn btn-success" value="Add variant +"> + <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/NameGenerator" target="new" class="btn btn-default pull-right">Help</a> + <input type="button" onclick="if(confirm('This action will clear all input fields'))javascript:location.reload(true);" value="Clear form" class="btn btn-default pull-right"> + </div> + </div> + + + + </form> + + <hr/> + + <a id="constructed_name"></a><h4>Constructed HGVS Name</h4> + <p><code id="output" > + <!-- Empty PlaceHolder --> + </code></p> + <p class="text-muted">Please click the link to check with the Name Checker</p> + + </div><!-- form --> <!-- Inline Javascript --> @@ -165,6 +165,4 @@ </script> - - {% endblock content %} diff --git a/mutalyzer/website/templates/position-converter.html b/mutalyzer/website/templates/position-converter.html index d7dc142404bc690a70d5725581135fd73eec3f4d..625e4219b6f237e83e90bb5f366e0f64381e3353 100644 --- a/mutalyzer/website/templates/position-converter.html +++ b/mutalyzer/website/templates/position-converter.html @@ -5,80 +5,64 @@ {% block content %} - <p> - Please supply the genome assembly which you want to use to convert your - position. - </p> - <p> - <b>Note:</b> The Position Converter does NOT check the description or - normalize it to HGVS. Use the <a href="{{ url_for('.name_checker') }}">Name Checker</a> for this. - </p> - <p> - Examples: <code class="example-input">NM_003002.2:c.274G>T</code>, <code class="example-input">chr11:g.111959693G>T</code> and <code class="example-input">NC_000011.9:g.111959693G>T</code> - </p> - <form class="form-horizontal" role="form" action="{{ url_for('.position_converter') }}" method="get" enctype="multipart/form-data"> - - <div class="form-group"> - <label for="assembly_name_or_alias" class="col-md-2 control-label">Build</label> - <div class="col-md-10"> - <select name="assembly_name_or_alias" class="form-control"> - {% for assembly in assemblies %} - <option value="{{ assembly.name }}"{% if assembly_name_or_alias in (assembly.name, assembly.alias) %} selected="selected"{% endif %}>{{ assembly.taxonomy_common_name }} — {{ assembly.name }}{% if assembly.alias %} ({{ assembly.alias }}){% endif %}</option> - {% endfor %} - </select> - </div> - </div> - - <div class="form-group"> - <label for="description" class="col-md-2 control-label">Variant</label> - <div class="col-md-10"> - <input type="text" name="description" value="{{ description }}" class="form-control form-pre example-target" placeholder="Variant"> - </div> - </div> - <div class="form-group"> - <div class=" col-md-12"> - <input type="submit" class="btn btn-primary" value="Submit"> - <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/PositionConverter" target="new" class="btn btn-default pull-right">Help</a> - <input type="reset" class="btn btn-default pull-right" value="Undo"> - </div> - </div> - </form> +<p> +Please supply the genome assembly which you want to use to convert your +position. +</p> -{% if description %} - <h3>Results</h3> +<p> +<b>Note:</b> The Position Converter does NOT check the description or +normalize it to HGVS. Use the <a href="{{ url_for('.name_checker') }}">Name Checker</a> for this. +</p> + + +<form class="form" role="form" action="{{ url_for('.position_converter') }}" method="get" enctype="multipart/form-data"> + <div class="form-group"> + <label for="assembly_name_or_alias">Build</label> + <select name="assembly_name_or_alias" class="form-control"> + {% for assembly in assemblies %} + <option value="{{ assembly.name }}"{% if assembly_name_or_alias in (assembly.name, assembly.alias) %} selected="selected"{% endif %}>{{ assembly.taxonomy_common_name }} — {{ assembly.name }}{% if assembly.alias %} ({{ assembly.alias }}){% endif %}</option> + {% endfor %} + </select> + </div> + <div class="form-group"> + <label for="description">Variant</label> + <input type="text" name="description" value="{{ description }}" class="form-control form-pre example-target" placeholder="Variant"> + <p>Examples: <code class="example-input">NM_003002.2:c.274G>T</code>, <code class="example-input">chr11:g.111959693G>T</code> and <code class="example-input">NC_000011.9:g.111959693G>T</code></p> + </div> + <div class="form-group button-group"> + <input type="submit" class="btn btn-primary" value="Submit"> + <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/PositionConverter" target="new" class="btn btn-default pull-right">Help</a> + </div> +</form> +{% if description %} + <hr> {% for m in messages %} - {% if m.class == "error" %} - <div class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</div> - {% elif m.class == "warning" %} - <div class="alert warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</div> - {% endif %} + {% if m.class == "error" %} + <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> + {% elif m.class == "warning" %} + <p class="alert warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> + {% endif %} {% endfor %} - - {% if summary == "0 Errors, 0 Warnings."%} - <div class="alert success summary">{{ summary }}</div> + + {% if summary == "0 Errors, 0 Warnings." %} + <p class="alert alert-success summary">{{ summary }}</p> {% else %} - <div>{{summary}}</div> + <p>{{summary}}</p> {% endif %} {% if chromosomal_description %} - <p> - <h4>Chromosomal Variant:</h4> - </p> - <pre>{{ chromosomal_description }}</pre> - {% if not transcript_descriptions %} - <p> - <b>No transcripts found in mutation region</b> - </p> - {% endif %} - {% endif %} + <h4>Chromosomal variant</h4> + <p><code>{{ chromosomal_description }}</code></p> - {% if transcript_descriptions %} - <p> - <b>Found transcripts in mutation region:</b> - </p> - <pre>{% for d in transcript_descriptions %}{{ d }}<br>{% endfor %}</pre> + {% if transcript_descriptions %} + <h4>Found transcripts in mutation region</h4> + <pre>{% for d in transcript_descriptions %}{{ d }}<br>{% endfor %}</pre> + {% else %} + <h4>No transcripts found in mutation region</h4> + {% endif %} {% endif %} -{% endif %} +{% endif %}{# description #} {% endblock content %} diff --git a/mutalyzer/website/templates/reference-loader.html b/mutalyzer/website/templates/reference-loader.html index decbc6b89913b6b15dc76bb611f40bae4b10e075..a4e2e1ba3534738a0559f4a3c32f8aeccd565e01 100644 --- a/mutalyzer/website/templates/reference-loader.html +++ b/mutalyzer/website/templates/reference-loader.html @@ -13,174 +13,172 @@ window.onload=function(){ } </script> -{% if errors %} -<div class="alert alert-danger" role="alert"> - <h4>Reference File not loaded!</h4> - The following errors occured: - <ul> - {% for i in errors %} - <li>{{ i }}</li> - {% endfor %} - </ul> -</div> -{% endif %} - -{% if ud %} -<div class="alert alert-success"> - <h4>Reference Sequence successfully loaded</h4> - <p>Your reference sequence was loaded successfully. You can now use Mutalyzer with the following accession number as reference:</p> - <p class="text-center" style="font-size: 20px"><strong>{{ ud }}</strong></p> - <p class="text-center"><a href="{{ url_for('.reference', filename=ud + '.gb') }}" id="reference_download" class="">Download this reference sequence.</a></p> -</div> -{% endif %} - - <p> The Reference File Loader allows you to use your own reference sequence when no appropriate RefSeq, GenBank or LRG file is available. </p> <p> Please select one of the options below to upload or retrieve your reference -sequence (maximum size is {{ max_file_size }} megabytes): +sequence (maximum size is {{ max_file_size }} megabytes). </p> <form name="invoer" enctype="multipart/form-data" action="{{ url_for('.reference_loader') }}" method="post"> - <div class="row"> - <div class="col-md-6"> - <div class="form-group" id="input-methods"> - <div class="radio"> - <label> - <input type="radio" name="method" value="upload" checked > - The reference sequence file is a local file - </label> - </div> - <div class="radio"> - <label> - <input type="radio" name="method" value="url" > - The reference sequence file can be found at the following URL - </label> - </div> - <div class="radio"> - <label> - <input type="radio" name="method" value="slice_gene" > - Retrieve part of the reference genome for a (HGNC) gene symbol - </label> - </div> - <div class="radio"> - <label> - <input type="radio" name="method" value="slice_accession" > - Retrieve a range of a chromosome by accession number - </label> - </div> - <div class="radio"> - <label> - <input type="radio" name="method" value="slice_chromosome" > - Retrieve a range of a chromosome by name - </label> - </div> - </div> - </div> - <script type="text/javascript"> - $('#input-methods input').on('change', updateVisibility); - </script> - <div class="col-md-6"> - - - <div class="form-group" id="upload_label"> - <label for="file">GenBank file</label> - <input type="file" name="file"> - <p class="help-block">Please select the GenBank file in plain text format</p> - </div> - - - <div class="form-group" id="url_label"> - <label for="url">GenBank file URL</label> - <input type="text" name="url" class="form-control"> - <p class="help-block">Please enter the URL of the GenBank file in plain text (including http://)</p> - </div> - - - <div id="slice_gene_label"> - <div class="form-group"> - <p class="help-block">Please enter the Gene symbol and organism name without spaces - and specify the length of the flanking sequences</p> - <p class="help-block"><b>Note:</b> This uses - the <a href="http://www.ncbi.nlm.nih.gov/sites/gquery">NCBI - Entrez</a> search engine and is therefore based on the current - Entrez assembly for the given organism (GRCh38/hg38 for human).</p> - - <label for="genesymbol">Gene symbol</label> - <input type="text" name="genesymbol" class="form-control"> - </div> - <div class="form-group"> - <label for="organism">Organism name</label> - <input type="text" name="organism" class="form-control"> - </div> - <div class="form-group"> - <label for="upstream">Number of 5' flanking nucleotides</label> - <input type="text" name="upstream" value="5000" class="form-control"> - </div> - <div class="form-group"> - <label for="downstream"><td>Number of 3' flanking nucleotides</label> - <input type="text" name="downstream" value="2000" class="form-control"> - </div> - </div> - - - <div id="slice_accession_label"> - <div class="form-group"> - <p class="help-block">Please enter the accession number of the chromosome or contig and specify the range</p> - <label>Chromosome accession number</label> - <input type="text" name="accession" class="form-control"> - </div> - <div class="form-group"> - <label>Start position</label> - <input type="text" name="accession_start" class="form-control"> - </div> - <div class="form-group"> - <label>Stop position</label> - <input type="text" name="accession_stop" class="form-control"> - </div> - <div class="form-group"> - <label>Orientation</label> - <div class="radio"><label><input type="radio" name="accession_orientation" value="1" checked> Forward</label></div> - <div class="radio"><label><input type="radio" name="accession_orientation" value="2"> Reverse</label></div> - </div> - </div> - - <div id="slice_chromosome_label"> - <div class="form-group"> - <p class="help-block">Please enter the name of the chromosome and specify the range</p> - <label for="assembly_name_or_alias">Assembly</label> - <select name="assembly_name_or_alias"> - {% for assembly in assemblies %} - <option value="{{ assembly.name }}"{% if assembly_name_or_alias in (assembly.name, assembly.alias) %} selected="selected"{% endif %}>{{ assembly.taxonomy_common_name }} — {{ assembly.name }}{% if assembly.alias %} ({{assembly.alias }}){% endif %}</option> - {% endfor %} - </select> - </div> - <div class="form-group"> - <label for="chromosome">Chromosome name</label> - <input type="text" name="chromosome" class="form-control"> - </div> - <div class="form-group"> - <label for="chromosome_start">Start position</label> - <input type="text" name="chromosome_start" class="form-control"> - </div> - <div class="form-group"> - <label for="chromosome_stop">Stop position</label> - <input type="text" name="chromosome_stop" class="form-control"> - </div> - <div class="form-group"> - <label for="chromosome_orientation">Orientation</label> - <div class="radio"><label><input type="radio" name="chromosome_orientation" value="1" checked> Forward</label></div> - <div class="radio"><label><input type="radio" name="chromosome_orientation" value="2"> Reverse</label></div> - </div> - </div> - </div> - </div> - <input type="submit" value="Submit"class="btn btn-primary btn-submit" > - <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/SyntaxChecker" target="_blank" class="btn btn-default pull-right">Help</a> - + <div class="row"> + <div class="col-md-6"> + <div class="form-group" id="input-methods"> + <div class="radio"> + <label> + <input type="radio" name="method" value="upload" checked > + The reference sequence file is a local file. + </label> + </div> + <div class="radio"> + <label> + <input type="radio" name="method" value="url" > + The reference sequence file can be found at the following URL. + </label> + </div> + <div class="radio"> + <label> + <input type="radio" name="method" value="slice_gene" > + Retrieve part of the reference genome for a (HGNC) gene symbol. + </label> + </div> + <div class="radio"> + <label> + <input type="radio" name="method" value="slice_accession" > + Retrieve a range of a chromosome by accession number. + </label> + </div> + <div class="radio"> + <label> + <input type="radio" name="method" value="slice_chromosome" > + Retrieve a range of a chromosome by name. + </label> + </div> + </div> + </div> + + <script type="text/javascript"> + $('#input-methods input').on('change', updateVisibility); + </script> + + <div class="col-md-6"> + <div class="form-group" id="upload_label"> + <label for="file">GenBank file</label> + <input type="file" name="file"> + <p class="help-block">Please select the GenBank file in plain text format.</p> + </div> + + <div class="form-group" id="url_label"> + <label for="url">GenBank file URL</label> + <input type="text" name="url" class="form-control"> + <p class="help-block">Please enter the URL of the GenBank file in plain text (including http://).</p> + </div> + + <div id="slice_gene_label"> + <div class="form-group"> + <p class="help-block">Please enter the Gene symbol and organism name without spaces + and specify the length of the flanking sequences.</p> + <p class="help-block"><b>Note:</b> This uses + the <a href="http://www.ncbi.nlm.nih.gov/sites/gquery">NCBI + Entrez</a> search engine and is therefore based on the current + Entrez assembly for the given organism (GRCh38/hg38 for human).</p> + <label for="genesymbol">Gene symbol</label> + <input type="text" name="genesymbol" class="form-control"> + </div> + <div class="form-group"> + <label for="organism">Organism name</label> + <input type="text" name="organism" class="form-control"> + </div> + <div class="form-group"> + <label for="upstream">Number of 5' flanking nucleotides</label> + <input type="text" name="upstream" value="5000" class="form-control"> + </div> + <div class="form-group"> + <label for="downstream"><td>Number of 3' flanking nucleotides</label> + <input type="text" name="downstream" value="2000" class="form-control"> + </div> + </div> + + <div id="slice_accession_label"> + <div class="form-group"> + <p class="help-block">Please enter the accession number of the chromosome or contig and specify the range.</p> + <label>Chromosome accession number</label> + <input type="text" name="accession" class="form-control"> + </div> + <div class="form-group"> + <label>Start position</label> + <input type="text" name="accession_start" class="form-control"> + </div> + <div class="form-group"> + <label>Stop position</label> + <input type="text" name="accession_stop" class="form-control"> + </div> + <div class="form-group"> + <label>Orientation</label> + <div class="radio"><label><input type="radio" name="accession_orientation" value="1" checked> Forward</label></div> + <div class="radio"><label><input type="radio" name="accession_orientation" value="2"> Reverse</label></div> + </div> + </div> + + <div id="slice_chromosome_label"> + <div class="form-group"> + <p class="help-block">Please enter the name of the chromosome and specify the range.</p> + <label for="assembly_name_or_alias">Assembly</label> + <select name="assembly_name_or_alias" class="form-control"> + {% for assembly in assemblies %} + <option value="{{ assembly.name }}"{% if assembly_name_or_alias in (assembly.name, assembly.alias) %} selected="selected"{% endif %}>{{ assembly.taxonomy_common_name }} — {{ assembly.name }}{% if assembly.alias %} ({{assembly.alias }}){% endif %}</option> + {% endfor %} + </select> + </div> + <div class="form-group"> + <label for="chromosome">Chromosome name</label> + <input type="text" name="chromosome" class="form-control"> + </div> + <div class="form-group"> + <label for="chromosome_start">Start position</label> + <input type="text" name="chromosome_start" class="form-control"> + </div> + <div class="form-group"> + <label for="chromosome_stop">Stop position</label> + <input type="text" name="chromosome_stop" class="form-control"> + </div> + <div class="form-group"> + <label for="chromosome_orientation">Orientation</label> + <div class="radio"><label><input type="radio" name="chromosome_orientation" value="1" checked> Forward</label></div> + <div class="radio"><label><input type="radio" name="chromosome_orientation" value="2"> Reverse</label></div> + </div> + </div> + </div> + </div> + <div class="form-group"> + <input type="submit" value="Submit"class="btn btn-primary"> + <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/SyntaxChecker" target="_blank" class="btn btn-default pull-right">Help</a> + </div> </form> +{% if errors %} + <hr> + <div class="alert alert-danger" role="alert"> + <h4>Reference File not loaded!</h4> + The following errors occured: + <ul> + {% for i in errors %} + <li>{{ i }}</li> + {% endfor %} + </ul> + </div> +{% endif %} + +{% if ud %} + <hr> + <div class="alert alert-success"> + <h4>Reference Sequence successfully loaded</h4> + <p>Your reference sequence was loaded successfully. You can now use Mutalyzer with the following accession number as reference:</p> + <p class="text-center" style="font-size: 20px"><code>{{ ud }}</code></p> + <p><a href="{{ url_for('.reference', filename=ud + '.gb') }}" id="reference_download" class="">Download this reference sequence</a>.</p> + </div> +{% endif %} + {% endblock content %} diff --git a/mutalyzer/website/templates/snp-converter.html b/mutalyzer/website/templates/snp-converter.html index 837ce97c27218ec863c1889572126d7a7b080128..b24064ff9b0b3cbdfedca2ee3abd75c076e91630 100644 --- a/mutalyzer/website/templates/snp-converter.html +++ b/mutalyzer/website/templates/snp-converter.html @@ -5,68 +5,53 @@ {% block content %} - {% if messages %} - {% for m in messages %} - {% if m.class == "error" %} - <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> - {% elif m.class == "warning" %} - <p class="alert alert-warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> - {% endif %} - {% endfor %} - {% endif %} <!-- messages --> - - {% if summary == "0 Errors, 0 Warnings."%} - <p class="alert alert-success summary">{{ summary }}</p> - {% else %} - <p>{{summary}}</p> - <hr /> - {% endif %} - - <p> - Please insert the - <a href="http://www.ncbi.nlm.nih.gov/projects/SNP/">dbSNP</a> rs - number below. Mutalyzer will retrieve the HGVS description of the SNP specified on the reference sequence(s) used by dbSNP. - </p> - - <p> - Example: <code class="example-input">rs9919552</code> - </p> - - <form role="form" class="form" action="{{ url_for('.snp_converter') }}" method="get"> - <div class="form-group"> - <label for="description">dbSNP rs number</label> - <input type="text" class="form-control form-pre example-target" name="rs_id" placeholder="" value="{{ rs_id }}" ></input> - </div> - - <div class="form-group"> - <input type="submit" class="btn btn-primary" value="Submit"> - <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/PositionConverter" target="new" class="btn btn-default pull-right">Help</a> - <input type="reset" class="btn btn-default pull-right" value="Undo"> - </div> - </form> +<p> +Please insert +the <a href="http://www.ncbi.nlm.nih.gov/projects/SNP/">dbSNP</a> rs number +below. Mutalyzer will retrieve the HGVS description of the SNP specified on +the reference sequence(s) used by dbSNP. +</p> + +<form role="form" class="form" action="{{ url_for('.snp_converter') }}" method="get"> + <div class="form-group"> + <label for="description">dbSNP rs number</label> + <input type="text" class="form-control form-pre example-target" name="rs_id" placeholder="" value="{{ rs_id }}" ></input> + <p>Example: <code class="example-input">rs9919552</code></p> + </div> + + <div class="form-group"> + <input type="submit" class="btn btn-primary" value="Submit"> + <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/PositionConverter" target="new" class="btn btn-default pull-right">Help</a> + </div> +</form> {% if rs_id %} - <h3>SNP converter results</h3> + <hr> + {% if messages %} + {% for m in messages %} + {% if m.class == "error" %} + <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> + {% elif m.class == "warning" %} + <p class="alert alert-warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> + {% endif %} + {% endfor %} + {% endif %} -<!-- {% for m in messages %} - {% if m.class == "error" %} - <div class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</div> - {% elif m.class == "warning" %} - <div class="alert warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</div> - {% endif %} - {% endfor %} - {% if summary == "0 Errors, 0 Warnings."%} - <div class="alert success summary">{{ summary }}</div> + <p class="alert alert-success summary">{{ summary }}</p> {% else %} - <div>{{summary}}</div> - {% endif %} --> - + <p>{{summary}}</p> + {% endif %} + + <hr> <h4>dbSNP rs ID</h4> - <pre>{{ rs_id }}</pre> + <p><code>{{ rs_id }}</code></p> + <h4>HGVS descriptions</h4> - <pre>{% for d in descriptions %}{{ d }}</br>{% endfor %}</pre> -{% endif %} + {% for d in descriptions %} + <p><code>{{ d }}</code></p> + {% endfor %} +{% endif %}{# rs_id #} {% endblock content %} diff --git a/mutalyzer/website/templates/static/css/style.css b/mutalyzer/website/templates/static/css/style.css index 99241013150cf74b41c36768882682140c958f87..08f868e646cb034afe19beb5ab63474230a0f6d9 100644 --- a/mutalyzer/website/templates/static/css/style.css +++ b/mutalyzer/website/templates/static/css/style.css @@ -3,7 +3,7 @@ body{ /* margin: 0 10px;*/ padding-top: 70px; /* padding-top: 110px;*/ - + font-family: Roboto; -webkit-font-smoothing: antialiased; } @@ -15,17 +15,17 @@ body{ margin-right: auto; padding: 40px; margin-bottom: 25px; - + border-radius: 2px; - - font-size: 14px; + + font-size: 14px; font-weight: 400; } .block-shadow { /* box-shadow: 0 -1px 2.5px rgba(0,0,0,0.12), 0 1px 2px rgba(0, 0,0,0.24);*/ box-shadow: 1px 2px 2px rgba(50,50,50,.16), -1px -1px 3px rgba(50, 50, 50,.23); - + } @@ -49,11 +49,11 @@ body{ .block { padding: 15px; } - + .block-shadow { box-shadow: none; } - + .block h1 { font-size: 32px; line-height: 1em; @@ -75,7 +75,7 @@ footer.row { /* padding-top:20px; padding-bottom: 20px;*/ } -.navbar-header { +.navbar-header { z-index: 3; position: relative; } @@ -120,7 +120,7 @@ h2,h3,h4,h5{ } input[type="text"].form-pre{ - font-family: Menlo, Monaco, Consolas, "Courier New", monospace; + font-family: Menlo, Monaco, Consolas, "Courier New", monospace; } code { @@ -146,11 +146,11 @@ header.main-header { .table2 > td { padding: 3px; } - + .table2{ margin-bottom: 0px; } - + .pre { padding: 0 9.5px; margin: 0 30px 10px 30px; @@ -167,15 +167,6 @@ header.main-header { cursor: default; } -.btn-right{ - width: 177px; - margin-left: 375px; -} - -.btn-submit{ - margin-top: 15px; -} - .summary{ text-align: left; } @@ -195,7 +186,7 @@ header.main-header { font-size: 11px; cursor: pointer; } - + #variants{ /* border: 1px solid green; */ } diff --git a/mutalyzer/website/templates/syntax-checker.html b/mutalyzer/website/templates/syntax-checker.html index 75c353ce544e5fd345569a38255139d8d83db96c..3854c8c1269be83038824a09f26562df7dad08e5 100644 --- a/mutalyzer/website/templates/syntax-checker.html +++ b/mutalyzer/website/templates/syntax-checker.html @@ -2,49 +2,51 @@ {% set active_page = "syntax-checker" %} {% set page_title = "Syntax checker" %} -<!-- {% set page_titles = "Syntax Checker" %} --> {% block content %} - {% if description %} - <h3>Variant syntax checker results</h3> - {% if parse_error %} - <div class="alert alert-danger"> - <h4>There were errors</h4> - <ul> - {% for m in messages %} - <li title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</li> - {% endfor %} - </ul> - <h5>Details of the parse error</h5> - <pre>{{- parse_error[0] }}<br>{{- parse_error[1] }}</pre> - <p>The "^" indicates the position where the error occurred.</p> - </div> - {% else %} - <div class="alert alert-success"> - The syntax of this variant is OK! - </div> - {% endif %} - <br> - {% endif %} - <p> - Please insert the mutation name using the <a href="http://www.hgvs.org/mutnomen" title="Human Genome Variation Society standard variant nomenclature" alt="Human Genome Variation Society standard variant nomenclature">HGVS</a> format:<br> - <code><accession number>.<version number>(<gene symbol>):<sequence type>.<variant description></code> - </p> - - <p> - Example: <code class="example-input">AB026906.1:c.274G>T</code> - </p> - - <form class="form" action="{{ url_for('.syntax_checker') }}" method="get"> - <div class="form-group"> - <label for="description">HGVS Description</label> - <input class="form-control form-pre example-target" type="text" name="description" value="{{ description }}" placeholder="Mutation name using HGVS format"> - </div> - <div class="form-group button-group"> - <input type="submit" class="btn btn-primary" value="Check syntax"> - <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/SyntaxChecker" target="new" class="btn btn-default pull-right">Help</a> - <input type="reset" class="btn btn-default pull-right" value="Undo"> - </div> - </form> - + +<p> +Please insert the mutation name using +the <a href="http://www.hgvs.org/mutnomen" title="Human Genome Variation +Society standard variant nomenclature" alt="Human Genome Variation Society +standard variant nomenclature">HGVS</a> format: +</p> + +<pre><accession number>.<version number>(<gene symbol>):<sequence type>.<variant description></pre> + +<form class="form" action="{{ url_for('.syntax_checker') }}" method="get"> + <div class="form-group"> + <label for="description">HGVS Description</label> + <input class="form-control form-pre example-target" type="text" name="description" value="{{ description }}" placeholder="Mutation name using HGVS format"> + <p>Example: <code class="example-input">AB026906.1:c.274G>T</code></p> + </div> + <div class="form-group button-group"> + <input type="submit" class="btn btn-primary" value="Check syntax"> + <a href="https://humgenprojects.lumc.nl/trac/mutalyzer/wiki/SyntaxChecker" target="new" class="btn btn-default pull-right">Help</a> + </div> +</form> + +{% if description %} + <hr> + {% if parse_error %} + <div class="alert alert-danger"> + <h4>Parse error</h4> + <pre>{{ parse_error[0] }}<br>{{ parse_error[1] }}</pre> + <p>The "^" indicates the position where the error occurred.</p> + </div> + {% else %} + <p class="alert alert-success">The syntax of this variant is OK!</p> + {% endif %} + + {% if messages %} + {% for m in messages %} + {% if m.class == "error" %} + <p class="alert alert-danger" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> + {% elif m.class == "warning" %} + <p class="alert alert-warning" title="{{ m.level }} (origin: {{ m.origin }})">{{ m.description }}</p> + {% endif %} + {% endfor %} + {% endif %} +{% endif %}{# description #} + {% endblock content %} diff --git a/mutalyzer/website/views.py b/mutalyzer/website/views.py index 9f47146c07b22a1a74b00b8efe7c83d9c0ed7410..992e84a502ba6d46c310f65f0e50b9611b6ac412 100644 --- a/mutalyzer/website/views.py +++ b/mutalyzer/website/views.py @@ -829,14 +829,14 @@ def batch_jobs_submit(): for error in errors: output.addMessage(__file__, 3, 'EBATCHJOB', error) - errors = map(util.message_info, output.getMessages()) + messages = map(util.message_info, output.getMessages()) return render_template('batch-jobs.html', assemblies=assemblies, assembly_name_or_alias=assembly_name_or_alias, job_type=job_type, max_file_size=settings.MAX_FILE_SIZE // 1048576, - errors=errors) + messages=messages) @website.route('/batch-job-progress') diff --git a/tests/test_website.py b/tests/test_website.py index a7fa1b1dc6a5cce119897309930522e32d40c2c8..06b19d9d7bf24ceab3a4ec7ae7d7a0a23149538b 100644 --- a/tests/test_website.py +++ b/tests/test_website.py @@ -124,7 +124,7 @@ class TestWebsite(MutalyzerTest): r = self.app.get('/syntax-checker', query_string={'description': 'AB026906.1:c.27'}) assert 'Fatal' in r.data - assert 'Details of the parse error' in r.data + assert 'The "^" indicates the position where the error occurred' in r.data @fix(database, cache('NM_002001.2')) def test_check_valid(self): @@ -742,7 +742,7 @@ class TestWebsite(MutalyzerTest): query_string={'description': 'La Pe\xf1a'}) body = r.get_data(as_text=True) assert 'Fatal' in body - assert 'Details of the parse error' in body + assert 'The "^" indicates the position where the error occurred' in body assert 'Expected W:(0123...) (at char 2), (line:1, col:3)' in body @fix(database)