{% extends "layout.html" %}
{% from "utils.html" import comments_panel, pedigree_panel %}

{% block title %}
  {{ super() }} - {{ institute.display_name }} - {{ case.display_name }} - {{ variant.display_name }}
{% endblock %}

{% block top_nav %}
  <li>
    <a href="{{ url_for('cases.cases', institute_id=institute._id) }}">
      {{ institute.display_name }}
    </a>
  </li>
  <li>
    <a href="{{ url_for('cases.case', institute_id=institute._id, case_name=case.display_name) }}">
      {{ case.display_name }}
    </a>
  </li>
  <li>
    <a href="{{ url_for('variants.sv_variants', institute_id=institute._id, case_name=case.display_name, variant_type=variant.variant_type) }}">
      {{ variant.variant_type|capitalize }} structural variants
    </a>
  </li>
  <li class="active">
    <p class="navbar-text">{{ variant.display_name|truncate(20, True) }}</p>
  </li>
{% endblock %}

{% block top_nav_right %}
  {% if config['MAIL_USERNAME'] %}
    {# Email setting must be setup #}
    <li>{{ verify_button() }}</li>
  {% endif %}
  <li>{{ pin_button() }}</li>
  <li>{{ causative_button() }}</li>
  {{ super() }}
{% endblock %}

{% block content_main %}
  {% if variant.missing_data %}
    <div class="alert alert-warning">Showing only first 30 genes!</div>
  {% endif %}

  <div class="row">
    <div class="col-md-6">
      <ul class="list-group">
        <li class="list-group-item">Rank <span class="badge">{{ variant.variant_rank }}</span></li>

        <li class="list-group-item">
          Rank score
          <span class="badge">{{ variant.rank_score }}</span>
        </li>

        <li class="list-group-item">
          Category
          <span class="badge">{{ variant.sub_category|upper }}</span>
        </li>

        <li class="list-group-item">
          Gene panels
          <ul class="list-inline pull-right">
            {% for panel_id in variant.panels %}
              <li>
                <a href="{{ url_for('panels.panel', panel_id=panel_id) }}">{{ panel_id }}</a>
              </li>
            {% endfor %}
          </ul>
        </li>

        <li class="list-group-item">
	        <div>
	          <form action="{{ url_for('variants.variant_update', institute_id=institute._id, case_name=case.display_name, variant_id=variant._id) }}" method="POST">
              <label>Variant tag</label>
              <div class="row">
		            <div class="col-xs-8">
		              <select name="manual_rank" class="form-control">
		                <option>Select a tag</option>
		                {% for rank, data in manual_rank_options.items() %}
                      <option {% if rank == variant.manual_rank %} selected {% endif %} value="{{ rank }}">
                        {{ data.label }}
                      </option>
		                {% endfor %}
		              </select>
		            </div>
		            <div class="col-xs-4">
		              <button type="submit" class="btn btn-default form-control">Save</button>
		            </div>
              </div>
	          </form>
	        </div>
	      </li>

        <li class="list-group-item">
	        <div>
	          <form action="{{ url_for('variants.variant_update', institute_id=institute._id, case_name=case.display_name, variant_id=variant._id) }}" method="POST">
              <label>Dismiss variant</label>
              <div class="row">
		            <div class="col-xs-8">
		              <select multiple name="dismiss_variant" class="form-control">
		                <option>Select a tag</option>
                    {% for rank, data in dismiss_variant_options.items() %}
                      <option {% if rank~"" in variant.dismiss_variant %} selected {% endif %} value="{{ rank }}">
                        {{ data.label }}
                      </option>
                    {% endfor %}
		              </select>
		            </div>
		            <div class="col-xs-4">
		              <button type="submit" class="btn btn-default form-control">Save</button>
		            </div>
              </div>
	          </form>
	        </div>
	      </li>
      </ul>
    </div>
    <div class="col-md-6">
      <ul class="list-group">
        <li class="list-group-item">
          Position
          <div class="pull-right">
            {{ variant.chromosome }}:{{ variant.position }}-{{ variant.end }}
            {% if variant.chromosome == "MT" and case.mt_bams %}
              - Alignment:
              <a class="btn btn-default btn-sm" href="{{ url_for('alignviewers.pileup', bam=case.mt_bams, bai=case.mt_bais, vcf=case.region_vcf_file, sample=case.sample_names, contig=variant.chromosome, start=(variant.position - 50), stop=(variant.end + 50)) }}" target="_blank">Pileup viewer</a><br>
              <a class="btn btn-default btn-sm" href="{{ url_for('alignviewers.igv', sample=case.sample_names, build=case.genome_build, bam=case.mt_bams, bai=case.mt_bais, contig=variant.chromosome, start=(variant.position - 50), stop=(variant.end + 50)) }}" target="_blank">IGV viewer (BETA)</a>
            {% elif case.bam_files %}
              - Alignment:
              <a class="btn btn-default btn-sm" href="{{ url_for('alignviewers.pileup', bam=case.bam_files, bai=case.bai_files, sample=case.sample_names, contig=variant.chromosome, start=(variant.position - 50), stop=(variant.end + 50), vcf=case.vcf_files.vcf_sv) }}" target="_blank">Pileup</a>
              <a class="btn btn-default btn-sm" href="{{ url_for('alignviewers.igv', bam=case.bam_files, bai=case.bai_files, sample=case.sample_names, build=case.genome_build, contig=variant.chromosome, start=(variant.position - 50), stop=(variant.end + 50)) }}" target="_blank">IGV (BETA)</a>
            {% else %}
              - BAM file(s) missing
            {% endif %}
          </div>
        </li>
        <li class="list-group-item">
          Breakpoint 1
          <div class="pull-right">
            {{ variant.chromosome }}:{{ variant.position }}
            {% if variant.chromosome == "MT" and case.mt_bams %}
              - Alignment:
              <a class="btn btn-default btn-sm" href="{{ url_for('alignviewers.pileup', bam=case.mt_bams, bai=case.mt_bais, vcf=case.region_vcf_file, sample=case.sample_names, contig=variant.chromosome, start=(variant.position - 500), stop=(variant.position + 500)) }}" target="_blank">Pileup viewer</a><br>
              <a class="btn btn-default btn-sm" href="{{ url_for('alignviewers.igv', sample=case.sample_names, build=case.genome_build, bam=case.mt_bams, bai=case.mt_bais, contig=variant.chromosome, start=(variant.position - 500), stop=(variant.position + 500)) }}" target="_blank">IGV viewer (BETA)</a>
            {% elif case.bam_files %}
              - Alignment:
              <a class="btn btn-default btn-sm" href="{{ url_for('alignviewers.pileup', bam=case.bam_files, bai=case.bai_files, sample=case.sample_names, contig=variant.chromosome, start=(variant.position - 500), stop=(variant.position + 500), vcf=case.vcf_files.vcf_sv) }}" target="_blank">Pileup</a>
              <a class="btn btn-default btn-sm" href="{{ url_for('alignviewers.igv', bam=case.bam_files, bai=case.bai_files, sample=case.sample_names, build=case.genome_build, contig=variant.chromosome, start=(variant.position - 500), stop=(variant.position + 500)) }}" target="_blank">IGV (BETA)</a>
            {% else %}
              - BAM file(s) missing
            {% endif %}
          </div>
        </li>
        <li class="list-group-item">
          Breakpoint 2
          <div class="pull-right">
            {{ variant.chromosome }}:{{ variant.end }}
            {% if variant.chromosome == "MT" and case.mt_bams %}
              - Alignment:
              <a class="btn btn-default btn-sm" href="{{ url_for('alignviewers.pileup', bam=case.mt_bams, bai=case.mt_bais, vcf=case.region_vcf_file, sample=case.sample_names, contig=variant.chromosome, start=(variant.end - 500), stop=(variant.end + 500)) }}" target="_blank">Pileup viewer</a><br>
              <a class="btn btn-default btn-sm" href="{{ url_for('alignviewers.igv', sample=case.sample_names, build=case.genome_build, bam=case.mt_bams, bai=case.mt_bais, contig=variant.chromosome, start=(variant.end - 500), stop=(variant.end + 500)) }}" target="_blank">IGV viewer (BETA)</a>
            {% elif case.bam_files %}
              - Alignment:
              <a class="btn btn-default btn-sm" href="{{ url_for('alignviewers.pileup', bam=case.bam_files, bai=case.bai_files, sample=case.sample_names, contig=variant.chromosome, start=(variant.end - 500), stop=(variant.end + 500), vcf=case.vcf_files.vcf_sv) }}" target="_blank">Pileup</a>
              <a class="btn btn-default btn-sm" href="{{ url_for('alignviewers.igv', bam=case.bam_files, bai=case.bai_files, sample=case.sample_names, build=case.genome_build, contig=variant.chromosome, start=(variant.end - 500), stop=(variant.end + 500)) }}" target="_blank">IGV (BETA)</a>
            {% else %}
              - BAM file(s) missing
            {% endif %}
          </div>
        </li>
	      <li class="list-group-item">
	        Cytoband
          <div class="pull-right">
            {% if variant.chromosome == variant.end_chrom and variant.cytoband_start == variant.cytoband_end %}
              {{ variant.chromosome }}{{ variant.cytoband_start }}
            {% elif variant.chromosome == variant.end_chrom %}
              {{ variant.chromosome }}{{ variant.cytoband_start }}{{ variant.cytoband_end }}
            {% else %}
              {{ variant.chromosome }}{{ variant.cytoband_start }}-{{variant.end_chrom}}{{ variant.cytoband_end }}
            {% endif %}
          </div>
	      </li>
	      <li class="list-group-item">
	        Length <div class="pull-right">{{ variant.length }}</div>
	      </li>
	      <li class="list-group-item">
	        Type <div class="pull-right">{{ variant.sub_category|upper }}</div>
	      </li>
        {% if variant._id in case.suspects and not variant.clinvar_clinsig %}
          <a href="{{ url_for('variants.clinvar', institute_id=institute._id, case_name=case.display_name, variant_id=variant._id) }}" class="btn btn-default form-control">Submit to ClinVar (BETA)</a>
        {% endif %}
        {% if variant.clinvar_clinsig%}
          <a href="{{ url_for('cases.clinvar_submissions', institute_id=institute._id) }}" class="btn btn-default form-control">Modify clinvar submission</a>
        {% endif %}
      </ul>
    </div>
  </div>

  <div class="row">
    <div class="col-md-4">
      {{ frequencies(variant) }}
    </div>
    <div class="col-md-8">
      {{ gt_calls(variant.samples) }}
    </div>
  </div>

  <div class="row">
    <div class="col-xs-12 col-sm-9 {{ 'col-md9' if has_pedigree }}">
      {{ comments_panel(institute, case, current_user, variant.comments, variant_id=variant._id) }}
    </div>
    {% set has_pedigree = case.madeline_info and case.individuals|length > 1 %}
    {% if has_pedigree %}
      <div class="col-xs-12 col-md-3">{{ pedigree_panel(case) }}</div>
    {% endif %}
  </div>

  <div class="row">
    <div class="col-md-12">
      {{ genes(variant) }}
    </div>
  </div>

  <div class="row">
    <div class="col-md-12">
      {{ overlapping(overlapping_snvs, variant.rank_score) }}
    </div>
  </div>

  <div class="row">
    <div class="col-md-12">
      {{ ext_links(variant) }}
    </div>
  </div>

  {% if config['MAIL_USERNAME'] %}
    {# Email setting must be setup #}
    {{ verify_modal() }}
  {% endif %}

  {% if config['MAIL_USERNAME'] %}
    {# Email setting must be setup #}
    {{ modal_cancel_verify() }}
  {% endif %}

{% endblock %}

{% macro pin_button() %}
  {% if variant._id not in case.suspects %}
    <form action="{{ url_for('cases.pin_variant',
                             institute_id=institute._id,
                             case_name=case.display_name,
                             variant_id=variant._id) }}"
          method="POST">
      <button name="action" value="ADD" type="submit" class="btn btn-default navbar-btn" title="Pin variant">Pin</button>
    </form>
  {% else %}
    <form action="{{ url_for('cases.pin_variant',
                             institute_id=institute._id,
                             case_name=case.display_name,
                             variant_id=variant._id) }}"
          method="POST">
      <button name="action" value="DELETE" type="submit" class="btn btn-default navbar-btn" title="Unpin variant">Unpin</button>
    </form>
  {% endif %}
{% endmacro %}

{% macro causative_button() %}
  {% if variant._id in case.causatives %}
      <form action="{{ url_for('cases.mark_causative',
                               institute_id=institute._id,
                               case_name=case.display_name,
                               variant_id=variant._id) }}"
            method="POST">
        <button name="action" value="DELETE" type="submit" class="btn btn-default navbar-btn" title="Reset causative">
          Reset causative
        </button>
      </form>
  {% else %}
    <form action="{{ url_for('cases.mark_causative',
                             institute_id=institute._id,
                             case_name=case.display_name,
                             variant_id=variant._id) }}"
          method="POST">
      <button name="action" value="ADD" type="submit" class="btn btn-default navbar-btn" title="Mark causative" onclick="return confirm('Are you sure?')">
        Mark causative
      </button>
    </form>
  {% endif %}
{% endmacro %}

{% macro frequencies(variant) %}
  <div class="panel panel-default">
    <div class="panel-heading">Frequencies</div>
    <ul class="list-group">
      {% for freq_name, value in variant.frequencies %}
        <li class="list-group-item">
          {{ freq_name }}
          {% if value %}
            <span class="badge">{{ value|human_decimal }}</span>
          {% else %}
            <span class="pull-right">-</span>
          {% endif %}
        </li>
      {% endfor %}
    </ul>
  </div>
{% endmacro %}

{% macro gt_calls(samples) %}
  <div class="panel panel-default">
    <table class="table table-bordered">
      <thead>
        <tr>
          <th rowspan="2">Sample</th>
          <th rowspan="2">Genotype</th>
          <th colspan="2">Alleles</th>
          <th rowspan="2">GQ</th>
        </tr>
        <tr>
          <th>1st</th>
          <th>2nd</th>
        </tr>
      </thead>
      <tbody>
        {% for sample in samples %}
          <tr>
            <td>{{ sample.display_name }}</td>
            <td>{{ sample.genotype_call }}</td>
            {% for allele in sample.allele_depths %}
              <td>{{ allele }}</td>
            {% endfor %}
            <td>{{ sample.genotype_quality }}</td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
    {% if variant.callers %}
      <div class="panel-footer">
        {% for name, caller in variant.callers %}
          <span class="label label-default">{{ name }}: {{ caller }}</span>
        {% endfor %}
      </div>
    {% endif %}
  </div>
{% endmacro %}

{% macro genes(variant) %}
  <div class="panel panel-default">
    <div class="panel-heading">Genes</div>
    <div class="table-responsive">
      <table class="table table-bordered">
        <thead>
          <tr>
            <th>Gene</th>
            <th>Ensembl</th>
            <th>Region</th>
            <th>Function</th>
            <th>Description</th>
            <th>OMIM</th>
          </tr>
        </thead>
        <tbody>
          {% for gene in variant.genes %}
            <tr>
              <td>
                <a href="http://www.genenames.org/cgi-bin/gene_symbol_report?match={{ gene.hgnc_symbol }}" target="_blank">
                  {{ gene.common.hgnc_symbol }}
                </a>
              </td>
              <td>
                <a target="_blank" href="{{ gene.ensembl_link }}">
                  {{ gene.common.ensembl_id }}
                </a>
              </td>
              <td>{{ gene.region_annotation }}</td>
              <td>{{ gene.functional_annotation }}</td>
              <td>{{ gene.common.description|replace('_', ' ') }}</td>
              <td>
                {% if gene.common.omim_id %}
                  <a href="http://omim.org/entry/{{ gene.common.omim_id }}" target="_blank">
                    {{ gene.common.omim_id }}
                  </a>
                {% endif %}
              </td>
            </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
  </div>
{% endmacro %}

{% macro ext_links(variant) %}
  {# External links #}
  <div class="panel panel-default">
    <table class="table table-bordered">
      <tbody>
        <tr>
          <td>
            <a class="btn btn-link form-control" href="http://grch37.ensembl.org/Homo_sapiens/Location/View?db=core;r={{ variant.chromosome }}:{{ variant.position }}-{{ variant.end }}" target="_blank">Ensembl</a>
          </td>
          <td>
            <a class="btn btn-link form-control" href="http://genome.ucsc.edu/cgi-bin/hgTracks?db=hg19&position=chr{{ variant.chromosome }}:{{ variant.position }}-{{ variant.end }}&dgv=pack&knownGene=pack&omimGene=pack" target="_blank">UCSC</a>
          </td>
	  <td>
	    <a class="btn btn-link form-control" href="https://decipher.sanger.ac.uk/browser#q/{{ variant.chromosome }}:{{ variant.position }}-{{ variant.end }}%20/location/{{ variant.chromosome }}:{{ variant.position }}-{{ variant.end }}" target ="_blank">DECIPHER</a>
	  </td>
        </tr>
      </tbody>
    </table>
  </div>
{% endmacro %}


{% macro overlapping(other_variants, rank_score) %}
  <div class="panel panel-default">
    <div class="panel-heading">Overlapping SNVs</div>
    <table class="table table-bordered">
      <thead>
        <tr>
          <th>Variant</th>
          <th>Gene</th>
          <th>Combined score</th>
          <th>Rank score</th>
          <th>Region</th>
          <th>Function</th>
        </tr>
      </thead>
      <tbody>
        {% for variant in other_variants %}
          <tr>
            <td>
              <a href="{{ url_for('variants.variant', institute_id=institute._id,
                                  case_name=case.display_name,
                                  variant_id=variant._id)}}">
                {{ variant.display_name|truncate(20, True) }}
              </a>
            </td>
            <td>{{ variant.hgnc_symbols|join(', ') }}</td>
            <td class="text-right">{{ rank_score + variant.rank_score }}</td>
            <td class="text-right">{{ variant.rank_score }}</td>
            <td>{{ variant.region_annotations|join(',') }}</td>
            <td>{{ variant.functional_annotations|join(',') }}</td>
          </tr>
        {% else %}
          <tr>
            <td colspan="6">No overlapping SNVs found</td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>

{% endmacro %}

{% macro verify_button() %}
  {% if variant.sanger_ordered %}
    {% if variant.validation in ['True positive', 'False positive']%}
      <p class="navbar-text">Validation: {{ variant.validation }}</p>
    {% else %}
      <button class="btn btn-default navbar-btn" data-toggle="modal" data-target="#cancelVerifyModal">
        Verification pending...
      </button>
    {% endif %}
  {% else %}
    <button class="btn btn-default navbar-btn" data-toggle="modal" data-target="#svVerifyModal">
      Verify
    </button>
  {% endif %}
{% endmacro %}

{% macro verify_modal() %}
<form action="{{ url_for('variants.verify', institute_id=institute._id,
                         case_name=case.display_name, variant_id=variant._id, variant_category=variant.category, order=True) }}"
      method="POST">
  <div class="modal fade" id="svVerifyModal">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Order verification</h4>
        </div>
        <div class="modal-body">
          {{ verify_form() }}
        </div>
        <div class="modal-footer">
          <button class="btn btn-default" data-dismiss="modal">Close</button>
          <button type="submit" class="btn btn-primary">Send verification order request</button>
        </div>
      </div>
    </div>
  </div>
</form>
{% endmacro %}

{% macro modal_cancel_verify() %}
  <form action="{{ url_for('variants.verify', institute_id=institute._id,
                           case_name=case.display_name, variant_id=variant._id, variant_category=variant.category, order=False) }}"
        method="POST">
    <div class="modal fade" id="cancelVerifyModal">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
            <button class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">Cancel variant verification</h4>
          </div>
          <div class="modal-body">
            {{ verify_form() }}
          </div>
          <div class="modal-footer">
            <button class="btn btn-default" data-dismiss="modal">Close</button>
            <button type="submit" class="btn btn-primary">Send cancellation request</button>
          </div>
        </div>
      </div>
    </div>
  </form>
{% endmacro %}

{% macro verify_form() %}
<ul class="list-group">
  <li class="list-group-item">
    <strong>Case {{ case.display_name }}</strong><br>
    <a href="{{ url_for('variants.sv_variant', institute_id=institute._id,
                        case_name=case.display_name, variant_id=variant._id) }}">
      {% if variant.end_chrom and variant.end_chrom == variant.chromosome %}
        {{variant.chromosome}}:{{variant.position}}-{{variant.end}}
      {% elif variant.end_chrom %}
        {{variant.chromosome}}:{{variant.position}} - {{variant.end_chrom}}:{{variant.end}}
      {% endif %}
      {{ variant.sub_category|upper }}
    </a>
  <li class="list-group-item"><strong>Variant type</strong>: {{variant.sub_category|upper}}</li>
  <li class="list-group-item"><strong>Breakpoint 1</strong>: chr{{variant.chromosome}}:{{variant.position}}</li>
  <li class="list-group-item"><strong>Breakpoint 2</strong>: chr{{variant.end_chrom if variant.end_chrom else variant.chromosome}}:{{variant.end}}</li>
  <li class="list-group-item"><strong>Lenght</strong>: {{variant.length}}</li>
  </li>
  <li class="list-group-item">
    <strong>Encompassing genes</strong>:
    {{ variant.hgnc_symbols|join(', ') }}
  </li>
  <li class="list-group-item">
    <strong>Gene panels</strong>:
    {{ variant.panels|join(', ') }}
  </li>
  <li class="list-group-item disabled"><strong>GT call</strong></li>
  {% for individual in variant.samples %}
    <li class="list-group-item">
      {{ individual.display_name }}: {{ individual.genotype_call }}
    </li>
  {% endfor %}
  <li class="list-group-item">
    <strong>Ordered by</strong>:
    {{ current_user.name }}
  </li>
</ul>
{% endmacro %}

{% block scripts %}
  {{ super() }}

  <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.13/js/bootstrap-multiselect.min.js"></script>
  <script>
    $(function () {
      $('select[multiple]').multiselect({
        buttonWidth: '100%'
      });
    })
  </script>
{% endblock %}
