{% from "alignviewers/utils.html" import igv_script %}

<!DOCTYPE html>

<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Scout: Integrative Genomics Viewer</title>

    <!-- jQuery UI CSS -->
    <link rel="stylesheet" type="text/css"
          href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css"/>

    <!-- Font Awesome CSS -->
    <link rel="stylesheet" type="text/css"
          href="https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css"/>

    <!-- jQuery JS -->
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script type="text/javascript"
            src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
    {{ igv_script() }}
</head>

<body>
  <div class="container-fluid" id="igvDiv" style="padding:5px; border:1px solid lightgray"></div>
</body>

<script type="text/javascript">
  $(document).ready(function () {
      var div = $("#igvDiv")[0],
              options = {
                    showNavigation: true,
                    showRuler: true,
                    {% if display_center_guide %}
                      showCenterGuide: true,
                    {% else %}
                      showCenterGuide: false,
                    {% endif %}
                    reference: {
                        fastaURL: "{{ reference_track.fastaURL }}",
                        indexURL: "{{ reference_track.indexURL }}",
                        cytobandURL: "{{ reference_track.cytobandURL }}"
                    },
                    locus: "{{locus}}",
                    tracks: [
                      {% for custTrack in custom_tracks %}
                        {
                            name: "{{ custTrack.name }}",
                            type: "{{ custTrack.type }}",
                            format: "{{ custTrack.format }}",
                            sourceType: "{{ custTrack.sourceType }}",
                            url: "{{ custTrack.url|replace('%2F','/') }}",
                            displayMode: "{{ custTrack.displayMode }}",
                            order: Number.MIN_VALUE,
                            {% if custTrack.name == "Genes" %}
                                indexURL: "{{ custTrack.indexURL|replace('%2F','/') }}",
                            {% endif %}
                        },
                      {% endfor %}
                      {% for custTrack in cloud_public_tracks %}
                        {
                          name: "{{ custTrack.name }}",
                          type: "{{ custTrack.type }}",
                          format: "{{ custTrack.format }}",
                          url: "{{ url_for('alignviewers.remote_cors', remote_url=custTrack.url) }}",
                          indexURL: "{{ url_for('alignviewers.remote_cors', remote_url=custTrack.indexURL) }}"
                        },
                      {% endfor %}
                      {% for wtrack in rhocall_wig %}
                      {
                        type: "wig",
                        name: '{{ wtrack.name }}',
                        url: '{{ url_for("alignviewers.remote_static", file=wtrack.url) }}',
                        format: 'wig',
                        {# indexURL: '{{ url_for("alignviewers.remote_static", file=wtrack.url)  }}', #}
                        color: "rgb(60, 37, 17)",
                        min: '{{ wtrack.min }}',
                        max: '{{ wtrack.max }}',
                        sourceType: 'file'
                      },
                      {% endfor %}
                      {% for btrack in rhocall_bed %}
                      {
                        type: "bed",
                        name: '{{ btrack.name }}',
                        url: '{{ url_for("alignviewers.remote_static", file=btrack.url) }}',
                        format: 'bed',
                        color: "rgb(65, 31, 30)",
                        sourceType: 'file'
                      },
                      {% endfor %}
                      {% for track in sample_tracks %}
                      {
                        name: "{{ track.name }}",
                        type: "alignment",
                        url: "{{ url_for('alignviewers.remote_static', file=track.url) }}",
                        indexURL: "{{ url_for('alignviewers.remote_static', file=track.indexURL) }}",
                        sourceType: "file",
                        format: "{{ track.format }}",
                        height: "{{track.height}}"
                      },
                      {% endfor %}
                      {% for ttrack in tiddit_coverage_wig %}
                      {
                        type: "wig",
                        name: '{{ ttrack.name }}',
                        url: '{{ url_for("alignviewers.remote_static", file=ttrack.url) }}',
                        color: "rgb(40, 0, 13)",
                        sourceType: 'file'
                      },
                      {% endfor %}
                      {% for rtrack in upd_regions_bed %}
                      {
                        type: "bed",
                        name: '{{ rtrack.name }}',
                        url: '{{ url_for("alignviewers.remote_static", file=rtrack.url) }}',
                        color: "rgb(0, 204, 102)",
                        sourceType: 'file'
                      },
                      {% endfor %}
                      {% for strack in upd_sites_bed %}
                      {
                        type: "bed",
                        name: '{{ strack.name }}',
                        url: '{{ url_for("alignviewers.remote_static", file=strack.url) }}',
                        color: "rgb(25, 61, 4)",
                        sourceType: 'file'
                      },
                      {% endfor %}
                  ]
              };
      igv.createBrowser(div, options);
  });
</script>

</html>
