280cec9d1154fc2613fcf127a988b5252c9fa824 kate Wed Sep 28 16:42:40 2016 -0700 First cut CGI with body map illustration for tissue selection: GTEx track config. refs #17369 diff --git src/hg/hgGtexTrackSettings/hgGtexTrackSettings.html src/hg/hgGtexTrackSettings/hgGtexTrackSettings.html new file mode 100644 index 0000000..a7d77ef --- /dev/null +++ src/hg/hgGtexTrackSettings/hgGtexTrackSettings.html @@ -0,0 +1,184 @@ +<div class="container-fluid"> + <div class="row gbTrackTitle"> + <div class="col-md-10"> + <span class="gbTrackName">GTEx Track</span> + Gene Expression in 53 tissues from GTEx RNA-seq of 8555 samples (570 donors) + <span class="gbAssembly">GRCh37 / hg19</span> + </div> + + <div class="col-md-2 text-right"> + <select id="selectVisibility" class="gbSelect"> + <option>hide</option> + <option>dense</option> + <option>squish</option> + <option>pack</option> + <option>full</option> + </select> + + <div class="goButtonContainer" title="Go to the Genome Browser"> + <div class="jwGoButton">GO</div> + <i class="jwGoIcon fa fa-play fa-2x"></i> + </div> + </div> + </div> + + <div id="configureSectionTitle" class="row gbSectionTitle"> + <div class="col-md-10">Configure</div> + <div class="col-md-2 text-right"> + <div class="goButtonContainer" title="Go to the Genome Browser"> + <div class="jwGoButton">GO</div> + <i class="jwGoIcon fa fa-play fa-2x"></i> + </div> + </div> + </div> + + <div class="row"> + <div class="configurator col-md-4"> + <b>Label</b>: + <input type="radio" name="gtexGene.label" value="name"> gene symbol + <input type="radio" name="gtexGene.label" value="accession"> accession + <input type="radio" name="gtexGene.label" value="both"> both + </div> + <div class="configurator col-md-4"> +<b>Limit to protein coding genes:</b> +<INPUT TYPE=CHECKBOX NAME="gtexGene.codingOnly" VALUE=on ><INPUT TYPE=HIDDEN NAME='boolshad.gtexGene.codingOnly' VALUE='0' class='cbShadow'> + </div> + <div class="configurator col-md-4"> +<b>Show GTEx gene model</b> +<INPUT TYPE=CHECKBOX NAME="gtexGene.showExons" VALUE=on ><INPUT TYPE=HIDDEN NAME='boolshad.gtexGene.showExons' VALUE='0' class='cbShadow'> + </div> + </div> + <div class="row"> + + <div class="configurator col-md-4"> +<b>Log10 transform:</b> +<INPUT TYPE=CHECKBOX NAME="gtexGene.logTransform" VALUE=on onchange='gtexTransformChanged("gtexGene")' CHECKED><INPUT TYPE=HIDDEN NAME='boolshad.gtexGene.logTransform' VALUE='0' class='cbShadow'> + </div> + <div class="configurator col-md-8"> +<span class='gtexGeneViewLimitsMaxLabel disabled'><b>View limits maximum:</b></span> +<INPUT TYPE=TEXT NAME="gtexGene.maxLimit" SIZE=4 VALUE=300 disabled><span class='gtexGeneViewLimitsMaxLabel disabled'> RPKM (range 0-711778)</span> + </div> + </div> + + <div class="row"> + <div class="configurator col-md-12"> + <b>Show only items with score at or above:</b> + <input id="scoreInput" value="" size="8"> + (range 0-1000) + </div> + </div> + + <!--<div class="gbPanel"> </div> --> + + <div id="tissueSectionTitle" class="row gbSectionTitle""> + <div class="col-md-6">Choose Tissues</div> + <div class="col-md-6 text-right"> + + <div class="goButtonContainer gbWhiteButton">set all</div> + <div class="goButtonContainer gbWhiteButton">clear all</div> + <input class="gbSearch" TYPE="text" VALUE="Search" class="gbButton"> + + <div class="goButtonContainer" title="Go to the Genome Browser"> + <div class="jwGoButton">GO</div> + <i class="jwGoIcon fa fa-play fa-2x"></i> + </div> + </div> + </div> + + <div id="tissueSection" class="row"> + <div id="bodyMap" class="col-md-6"> + <!--<img height="800px" class="gbImage gtexBodyMap" src="/images/bodyMap/jwBody.png">--> + <!--<img height="800px" class="gbImage gtexBodyMap" src="/images/bodyMap/bodyMap.svg"> --> + <object type="image/svg+xml" height="800px" class="gbImage gtexBodyMap" data="/images/bodyMap.svg"> + Body Map illustration not found + </object> + </div> + <div id="tissueTable" class="col-md-6"> +<p> + <table> +<tr class='tissueRow'><td bgcolor=#FFA54F> </td><td class=tissueCell id='adiposeSubcut'> Adipose - Subcutaneous</td> + <td bgcolor=#EEC591> </td><td id='colonTransverse'> Colon - Transverse</td></tr> + +<tr class='tissueRow' ><td bgcolor=#EE9A00> </td><td id='adiposeVisceral'> Adipose - Visceral (Omentum)</td> + <td bgcolor=#8B7355> </td><td id='esophagusJunction'> Esophagus - Gastroesophageal Junction</td></tr> + +<tr class='tissueRow' ><td bgcolor=#8FBC8F> </td><td id='adrenalGland'> Adrenal Gland</td> + <td bgcolor=#8B7355> </td><td id='esophagusMucosa'> Esophagus - Mucosa</td></tr> + +<tr class='tissueRow' id='arteryAorta'><td bgcolor=#8B1C62> </td><td> Artery - Aorta</td> + <td bgcolor=#CDAA7D> </td><td id='esophagusMuscular'> Esophagus - Muscularis</td></tr> + +<tr class='tissueRow' id='arteryCoronary'><td bgcolor=#EE6A50> </td><td> Artery - Coronary</td> + <td bgcolor=#EED5D2> </td><td id='fallopianTube'> Fallopian Tube</td></tr> + +<tr class='tissueRow' id='arteryTibial'><td bgcolor=#FF0000> </td><td> Artery - Tibial</td> + <td bgcolor=#B452CD> </td><td id='heartAtrialAppend'> Heart - Atrial Appendage</td></tr> + +<tr class='tissueRow' id='bladder'><td bgcolor=#CDB79E> </td><td> Bladder</td> + <td bgcolor=#7A378B> </td><td id='heartLeftVentricl'> Heart - Left Ventricle</td></tr> + +<tr class='tissueRow' id='brainAmygdala'><td bgcolor=#EEEE00> </td><td> Brain - Amygdala</td> + <td bgcolor=#CDB79E> </td><td id='kidneyCortex'> Kidney - Cortex</td></tr> + +<tr class='tissueRow' id='brainAnCinCortex'><td bgcolor=#EEEE00> </td><td> Brain - Anterior cingulate cortex (BA24)</td> + <td bgcolor=#CDB79E> </td><td id='liver'> Liver</td></tr> + +<tr class='tissueRow' id='brainCaudate'><td bgcolor=#EEEE00> </td><td> Brain - Caudate (basal ganglia)</td> + <td bgcolor=#9ACD32> </td><td id='lung'> Lung</td></tr> + +<tr class='tissueRow' id='brainCerebelHemi'><td bgcolor=#EEEE00> </td><td> Brain - Cerebellar Hemisphere</td> + <td bgcolor=#CDB79E> </td><td id='minorSalivGland'> Minor Salivary Gland</td></tr> + +<tr class='tissueRow' id='brainCerebellum'><td bgcolor=#EEEE00> </td><td> Brain - Cerebellum</td> + <td bgcolor=#7A67EE> </td><td id='muscleSkeletal'> Muscle - Skeletal</td></tr> + +<tr class='tissueRow' id='brainCortex'><td bgcolor=#EEEE00> </td><td> Brain - Cortex</td> + <td bgcolor=#FFD700> </td><td id='nerveTibial'> Nerve - Tibial</td></tr> + +<tr class='tissueRow' id='brainFrontCortex'><td bgcolor=#EEEE00> </td><td> Brain - Frontal Cortex (BA9)</td> + <td bgcolor=#FFB6C1> </td><td id='ovary'> Ovary</td></tr> + +<tr class='tissueRow' id='brainHippocampus'><td bgcolor=#EEEE00> </td><td> Brain - Hippocampus</td> + <td bgcolor=#CD9B1D> </td><td id='pancreas'> Pancreas</td></tr> + +<tr class='tissueRow' id='brainHypothalamus'><td bgcolor=#EEEE00> </td><td> Brain - Hypothalamus</td> + <td bgcolor=#B4EEB4> </td><td id='pituitary'> Pituitary</td></tr> + +<tr class='tissueRow' id='brainNucAccumbens'><td bgcolor=#EEEE00> </td><td> Brain - Nucleus accumbens (basal ganglia)</td> + <td bgcolor=#D9D9D9> </td><td id='prostate'> Prostate</td></tr> + +<tr class='tissueRow' id='brainPutamen'><td bgcolor=#EEEE00> </td><td> Brain - Putamen (basal ganglia)</td> + <td bgcolor=#3A5FCD> </td><td id='skinNotExposed'> Skin - Not Sun Exposed (Suprapubic)</td></tr> + +<tr class='tissueRow' id='brainSpinalcord'><td bgcolor=#EEEE00> </td><td> Brain - Spinal cord (cervical c-1)</td> + <td bgcolor=#1E90FF> </td><td id='skinExposed'> Skin - Sun Exposed (Lower leg)</td></tr> + +<tr class='tissueRow' id='brainSubstanNigra'><td bgcolor=#EEEE00> </td><td> Brain - Substantia nigra</td> + <td bgcolor=#CDB79E> </td><td id='smallIntestine'> Small Intestine - Terminal Ileum</td></tr> + +<tr class='tissueRow' id='breastMamTissue'><td bgcolor=#CDCD> </td><td> Breast - Mammary Tissue</td> + <td bgcolor=#CDB79E> </td><td id='spleen'> Spleen</td></tr> + +<tr class='tissueRow' id='xformedlymphocytes'><td bgcolor=#EE82EE> </td><td> Cells - EBV-transformed lymphocytes</td> + <td bgcolor=#FFD39B> </td><td id='stomach'> Stomach</td></tr> + +<tr class='tissueRow' id='xformedfibroblasts'><td bgcolor=#9AC0CD> </td><td> Cells - Transformed fibroblasts</td> + <td bgcolor=#A6A6A6> </td><td id='testis'> Testis</td></tr> + +<tr class='tissueRow' id='ectocervix'><td bgcolor=#EED5D2> </td><td> Cervix - Ectocervix</td> + <td bgcolor=#8B45> </td><td id='thyroid'> Thyroid</td></tr> + +<tr class='tissueRow' id='endocervix'><td bgcolor=#EED5D2> </td><td> Cervix - Endocervix</td> + <td bgcolor=#EED5D2> </td><td id='uterus'> Uterus</td></tr> + +<tr class='tissueRow' id='colonSigmoid'><td bgcolor=#CDB79E> </td><td> Colon - Sigmoid</td> + <td bgcolor=#EED5D2> </td><td id='vagina'> Vagina</td></tr> + +<tr class='tissueRow' id='wholeBlood'><td bgcolor=#FF00FF> </td><td> Whole Blood</td></tr> + </table> + </div> + </div> + +</div> +</div> +