Merge pull request #877 from genenetwork/feature/cleanup-base-file

Feature/cleanup base file

1 files changed, 471 insertions, 347 deletions

diff --git a/gn2/wqflask/templates/index_page.html b/gn2/wqflask/templates/index_page.html
index 734cd075..7044e9e3 100755
--- a/gn2/wqflask/templates/index_page.html
+++ b/gn2/wqflask/templates/index_page.html
@@ -1,400 +1,524 @@
 {% extends "base.html" %}
-{% block title %}GeneNetwork{% endblock %}
-{% block css %}
-<!-- UIkit CSS -->
-<link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='uikit/css/uikit.min.css') }}"/>
-
-<link rel="stylesheet" href="/static/new/css/index_page.css" />
-<link rel="stylesheet" href="/static/new/css/autocomplete.css"/>
+{% block title %} GeneNetwork {% endblock %}
 
-<!-- UIkit JS -->
-<script language="javascript" type="text/javascript" src="{{ url_for('js', filename='uikit/js/uikit.min.js') }}"></script>
+<link rel="stylesheet"
+      type="text/css"
+      href="{{ url_for('css', filename='uikit/css/uikit.min.css') }}" />
+{% block css %}
+<link rel="stylesheet"
+      type="text/css"
+      href="{{ url_for('static', filename='/new/css/index_page.css') }}" />
+<link rel="stylesheet"
+      type="text/css"
+      href="{{ url_for('static', filename='/new/css/toots.css') }}" />
+<style TYPE="text/css">
 
-<script language="javascript" type="text/javascript" src="{{ url_for('js', filename='uikit/js/uikit-icons.min.js') }}"></script>
+ p.interact { display: none; }
 
-<!--locally built emfed package see source file:https://github.com/sampsyo/emfed -->
-<script type="module" src="static/new/javascript/emfed.bundle.js"></script>
-<link rel="stylesheet" type="text/css"
-    href="static/new/css/toots.css">
-<style TYPE="text/css">
-    
-  p.interact { display: none; }
 
+ .media {
+     padding-bottom:10px;
+     border-bottom: 1px solid #c8ccc9;
+ }
 
-  .media {
-    padding-bottom:10px;
-    border-bottom: 1px solid #c8ccc9;
-  }
+ .media img {
 
-  .media img {
+     width: 95%;
+     height: 100%;
+     border-radius: 5px;
+     /*transform: scale(1.1); image small?*/
+     border:1px solid #c8ccc9;
+ }
 
-    width: 95%;
-    height: 100%;
-    border-radius: 5px;
-    /*transform: scale(1.1); image small?*/
-    border:1px solid #c8ccc9;
-  }
+ .toots {
+     margin:0 auto;
+     max-width: 500px;
+     height: 160px;
+     position: relative;
+     border-radius:10px;
+     background-color: #F9F9F9;
 
-  .toots {
-    margin:0 auto;
-    max-width: 500px;
-    height: 160px;
-    position: relative;
-    border-radius:10px;
-    background-color: #F9F9F9;
+ }
 
-  }
+ h2 {
+     margin-bottom: 0px;
+ }
 
-  h2 {
-      margin-bottom: 0px;
-  }
+ ul {
+     margin-top: 0px;
+ }
 
-  ul {
-      margin-top: 0px;
-  }
+ .toot {
+     padding-top:8px;     
+     background:#f9f9f9;
+     color:#000;
+     
+ }
 
-  .toot {
-    padding-top:8px;
-    background:#f9f9f9;
-    color:#000;
- 
-  }
 </style>
 {% endblock %}
+{% block search %}
+{% include "gsearch.html" %}
+{% endblock %}
 {% block content %}
-<!-- Start of body -->
-    <div class="container-fluid" style="min-width: 1210px;">
-
-      {{ flash_me() }}
-
-      {%if anon_collections | length > 0%}
-      <div class="panel panel-warning">
-	<div class="panel-heading">
-	  <h3 class="panel-title">Import Anonymous Collections</h3>
-	</div>
-	<div class="panel-body">
-	  <p>
-	    There {%if anon_collections | length > 1%}are{%else%}is{%endif%}
-	    {{anon_collections | length}} anonymous
-	    collection{%if anon_collections | length > 1%}s{%endif%}
-	    associated with your current session. What do you wish to do?
-	  </p>
-	  <p class="text-danger" style="font-weight: bold;">
-	    <small>
-	      If you choose to ignore this, the anonymous collections will be
-	      eventually deleted and lost.
-	    </small>
-	  </p>
-	  <form action="{{url_for('handle_anonymous_collections')}}"
-		method="POST">
-	    <div class="form-group">
-	      <input type="radio" id="rdo-import" value="import"
-		     name="anon_choice" />
-	      <label for="rdo-import">Import</label>
-	      <input type="radio" id="rdo-delete" value="delete"
-		     name="anon_choice" />
-	      <label for="rdo-delete">Delete</label>
-	    </div>
-
-	    <input type="submit" class="btn btn-warning" value="Submit" />
-	  </form>
-	</div>
-      </div>
-      {%endif%}
-
-        <div class="row" style="width: 100%;">
-
-            <div class="col-xs-4" style="margin-right:50px; min-width: 530px; max-width: 550px;">
-                <section id="search">
-                    <div class="page-header">
-                        <h2>Select and Search</h2>
-                    </div>
-                    <form method="get" action="/search" target="_blank" id="searchform" name="SEARCHFORM",
-			  data-gn_server_url="{{gn_server_url}}">
-                        <fieldset>
-                            <div style="padding-left: 20px; padding-right: 20px;" class="form-horizontal">
-
-                                <div class="form-group">
-                                    <label for="species" class="col-xs-1 control-label" style="width: 65px !important;">Species:</label>
-                                    <div class="col-xs-10 controls input-append" style="display: flex; padding-left: 20px;">
-                                        <div class="col-9">
-                                          <select name="species" id="species" class="form-control" style="width: 340px !important;"><option>Loading...</option></select>
-                                        </div>
+<div class="container-fluid" style="min-width: 1210px;">
+    {{ flash_me() }}
+    {% if anon_collections | length > 0 %}
+    <div class="panel panel-warning">
+        <div class="panel-heading">
+            <h3 class="panel-title">Import Anonymous Collections</h3>
+        </div>
+        <div class="panel-body">
+            <p>
+                There
+                {% if anon_collections | length > 1 %}
+                are
+                {% else %}
+                is
+                {% endif %}
+                {{ anon_collections | length }} anonymous
+                collection
+                {% if anon_collections | length > 1 %}s{% endif %}
+                associated with your current session. What do you wish to do?
+            </p>
+            <p class="text-danger" style="font-weight: bold;">
+                <small>
+                    If you choose to ignore this, the anonymous collections will be
+                    eventually deleted and lost.
+                </small>
+            </p>
+            <form action="{{ url_for("handle_anonymous_collections") }}" method="post">
+                <div class="form-group">
+                    <input type="radio" id="rdo-import" value="import" name="anon_choice" />
+                    <label for="rdo-import">Import</label>
+                    <input type="radio" id="rdo-delete" value="delete" name="anon_choice" />
+                    <label for="rdo-delete">Delete</label>
+                </div>
+                <input type="submit" class="btn btn-warning" value="Submit" />
+            </form>
+        </div>
+    </div>
+    {% endif %}
+    <div class="row" style="width: 100%;">
+        <div class="col-xs-4"
+             style="margin-right:50px;
+                    min-width: 530px;
+                    max-width: 550px">
+            <section id="search">
+                <div class="page-header">
+                    <h2>Select and Search</h2>
+                </div>
+                <form method="get"
+                      action="/search"
+                      target="_blank"
+                      id="searchform"
+                      name="SEARCHFORM"
+                      data-gn_server_url="{{ gn_server_url }}">
+                    <fieldset>
+                        <div style="padding-left: 20px;
+                                    padding-right: 20px"
+                             class="form-horizontal">
+                            <div class="form-group">
+                                <label for="species"
+                                       class="col-xs-1 control-label"
+                                       style="width: 65px !important">Species:</label>
+                                <div class="col-xs-10 controls input-append"
+                                     style="display: flex;
+                                            padding-left: 20px">
+                                    <div class="col-9">
+                                        <select name="species"
+                                                id="species"
+                                                class="form-control"
+                                                style="width: 340px !important">
+                                            <option>Loading...</option>
+                                        </select>
                                     </div>
                                 </div>
-
-                                <div class="form-group">
-                                    <label for="group" class="col-xs-1 control-label" style="width: 65px !important;">Group:</label>
-                                    <div class="col-xs-10 controls input-append" style="display: flex; padding-left: 20px;">
-                                        <div class="col-9">
-                                          <select name="group" id="group" class="form-control" style="width: 340px !important;"><option>Loading...</option></select>
-                                          <i class="icon-question-sign"></i>
-                                        </div>
-                                        <div class="col-3" style="margin-left: 10px;">
-                                            <button type="button" id="group_info" class="btn form-control info-button"><span class="glyphicon glyphicon-flag"></span> Info</button>
-                                        </div>
+                            </div>
+                            <div class="form-group">
+                                <label for="group"
+                                       class="col-xs-1 control-label"
+                                       style="width: 65px !important">Group:</label>
+                                <div class="col-xs-10 controls input-append"
+                                     style="display: flex;
+                                            padding-left: 20px">
+                                    <div class="col-9">
+                                        <select name="group"
+                                                id="group"
+                                                class="form-control"
+                                                style="width: 340px !important">
+                                            <option>Loading...</option>
+                                        </select>
+                                        <i class="icon-question-sign"></i>
                                     </div>
-                                </div>
-
-                                <div class="form-group">
-                                    <label for="tissue" class="col-xs-1 control-label" style="width: 65px !important;">Type:</label>
-                                    <div class="col-xs-10 controls input-append" style="display: flex; padding-left: 20px;">
-                                        <div class="col-9">
-                                          <select name="type" id="type" class="form-control" style="width: 340px !important;"><option>Loading...</option></select>
-                                        </div>
-                                        <div class="col-3" style="margin-left: 10px;">
-                                            <button type="button" id="dataset_info" class="btn form-control info-button"><span class="glyphicon glyphicon-flag"></span> Info</button>
-                                        </div>
+                                    <div class="col-3" style="margin-left: 10px;">
+                                        <button type="button" id="group_info" class="btn form-control info-button">
+                                            <span class="glyphicon glyphicon-flag"></span> Info
+                                        </button>
                                     </div>
                                 </div>
-
-                                <div class="form-group">
-                                    <label for="dataset" class="col-xs-1 control-label" style="width: 65px !important;">Dataset:</label>
-                                    <div class="col-xs-10 controls" style="display: flex; padding-left: 20px;">
-                                        <div class="col-9">
-                                          <select name="dataset" id="dataset" class="form-control" style="max-width: 550px; width: 450px !important;"><option>Loading...</option></select>
-                                          <i class="icon-question-sign"></i>
-                                        </div>
+                            </div>
+                            <div class="form-group">
+                                <label for="tissue"
+                                       class="col-xs-1 control-label"
+                                       style="width: 65px !important">Type:</label>
+                                <div class="col-xs-10 controls input-append"
+                                     style="display: flex;
+                                            padding-left: 20px">
+                                    <div class="col-9">
+                                        <select name="type"
+                                                id="type"
+                                                class="form-control"
+                                                style="width: 340px !important">
+                                            <option>Loading...</option>
+                                        </select>
+                                    </div>
+                                    <div class="col-3" style="margin-left: 10px;">
+                                        <button type="button" id="dataset_info" class="btn form-control info-button">
+                                            <span class="glyphicon glyphicon-flag"></span> Info
+                                        </button>
                                     </div>
                                 </div>
-                                <!--  GET ANY  SEARCH -->
-
-                                <div class="form-group">
-                                    <label for="or_search" class="col-xs-1 control-label" style="padding-left: 0px; padding-right: 0px; width: 65px !important;">Get Any:</label>
-                                    <div class="col-xs-10 controls" style="padding-left: 20px;">
-                                        <div class="col-8 autocomplete">
-                                          <textarea id="myInput" onkeyup="pressed(event)" name="search_terms_or" rows="1" class="form-control search-query" style="resize: vertical; max-width: 550px; width: 450px !important;" id="or_search"></textarea>
-                                        </div>
+                            </div>
+                            <div class="form-group">
+                                <label for="dataset"
+                                       class="col-xs-1 control-label"
+                                       style="width: 65px !important">Dataset:</label>
+                                <div class="col-xs-10 controls" style="display: flex; padding-left: 20px;">
+                                    <div class="col-9">
+                                        <select name="dataset"
+                                                id="dataset"
+                                                class="form-control"
+                                                style="max-width: 550px;
+                                                      width: 450px !important">
+                                            <option>Loading...</option>
+                                        </select>
+                                        <i class="icon-question-sign"></i>
                                     </div>
                                 </div>
-
-                                <!--  GET ANY HELP   -->
-                                <div class="form-group">
-                                    <label for="btsearch" class="col-xs-1 control-label" style="width: 65px !important;"></label>
-                                    <div class="col-xs-10 controls" style="padding-left: 20px;">
-                                        <div class="col-12 controls">
-                                            Enter terms, genes, ID numbers in the <b>Search</b> field.<br>
-                                            Use <b>*</b> or <b>?</b> wildcards (Cyp*a?, synap*).<br>
-                                            Use <b>quotes</b> for terms such as <i>"tyrosine kinase"</i>.
-
-
-                                            <div><strong><a style="text-decoration: none;"  href="https://issues.genenetwork.org/topics/xapian/xapian-search-queries" target=”_blank” >see more hints</a></strong></div>
-                                        </div>
+                            </div>
+                            <!--  GET ANY  SEARCH -->
+                            <div class="form-group">
+                                <label for="or_search"
+                                       class="col-xs-1 control-label"
+                                       style="padding-left: 0px;
+                                            padding-right: 0px;
+                                            width: 65px !important">Get Any:</label>
+                                <div class="col-xs-10 controls" style="padding-left: 20px;">
+                                    <div class="col-8 autocomplete">
+                                        <textarea id="myInput"
+                                                  onkeyup="pressed(event)"
+                                                  name="search_terms_or"
+                                                  rows="1"
+                                                  class="form-control search-query"
+                                                  style="resize: vertical;
+                                                      max-width: 550px;
+                                                      width: 450px !important"
+                                                  id="or_search"></textarea>
                                     </div>
                                 </div>
-
-                                <div class="form-group">
-                                    <label for="and_search" class="col-xs-1 control-label" style="padding-left: 0px; padding-right: 0px; width: 65px !important;">Combined:</label>
-                                    <div class="col-xs-10 controls" style="padding-left: 20px;">
-                                        <div class="col-8 autocomplete">
-                                          <textarea id="myInput" onkeyup="pressed(event)" name="search_terms_and" rows="1" class="form-control search-query" style="resize: vertical; max-width: 550px; width: 450px !important;" id="and_search"></textarea>
+                            </div>
+                            <!--  GET ANY HELP   -->
+                            <div class="form-group">
+                                <label for="btsearch"
+                                       class="col-xs-1 control-label"
+                                       style="width: 65px !important"></label>
+                                <div class="col-xs-10 controls" style="padding-left: 20px;">
+                                    <div class="col-12 controls">
+                                        Enter terms, genes, ID numbers in the <b>Search</b> field.
+                                        <br>
+                                        Use <b>*</b> or <b>?</b> wildcards (Cyp*a?, synap*).
+                                        <br>
+                                        Use <b>quotes</b> for terms such as <i>"tyrosine kinase"</i>.
+                                        <div>
+                                            <strong>
+                                                <a style="text-decoration: none"
+                                                   href="https://issues.genenetwork.org/topics/xapian/xapian-search-queries"
+                                                   target="_blank">see more hints</a>
+                                            </strong>
                                         </div>
                                     </div>
                                 </div>
-
-                                <div class="form-group">
-                                    <label for="btsearch" class="col-xs-1 control-label" style="width: 65px !important;"></label>
-                                    <div class="col-xs-10 controls" style="display: flex; padding-left: 20px;">
-                                        <div class="col-2 controls">
-                                            <button id="btsearch" class="btn btn-primary form-control"><span class="glyphicon glyphicon-search"></span> Search</button>
-                                        </div>
-                                        <div class="col-2 align-self-end controls" style="padding-left: 20px;">
-                                            <button type="button" id="make_default" class="btn form-control info-button"><span class="glyphicon glyphicon-pushpin"></span> Lock Menu</button>
-                                        </div>
+                            </div>
+                            <div class="form-group">
+                                <label for="and_search"
+                                       class="col-xs-1 control-label"
+                                       style="padding-left: 0px;
+                                            padding-right: 0px;
+                                            width: 65px !important">Combined:</label>
+                                <div class="col-xs-10 controls" style="padding-left: 20px;">
+                                    <div class="col-8 autocomplete">
+                                        <textarea id="myInput"
+                                                  onkeyup="pressed(event)"
+                                                  name="search_terms_and"
+                                                  rows="1"
+                                                  class="form-control search-query"
+                                                  style="resize: vertical;
+                                                      max-width: 550px;
+                                                      width: 450px !important"
+                                                  id="and_search"></textarea>
                                     </div>
                                 </div>
-
-                                <!--  SEARCH, MAKE DEFAULT -->
-                                <div class="form-group">
+                            </div>
+                            <div class="form-group">
+                                <label for="btsearch"
+                                       class="col-xs-1 control-label"
+                                       style="width: 65px !important"></label>
+                                <div class="col-xs-10 controls" style="display: flex; padding-left: 20px;">
+                                    <div class="col-2 controls">
+                                        <button id="btsearch" class="btn btn-primary form-control">
+                                            <span class="glyphicon glyphicon-search"></span> Search
+                                        </button>
+                                    </div>
+                                    <div class="col-2 align-self-end controls" style="padding-left: 20px;">
+                                        <button type="button" id="make_default" class="btn form-control info-button">
+                                            <span class="glyphicon glyphicon-pushpin"></span> Lock Menu
+                                        </button>
+                                    </div>
                                 </div>
-                                <input type="hidden" name="accession_id" value="None" class="form-control">
-                                <input type="hidden" name="FormID" value="searchResult" class="form-control">
                             </div>
-                        </fieldset>
-                    </form>
-                </section>
-                <section id="advanced">
-                    <div class="page-header">
-                        <h2>Advanced Commands</h2>
-                    </div>
-
-                    <p>You can also use advanced commands. Copy these simple examples into the Get Any field for single term searches and Combined for searches with multiple terms:</p>
-
-                      <ul>
-                        <li><b>POSITION=(chr1 25 30)</b> finds genes, markers, or transcripts on
-                        chromosome 1 between 25 and 30 Mb.</li>
-
-                        <li><b>MEAN=(15 16)</b> in the <b>Combined</b> field finds
-                        highly expressed genes (15 to 16 log2 units)</li>
-
-                        <li><b>RANGE=(1.5 2.5)</b> in the <b>Any</b> field finds traits with values with a specified fold-range (minimum = 1). 
-                        Useful for finding "housekeeping genes" <b>(1.0 1.2)</b> or highly variable molecular assays <b>(10 100)</b>.</li>
-
-                        <li><b>LRS=(15 1000)</b> or <b>LOD=(2 8)</b> finds all traits with peak LRS or LOD scores between lower and upper limits.</li>
-
-                        <li><b>LRS=(9 999 Chr4 122 155)</b> finds all traits on Chr 4 from 122 and 155 Mb with LRS scores between 9 and 999.</li>
-
-                        <li><b>cisLRS=(15 1000 5)</b> or <b>cisLOD=(2 8 5)</b> finds all cis eQTLs with peak LRS or LOD scores between lower and upper limits,
-                            with an <b>inclusion</b> zone of 5 Mb around the parent gene.</li>
-
-                        <li><b>transLRS=(15 1000 5)</b> or <b>transLOD=(2 8 5)</b> finds all trans eQTLs with peak LRS or LOD scores between lower and upper limits,
-                            with an <b>exclusion</b> zone of 5 Mb around the parent gene. You can also add a fourth term specifying which chromosome you want the transLRS to be on
-                            (for example transLRS=(15 1000 5 7) would find all trans eQTLs with peak LRS on chromosome 7 that is also a trans eQTL with exclusionary zone of 5Mb).</li>
-
-                        <li><b>POSITION=(Chr4 122 130) cisLRS=(9 999 10)</b>
-                            finds all traits on Chr 4 from 122 and 155 Mb with cisLRS scores
-                            between 9 and 999 and an inclusion zone of 10 Mb.</li>
-
-                        <li><b>RIF=mitochondrial</b> searches RNA databases for <a href="https://en.wikipedia.org/wiki/GeneRIF">
-                        GeneRIF</a> links.</li>
-
-                        <li><b>WIKI=nicotine</b> searches <a href="http://gn1.genenetwork.org/webqtl/main.py?FormID=geneWiki">
-                        GeneWiki</a> for genes that you or other users have annotated
-                        with the word <i>nicotine</i>.</li>
-
-                        <li><b>GO:0045202</b> searches for synapse-associated genes listed in the
-                        <a href="http://amigo.geneontology.org/amigo/medial_search?q=GO%3A0045202">
-                            Gene Ontology</a>.</li>
-
-                        <li><b>RIF=diabetes LRS=(9 999 Chr2 100 105) transLRS=(9 999 10)</b>
-                        finds diabetes-associated transcripts with peak <a href="{{ url_for('gn_docs_blueprint.glossary') }}#E">
-                        trans eQTLs</a> on Chr 2 between 100 and 105 Mb with LRS
-                        scores between 9 and 999.</li>
-                      </ul>
-                </section>
-            </div>
-
-            <div class="col-xs-4" style="width: 600px !important;">
-	            <section id="tutorials">
-                    <div class="page-header">
-                        <h2>Tutorials</h2>
-                    </div>
-                    <div class="uk-grid-match uk-child-width-1-3@m" uk-grid>
-                        <div>
-                            <strong><a class="uk-link-text" href="/tutorials">Webinars & Courses</a></strong><br>
-                            In-person courses, live webinars and webinar recordings<br>
-                            <a href="/tutorials" class="uk-icon-link" uk-icon="laptop" ratio="2"></a>
-                        </div>
-                        <div>
-                            <strong><a class="uk-link-text" href="/tutorials">Tutorials</a></strong><br>
-                            Tutorials: Training materials in HTML, PDF and video formats<br>
-                            <a href="/tutorials" class="uk-icon-link" uk-icon="file-text" ratio="2"></a>
+                            <!--  SEARCH, MAKE DEFAULT -->
+                            <div class="form-group"></div>
+                            <input type="hidden" name="accession_id" value="None" class="form-control">
+                            <input type="hidden" name="FormID" value="searchResult" class="form-control">
                         </div>
-                        <div>
-                            <strong><a class="uk-link-text" href="/tutorials">Documentation</a></strong><br>
-                            Online manuals, handbooks, fact sheets and FAQs<br>
-                            <a href="/tutorials" class="uk-icon-link" uk-icon="album" ratio="2"></a>
-                        </div>
-                    </div>
-                </section>
-                <section id="news-section">
-                    <div class="page-header">
-                        <h2>News</h2>
-                    </div>
-                    <div id="mastadon" style="height: 405px; overflow: scroll; overflow-x: hidden;">
-                    	<a class="mastodon-feed" target="_blank"
-   href="https://genomic.social/@genenetwork"
-   data-toot-limit="5"
-   >Genenetwork mastadon</a>
-                    	
+                    </fieldset>
+                </form>
+            </section>
+            <section id="advanced">
+                <div class="page-header">
+                    <h2>Advanced Commands</h2>
+                </div>
+                <p>
+                    You can also use advanced commands. Copy these simple examples into the Get Any field for single term searches and Combined for searches with multiple terms:
+                </p>
+                <ul>
+                    <li>
+                        <b>POSITION=(chr1 25 30)</b> finds genes, markers, or transcripts on
+                        chromosome 1 between 25 and 30 Mb.
+                    </li>
+                    <li>
+                        <b>MEAN=(15 16)</b> in the <b>Combined</b> field finds
+                        highly expressed genes (15 to 16 log2 units)
+                    </li>
+                    <li>
+                        <b>RANGE=(1.5 2.5)</b> in the <b>Any</b> field finds traits with values with a specified fold-range (minimum = 1).
+                        Useful for finding "housekeeping genes" <b>(1.0 1.2)</b> or highly variable molecular assays <b>(10 100)</b>.
+                    </li>
+                    <li>
+                        <b>LRS=(15 1000)</b> or <b>LOD=(2 8)</b> finds all traits with peak LRS or LOD scores between lower and upper limits.
+                    </li>
+                    <li>
+                        <b>LRS=(9 999 Chr4 122 155)</b> finds all traits on Chr 4 from 122 and 155 Mb with LRS scores between 9 and 999.
+                    </li>
+                    <li>
+                        <b>cisLRS=(15 1000 5)</b> or <b>cisLOD=(2 8 5)</b> finds all cis eQTLs with peak LRS or LOD scores between lower and upper limits,
+                        with an <b>inclusion</b> zone of 5 Mb around the parent gene.
+                    </li>
+                    <li>
+                        <b>transLRS=(15 1000 5)</b> or <b>transLOD=(2 8 5)</b> finds all trans eQTLs with peak LRS or LOD scores between lower and upper limits,
+                        with an <b>exclusion</b> zone of 5 Mb around the parent gene. You can also add a fourth term specifying which chromosome you want the transLRS to be on
+                        (for example transLRS=(15 1000 5 7) would find all trans eQTLs with peak LRS on chromosome 7 that is also a trans eQTL with exclusionary zone of 5Mb).
+                    </li>
+                    <li>
+                        <b>POSITION=(Chr4 122 130) cisLRS=(9 999 10)</b>
+                        finds all traits on Chr 4 from 122 and 155 Mb with cisLRS scores
+                        between 9 and 999 and an inclusion zone of 10 Mb.
+                    </li>
+                    <li>
+                        <b>RIF=mitochondrial</b> searches RNA databases for <a href="https://en.wikipedia.org/wiki/GeneRIF">GeneRIF</a> links.
+                    </li>
+                    <li>
+                        <b>WIKI=nicotine</b> searches <a href="http://gn1.genenetwork.org/webqtl/main.py?FormID=geneWiki">GeneWiki</a> for genes that you or other users have annotated
+                        with the word <i>nicotine</i>.
+                    </li>
+                    <li>
+                        <b>GO:0045202</b> searches for synapse-associated genes listed in the
+                        <a href="http://amigo.geneontology.org/amigo/medial_search?q=GO%3A0045202">Gene Ontology</a>.
+                    </li>
+                    <li>
+                        <b>RIF=diabetes LRS=(9 999 Chr2 100 105) transLRS=(9 999 10)</b>
+                        finds diabetes-associated transcripts with peak <a href="{{ url_for("gn_docs_blueprint.glossary") }}#E">trans eQTLs</a> on Chr 2 between 100 and 105 Mb with LRS
+                        scores between 9 and 999.
+                    </li>
+                </ul>
+            </section>
+        </div>
+        <div class="col-xs-4" style="width: 600px !important;">
+            <section id="tutorials">
+                <div class="page-header">
+                    <h2>Tutorials</h2>
+                </div>
+                <div class="uk-grid-match uk-child-width-1-3@m" uk-grid>
+                    <div>
+                        <strong><a class="uk-link-text" href="/tutorials">Webinars & Courses</a></strong>
+                        <br>
+                        In-person courses, live webinars and webinar recordings
+                        <br>
+                        <a href="/tutorials" class="uk-icon-link" uk-icon="laptop" ratio="2"></a>
                     </div>
-                    <div align="right">
-
-                        <a href="https://genomic.social/@genenetwork">more news items...</a>
+                    <div>
+                        <strong><a class="uk-link-text" href="/tutorials">Tutorials</a></strong>
+                        <br>
+                        Tutorials: Training materials in HTML, PDF and video formats
+                        <br>
+                        <a href="/tutorials" class="uk-icon-link" uk-icon="file-text" ratio="2"></a>
                     </div>
-		        </section>
-                <section id="websites">
-                    <div class="page-header">
-                        <h2>Links</h2>
+                    <div>
+                        <strong><a class="uk-link-text" href="/tutorials">Documentation</a></strong>
+                        <br>
+                        Online manuals, handbooks, fact sheets and FAQs
+                        <br>
+                        <a href="/tutorials" class="uk-icon-link" uk-icon="album" ratio="2"></a>
                     </div>
+                </div>
+            </section>
+            <section id="news-section">
+                <div class="page-header">
+                    <h2>News</h2>
+                </div>
+                <div id="mastadon"
+                     style="height: 405px;
+                         overflow: scroll;
+                         overflow-x: hidden">
+                    <a class="mastodon-feed"
+                       target="_blank"
+                       href="https://genomic.social/@genenetwork"
+                       data-toot-limit="5">Genenetwork mastadon</a>
+                </div>
+                <div align="right">
+                    <a href="https://genomic.social/@genenetwork">more news items...</a>
+                </div>
+            </section>
+            <section id="websites">
+                <div class="page-header">
+                    <h2>Links</h2>
+                </div>
+                <ul>
+                    <li>Github</li>
                     <ul>
-                        <li>Github</li>
-                        <ul>
-                            <li><a href="https://github.com/genenetwork/genenetwork2">GN2 Source Code</a></li>
-                            <li><a href="https://github.com/genenetwork/genenetwork3">GN3 Source Code</a></li>
-                            <li><a href="https://github.com/genenetwork/genenetwork">GN1 Source Code</a></li>
-                            <li><a href="https://github.com/genenetwork/sysmaintenance">System Maintenance Code</a></li>
-                        </ul>
+                        <li>
+                            <a href="https://github.com/genenetwork/genenetwork2">GN2 Source Code</a>
+                        </li>
+                        <li>
+                            <a href="https://github.com/genenetwork/genenetwork3">GN3 Source Code</a>
+                        </li>
+                        <li> 
+                            <a href="https://github.com/genenetwork/genenetwork">GN1 Source Code</a>
+                        </li>
+                        <li>
+                            <a href="https://github.com/genenetwork/sysmaintenance">System Maintenance Code</a>
+                        </li>
                     </ul>
+                </ul>
+                <ul>
+                    <li>GeneNetwork v2</li>
                     <ul>
-                        <li>GeneNetwork v2</li>
-                        <ul>
-                            <li><a href="https://genenetwork.org/">Main website</a> at UTHSC</li>
-                        </ul>
+                        <li>
+                            <a href="https://genenetwork.org/">Main website</a> at UTHSC
+                        </li>
                     </ul>
+                </ul>
+                <ul>
+                    <li>GeneNetwork v1</li>
                     <ul>
-                        <li>GeneNetwork v1</li>
-                        <ul>
-                            <li><a href="http://gn1.genenetwork.org/">Main website</a> at UTHSC</li>
-                        </ul>
+                        <li>
+                            <a href="http://gn1.genenetwork.org/">Main website</a> at UTHSC
+                        </li>
                     </ul>
+                </ul>
+                <ul>
+                    <li>Affiliates</li>
                     <ul>
-                        <li>Affiliates</li>
-                        <ul>
-                            <li><b><a href="http://gn1.genenetwork.org">GeneNetwork 1</a> at UTHSC</b></li>
-                            <li><a href="https://systems-genetics.org/">Systems Genetics</a> at EPFL</li>
-                            <li><a href="http://bnw.genenetwork.org/">Bayesian Network Web Server</a> at UTHSC</li>
-                            <li><a href="https://www.geneweaver.org/">GeneWeaver</a></li>
-                            <li><a href="https://phenogen.org/">PhenoGen</a> at University of Colorado</li>
-                            <li><a href="http://www.webgestalt.org/">WebGestalt</a> at Baylor</li>
-                        </ul>
+                        <li>
+                            <b><a href="http://gn1.genenetwork.org">GeneNetwork 1</a> at UTHSC</b>
+                        </li>
+                        <li>
+                            <a href="https://systems-genetics.org/">Systems Genetics</a> at EPFL
+                        </li>
+                        <li>
+                            <a href="http://bnw.genenetwork.org/">Bayesian Network Web Server</a> at UTHSC
+                        </li>
+                        <li>
+                            <a href="https://www.geneweaver.org/">GeneWeaver</a>
+                        </li>
+                        <li>
+                            <a href="https://phenogen.org/">PhenoGen</a> at University of Colorado
+                        </li>
+                        <li>
+                            <a href="http://www.webgestalt.org/">WebGestalt</a> at Baylor
+                        </li>
                     </ul>
+                </ul>
+                <ul>
+                    <li>GeneNetwork hosted portals</li>
                     <ul>
-                        <li>GeneNetwork hosted portals</li>
-                        <ul>
-                            <li><a href="https://www.opar.io/">Omics Portal For Addiction Research</a></li>
-                            <li><a href="https://msk.genenetwork.org/">GN4MSK musculoskeletal</a></li>
-                            <li><a href="https://genecup.org/">GeneCup: Mining PubMed for Gene Relationships using Custom Ontologies</a></li>
-                        </ul>
+                        <li>
+                            <a href="https://www.opar.io/">Omics Portal For Addiction Research</a>
+                        </li>
+                        <li>
+                            <a href="https://msk.genenetwork.org/">GN4MSK musculoskeletal</a>
+                        </li>
+                        <li>
+                            <a href="https://genecup.org/">GeneCup: Mining PubMed for Gene Relationships using Custom Ontologies</a>
+                        </li>
                     </ul>
-                </section>
-            </div>
+                </ul>
+            </section>
         </div>
     </div>
+</div>
 
-{%endblock%}
-
+{% endblock %}
+<script language="javascript"
+        type="text/javascript"
+        src="{{ url_for('js', filename='uikit/js/uikit-icons.min.js') }}"></script>
+<script src="{{ url_for('js', filename='jquery/jquery.min.js') }}"
+        type="text/javascript"></script>
+<script src="{{ url_for('js', filename='bootstrap/js/bootstrap.min.js') }}"
+        type="text/javascript"></script>
 {% block js %}
-
-    <script src="/static/new/javascript/dataset_select_menu_orig.js"></script>
-
-
-    <script type="text/javascript">
-    
-$(document).on('submit', '#searchform', function(event){
-
-    event.preventDefault()
-    let user_searches = [];
-    $(".search-query").each(function() {
-        this_search = $(this).val().trim();
-        if (this_search != ""){
-            user_searches.push(this_search);
-        }
-    });
-
-    for (i=0; i<user_searches.length; ++i){
-        saveBeforeSubmit(user_searches[i])
-    }
-    $( "#searchform" )[0].submit();
-
-});
-    </script>
-
-    <script>
-        function pressed(e) {
-            // Has the enter key been pressed?
-            if ( (window.event ? event.keyCode : e.which) == 13) {
-                e.preventDefault();
-                // If enter key has been pressed and the search fields are non-empty
-                // manually submit the <form>
-
-                if( event.target.value.trim() != "" ) {
-                    saveBeforeSubmit(event.target.value.trim())
-                    $("#searchform").prop("action", "/search")
-                    $("#searchform")[0].submit();
-                }
-                
-            }
-        }
-    </script>
+<!--Note this is locally built emfed package see source file:https://github.com/sampsyo/emfed -->
+
+<script src="{{ url_for('static', filename='/new/javascript/emfed.bundle.js') }}"
+        type="module"></script>
+<script src="{{ url_for('static', filename='/new/javascript/dataset_select_menu_orig.js') }}"
+        type="text/javascript"></script>
+<script>
+
+ $(document).on('submit', '#searchform', function(event){
+
+     event.preventDefault()
+     let user_searches = [];
+     $(".search-query").each(function() {
+         this_search = $(this).val().trim();
+         if (this_search != ""){
+             user_searches.push(this_search);
+         }
+     });
+
+     for (i=0; i<user_searches.length; ++i){
+         saveBeforeSubmit(user_searches[i])
+     }
+     $( "#searchform" )[0].submit();
+
+ });
+ function pressed(e) {
+     // Has the enter key been pressed?
+     if ( (window.event ? event.keyCode : e.which) == 13) {
+         e.preventDefault();
+         // If enter key has been pressed and the search fields are non-empty
+         // manually submit the <form>
+
+         if( event.target.value.trim() != "" ) {
+             saveBeforeSubmit(event.target.value.trim())
+             $("#searchform").prop("action", "/search")
+             $("#searchform")[0].submit();
+         }
+         
+     }
+ }
+ 
+ 
+</script>
 {% endblock %}