scout-browser 4.102.0__py3-none-any.whl → 4.103.0__py3-none-any.whl

scout/server/blueprints/clinvar/templates/clinvar/clinvar_onc_submissions.html

@@ -0,0 +1,200 @@
+{% extends "layout.html" %}
+{% from "overview/institute_sidebar.html" import institute_actionbar %}
+{% from "clinvar/components.html" import update_submission_status_form %}
+
+{% block title %}
+  {{ super() }} - {{ institute.display_name }}
+{% endblock %}
+
+{% block top_nav %}
+  {{ super() }}
+  <li class="nav-item">
+    <a class="nav-link" href="{{ url_for('cases.index') }}">Institutes</a>
+  </li>
+  <li class="nav-item">
+    <a class="nav-link" href="{{ url_for('overview.cases', institute_id=institute._id) }}">{{ institute.display_name }}</a>
+  </li>
+  <li class="nav-item active d-flex align-items-center">
+    <span class="navbar-text">Clinvar oncogenicity submissions</span>
+  </li>
+{% endblock %}
+
+
+{% macro submissions_macro(submissions) %}
+<div class="container-float">
+  <h3 class="mt-3">Oncogenicity submissions</h3>
+  <br>
+  {% if submissions %}
+    <div style="overflow-y: auto; height: 1000px;">
+     {% for status in ['open', 'closed', 'submitted'] %}
+      {% for submission in submissions|sort(attribute='status') %}
+        {% if submission.status==status %}
+          {{ submission_panel(submission) }}
+        {% endif %}
+      {% endfor %}
+    {% endfor %}
+    </div>
+  {% else %}
+  <p>No ClinVar submissions found. You can create one by choosing one or more pinned variants on a case page and clicking the button "Submit to ClinVar".</p>
+  {% endif %}
+</div>
+{% endmacro %}
+
+{% macro submission_panel(subm_obj) %}
+<div class="accordion accordion-flush" id="accordionFlushSubmissions">
+  <div class="accordion-item">
+    <h2 class="accordion-header" id="header-{{subm_obj._id}}">
+      <a class="accordion-button collapsed {% if subm_obj.status=='open' %} link-primary {% elif subm_obj.status=='submitted' %} link-success {% else %} link-secondary {% endif%}" type="button" data-bs-toggle="collapse" data-bs-target="#flush-{{subm_obj._id}}" aria-expanded="false" aria-controls="flush-{{subm_obj._id}}" style="text-decoration: none;">
+        Submission&nbsp;<strong>{{subm_obj._id}} - ({{subm_obj.status|upper}})</strong>&nbsp;/&nbsp;Created {% if subm_obj.created_by %}&nbsp;by&nbsp;<strong>{{subm_obj.created_by}}</strong>{% endif %}&nbsp;on&nbsp;<strong>{{subm_obj.created_at.strftime('%Y-%m-%d')}}</strong>&nbsp;/&nbsp;Last updated:&nbsp;<strong>{{subm_obj.updated_at.strftime('%d-%m-%Y, %T')}}</strong>
+      </a>
+    </h2>
+    <div id="flush-{{subm_obj._id}}" class="accordion-collapse collapse" aria-labelledby="header-{{subm_obj._id}}" data-bs-parent="#accordionFlushSubmissions">
+      <div class="accordion-body">
+        <div class="row">
+          {{ update_submission_status_form(institute, subm_obj) }}
+        </div>
+        <div class="row">
+          <table>
+            <caption></caption>
+            <tr><th></th></tr>
+            <tr>
+              <form id="updateName_{{subm_obj._id}}" action="{{ url_for('clinvar.clinvar_update_submission', institute_id=institute._id, submission=subm_obj._id) }}" method="POST">
+              <td style="width: 10%"><label for="clinvar_id">Submission ID</label></td>
+              <td style="width: 25%"> <input type="text" class="form-control" name="clinvar_id" pattern="SUB[0-9]+" placeholder="ex: SUB1234567" value="{{ subm_obj.clinvar_subm_id or ""}}"></td>
+              <td style="width: 20%"><button type="submit" class="btn btn-sm btn-primary form-control" name="update_submission" value="register_id">Update ID manually</button></td>
+              </form>
+              {% if subm_obj.status == 'open' and show_submit  %}
+                <form id="useApi_{{subm_obj._id}}" action="{{ url_for('clinvar.clinvar_update_submission', institute_id=institute._id, submission=subm_obj._id) }}" method="POST">
+                {{ submit_modal() }}
+                  <td style="width: 20%"><button type="button" class="btn btn-sm btn-success form-control" name="update_submission" value="api_submit" data-bs-toggle="modal" data-bs-target="#submitModal">Submit to ClinVar</button></td>
+                </form>
+              {% endif %}
+              {% if subm_obj.status == 'submitted' %} <!--Submission status query -->
+                 <form id="statusApi_{{subm_obj._id}}" action="{{ url_for('clinvar.clinvar_submission_status', submission_id=subm_obj.clinvar_subm_id) }}" method="POST">
+                   {{ action_modal("status", subm_obj._id) }}
+                   <td style="width: 20%"><button type="button" class="btn btn-sm btn-secondary form-control" name="status_enquiry" value="api_status" data-bs-toggle="modal" data-bs-target="#statusModal_{{subm_obj._id}}">Submission status enquiry</button></td>
+                 </form>
+                <form id="deleteApi_{{subm_obj._id}}" action="{{ url_for('clinvar.clinvar_submission_delete', submission_id=subm_obj.clinvar_subm_id) }}" method="POST">
+                   {{ action_modal("remove", subm_obj._id) }}
+                   <td style="width: 20%"><button type="button" class="btn btn-sm btn-danger form-control" name="_enquiry" value="api_status" data-bs-toggle="modal" data-bs-target="#removeModal_{{subm_obj._id}}">Delete submission from ClinVar</button></td>
+                 </form>
+              {% endif %}
+            </tr>
+          </table>
+        </div>
+        <div> <!--variant data div -->
+          <h4>Variant data:</h4>
+          {% if subm_obj.oncogenicitySubmission and subm_obj.oncogenicitySubmission | length > 0 %}
+          <table class="table table-striped">
+            <caption></caption>
+            <thead>
+              <tr>
+                <th>Case</th>
+                <th>Variant</th>
+                <th>Classification</th>
+                <th>Last evaluated</th>
+                <th>Comment</th>
+                <th>Citation</th>
+                <th>Variant</th>
+                <th>Associated conditions</th>
+                <th>Observations</th>
+                <th></th>
+              </tr>
+            </thead>
+            <tbody>
+              {% for onc_var in subm_obj.oncogenicitySubmission %}
+                <tr>
+                  <td><a href="{{ url_for('cases.case', institute_id=onc_var.institute_id, case_name=onc_var.case_name) }}" target="_blank">{{onc_var.case_name}}</a></td>
+                  <td><a href="{{ url_for('variant.cancer_variant', institute_id=onc_var.institute_id, case_name=onc_var.case_name, variant_id=onc_var.variant_id) }}" target="_blank">link</a></td>
+                  <td>{{onc_var.oncogenicityClassification.oncogenicityClassificationDescription}}</td>
+                  <td>{{onc_var.oncogenicityClassification.dateLastEvaluated}}</td>
+                  <td>{{onc_var.oncogenicityClassification.comment}}</td>
+                  <td>{{render_dict_array(onc_var.oncogenicityClassification.citation)}}</td>
+                  <td>{{render_dict_array(onc_var.variantSet.variant)}}</td>
+                  <td>{{render_dict_array(onc_var.conditionSet.condition)}}</td>
+                  <td>{{render_dict_array(onc_var.observedIn)}}</td>
+                  <td>
+                    <form id="delete_onc_var_item_{{subm_obj._id}}_{{onc_var.variant_id}}" action="{{ url_for('clinvar.clinvar_delete_onc_variant', submission=subm_obj._id) }}" method="POST">
+                      <button type="submit" name="delete_object" value="{{onc_var.variant_id}}" class="btn btn-danger btn-xs"><span class="fa fa-trash" aria-hidden="true"></span></button>
+                    </form>
+                  </td>
+                </tr>
+              {% endfor %}
+            </tbody>
+          </table>
+          {% else %}
+            <p>This submission is open but has no variants yet.</p>
+          {% endif %}
+        </div> <!--variant data div end -->
+      </div>
+    </div>
+  </div>
+</div>
+{% endmacro %}
+
+{% macro render_dict_array(list_of_dicts) %}
+  {% for item in list_of_dicts %}
+    {% for key, value in item.items() %}
+      {{key}} : {{value}}<br>
+    {% endfor %}
+  {% endfor %}
+  {% if list_of_dicts|length > 1%}<br>{% endif %}
+{% endmacro %}
+
+{% macro action_modal(action_type, subm_id) %}
+<div class="modal fade" id="{{action_type}}Modal_{{subm_id}}" tabindex="-1">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h5 class="modal-title">Submission {{action_type}}</h5>
+        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+      </div>
+      <div class="modal-body">
+        <label for="apiKey">Submitter's <a href="https://www.ncbi.nlm.nih.gov/clinvar/docs/api_http/" target="_blank" rel="noopener">API key</a></label>
+        <input type="password" class="form-control" name="apiKey" id="apiKey" placeholder="64 alphanumeric characters" value="{{institute.clinvar_key or ''}}" required>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+        <button type="submit" name="{{action_type}}" value="{{action_type}}" class="btn btn-primary">Submission {{action_type}} enquiry</button>
+      </div>
+    </div>
+  </div>
+</div>
+{% endmacro %}
+
+{% macro submit_modal() %}
+<div class="modal fade" id="submitModal" tabindex="-1">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h5 class="modal-title">ClinVar API submission</h5>
+        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+      </div>
+      <div class="modal-body">
+        <label for="apiKey">Submitter's <a href="https://www.ncbi.nlm.nih.gov/clinvar/docs/api_http/" target="_blank" rel="noopener">API key</a></label>
+        <input type="password" class="form-control" name="apiKey" id="apiKey" placeholder="64 alphanumeric characters" value="{{institute.clinvar_key or ''}}" required>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+        <button type="submit" name="update_submission" value="submit" class="btn btn-primary">Submit variants</button>
+      </div>
+    </div>
+  </div>
+</div>
+{% endmacro %}
+
+{% block content_main %}
+<div class="container-float">
+  <div class="row" id="body-row"> <!--sidebar and main container are on the same row-->
+    {{ institute_actionbar(institute, "shared") }} <!-- This is the sidebar -->
+  <div class="col">
+    {{ submissions_macro(submissions) }}
+  </div>
+  </div> <!-- end of div id body-row -->
+</div>
+{% endblock %}
+
+{% block scripts %}
+  {{ super() }}
+
+{% endblock %}

scout/server/blueprints/clinvar/templates/clinvar/clinvar_submissions.html

@@ -1,6 +1,7 @@
 {% extends "layout.html" %}
 {% from "overview/institute_sidebar.html" import institute_actionbar %}
 {% from "clinvar/clinvar_howto.html" import clinvar_howto_modal %}
+{% from "clinvar/components.html" import update_submission_status_form %}
 
 {% block title %}
   {{ super() }} - {{ institute.display_name }}
@@ -15,14 +16,14 @@
     <a class="nav-link" href="{{ url_for('overview.cases', institute_id=institute._id) }}">{{ institute.display_name }}</a>
   </li>
   <li class="nav-item active d-flex align-items-center">
-    <span class="navbar-text">Clinvar submissions</span>
+    <span class="navbar-text">Clinvar germline submissions</span>
   </li>
 {% endblock %}
 
 
 {% macro submissions_macro(submissions) %}
 <div class="container-float">
-  <h3 class="mt-3">ClinVar submissions page<h5></h3><a data-bs-target="#howto" href="#" data-bs-toggle="modal">howto</a><br>
+  <h3 class="mt-3">ClinVar submissions page</h3><a data-bs-target="#howto" href="#" data-bs-toggle="modal">howto</a><br>
   <!-- Modal -->
   {{ clinvar_howto_modal() }}
   <!-- Modal end -->

scout/server/blueprints/clinvar/templates/clinvar/components.html

@@ -0,0 +1,198 @@
+{% macro update_submission_status_form(institute, subm_obj) %}
+<form id="updateStatus_{{subm_obj._id}}" action="{{ url_for('clinvar.clinvar_update_submission', institute_id=institute._id, submission=subm_obj._id) }}" method="POST">
+  <nav aria-label="breadcrumb">
+    <ol class="breadcrumb align-items-center">
+      <li class="breadcrumb-item">
+        <a id="download_clinvar_json" href="{{ url_for('clinvar.clinvar_download', submission=subm_obj._id) }}" class="btn btn-primary btn-xs text-white" target="_blank" rel="noopener">
+          Download submission json file
+        </a>
+      </li>
+      {% if subm_obj.status=='open'%}
+        <li class="breadcrumb-item"><button type="submit" name="update_submission" value="closed" class="btn btn-warning btn-xs">Close submission</button></li>
+      {% else %}
+        <li class="breadcrumb-item"><button type="submit" name="update_submission" value="open" class="btn btn-primary btn-xs">Re-open submission</button></li>
+      {% endif %}
+      {% if subm_obj.status != 'submitted' %}
+        <li class="breadcrumb-item"><button type="submit" name="update_submission" value="submitted" class="btn btn-success btn-xs">Mark as submitted</button></li>
+      {% endif %}
+        <li class="breadcrumb-item"><button type="submit" name="update_submission" value="delete" class="btn btn-danger btn-xs">Delete submission from Scout</button></li>
+    </ol>
+  </nav>
+</form>
+{% endmacro %}
+
+
+{% macro hgvs_choices(tx_hgvs)%}
+<!-- Transcripts & HGVS:(optional) -->
+{{ tx_hgvs.label(class="fw-bold, text-dark") }}
+
+<span class="text-danger" data-bs-toggle='tooltip' title="If you do not provide any HGVS expression, chromosome coordinates will be used to describe this variant instead (automatic). HGVS expressions were validated using VariantValidator"><strong>?</strong></span>
+<span class="badge bg-primary float-end"><a class="text-white" href="https://variantvalidator.org/service/validate/" target="_blank" rel="noopener">VariantValidator</a></span>
+<br><br>
+
+<table style="width:100%; table-layout: auto; border-collapse: collapse;">
+  <caption></caption>
+  <tr><th></th></tr>
+  {% for item_row in tx_hgvs | batch(3) %}
+    <tr>
+    {% for item in item_row %}
+      {% set ns = namespace(label='', validated=false, mane_select=false, mane_plus_clinical=false) %}
+      {% if "_validated_" in item.label.text %}
+        {% set ns.validated = true %}
+      {% endif %}
+      {% if "_mane-select_" in item.label.text %}
+        {% set ns.mane_select = true %}
+      {% endif %}
+      {% if "_mane-plus-clinical_" in item.label.text %}
+         {% set ns.mane_plus_clinical = true %}
+      {% endif %}
+
+      {% set ns.label = item.label.text | replace("_validated_", "") | replace("_mane-select_", "")  %}
+
+      <td style="width: 3%; text-align: right; vertical-align: baseline;">
+        <input type="radio" name="tx_hgvs" value="{{ ns.label }}"
+          {% if ns.mane_select %}checked{% endif %}>
+      </td>
+
+      <td style="width: 30%; text-align: left; ">
+        <p class="text-dark"
+        {% if ns.label|length > 50 %}
+         data-bs-toggle="tooltip" title="{{ns.label}}">{{ ns.label|truncate(25,true,'..') }}
+        {% else %}
+          >{{ ns.label }}
+        {% endif %}
+        {% if ns.mane_select %}
+          <span class='badge bg-dark'>MANE SELECT</span>
+        {% endif %}
+        {% if ns.mane_plus_clinical %}
+          <span class='badge bg-dark'>MANE PLUS CLINICAL</span>
+        {% endif %}
+        {% if ns.validated %}
+          <em class="fa fa-check text-success" aria-hidden="true" data-bs-toggle="tooltip" title="Verified by VariantValidator"></em>
+        {% endif %}
+        </p>
+      </td>
+    {% endfor %}
+    </tr>
+  {% endfor %}
+</table>
+{% endmacro %}
+
+{% macro condition_identifiers(var_form) %}
+<div class="row">
+  <div class="col-6" id="clinvar_condition_container">
+    {{ var_form.condition_type.label(class="fw-bold, text-dark")}}<span class="text-danger" data-bs-toggle='tooltip' title="Required field."><strong>*</strong></span>
+
+    <select class="form-control, btn-secondary" name="condition_type" id="condition_type">
+      {% for dbtype, _ in var_form.condition_type.choices %}
+        <option value="{{dbtype}}">{{dbtype}}</option>
+      {% endfor %}
+    </select>
+
+    <br><br>
+    {{ var_form.conditions.label(class="fw-bold, text-dark")}} <span class="text-danger" data-bs-toggle='tooltip' title="Required field. Include data from ONE DATABASE TYPE ONLY (i.e. only OMIM terms, only HPO terms etc). If multiple conditions are submitted for a variant, this indicates that the variant was interpreted for the combination of conditions in the same individual(s).  i.e. this variant causes both condition A and condition B in the same individual. This scenario is most common for a new disease or syndrome that does not yet have a name and is described by several clinical features. If you want to indicate that the variant has been interpreted for more than one condition, please submit these as separate records."><strong>*?</strong></span>
+    <select class="select2" id="condition_tags" name="conditions" multiple="true" style="width:100%;">
+      {% if var_form.omim_terms.choices %}
+        {% for term, _ in var_form.omim_terms.choices %}
+          <option value="{{term}}" selected>{{term}}</option>
+        {% endfor %}
+      {% elif var_form.orpha_terms.choices %}
+        {% for term, _ in var_form.orpha_terms.choices %}
+          <option value="{{term}}" selected>{{term}}</option>
+        {% endfor %}
+      {% elif var_form.hpo_terms.choices %}
+        {% for term, _ in var_form.hpo_terms.choices %}
+          <option value="{{term}}" selected>{{term}}</option>
+        {% endfor %}
+      {% endif %}
+    </select>
+
+    <div class="mt-3">
+      {{ var_form.multiple_condition_explanation.label(class="fw-bold, text-dark")}} <span class="text-danger" data-bs-toggle='tooltip' title="Required if you provide more than one condition ID."><strong>?</strong></span>
+      <select name="multiple_condition_explanation" id="multiple_condition_explanation" class="form-control, btn-secondary">
+        <option selected value>-</option>
+        {% for choice, _ in var_form.multiple_condition_explanation.choices %}
+          <option value="{{choice}}">{{choice}}</option>
+        {% endfor %}
+      </select>
+    </div>
+
+
+  </div>
+  <div class="col-6">
+    {{ var_form.omim_terms.label(class="fw-bold, text-dark" )}}<br>
+    <ul class="list-group">
+    {% for term in var_form.omim_terms %}
+      <li class="list-group-item">{{ term.label }}</li>
+    {% else %}
+      <span class="text-dark">N/A</span>
+    {% endfor %}
+    </ul>
+    <br><br>
+    {{ var_form.orpha_terms.label(class="fw-bold, text-dark") }}<br>
+    <ul class="list-group">
+    {% for term in var_form.orpha_terms %}
+      <li class="list-group-item">{{ term.label }}</li>
+    {% else %}
+      <span class="text-dark">N/A</span>
+    {% endfor %}
+    </ul>
+    <br><br>
+    {{ var_form.hpo_terms.label(class="fw-bold, text-dark" )}}<br>
+    <ul class="list-group">
+    {% for term in var_form.hpo_terms %}
+      <li class="list-group-item">{{ term.label }}</li>
+    {% else %}
+    N/A
+    </ul>
+    {% endfor %}
+  </div>
+</div>
+{% endmacro %}
+
+{% macro observations(cdata_forms, var_type) %}
+<ul class="list-group">
+  {% for cdata in cdata_forms %}
+    {{ cdata.linking_id() }} {# Hidden field #}
+    <li class="list-group-item bg-white">
+      <div class="row align-items-start">
+        <div class="col-md-2 mb-3">
+          <label class="form-label fw-bold text-dark d-block">{{ cdata.include_ind.label.text }}</label>
+          <div class="form-check pt-1">
+            {{ cdata.include_ind(class="form-check-input", id="include_ind_" ~ loop.index) }}
+          </div>
+        </div>
+        <div class="col-md-2 mb-3">
+          <label class="form-label fw-bold text-dark">{{ cdata.individual_id.label.text }}</label>
+          {{ cdata.individual_id(class="form-control bg-white", readonly=true) }}
+        </div>
+        <div class="col-md-2 mb-3">
+          <label class="form-label fw-bold text-dark">{{ cdata.affected_status.label.text }}</label>
+          {{ cdata.affected_status(class="form-select") }}
+        </div>
+        <div class="col-md-2 mb-3">
+          <label class="form-label fw-bold text-dark">{{ cdata.allele_of_origin.label.text }}</label>
+          {{ cdata.allele_of_origin(class="form-select") }}
+        </div>
+        <div class="col-md-2 mb-3">
+          <label class="form-label fw-bold text-dark">{{ cdata.collection_method.label.text }}</label>
+          {{ cdata.collection_method(class="form-select") }}
+        </div>
+      </div>
+
+      {% if var_type == "cancer" %}
+      <div class="row align-items-start">
+        <div class="col-md-2 offset-md-6 mb-3">
+          <label class="form-label fw-bold text-dark">{{ cdata.somatic_allele_fraction.label.text }}</label>
+          {{ cdata.somatic_allele_fraction(class="form-control") }}
+        </div>
+        <div class="col-md-2 mb-3">
+          <label class="form-label fw-bold text-dark">{{ cdata.somatic_allele_in_normal.label.text }}</label>
+          {{ cdata.somatic_allele_in_normal(class="form-control") }}
+        </div>
+      </div>
+      {% endif %}
+    </li>
+  {% endfor %}
+</ul>
+{% endmacro %}

scout/server/blueprints/clinvar/templates/clinvar/multistep_add_onc_variant.html

@@ -0,0 +1,187 @@
+{% extends "bootstrap_global.html" %}
+{% from "clinvar/components.html" import condition_identifiers, hgvs_choices, observations %}
+
+{% block css %}
+  {{ super() }}
+  <link rel="stylesheet" href="{{ url_for('clinvar.static', filename='form_style.css') }}"/>
+  <link href="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/css/select2.min.css" rel="stylesheet" integrity="sha512-nMNlpuaDPrqlEls3IX/Q56H36qvBASwb3ipuo3MxeWbsQB1881ox0cRv7UPTgBlriqoynt35KjEwgGUeUXIPnw==" crossorigin="anonymous" referrerpolicy="no-referrer"/>
+  <link href="https://cdn.jsdelivr.net/npm/select2-bootstrap-5-theme@1.2.0/dist/select2-bootstrap-5-theme.min.css" rel="stylesheet" />
+{% endblock %}
+
+{% block head %}
+  {{ super() }}
+{% endblock head %}
+
+{% block content %}
+{% if variant_data.var_obj.category in ["snv", "cancer"]%}
+  {% set var_category = 'snv' %}
+{% else %}
+  {% set var_category = 'sv' %}
+{% endif %}
+<div class="container-fluid">
+  <!-- MultiStep Form -->
+  <div class="row d-flex justify-content-center">
+      <div class="col-md-10">
+          <form id="clinVarAdd" method="POST" action="{{ url_for('clinvar.clinvar_onc_save', institute_id=institute._id, case_name=case.display_name) }}" id="{{variant_data.var_id}}_form">
+              <!-- progressbar -->
+              <ul id="progressbar" class="steps-5">
+                  <li class="active">Start</li>
+                  <li>Oncogenicity classification</li>
+                  <li>Observation Data</li>
+                  <li>Variant Details</li>
+                  <li>Associated conditions</li>
+
+              </ul>
+
+              <!-- hidden fields -->
+                {{ variant_data.var_form.csrf_token }}
+
+              <!-- fieldsets -->
+              <fieldset data-step="1">
+                <legend class="text-dark">ClinVar oncogenic submission form</legend>
+                <br><br>
+                <p class="text-dark">
+                Use this form to add a variant to an oncogenicity submission object. The submission will be formatted as a JSON document, ready to be sent to ClinVar via their API.<br>
+                </p>
+                <a href="{{url_for('cases.case',institute_id=institute._id, case_name=case.display_name)}}" class="previous action-button-previous" style="text-decoration: none;">Back to Case</a>
+                <input type="button" name="next" class="next action-button" value="Start"/>
+              </fieldset>
+
+              <fieldset data-step="2">
+                <legend class="text-dark">Oncogenicity classification</legend>
+                  <br><br>
+                  <div class="mb-3">
+                    {{ variant_data.var_form.onc_classification.label }}
+                    {{ variant_data.var_form.onc_classification }}
+                  </div>
+                  <br><br>
+                  <div class="mb-3 col-md-2 offset-md-5">
+                    {{ variant_data.var_form.last_evaluated.label }}
+                    {{ variant_data.var_form.last_evaluated }}
+                  </div>
+
+                  <div class="mb-3 col-md-6 offset-md-3">
+                    {{ variant_data.var_form.clinsig_comment.label }} <span data-bs-toggle='tooltip' title="Optional, but highly encouraged. Free text describing the rationale for the classification."><strong>*</strong></span>
+                    {{ variant_data.var_form.clinsig_comment(rows=4, class="form-control") }}
+                  </div>
+                  <br><br>
+                  <div class="mb-3">
+                    {{ variant_data.var_form.assertion_method_cit_db.label }}
+                    {{ variant_data.var_form.assertion_method_cit_db }}
+                    <span class="text-danger" data-bs-toggle='tooltip' title="This citation is specific to this variant only. Leave blanc if unsure. Note the whole submission, containing one or more variants, will be already containing the following citation reference: 'Horak P. et al. Standards for the classification of pathogenicity of somatic variants in cancer (oncogenicity): Joint recommendations of Clinical Genome Resource (ClinGen), Cancer Genomics Consortium (CGC), and Variant Interpretation for Cancer Consortium (VICC). Genet Med. 2022 (PubMed:36063163)'."><strong>?</strong></span>
+                    <span data-bs-toggle='tooltip' title="Optional field"><strong>*</strong></span>
+                  </div>
+
+                  <div class="mb-3 col-md-6 offset-md-3">
+                    {{ variant_data.var_form.assertion_method_cit_id.label(
+                        id="citation_tooltip",
+                        **{'data-bs-toggle': 'tooltip', 'title': 'Original tooltip text'}
+                    ) }}
+                    {{ variant_data.var_form.assertion_method_cit_id }}
+                  </div>
+
+                <input type="button" name="previous" class="previous action-button-previous" value="Previous"/>
+                <input type="button" name="next" class="next action-button" value="Next"/>
+              </fieldset>
+
+              <fieldset data-step="5">
+                <legend class="text-dark">Variant Details</legend>
+
+                {{variant_data.var_form.gene_symbol.label(class="fw-bold, text-dark")}} <span class="text-danger" data-bs-toggle='tooltip' title="Gene symbol should be provided only to indicate the gene-disease relationship supporting the variant interpretation. Gene symbol is not expected for SVs, except to make a statement that a specific gene within the variant has a relationship to the interpreted condition."><strong>?</strong></span>
+                {{variant_data.var_form.gene_symbol(class="bg-white")}}
+
+                <!-- Cancer SNVs only. Collect coordinates if user doesn't provide any HGVS choice-->
+                {% if variant_data.var_obj.category == 'cancer' %}
+                  {{ variant_data.var_form.chromosome() }}
+                  {{ variant_data.var_form.start() }}
+                  {{ variant_data.var_form.stop() }}
+                  {{ variant_data.var_form.alt() }}
+                  {{ variant_data.var_form.assembly() }}
+                {% endif %}
+
+                {{ hgvs_choices(variant_data.var_form.tx_hgvs) }}
+
+                <br><br>
+                <!-- Cancer SNV - end -->
+
+                <input type="button" name="previous" class="previous action-button-previous" value="Previous"/>
+                <input type="button" name="next" class="next action-button" value="Next"/>
+              </fieldset>
+
+
+              <fieldset data-step="4">
+                <legend class="text-dark">Associated Conditions</legend>
+                <h3 class="fs-subtitle">The condition must be provided as a database identifier. Assigning a condition name if the database identifier can't be found is not yet supported.</h3>
+
+                {{ condition_identifiers(variant_data.var_form) }}
+
+                <br>
+                <input type="button" name="previous" class="previous action-button-previous" value="Previous"/>
+                <input type="button" name="next" class="next action-button" value="Next"/>
+              </fieldset>
+
+
+              <fieldset data-step="5">
+                  <legend class="text-dark">Observation Data</legend>
+
+                  {{ observations(variant_data.cdata_forms, variant_data.var_obj.category) }}
+
+                  <input type="button" name="previous" class="previous action-button-previous" value="Previous"/>
+                  <input type="submit" name="submit" class="submit action-button" value="Add to submission"/>
+              </fieldset>
+
+          </form>
+      </div>
+  </div>
+  <!-- /.MultiStep Form -->
+</div>
+{% endblock %}
+
+{% block scripts %}
+{{ super() }}
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js" integrity="sha512-0QbL0ph8Tc8g5bLhfVzSqxe9GERORsKhIn1IrpxDAgUsbBGz/V7iSav2zzW325XGd1OMLdL4UiqRJj702IeqnQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.14.0-beta3/js/bootstrap-select.min.js" integrity="sha512-yrOmjPdp8qH8hgLfWpSFhC/+R9Cj9USL8uJxYIveJZGAiedxyIxwNw4RsLDlcjNlIRR4kkHaDHSmNHAkxFTmgg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script src="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/js/select2.min.js" integrity="sha512-2ImtlRlf2VVmiGZsjm9bEyhjGW4dU7B6TNwh/hx/iSByxNENtj3WVE6o/9Lj4TJeVXPi4bnOIMXFIJJAeufa0A==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+{% include "clinvar/scripts.html" %}
+<script>
+
+
+
+document.querySelector('form').addEventListener('keydown', function(e) {
+    if (e.key === 'Enter' && e.target.tagName !== 'TEXTAREA') {
+      e.preventDefault();
+    }
+  });
+
+//Function definition for keeping the tooltip updated for each citation database option
+function updateTooltip(){
+      let selectedDBId = $("#assertion_method_cit_db option:selected").text();
+      switch (selectedDBId) {
+          case "PubMed":
+              tooltipText = "PubMed ID (PMID) is written as digits only, e.g. 21084639"
+              break
+          case "DOI":
+              tooltipText = "DOI ID is written including prefix, forward slash, and suffix, e.g. 10.1038/gim.2015.30"
+              break
+          case "BookShelf":
+              tooltipText = "Bookshelf ID including the prefix, e.g. NBK1384"
+              break
+          case "pmc":
+              tooltipText = "PubMedCentral ID (pmc) is written as digits only, e.g. 4544753"
+              break
+          default:
+            return
+      }
+     const $el = $("#citation_tooltip");
+     $el.attr("data-bs-original-title", tooltipText).tooltip("dispose").tooltip("show");
+}
+
+//Add eventhandler for change of the DB id, keeping the tooltip updated
+$(function () {
+    $("#assertion_method_cit_db").change(function () {
+        updateTooltip()
+    })
+});
+
+</script>
+{% endblock %}