Mercurial > repos > brasset_jensen > srnapipe


  <!DOCTYPE html>
  <html lang="en">
  <head>
  <meta charset="utf-8">
  <title>pipeline</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="">
  <meta name="author" content="">
  <!-- Le styles -->
  <link href="css/bootstrap.css" rel="stylesheet">
  <link href="css/bootstrap-table.css" rel="stylesheet">
  <style type="text/css">
  body {
    padding-top: 60px;
    padding-bottom: 40px;
  }
  div#page {
    width: 940px;
    background-color: #fff;
    margin: 0 auto;
    text-align: left;
    border-color: #fff;
    border-style: none solid solid;
    border-width: medium 1px 1px;
  }

  div.content {
   	display: none;
	  float: right;
	  width: 550px;
  }
  div.content a, div.navigation a {
    text-decoration: none;
   	color: #777;
  }
  div.content a:focus, div.content a:hover, div.content a:active {
    text-decoration: underline;
  }

  div.controls {
    margin-top: 5px;
	  height: 23px;
  }

  div.controls a {
	  padding: 5px;
  }
  div.ss-controls {
	  float: left;
  }
  div.nav-controls {
	  float: right;
  }
  div.slideshow-container {
	  position: relative;
	  clear: both;
	  height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */
  }
  div.loader {
  	position: absolute;
  	top: 0;
  	left: 0;
    background-image: url('loader.gif');
    background-repeat: no-repeat;
    background-position: center;
  	width: 550px;
  	height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */
  }
  div.slideshow {

  }

  div.slideshow span.image-wrapper {
	  display: block;
	  position: absolute;
	  top: 0;
	  left: 0;
  }
  div.slideshow a.advance-link {
	  display: block;
 	  width: 550px;
    height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */
    line-height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */
    text-align: center;
  }
  div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited {
    text-decoration: none;
  }
  div.slideshow img {
    vertical-align: middle;
	border: 1px solid #ccc;
  }

  div.image-title {
    font-weight: bold;
    font-size: 1.4em;
  }

  div.image-desc {
    line-height: 1.3em;
    padding-top: 12px;
  }
  div.navigation {

  }
  ul.thumbs {
	clear: both;
	margin: 0;
	padding: 0;
  }
  ul.thumbs li {
	float: none;
	padding: 0;
	margin: 0;
    list-style: none;
  }
  a.thumb {
	padding: 0;
	display: inline;
	border: none;
  }
  ul.thumbs li.selected a.thumb {
	color: #000;
    font-weight: bold;
  }
  a.thumb:focus {
	outline: none;
  }
  ul.thumbs img {
	border: none;
	display: block;
  }
  div.pagination {
	clear: both;
  }
  div.navigation div.top {
    margin-bottom: 12px;
	height: 11px;
  }
  div.navigation div.bottom {
    margin-top: 12px;
  }
  div.pagination a, div.pagination span.current, div.pagination span.ellipsis {
	display: block;
	float: left;
    margin-right: 2px;
	padding: 4px 7px 2px 7px;
	border: 1px solid #ccc;
  }
  div.pagination a:hover {
    background-color: #eee;
    text-decoration: none;
  }
  div.pagination span.current {
    font-weight: bold;
    background-color: #000;
    border-color: #000;
	color: #fff;
  }
  div.pagination span.ellipsis {
	border: none;
	padding: 5px 0 3px 2px;
  }

  div.download {
	float: right;
  }

  div.caption-container {
	position: relative;
	clear: left;
	height: 75px;
  }
  span.image-caption {
	display: block;
	position: absolute;
	width: 550px;
	top: 0;
	left: 0;
  }
  div.caption {
	padding: 12px;
  }

  /* Featurettes
  ------------------------- */

  .featurette {
  padding-top: 20px; /* Vertically center images part 1: add padding above and below text. */
  overflow: hidden; /* Vertically center images part 2: clear their floats. */
  text-align: center;
  }

  .featurette-p
  {
   text-align: left;
  }

  .featurette-image {
  margin-top: 10px; /* Vertically center images part 3: negative margin up the image the same amount of the padding to center it. */
  width: 450px;
  height: auto;
  }

  </style>
  <link href="css/bootstrap-responsive.css" rel="stylesheet">
  </head>
  <body>

  <div class="navbar navbar-inverse navbar-fixed-top">
  <div class="navbar-inner">
  <div class="container">
  <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
  <span class="icon-bar"></span>
  <span class="icon-bar"></span>
  <span class="icon-bar"></span>
  </button>
  <a class="brand" href="report.txt">Report</a>
  <div class="nav-collapse collapse">
  <ul class="nav">
  <li class="active"><a href="reads-sample-small.fastq.html">reads-sample-small.fastq</a></li>
  </ul>
  </div><!--/.nav-collapse -->
  </div>
  </div>
  </div>
<div class="container  text-center">
  <div class="row-fluid">
      <div class="span6">
        <h2>Bonafide</h2>
        reads of size between 18 and 29<br>with no mi, sn, t and r RNAs
        <p><a class="btn" href="reads-sample-small.fastq-bonafide_reads-genome.html">Genome</a></p>
        <p><a class="btn" href="reads-sample-small.fastq-bonafide_reads-TEs.html">TE</a></p>
        <p><a class="btn" href="reads-sample-small.fastq-bonafide_reads-transcripts.html">Transcripts</a></p>
        <div class="row-fluid">
          <div class="span6">
            <h2>siRNAs</h2>
            bonafide reads of size between 21 and 21
            <p><a class="btn" href="reads-sample-small.fastq-siRNAs-genome.html">Genome</a></p>
            <p><a class="btn" href="reads-sample-small.fastq-siRNAs-TEs.html">TE</a></p>
            <p><a class="btn" href="reads-sample-small.fastq-siRNAs-transcripts.html">Transcripts</a></p>
          </div>
          <div class="span6">
            <h2>piRNAs</h2>
            bonafide reads of size between 23 and 29
            <p><a class="btn" href="reads-sample-small.fastq-piRNAs-genome.html">Genome</a></p>
            <p><a class="btn" href="reads-sample-small.fastq-piRNAs-TEs.html">TE</a></p>
            <p><a class="btn" href="reads-sample-small.fastq-piRNAs-transcripts.html">Transcripts</a></p>
          </div>
        </div>
      </div>
    <div class="span6">
       <h2>miRNAs</h2>
       <p><a class="btn" href="reads-sample-small.fastq-miRNAs-genome.html">Genome</a></p>
       <p><a class="btn" href="reads-sample-small.fastq-miRNAs-TEs.html">TE</a></p>
       <p><a class="btn" href="reads-sample-small.fastq-miRNAs-transcripts.html">Transcripts</a></p>
    </div>
  </div>
</div>
  <div class="container"> <div class="row text-center">  <img  src="reads-sample-small.fastq/subgroups//pie_chart.png"/><br />
  <A HREF="reads-sample-small.fastq/subgroups//repartition.txt">text file</A><br/>
 </div></div>
  <!-- FOOTER -->
  <div class="container">
  <footer>

  </footer>
  </div>
  <!-- Le javascript
  ================================================== -->
  <!-- Placed at the end of the document so the pages load faster -->
  <script type="text/javascript" src="js/filter.js"></script>
  <script type="text/javascript" src="js/jquery.js"></script>
  <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
  <script type="text/javascript" src="js/jquery.galleriffic.js"></script>
  <script type="text/javascript" src="js/jquery.opacityrollover.js"></script>
  <script type="text/javascript" src="js/bootstrap-table.js"></script>
  <script type="text/javascript" src="js/bootstrap.min.js"></script>
  <script type="text/javascript">
  jQuery(document).ready(function($) {
    // We only want these styles applied when javascript is enabled
    $('div.navigation').css({'width' : '300px', 'float' : 'left'});
    $('div.content').css('display', 'block');

    $(".each-gallery").each(function(i){
      // Initially set opacity on thumbs and add
      // additional styling for hover effect on thumbs
        var onMouseOutOpacity = 0.67;
      $('#thumbs + i + ul.thumbs li').opacityrollover({
      mouseOutOpacity:   onMouseOutOpacity,
      mouseOverOpacity:  1.0,
      fadeSpeed:         'fast',
      exemptionSelector: '.selected'
      });

      // Initialize Advanced Galleriffic Gallery
      var gallery = $('#thumbs'+i).galleriffic({
      delay:                     2500,
      numThumbs:                 22,
      preloadAhead:              10,
      enableTopPager:            true,
      enableBottomPager:         true,
      maxPagesToShow:            7,
      imageContainerSel:         '#slideshow'+ i,
      controlsContainerSel:      '#controls' + i,
      captionContainerSel:       '#caption' + i,
      loadingContainerSel:       '#loading' + i,
      renderSSControls:          true,
      renderNavControls:         true,
      playLinkText:              'Play',
      pauseLinkText:             'Pause',
      prevLinkText:              '&lsaquo; Previous',
      nextLinkText:              'Next &rsaquo;',
      nextPageLinkText:          'Next &rsaquo;',
      prevPageLinkText:          '&lsaquo; Prev',
      enableHistory:             false,
      autoStart:                 false,
      syncTransitions:           true,
      defaultTransitionDuration: 900,
      onSlideChange:             function(prevIndex, nextIndex) {
        // 'this' refers to the gallery, which is an extension of $('#thumbs')
        this.find('ul.thumbs').children()
        .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
        .eq(nextIndex).fadeTo('fast', 1.0);
      },
      onPageTransitionOut:       function(callback) {
        this.fadeTo('fast', 0.0, callback);
      },
      onPageTransitionIn:        function() {
        this.fadeTo('fast', 1.0);
      }
      });
    });
  });
  </script>
  </body>
  </html>
author	brasset_jensen
date	Tue, 30 Jun 2020 06:38:36 -0400
parents	9185ca0a7b43
children