aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorzsloan2016-12-15 21:01:30 +0000
committerzsloan2016-12-15 21:01:30 +0000
commitb88eb7fcbd24462efb34fd3e30bfb64483223935 (patch)
tree9f739a9d4a88684aadd127c5e4e2f9e59f2ea252
parent6a3f964240d9ff28238b2aaeb90d47f8fa244870 (diff)
downloadgenenetwork2-b88eb7fcbd24462efb34fd3e30bfb64483223935.tar.gz
Changed table appearance
Updated dataset_menu_structure.json
-rw-r--r--wqflask/wqflask/static/new/javascript/dataset_menu_structure.json90
-rw-r--r--wqflask/wqflask/static/new/packages/DataTables/css/jquery.dataTables.css12
-rw-r--r--wqflask/wqflask/templates/collections/list.html23
-rw-r--r--wqflask/wqflask/templates/collections/view.html59
-rw-r--r--wqflask/wqflask/templates/search_result_page.html46
5 files changed, 131 insertions, 99 deletions
diff --git a/wqflask/wqflask/static/new/javascript/dataset_menu_structure.json b/wqflask/wqflask/static/new/javascript/dataset_menu_structure.json
index dc0af7d0..2f332a4a 100644
--- a/wqflask/wqflask/static/new/javascript/dataset_menu_structure.json
+++ b/wqflask/wqflask/static/new/javascript/dataset_menu_structure.json
@@ -1340,14 +1340,14 @@
"GSE9588 Human Liver Normal (Mar11) Both Sexes"
],
[
- "383",
- "HLCM_0311",
- "GSE9588 Human Liver Normal (Mar11) Males"
- ],
- [
"384",
"HLCF_0311",
"GSE9588 Human Liver Normal (Mar11) Females"
+ ],
+ [
+ "383",
+ "HLCM_0311",
+ "GSE9588 Human Liver Normal (Mar11) Males"
]
],
"Phenotypes": [
@@ -1727,6 +1727,11 @@
],
"Striatum mRNA": [
[
+ "85",
+ "SA_M2_0905_P",
+ "OHSU/VA B6D2F2 Striatum M430v2 (Sep05) PDNN"
+ ],
+ [
"84",
"SA_M2_0905_R",
"OHSU/VA B6D2F2 Striatum M430v2 (Sep05) RMA"
@@ -1735,27 +1740,22 @@
"83",
"SA_M2_0905_M",
"OHSU/VA B6D2F2 Striatum M430v2 (Sep05) MAS5"
- ],
- [
- "85",
- "SA_M2_0905_P",
- "OHSU/VA B6D2F2 Striatum M430v2 (Sep05) PDNN"
]
]
},
"BHF2": {
"Adipose mRNA": [
[
- "196",
- "UCLA_BHF2_ADIPOSE_MALE",
- "UCLA BHF2 Adipose Male mlratio"
- ],
- [
"197",
"UCLA_BHF2_ADIPOSE_FEMALE",
"UCLA BHF2 Adipose Female mlratio"
],
[
+ "196",
+ "UCLA_BHF2_ADIPOSE_MALE",
+ "UCLA BHF2 Adipose Male mlratio"
+ ],
+ [
"165",
"UCLA_BHF2_ADIPOSE_0605",
"UCLA BHF2 Adipose (June05) mlratio"
@@ -1763,16 +1763,16 @@
],
"Brain mRNA": [
[
- "198",
- "UCLA_BHF2_BRAIN_MALE",
- "UCLA BHF2 Brain Male mlratio"
- ],
- [
"199",
"UCLA_BHF2_BRAIN_FEMALE",
"UCLA BHF2 Brain Female mlratio"
],
[
+ "198",
+ "UCLA_BHF2_BRAIN_MALE",
+ "UCLA BHF2 Brain Male mlratio"
+ ],
+ [
"166",
"UCLA_BHF2_BRAIN_0605",
"UCLA BHF2 Brain (June05) mlratio"
@@ -1787,16 +1787,16 @@
],
"Liver mRNA": [
[
- "200",
- "UCLA_BHF2_LIVER_MALE",
- "UCLA BHF2 Liver Male mlratio"
- ],
- [
"201",
"UCLA_BHF2_LIVER_FEMALE",
"UCLA BHF2 Liver Female mlratio"
],
[
+ "200",
+ "UCLA_BHF2_LIVER_MALE",
+ "UCLA BHF2 Liver Male mlratio"
+ ],
+ [
"167",
"UCLA_BHF2_LIVER_0605",
"UCLA BHF2 Liver (June05) mlratio"
@@ -2000,6 +2000,11 @@
"UTHSC Brain mRNA U74Av2 (Nov05) PDNN"
],
[
+ "81",
+ "BR_U_0805_P",
+ "UTHSC Brain mRNA U74Av2 (Aug05) PDNN"
+ ],
+ [
"80",
"BR_U_0805_M",
"UTHSC Brain mRNA U74Av2 (Aug05) MAS5"
@@ -2010,11 +2015,6 @@
"UTHSC Brain mRNA U74Av2 (Aug05) RMA"
],
[
- "81",
- "BR_U_0805_P",
- "UTHSC Brain mRNA U74Av2 (Aug05) PDNN"
- ],
- [
"42",
"CB_M_0204_P",
"INIA Brain mRNA M430 (Feb04) PDNN"
@@ -2546,14 +2546,14 @@
"HQF BXD Neocortex ILM6v1.1 (Feb08) RankInv"
],
[
- "274",
- "DevNeocortex_ILM6.2P3RInv_1110",
- "BIDMC/UTHSC Dev Neocortex P3 ILMv6.2 (Nov10) RankInv"
- ],
- [
"275",
"DevNeocortex_ILM6.2P14RInv_1110",
"BIDMC/UTHSC Dev Neocortex P14 ILMv6.2 (Nov10) RankInv"
+ ],
+ [
+ "274",
+ "DevNeocortex_ILM6.2P3RInv_1110",
+ "BIDMC/UTHSC Dev Neocortex P3 ILMv6.2 (Nov10) RankInv"
]
],
"Nucleus Accumbens mRNA": [
@@ -2761,6 +2761,11 @@
],
"Ventral Tegmental Area mRNA": [
[
+ "230",
+ "VCUEtvsSal_0609_R",
+ "VCU BXD VTA Et vs Sal M430 2.0 (Jun09) RMA"
+ ],
+ [
"229",
"VCUEtOH_0609_R",
"VCU BXD VTA EtOH M430 2.0 (Jun09) RMA"
@@ -2769,11 +2774,6 @@
"228",
"VCUSal_0609_R",
"VCU BXD VTA Sal M430 2.0 (Jun09) RMA"
- ],
- [
- "230",
- "VCUEtvsSal_0609_R",
- "VCU BXD VTA Et vs Sal M430 2.0 (Jun09) RMA"
]
]
},
@@ -3052,6 +3052,11 @@
],
"Hippocampus mRNA": [
[
+ "213",
+ "Illum_LXS_Hipp_NOS_1008",
+ "Hippocampus Illumina NOS (Oct08) RankInv beta"
+ ],
+ [
"219",
"Illum_LXS_Hipp_NON_1008",
"Hippocampus Illumina NON (Oct08) RankInv beta"
@@ -3072,11 +3077,6 @@
"Hippocampus Illumina RSS (Oct08) RankInv beta"
],
[
- "213",
- "Illum_LXS_Hipp_NOS_1008",
- "Hippocampus Illumina NOS (Oct08) RankInv beta"
- ],
- [
"143",
"Illum_LXS_Hipp_loess0807",
"Hippocampus Illumina (Aug07) LOESS"
diff --git a/wqflask/wqflask/static/new/packages/DataTables/css/jquery.dataTables.css b/wqflask/wqflask/static/new/packages/DataTables/css/jquery.dataTables.css
index be82d5df..6e0e7348 100644
--- a/wqflask/wqflask/static/new/packages/DataTables/css/jquery.dataTables.css
+++ b/wqflask/wqflask/static/new/packages/DataTables/css/jquery.dataTables.css
@@ -20,7 +20,7 @@ table.dataTable tfoot th {
}
table.dataTable thead th,
table.dataTable thead td {
- font: bold 12px/18px Arial, Sans-serif;
+ font: bold 12px/20px Arial, Sans-serif;
color: #000000;
background-color: #ffffff;
border-collapse: collapse;
@@ -35,8 +35,13 @@ table.dataTable thead td:active {
}
table.dataTable tfoot th,
table.dataTable tfoot td {
- padding: 10px 18px 6px 18px;
- border-top: 1px solid #111;
+ font: bold 12px/20px Arial, Sans-serif;
+ color: #000000;
+ background-color: #ffffff;
+ border-collapse: collapse;
+ padding: 0;
+ //padding: 10px 18px 6px 18px;
+ //border-top: 1px solid #111;
}
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
@@ -75,6 +80,7 @@ table.dataTable tbody tr.selected {
}
table.dataTable tbody th,
table.dataTable tbody td {
+ font: 12px Arial, Sans-serif;
padding: 4px 5px;
}
table.dataTable.row-border tbody th, table.dataTable.row-border tbody td, table.dataTable.display tbody th, table.dataTable.display tbody td {
diff --git a/wqflask/wqflask/templates/collections/list.html b/wqflask/wqflask/templates/collections/list.html
index e38b32a0..6dc52c4d 100644
--- a/wqflask/wqflask/templates/collections/list.html
+++ b/wqflask/wqflask/templates/collections/list.html
@@ -26,7 +26,7 @@
{% endif %}
</div>
- <div id="collections_list" style="width:75%;">
+ <div id="collections_list" style="width:50%;">
<table class="table table-hover table-striped" id='trait_table'>
<thead>
<tr>
@@ -49,7 +49,7 @@
{% endif %}
<td>{{ timeago(uc.created_timestamp.isoformat() + "Z") }}</td>
<td>{{ timeago(uc.changed_timestamp.isoformat() + "Z") }}</td>
- <td>{{ uc.num_members }}</td>
+ <td align="right">{{ uc.num_members }}</td>
</tr>
{% endfor %}
</tbody>
@@ -79,15 +79,18 @@
{% endif %}
<script>
$('#trait_table').dataTable( {
- "buttons": [
- {
- extend: 'csvHtml5',
- text: 'Download CSV',
- title: 'collection_list',
- fieldBoundary: '"'
- }
+ "columns": [
+ { "type": "natural",
+ "width": "10%" },
+ { "type": "natural" },
+ { "type": "natural",
+ "width": "25%" },
+ { "type": "natural",
+ "width": "25%" },
+ { "type": "natural",
+ "width": "10%" }
],
- "sDom": "RZBtir",
+ "sDom": "RZtr",
"iDisplayLength": -1,
"autoWidth": true,
"bDeferRender": true,
diff --git a/wqflask/wqflask/templates/collections/view.html b/wqflask/wqflask/templates/collections/view.html
index 801266d3..9d03e6d7 100644
--- a/wqflask/wqflask/templates/collections/view.html
+++ b/wqflask/wqflask/templates/collections/view.html
@@ -79,20 +79,20 @@
<button class="btn btn-default" id="export_traits">Download CSV</button>
</form>
<br />
- <div style="background-color: #eeeeee; border: 1px solid black;">
- <table id="trait_table" class="table table-hover table-striped">
+ <div>
+ <table class="table table-hover table-striped nowrap" id='trait_table' style="float: left;">
<thead>
<tr>
- <th style="background-color: #eeeeee;"></th>
- <th data-export="Index" style="background-color: #eeeeee;">Index</th>
- <th data-export="Dataset" style="background-color: #eeeeee;">Dataset</th>
- <th data-export="Record" style="background-color: #eeeeee;">Record</th>
- <th data-export="Description" style="background-color: #eeeeee;">Description</th>
- <th data-export="Location" style="background-color: #eeeeee;">Location</th>
- <th data-export="Mean" style="background-color: #eeeeee;">Mean</th>
- <th data-export="Max LRS" style="background-color: #eeeeee;">Max LRS<a href="http://genenetwork.org//glossary.html#L" target="_blank"><sup style="color:#f00"> ?</sup></a></th>
- <th data-export="Max LRS Location" style="background-color: #eeeeee;">Max LRS Location</th>
- <th data-export="Additive Effect" style="background-color: #eeeeee;">Additive Effect<a href="http://genenetwork.org//glossary.html#A" target="_blank"><sup style="color:#f00"> ?</sup></a></th>
+ <th></th>
+ <th data-export="Index">Index</th>
+ <th data-export="Dataset">Dataset</th>
+ <th data-export="Record">Record</th>
+ <th data-export="Description">Description</th>
+ <th data-export="Location">Location</th>
+ <th data-export="Mean">Mean</th>
+ <th data-export="Max LRS">Max LRS<a href="http://genenetwork.org//glossary.html#L" target="_blank"><sup style="color:#f00"> ?</sup></a></th>
+ <th data-export="Max LRS Location">Max LRS Location</th>
+ <th data-export="Additive Effect">Additive Effect<a href="http://genenetwork.org//glossary.html#A" target="_blank"><sup style="color:#f00"> ?</sup></a></th>
</tr>
</thead>
@@ -103,7 +103,7 @@
<INPUT TYPE="checkbox" NAME="searchResult" class="checkbox trait_checkbox"
VALUE="{{ data_hmac('{}:{}'.format(this_trait.name, this_trait.dataset.name)) }}">
</TD>
- <TD data-export="{{ loop.index }}">{{ loop.index }}</TD>
+ <TD data-export="{{ loop.index }}" align="right">{{ loop.index }}</TD>
<TD data-export="{{ this_trait.dataset.name }}">{{ this_trait.dataset.name }}</TD>
<TD data-export="{{ this_trait.name }}">
<a href="{{ url_for('show_trait_page',
@@ -113,12 +113,12 @@
{{ this_trait.name }}
</a>
</TD>
- <TD data-export="{{ this_trait.description_display }}">{{ this_trait.description_display }}</TD>
+ <TD title="{{ this_trait.description_display }}" data-export="{{ this_trait.description_display }}">{{ this_trait.description_display }}</TD>
<TD data-export="{{ this_trait.location_repr }}">{{ this_trait.location_repr }}</TD>
- <TD data-export="{{ this_trait.mean }}">{{ '%0.3f' % this_trait.mean|float }}</TD>
- <TD data-export="{{ this_trait.LRS_score_repr }}">{{ '%0.3f' % this_trait.LRS_score_repr|float }}</TD>
+ <TD data-export="{{ this_trait.mean }}" align="right">{{ '%0.3f' % this_trait.mean|float }}</TD>
+ <TD data-export="{{ this_trait.LRS_score_repr }}" align="right">{{ '%0.3f' % this_trait.LRS_score_repr|float }}</TD>
<TD data-export="{{ this_trait.LRS_location_repr }}">{{ this_trait.LRS_location_repr }}</TD>
- <TD data-export="{{ this_trait.additive }}">{{ '%0.3f' % this_trait.additive|float }}</TD>
+ <TD data-export="{{ this_trait.additive }}" align="right">{{ '%0.3f' % this_trait.additive|float }}</TD>
</TR>
{% endfor %}
@@ -156,23 +156,34 @@
console.time("Creating table");
$('#trait_table').dataTable( {
+ "createdRow": function ( row, data, index ) {
+ if ($('td', row).eq(4).text().length > 50) {
+ $('td', row).eq(4).text($('td', row).eq(4).text().substring(0, 50));
+ $('td', row).eq(4).text($('td', row).eq(4).text() + '...')
+ }
+ },
"columns": [
{ "type": "natural" },
- { "type": "natural" },
+ { "type": "natural", "width": "5%" },
{ "type": "natural" },
{ "type": "natural" },
{ "type": "natural",
- "width": "35%" },
+ "width": "30%" },
{ "type": "natural",
- "width": "15%" },
+ "width": "10%" },
{ "type": "cust-txt" },
{ "type": "natural",
- "width": "9%" },
+ "width": "6%" },
+ { "type": "natural",
+ "width": "10%" },
{ "type": "natural",
- "width": "15%" },
- { "type": "natural" }
+ "width": "8%" }
],
- "sDom": "ZRtir",
+ "columnDefs": [ {
+ "targets": 0,
+ "orderable": false
+ } ],
+ "sDom": "ZRtr",
"iDisplayLength": -1,
"autoWidth": true,
"bDeferRender": true,
diff --git a/wqflask/wqflask/templates/search_result_page.html b/wqflask/wqflask/templates/search_result_page.html
index 5d0c38a3..f7b450c1 100644
--- a/wqflask/wqflask/templates/search_result_page.html
+++ b/wqflask/wqflask/templates/search_result_page.html
@@ -76,18 +76,18 @@
{% endif %}
-->
- <div id="table_container" style="background-color: #eeeeee; border: 1px solid black; width: {% if dataset.type == 'ProbeSet' %}1300{% elif dataset.type == 'Publish' %}1200{% elif dataset.type == 'Geno' %}500{% endif %}px;">
+ <div id="table_container" style="width: {% if dataset.type == 'ProbeSet' %}1300{% elif dataset.type == 'Publish' %}1200{% elif dataset.type == 'Geno' %}500{% endif %}px;">
<table class="table table-hover table-striped nowrap" id='trait_table' style="float: left;">
<thead>
<tr>
- <th style="background-color: #eeeeee;"></th>
+ <th></th>
{% for header in header_fields %}
{% if header == 'Max LRS' %}
- <th data-export="Max LRS" style="background-color: #eeeeee; text-align: right;">Max LRS</th>
+ <th data-export="Max LRS">Max LRS</th>
{% elif header == 'Additive Effect' %}
- <th data-export="Additive Effect" style="background-color: #eeeeee; text-align: right;">Additive Effect<a href="http://genenetwork.org//glossary.html#A" target="_blank"><sup style="color:#f00"> ?</sup></a></th>
+ <th data-export="Additive Effect">Additive Effect<a href="http://genenetwork.org//glossary.html#A" target="_blank"><sup style="color:#f00"> ?</sup></a></th>
{% else %}
- <th data-export="{{header}}" style="background-color: #eeeeee;">{{header}}</th>
+ <th data-export="{{header}}">{{header}}</th>
{% endif %}
{% endfor %}
</tr>
@@ -95,14 +95,14 @@
{% if trait_list|length > 20 %}
<tfoot>
<tr>
- <th style="width: 30px;"></th>
+ <th></th>
{% for header in header_fields %}
{% if header == 'Max LRS' %}
- <th style="text-align: right;">Max<br>LRS</th>
+ <th data-export="Max LRS">Max LRS</th>
{% elif header == 'Additive Effect' %}
- <th style="text-align: right;">Additive<br>Effect<a href="http://genenetwork.org//glossary.html#A" target="_blank"><sup style="color:#f00"> ?</sup></a></th>
+ <th data-export="Additive Effect">Additive Effect<a href="http://genenetwork.org//glossary.html#A" target="_blank"><sup style="color:#f00"> ?</sup></a></th>
{% else %}
- <th>{{header}}</th>
+ <th data-export="{{header}}">{{header}}</th>
{% endif %}
{% endfor %}
</tr>
@@ -205,16 +205,20 @@
"data": json_trait_list,
"columns": [
{ "type": "natural" },
- { "type": "natural" },
+ { "type": "natural", "width": "4%" },
{ "type": "natural" },
{ "type": "natural" },
{ "type": "natural", "width": "30%" },
- { "type": "natural", "width": "15%" },
- { "type": "natural" },
+ { "type": "natural", "width": "10%" },
{ "type": "natural" },
- { "type": "natural", "width": "15%" },
+ { "type": "natural", "width": "6%" },
+ { "type": "natural", "width": "12%" },
{ "type": "natural" }
],
+ "columnDefs": [ {
+ "targets": 0,
+ "orderable": false
+ } ],
"order": [[1, "asc" ]],
"sDom": "RZtir",
"iDisplayLength": -1,
@@ -260,17 +264,21 @@
"data": json_trait_list,
"columns": [
{ "type": "natural" },
+ { "type": "natural", "width": "5%" },
{ "type": "natural" },
{ "type": "natural" },
{ "type": "natural" },
{ "type": "natural" },
+ { "type": "natural", "width": "6%" },
{ "type": "natural" },
- { "type": "natural" },
- { "type": "natural" },
- { "type": "natural" }
+ { "type": "natural", "width": "9%" }
],
+ "columnDefs": [ {
+ "targets": 0,
+ "orderable": false
+ } ],
"order": [[1, "asc" ]],
- "sDom": "RZtir",
+ "sDom": "RZtr",
"iDisplayLength": -1,
"autoWidth": false,
"deferRender": true,
@@ -303,6 +311,10 @@
{ "type": "natural" },
{ "type": "natural", "width": "40%"}
],
+ "columnDefs": [ {
+ "targets": 0,
+ "orderable": false
+ } ],
"order": [[1, "asc" ]],
"sDom": "RZtir",
"iDisplayLength": -1,