Mercurial > repos > brasset_jensen > srnapipe
annotate test-data/res.html @ 63:11708af40030 draft
planemo upload for repository https://github.com/GReD-Clermont/sRNAPipe/ commit a461e07471d3897046e14389171a2c03d09b912d
| author | pierre.pouchin |
|---|---|
| date | Thu, 24 Jan 2019 13:09:46 -0500 |
| parents | 9185ca0a7b43 |
| children |
| rev | line source |
|---|---|
| 61 | 1 |
| 2 <!DOCTYPE html> | |
| 3 <html lang="en"> | |
| 4 <head> | |
| 5 <meta charset="utf-8"> | |
| 6 <title>pipeline</title> | |
| 7 <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| 8 <meta name="description" content=""> | |
| 9 <meta name="author" content=""> | |
| 10 <!-- Le styles --> | |
| 11 <link href="css/bootstrap.css" rel="stylesheet"> | |
| 12 <link href="css/bootstrap-table.css" rel="stylesheet"> | |
| 13 <style type="text/css"> | |
| 14 body { | |
| 15 padding-top: 60px; | |
| 16 padding-bottom: 40px; | |
| 17 } | |
| 18 div#page { | |
| 19 width: 940px; | |
| 20 background-color: #fff; | |
| 21 margin: 0 auto; | |
| 22 text-align: left; | |
| 23 border-color: #fff; | |
| 24 border-style: none solid solid; | |
| 25 border-width: medium 1px 1px; | |
| 26 } | |
| 27 | |
| 28 div.content { | |
| 29 display: none; | |
| 30 float: right; | |
| 31 width: 550px; | |
| 32 } | |
| 33 div.content a, div.navigation a { | |
| 34 text-decoration: none; | |
| 35 color: #777; | |
| 36 } | |
| 37 div.content a:focus, div.content a:hover, div.content a:active { | |
| 38 text-decoration: underline; | |
| 39 } | |
| 40 | |
| 41 div.controls { | |
| 42 margin-top: 5px; | |
| 43 height: 23px; | |
| 44 } | |
| 45 | |
| 46 div.controls a { | |
| 47 padding: 5px; | |
| 48 } | |
| 49 div.ss-controls { | |
| 50 float: left; | |
| 51 } | |
| 52 div.nav-controls { | |
| 53 float: right; | |
| 54 } | |
| 55 div.slideshow-container { | |
| 56 position: relative; | |
| 57 clear: both; | |
| 58 height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */ | |
| 59 } | |
| 60 div.loader { | |
| 61 position: absolute; | |
| 62 top: 0; | |
| 63 left: 0; | |
| 64 background-image: url('loader.gif'); | |
| 65 background-repeat: no-repeat; | |
| 66 background-position: center; | |
| 67 width: 550px; | |
| 68 height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */ | |
| 69 } | |
| 70 div.slideshow { | |
| 71 | |
| 72 } | |
| 73 | |
| 74 div.slideshow span.image-wrapper { | |
| 75 display: block; | |
| 76 position: absolute; | |
| 77 top: 0; | |
| 78 left: 0; | |
| 79 } | |
| 80 div.slideshow a.advance-link { | |
| 81 display: block; | |
| 82 width: 550px; | |
| 83 height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */ | |
| 84 line-height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */ | |
| 85 text-align: center; | |
| 86 } | |
| 87 div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited { | |
| 88 text-decoration: none; | |
| 89 } | |
| 90 div.slideshow img { | |
| 91 vertical-align: middle; | |
| 92 border: 1px solid #ccc; | |
| 93 } | |
| 94 | |
| 95 div.image-title { | |
| 96 font-weight: bold; | |
| 97 font-size: 1.4em; | |
| 98 } | |
| 99 | |
| 100 div.image-desc { | |
| 101 line-height: 1.3em; | |
| 102 padding-top: 12px; | |
| 103 } | |
| 104 div.navigation { | |
| 105 | |
| 106 } | |
| 107 ul.thumbs { | |
| 108 clear: both; | |
| 109 margin: 0; | |
| 110 padding: 0; | |
| 111 } | |
| 112 ul.thumbs li { | |
| 113 float: none; | |
| 114 padding: 0; | |
| 115 margin: 0; | |
| 116 list-style: none; | |
| 117 } | |
| 118 a.thumb { | |
| 119 padding: 0; | |
| 120 display: inline; | |
| 121 border: none; | |
| 122 } | |
| 123 ul.thumbs li.selected a.thumb { | |
| 124 color: #000; | |
| 125 font-weight: bold; | |
| 126 } | |
| 127 a.thumb:focus { | |
| 128 outline: none; | |
| 129 } | |
| 130 ul.thumbs img { | |
| 131 border: none; | |
| 132 display: block; | |
| 133 } | |
| 134 div.pagination { | |
| 135 clear: both; | |
| 136 } | |
| 137 div.navigation div.top { | |
| 138 margin-bottom: 12px; | |
| 139 height: 11px; | |
| 140 } | |
| 141 div.navigation div.bottom { | |
| 142 margin-top: 12px; | |
| 143 } | |
| 144 div.pagination a, div.pagination span.current, div.pagination span.ellipsis { | |
| 145 display: block; | |
| 146 float: left; | |
| 147 margin-right: 2px; | |
| 148 padding: 4px 7px 2px 7px; | |
| 149 border: 1px solid #ccc; | |
| 150 } | |
| 151 div.pagination a:hover { | |
| 152 background-color: #eee; | |
| 153 text-decoration: none; | |
| 154 } | |
| 155 div.pagination span.current { | |
| 156 font-weight: bold; | |
| 157 background-color: #000; | |
| 158 border-color: #000; | |
| 159 color: #fff; | |
| 160 } | |
| 161 div.pagination span.ellipsis { | |
| 162 border: none; | |
| 163 padding: 5px 0 3px 2px; | |
| 164 } | |
| 165 | |
| 166 div.download { | |
| 167 float: right; | |
| 168 } | |
| 169 | |
| 170 div.caption-container { | |
| 171 position: relative; | |
| 172 clear: left; | |
| 173 height: 75px; | |
| 174 } | |
| 175 span.image-caption { | |
| 176 display: block; | |
| 177 position: absolute; | |
| 178 width: 550px; | |
| 179 top: 0; | |
| 180 left: 0; | |
| 181 } | |
| 182 div.caption { | |
| 183 padding: 12px; | |
| 184 } | |
| 185 | |
| 186 /* Featurettes | |
| 187 ------------------------- */ | |
| 188 | |
| 189 .featurette { | |
| 190 padding-top: 20px; /* Vertically center images part 1: add padding above and below text. */ | |
| 191 overflow: hidden; /* Vertically center images part 2: clear their floats. */ | |
| 192 text-align: center; | |
| 193 } | |
| 194 | |
| 195 .featurette-p | |
| 196 { | |
| 197 text-align: left; | |
| 198 } | |
| 199 | |
| 200 .featurette-image { | |
| 201 margin-top: 10px; /* Vertically center images part 3: negative margin up the image the same amount of the padding to center it. */ | |
| 202 width: 450px; | |
| 203 height: auto; | |
| 204 } | |
| 205 | |
| 206 </style> | |
| 207 <link href="css/bootstrap-responsive.css" rel="stylesheet"> | |
| 208 </head> | |
| 209 <body> | |
| 210 | |
| 211 <div class="navbar navbar-inverse navbar-fixed-top"> | |
| 212 <div class="navbar-inner"> | |
| 213 <div class="container"> | |
| 214 <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> | |
| 215 <span class="icon-bar"></span> | |
| 216 <span class="icon-bar"></span> | |
| 217 <span class="icon-bar"></span> | |
| 218 </button> | |
| 219 <a class="brand" href="report.txt">Report</a> | |
| 220 <div class="nav-collapse collapse"> | |
| 221 <ul class="nav"> | |
| 222 <li class="active"><a href="reads-sample-small.fastq.html">reads-sample-small.fastq</a></li> | |
| 223 </ul> | |
| 224 </div><!--/.nav-collapse --> | |
| 225 </div> | |
| 226 </div> | |
| 227 </div><div class="container"><p><a class="btn" href="reads-sample-small.fastq-sub.html">View details »</a></p></div> | |
| 228 | |
| 229 <div class="container"> | |
| 230 <div class="featurette"> | |
| 231 <h1>reads-sample-small.fastq</h1> | |
| 232 <p class="featurette-p"> | |
| 233 <A HREF="reads-sample-small.fastq/genome//reads-sample-small.fastq_18-29_sorted.bam">alignment (bam)</A><br/> | |
| 234 <A HREF="reads-sample-small.fastq/genome//reads-sample-small.fastq_18-29_minus.bedgraph">bedgraph minus strand</A><br/> | |
| 235 <A HREF="reads-sample-small.fastq/genome//reads-sample-small.fastq_18-29_plus.bedgraph">bedgraph plus strand</A><br/> | |
| 236 <A HREF="reads-sample-small.fastq/genome//reads-sample-small.fastq_18-29_unique_minus.bedgraph">bedgraph unique minus strand</A><br/> | |
| 237 <A HREF="reads-sample-small.fastq/genome//reads-sample-small.fastq_18-29_unique_plus.bedgraph">bedgraph unique plus strand</A><br/> | |
| 238 <A HREF="reads-sample-small.fastq/genome//dup_mapnum.txt">mappers (txt)</A><br/> | |
| 239 <A HREF="reads-sample-small.fastq/genome//distribution.txt">mappers size distribution (txt)</A><br/> | |
| 240 <A HREF="reads-sample-small.fastq/genome//reads-sample-small.fastq_18-29_unique_sorted.bam">unique alignment (bam)</A><br/> | |
| 241 <A HREF="reads-sample-small.fastq/genome//dup_unique.txt">unique mappers (txt)</A><br/> | |
| 242 <A HREF="reads-sample-small.fastq/genome//dup_nonmapp.txt">unmapped (txt)</A><br/> | |
| 243 | |
| 244 </p><img class="featurette-image" src="reads-sample-small.fastq/genome//distribution.png"/><br /> | |
| 245 </div> | |
| 246 </div> | |
|
63
11708af40030
planemo upload for repository https://github.com/GReD-Clermont/sRNAPipe/ commit a461e07471d3897046e14389171a2c03d09b912d
pierre.pouchin
parents:
61
diff
changeset
|
247 <div class="container"><h2>mappers #: 3968</h2><h2>unique mappers #: 3963</h2> </div> |
| 61 | 248 |
| 249 <div id="page"> | |
| 250 <div id="container"> | |
| 251 <div class="each-gallery"> | |
| 252 <div id="gallery" class="content"> | |
| 253 <div id="controls0" class="controls"></div> | |
| 254 <div class="slideshow-container"> | |
| 255 <div id="loading0" class="loader"></div> | |
| 256 <div id="slideshow0" class="slideshow"></div> | |
| 257 </div> | |
| 258 <div id="caption0" class="caption-container">Uniquely mapped reads</div> | |
| 259 </div> | |
| 260 <div id="thumbs0" class="navigation"> | |
| 261 <input type="text" id="myInput0" onkeyup="search(this)" placeholder="Search for names..."> | |
| 262 <ul class="thumbs noscript"> | |
| 263 | |
| 264 <li> | |
| 265 <a class="thumb" href="reads-sample-small.fastq/genome//Gviz/unique/chrom_1.png" title="chrom_1">chrom_1</a> | |
| 266 </li> | |
| 267 | |
| 268 <li> | |
| 269 <a class="thumb" href="reads-sample-small.fastq/genome//Gviz/unique/chrom_2.png" title="chrom_2">chrom_2</a> | |
| 270 </li> | |
| 271 | |
| 272 <li> | |
| 273 <a class="thumb" href="reads-sample-small.fastq/genome//Gviz/unique/chrom_3.png" title="chrom_3">chrom_3</a> | |
| 274 </li> | |
| 275 | |
| 276 <li> | |
| 277 <a class="thumb" href="reads-sample-small.fastq/genome//Gviz/unique/chrom_4.png" title="chrom_4">chrom_4</a> | |
| 278 </li> | |
| 279 | |
| 280 <li> | |
| 281 <a class="thumb" href="reads-sample-small.fastq/genome//Gviz/unique/chrom_5.png" title="chrom_5">chrom_5</a> | |
| 282 </li> | |
| 283 | |
| 284 <li> | |
| 285 <a class="thumb" href="reads-sample-small.fastq/genome//Gviz/unique/chrom_6.png" title="chrom_6">chrom_6</a> | |
| 286 </li> | |
| 287 | |
| 288 </ul> | |
| 289 </div> | |
| 290 </div> | |
| 291 <div id="page"> | |
| 292 <div id="container"> | |
| 293 <div class="each-gallery"> | |
| 294 <div id="gallery" class="content"> | |
| 295 <div id="controls1" class="controls"></div> | |
| 296 <div class="slideshow-container"> | |
| 297 <div id="loading1" class="loader"></div> | |
| 298 <div id="slideshow1" class="slideshow"></div> | |
| 299 </div> | |
| 300 <div id="caption1" class="caption-container">Reads randomly assigned</div> | |
| 301 </div> | |
| 302 <div id="thumbs1" class="navigation"> | |
| 303 <input type="text" id="myInput1" onkeyup="search(this)" placeholder="Search for names..."> | |
| 304 <ul class="thumbs noscript"> | |
| 305 | |
| 306 <li> | |
| 307 <a class="thumb" href="reads-sample-small.fastq/genome//Gviz/rand/chrom_1.png" title="chrom_1">chrom_1</a> | |
| 308 </li> | |
| 309 | |
| 310 <li> | |
| 311 <a class="thumb" href="reads-sample-small.fastq/genome//Gviz/rand/chrom_2.png" title="chrom_2">chrom_2</a> | |
| 312 </li> | |
| 313 | |
| 314 <li> | |
| 315 <a class="thumb" href="reads-sample-small.fastq/genome//Gviz/rand/chrom_3.png" title="chrom_3">chrom_3</a> | |
| 316 </li> | |
| 317 | |
| 318 <li> | |
| 319 <a class="thumb" href="reads-sample-small.fastq/genome//Gviz/rand/chrom_4.png" title="chrom_4">chrom_4</a> | |
| 320 </li> | |
| 321 | |
| 322 <li> | |
| 323 <a class="thumb" href="reads-sample-small.fastq/genome//Gviz/rand/chrom_5.png" title="chrom_5">chrom_5</a> | |
| 324 </li> | |
| 325 | |
| 326 <li> | |
| 327 <a class="thumb" href="reads-sample-small.fastq/genome//Gviz/rand/chrom_6.png" title="chrom_6">chrom_6</a> | |
| 328 </li> | |
| 329 | |
| 330 </ul> | |
| 331 </div> | |
| 332 <div style="clear: both;"></div></div> | |
| 333 </div> | |
| 334 </div> | |
| 335 | |
| 336 <!-- FOOTER --> | |
| 337 <div class="container"> | |
| 338 <footer> | |
| 339 | |
| 340 </footer> | |
| 341 </div> | |
| 342 <!-- Le javascript | |
| 343 ================================================== --> | |
| 344 <!-- Placed at the end of the document so the pages load faster --> | |
| 345 <script type="text/javascript" src="js/filter.js"></script> | |
| 346 <script type="text/javascript" src="js/jquery.js"></script> | |
| 347 <script type="text/javascript" src="js/jquery-1.3.2.js"></script> | |
| 348 <script type="text/javascript" src="js/jquery.galleriffic.js"></script> | |
| 349 <script type="text/javascript" src="js/jquery.opacityrollover.js"></script> | |
| 350 <script type="text/javascript" src="js/bootstrap-table.js"></script> | |
| 351 <script type="text/javascript" src="js/bootstrap.min.js"></script> | |
| 352 <script type="text/javascript"> | |
| 353 jQuery(document).ready(function($) { | |
| 354 // We only want these styles applied when javascript is enabled | |
| 355 $('div.navigation').css({'width' : '300px', 'float' : 'left'}); | |
| 356 $('div.content').css('display', 'block'); | |
| 357 | |
| 358 $(".each-gallery").each(function(i){ | |
| 359 // Initially set opacity on thumbs and add | |
| 360 // additional styling for hover effect on thumbs | |
| 361 var onMouseOutOpacity = 0.67; | |
| 362 $('#thumbs + i + ul.thumbs li').opacityrollover({ | |
| 363 mouseOutOpacity: onMouseOutOpacity, | |
| 364 mouseOverOpacity: 1.0, | |
| 365 fadeSpeed: 'fast', | |
| 366 exemptionSelector: '.selected' | |
| 367 }); | |
| 368 | |
| 369 // Initialize Advanced Galleriffic Gallery | |
| 370 var gallery = $('#thumbs'+i).galleriffic({ | |
| 371 delay: 2500, | |
| 372 numThumbs: 22, | |
| 373 preloadAhead: 10, | |
| 374 enableTopPager: true, | |
| 375 enableBottomPager: true, | |
| 376 maxPagesToShow: 7, | |
| 377 imageContainerSel: '#slideshow'+ i, | |
| 378 controlsContainerSel: '#controls' + i, | |
| 379 captionContainerSel: '#caption' + i, | |
| 380 loadingContainerSel: '#loading' + i, | |
| 381 renderSSControls: true, | |
| 382 renderNavControls: true, | |
| 383 playLinkText: 'Play', | |
| 384 pauseLinkText: 'Pause', | |
| 385 prevLinkText: '‹ Previous', | |
| 386 nextLinkText: 'Next ›', | |
| 387 nextPageLinkText: 'Next ›', | |
| 388 prevPageLinkText: '‹ Prev', | |
| 389 enableHistory: false, | |
| 390 autoStart: false, | |
| 391 syncTransitions: true, | |
| 392 defaultTransitionDuration: 900, | |
| 393 onSlideChange: function(prevIndex, nextIndex) { | |
| 394 // 'this' refers to the gallery, which is an extension of $('#thumbs') | |
| 395 this.find('ul.thumbs').children() | |
| 396 .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end() | |
| 397 .eq(nextIndex).fadeTo('fast', 1.0); | |
| 398 }, | |
| 399 onPageTransitionOut: function(callback) { | |
| 400 this.fadeTo('fast', 0.0, callback); | |
| 401 }, | |
| 402 onPageTransitionIn: function() { | |
| 403 this.fadeTo('fast', 1.0); | |
| 404 } | |
| 405 }); | |
| 406 }); | |
| 407 }); | |
| 408 </script> | |
| 409 </body> | |
| 410 </html> | |
| 411 |