Commit 281e30b5 authored by Wai Yi Leung's avatar Wai Yi Leung

Update the tables with sortable indication and pull all online resources to jar for offline usage.

parent ad3013df
......@@ -35,7 +35,7 @@
<!-- Table -->
<table class="table sortable-theme-bootstrap" data-sortable>
<thead><tr>
<th>Sample</th>
<th data-sorted="true" data-sorted-direction="ascending">Sample</th>
#if (!sampleLevel) <th>Library</th> #end
<th>Total</th>
<th>Mapped</th>
......
header {
background-color:black;
color:white;
text-align:center;
padding:5px;
}
nav {
line-height:30px;
background-color:#eeeeee;
width:100%;
padding:5px;
}
nav ul ul {
display: none;
}
nav ul li:hover > ul {
display: block;
}
nav ul {
background: #efefef;
background: linear-gradient(top, #efefef 0%, #bbbbbb 100%);
background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%);
background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%);
box-shadow: 0px 0px 9px rgba(0,0,0,0.15);
padding: 0 20px;
border-radius: 10px;
list-style: none;
position: relative;
display: inline-table;
}
nav ul:after {
content: ""; clear: both; display: block;
}
nav ul li {
float: left;
}
nav ul li:hover {
background: #4b545f;
background: linear-gradient(top, #4f5964 0%, #5f6975 40%);
background: -moz-linear-gradient(top, #4f5964 0%, #5f6975 40%);
background: -webkit-linear-gradient(top, #4f5964 0%,#5f6975 40%);
}
nav ul li:hover a {
color: #fff;
}
nav ul li a {
display: block; padding: 2px 10px;
color: #757575; text-decoration: none;
}
nav ul ul {
background: #5f6975; border-radius: 0px; padding: 0;
position: absolute; top: 100%;
}
nav ul ul li {
float: none;
border-top: 1px solid #6b727c;
border-bottom: 1px solid #575f6a;
position: relative;
}
nav ul ul li a {
padding: 5px 15px;
color: #fff;
}
nav ul ul li a:hover {
background: #4b545f;
}
nav ul ul ul {
position: absolute; left: 100%; top:0;
}
#main {
float: left;
padding: 15px;
}
#index {
left: 0;
float: left;
line-height:30px;
background-color:#eeeeee;
padding:5px;
}
footer {
background-color:black;
color:white;
clear:both;
text-align:center;
padding:5px;
}
table, td, th {
border: 1px solid green;
border-collapse: collapse;
padding: 2px;
}
th {
background-color: green;
border: 1px solid white;
color: white;
}
This source diff could not be displayed because it is too large. You can view the blob instead.
/*
* Base structure
*/
/* Move down content because we have a fixed navbar that is 50px tall */
body {
padding-top: 50px;
}
/*
* Global add-ons
*/
.sub-header {
padding-bottom: 10px;
border-bottom: 1px solid #eee;
}
/*
* Top navigation
* Hide default border to remove 1px line.
*/
.navbar-fixed-top {
border: 0;
}
/*
* Sidebar
*/
/* Hide for mobile, show later */
.sidebar {
display: none;
}
@media (min-width: 768px) {
.sidebar {
position: fixed;
top: 51px;
bottom: 0;
left: 0;
z-index: 1000;
display: block;
padding: 20px;
overflow-x: hidden;
overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
background-color: #f5f5f5;
border-right: 1px solid #eee;
}
}
/* Sidebar navigation */
.nav-sidebar {
margin-right: -21px; /* 20px padding + 1px border */
margin-bottom: 20px;
margin-left: -20px;
}
.nav-sidebar > li > a {
padding-right: 20px;
padding-left: 20px;
}
.nav-sidebar > .active > a,
.nav-sidebar > .active > a:hover,
.nav-sidebar > .active > a:focus {
color: #fff;
background-color: #428bca;
}
/*
* Main content
*/
.main {
padding: 20px;
}
@media (min-width: 768px) {
.main {
padding-right: 40px;
padding-left: 40px;
}
}
.main .page-header {
margin-top: 0;
}
/*
* Placeholder dashboard ideas
*/
.placeholders {
margin-bottom: 30px;
text-align: center;
}
.placeholders h4 {
margin-bottom: 0;
}
.placeholder {
margin-bottom: 20px;
}
.placeholder img {
display: inline-block;
border-radius: 50%;
}
\ No newline at end of file
/* line 2, ../sass/_sortable.sass */
table[data-sortable] {
border-collapse: collapse;
border-spacing: 0;
}
/* line 6, ../sass/_sortable.sass */
table[data-sortable] th {
vertical-align: bottom;
font-weight: bold;
}
/* line 10, ../sass/_sortable.sass */
table[data-sortable] th, table[data-sortable] td {
text-align: left;
padding: 10px;
}
/* line 14, ../sass/_sortable.sass */
table[data-sortable] th:not([data-sortable="false"]) {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-touch-callout: none;
cursor: pointer;
}
/* line 26, ../sass/_sortable.sass */
table[data-sortable] th:after {
content: "";
visibility: hidden;
display: inline-block;
vertical-align: inherit;
height: 0;
width: 0;
border-width: 5px;
border-style: solid;
border-color: transparent;
margin-right: 1px;
margin-left: 10px;
float: right;
}
/* line 40, ../sass/_sortable.sass */
table[data-sortable] th[data-sorted="true"]:after {
visibility: visible;
}
/* line 43, ../sass/_sortable.sass */
table[data-sortable] th[data-sorted-direction="descending"]:after {
border-top-color: inherit;
margin-top: 8px;
}
/* line 47, ../sass/_sortable.sass */
table[data-sortable] th[data-sorted-direction="ascending"]:after {
border-bottom-color: inherit;
margin-top: 3px;
}
/* line 5, ../sass/sortable-theme-bootstrap.sass */
table[data-sortable].sortable-theme-bootstrap {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
line-height: 20px;
color: #333333;
background: white;
}
/* line 12, ../sass/sortable-theme-bootstrap.sass */
table[data-sortable].sortable-theme-bootstrap thead th {
border-bottom: 2px solid #e0e0e0;
}
/* line 15, ../sass/sortable-theme-bootstrap.sass */
table[data-sortable].sortable-theme-bootstrap tbody td {
border-top: 1px solid #e0e0e0;
}
/* line 18, ../sass/sortable-theme-bootstrap.sass */
table[data-sortable].sortable-theme-bootstrap th[data-sorted="true"] {
color: #3a87ad;
background: #d9edf7;
border-bottom-color: #bce8f1;
}
/* line 23, ../sass/sortable-theme-bootstrap.sass */
table[data-sortable].sortable-theme-bootstrap th[data-sorted="true"][data-sorted-direction="descending"]:after {
border-top-color: #3a87ad;
}
/* line 26, ../sass/sortable-theme-bootstrap.sass */
table[data-sortable].sortable-theme-bootstrap th[data-sorted="true"][data-sorted-direction="ascending"]:after {
border-bottom-color: #3a87ad;
}
/* line 31, ../sass/sortable-theme-bootstrap.sass */
table[data-sortable].sortable-theme-bootstrap.sortable-theme-bootstrap-striped tbody > tr:nth-child(odd) > td {
background-color: #f9f9f9;
}
\ No newline at end of file
/*! sortable.js 0.5.0 */
(function(){var a,b,c,d,e,f;a="table[data-sortable]",c=/^-?[£$¤]?[\d,.]+%?$/,f=/^\s+|\s+$/g,e="ontouchstart"in document.documentElement,b=e?"touchstart":"click",d={init:function(){var b,c,e,f,g;for(c=document.querySelectorAll(a),g=[],e=0,f=c.length;f>e;e++)b=c[e],g.push(d.initTable(b));return g},initTable:function(a){var b,c,e,f,g;if(1===a.tHead.rows.length&&"true"!==a.getAttribute("data-sortable-initialized")){for(a.setAttribute("data-sortable-initialized","true"),e=a.querySelectorAll("th"),b=f=0,g=e.length;g>f;b=++f)c=e[b],"false"!==c.getAttribute("data-sortable")&&d.setupClickableTH(a,c,b);return a}},setupClickableTH:function(a,c,e){var f;return f=d.getColumnType(a,e),c.addEventListener(b,function(){var b,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u;for(j="true"===this.getAttribute("data-sorted"),k=this.getAttribute("data-sorted-direction"),b=j?"ascending"===k?"descending":"ascending":f.defaultSortDirection,m=this.parentNode.querySelectorAll("th"),n=0,q=m.length;q>n;n++)c=m[n],c.setAttribute("data-sorted","false"),c.removeAttribute("data-sorted-direction");for(this.setAttribute("data-sorted","true"),this.setAttribute("data-sorted-direction",b),l=a.tBodies[0],h=[],t=l.rows,o=0,r=t.length;r>o;o++)g=t[o],h.push([d.getNodeValue(g.cells[e]),g]);for(j?h.reverse():h.sort(f.compare),u=[],p=0,s=h.length;s>p;p++)i=h[p],u.push(l.appendChild(i[1]));return u})},getColumnType:function(a,b){var e,f,g,h,i;for(i=a.tBodies[0].rows,g=0,h=i.length;h>g;g++)if(e=i[g],f=d.getNodeValue(e.cells[b]),""!==f&&f.match(c))return d.types.numeric;return d.types.alpha},getNodeValue:function(a){return a?null!==a.getAttribute("data-value")?a.getAttribute("data-value"):"undefined"!=typeof a.innerText?a.innerText.replace(f,""):a.textContent.replace(f,""):""},types:{numeric:{defaultSortDirection:"descending",compare:function(a,b){var c,d;return c=parseFloat(a[0].replace(/[^0-9.-]/g,"")),d=parseFloat(b[0].replace(/[^0-9.-]/g,"")),isNaN(c)&&(c=0),isNaN(d)&&(d=0),d-c}},alpha:{defaultSortDirection:"ascending",compare:function(a,b){var c,d;return c=a[0].toLowerCase(),d=b[0].toLowerCase(),c===d?0:d>c?-1:1}}}},setTimeout(d.init,0),window.Sortable=d}).call(this);
\ No newline at end of file
......@@ -119,16 +119,16 @@
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="${rootPath}ext/js/jquery.min.js"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="${rootPath}ext/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="${rootPath}ext/css/bootstrap-theme.min.css">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="${rootPath}ext/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="${rootPath}ext/css/bootstrap_dashboard.css">
<link rel="stylesheet" type="text/css" href="${rootPath}ext/css/sortable-theme-bootstrap.css">
......
......@@ -3,7 +3,7 @@
<%@ var summary: Summary %>
<%@ var rootPath: String %>
<table class="table sortable-theme-bootstrap" data-sortable>
<thead><tr></tr><th>Sample</th></thead></tr>
<thead><tr></tr><th data-sorted="true" data-sorted-direction="ascending">Sample</th></thead></tr>
<tbody>
#for (sample <- summary.samples)
<tr><td><a href="${rootPath}Samples/${sample}/index.html">${sample}</a></td></tr>
......
package nl.lumc.sasc.biopet.core.report
import java.io.{ PrintWriter, File }
import java.io.{FileOutputStream, PrintWriter, File}
import java.net.URL
import nl.lumc.sasc.biopet.core.{ BiopetJavaCommandLineFunction, ToolCommand }
import nl.lumc.sasc.biopet.core.summary.Summary
import org.apache.commons.io.IOUtils
import org.broadinstitute.gatk.utils.commandline.Input
import org.fusesource.scalate.{ TemplateSource, TemplateEngine }
......@@ -91,23 +92,20 @@ trait ReportBuilder extends ToolCommand {
logger.info(srcFile.getPath)
if (srcFile.isDirectory) {
var newPath: String = srcFile.getAbsolutePath.split(resourcePath).last
val newPath: String = srcFile.getAbsolutePath.split(resourcePath).last
val workDir = new File(externalDir, newPath)
workDir.mkdirs()
logger.info("Writing to " + workDir.getAbsolutePath)
for (f <- srcFile.listFiles()) {
var newFilePath: String = f.getAbsolutePath.split(resourcePath+ newPath).last
val resourceWriter = new PrintWriter( new File(workDir, newFilePath) )
val resourceSrcPath: File = new File( resourcePath, newPath+"/"+newFilePath )
val resourceSrcPath: String = new File( resourcePath, newPath+"/"+newFilePath ).getAbsolutePath
val is = getClass.getResourceAsStream(resourceSrcPath.getPath)
val os = new FileOutputStream(new File(workDir, newFilePath).getAbsolutePath)
Source.fromInputStream(
getClass.getResourceAsStream(
resourceSrcPath
)
).getLines().foreach(resourceWriter.println)
resourceWriter.close()
org.apache.commons.io.IOUtils.copy(is, os)
os.close()
}
}
}
......
......@@ -43,7 +43,7 @@
<table class="table sortable-theme-bootstrap" data-sortable>
<thead><tr>
<th>Sample</th>
<th data-sorted="true" data-sorted-direction="ascending">Sample</th>
<th colspan="2">Library</th>
<th>Before QC</th>
<th>Discarded</th>
......
......@@ -43,7 +43,7 @@
<!-- Table -->
<table class="table sortable-theme-bootstrap" data-sortable>
<thead><tr>
<th>Sample</th>
<th data-sorted="true" data-sorted-direction="ascending">Sample</th>
<th colspan="2">Library</th>
<th>Before QC</th>
<th>Clipping</th>
......
......@@ -30,12 +30,12 @@
<!-- Table -->
<table class="table sortable-theme-bootstrap" data-sortable>
<thead><tr><th>Sample</th>
<thead><tr><th data-sorted="true" data-sorted-direction="ascending">Sample</th>
#for (field <- fields) <th>${field}</th> #end
</tr></thead>
<tbody>
#for (sample <- samples.toList.sorted)
<tr><td data-sorted="true"><a href="${rootPath}Samples/${sample}/index.html">${sample}</a></td>
<tr><td><a href="${rootPath}Samples/${sample}/index.html">${sample}</a></td>
#for (field <- fields)
<td>${summary.getSampleValue(sample, "shivavariantcalling", "stats", "multisample-vcfstats-final", "genotype", field)}</td>
#end
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment