Team:Shenzhen BGIC 0101/Tutorial

From 2013.igem.org

(Difference between revisions)
 
(89 intermediate revisions not shown)
Line 1: Line 1:
 +
{{:Team:Shenzhen_BGIC_0101/Templates/Header}}
<html>
<html>
-
<head>
+
<script src="https://2013.igem.org/Team:Shenzhen_BGIC_0101/aaa?action=raw&ctype=text/javascript"></script>
-
    <!-- iGem wiki hacks -->
+
-
        <!-- Remove all empty <p> tags -->
+
-
        <script type="text/javascript">
+
-
            $(document).ready(function() {
+
-
                $("p").filter( function() {
+
-
                    return $.trim($(this).html()) == '';
+
-
                }).remove();
+
-
            });
+
-
        </script>
+
-
        <!-- Remove "team" from the menubar -->
+
<body>
-
        <script type="text/javascript">
+
-
            $(document).ready(function() {
+
-
                $("menubar > ul > li:last-child").remove();
+
-
            });
+
-
        </script>
+
-
        <!-- Empty heading? - Then remove it.. -->
+
<br/><br/>
-
        <script type="text/javascript">
+
<section class="container">
-
            $(document).ready(function() {
+
<div class="one-third column">
-
                if ("" == "</html>{{{1}}}<html>") {
+
-
                    $("#heading").remove();
+
<a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Tutorial/neochr" target="_blank">
-
                }
+
<img src="https://static.igem.org/mediawiki/2013/f/f9/Neochr_icon-purple.png" />
-
            });
+
        </a>
-
        </script>
+
       
-
        <script type="text/javascript">
+
<h1>NeoChromosome</h1>
-
        $(document).ready(function() {
+
<a href="https://static.igem.org/mediawiki/2013/9/9e/Tutorial-Neochr.pdf" target="_self"><h4>Download</h4></a>
-
        //       document.getElementById("p-logo").style.display= "none";
+
</div>
-
              document.getElementsByClassName("right-menu noprint")[0].style.display= "none";
+
-
//document.getElementById("searchform").style.display= "none";
+
-
            });
+
<div class="one-third column">
-
        </script>
+
 +
<a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Tutorial/nucleomod" target="_blank">
 +
<img src="https://static.igem.org/mediawiki/2013/e/e7/Nucleomod_icon-purple.png" />
 +
</a>
 +
     
 +
<h1>NucleoModifier</h1>
 +
 +
<a href="https://static.igem.org/mediawiki/2013/9/96/Tutorial-NucleoMod.pdf" target="_self"><h4>Download</h4></a>
 +
</div>
-
<link rel="stylesheet" href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/css?action=raw&ctype=text/css" type="text/css" />
 
-
<link rel="stylesheet" href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/style?action=raw&ctype=text/css" type="text/css" />
 
-
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
 
-
<!--[if lte IE 8]><link rel="stylesheet" href="http://www.humaan.com.au/wp-content/themes/humaan/css/iestyle.css"><![endif]-->
+
<div class="one-third column">
-
<!--[if IE 9]><link rel="stylesheet" href="http://www.humaan.com.au/wp-content/themes/humaan/css/ie9.css"><![endif]-->
+
-
<script type="text/javascript" src="https://2013.igem.org/Team:Shenzhen_BGIC_0101/easying?action=raw&ctype=text/javascript"></script>
+
<a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Tutorial/segmman" target="_blank">
-
<script type="text/javascript" src="//use.typekit.net/jlr8wlp.js"></script>
+
<img src="https://static.igem.org/mediawiki/2013/9/9e/Segman_icon-purple.png" />
-
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
+
</a>
 +
       
 +
<h1>Segmentation</h1>
 +
 +
<a href="https://static.igem.org/mediawiki/2013/a/a8/Tutorial-Segmentation.pdf" target="_self"><h4>Download</h4></a>
 +
        <br/><br/><br/>
 +
</div>
-
<style>
+
</section>
-
  #tabs {
 
-
    overflow: hidden;
 
-
    width: 100%;
 
-
    margin: 0;
 
-
margin-left: 25%;
 
-
    padding: 0;
 
-
    list-style: none;
 
-
font-size: 1.3em;
 
-
font-weight: 800;
+
<section class="container">
-
  }
+
<div class="one-third column">
 +
 +
<a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Tutorial/olsdesigner" target="_blank">
 +
<img src="https://static.igem.org/mediawiki/2013/e/ee/Olsdesigner.png" />
 +
</a>
-
  #tabs li {
+
<h1>OLS Designer</h1>
-
    float: left;
+
-
    margin: 0 -15px 0 0;
+
<a href="https://static.igem.org/mediawiki/2013/2/26/Tutorial-OLSDesigner.pdf" target="_self"><h4>Download</h4></a>
-
  }
+
</div>
-
  #tabs a {
+
<div class="one-third column">
-
    float: left;
+
-
    position: relative;
+
<a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Tutorial/kgml" target="_blank">
-
    padding: 0 40px;
+
<img src="https://static.igem.org/mediawiki/2013/0/02/Otherspuple.png"  />
-
    height: 0;
+
</a>
-
    line-height: 30px;
+
     
-
    text-transform: uppercase;
+
<h1>Kgml2Jason</h1>
-
    text-decoration: none;
+
-
    color: #38f;     
+
<a href="https://static.igem.org/mediawiki/2013/f/fa/Turorial-Kgml2Jason.pdf" target="_self"><h4>Download</h4></a>
-
    border-right: 30px solid transparent;
+
</div>
-
    border-bottom: 30px solid rgba(54, 49, 49, 0.71);
+
-
    border-bottom-color: #777\9;
+
-
//   opacity: .3;
+
-
    filter: alpha(opacity=30);     
+
-
  }
+
-
  #tabs a:hover,
+
        <div class="one-third column">
-
  #tabs a:focus {
+
-
    border-bottom-color: #2ac7e1;
+
<a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Tutorial/videoturorial" target="_blank">
-
    opacity: 1;
+
<img src="https://static.igem.org/mediawiki/2013/c/c1/Vedior.png" />
-
    filter: alpha(opacity=100);
+
</a>
-
  }
+
     
-
 
+
<h1>Video Tutorial</h1>
-
  #tabs a:focus {
+
-
    outline: 0;
+
-
  }
+
-
 
+
-
  #tabs #current {
+
-
    z-index: 3;
+
-
    border-bottom-color: #3d3d3d;
+
-
    opacity: 1;
+
-
    filter: alpha(opacity=100); 
+
-
  }
+
-
#tab1,#tab2,#tab3,#tab4{
+
-
font-size: 16px;
+
-
line-height: 19px;
+
-
font-family: Trebuchet MS;
+
-
font-weight: 600;
+
-
color: #ccc;
+
-
}
+
-
  /* ----------- */
+
-
  #content2 {
+
-
  background: rgba(29, 28, 28, 0.79);
+
-
      border-top: 2px solid #3d3d3d;
+
-
      padding: 2em;
+
-
      width :55%;
+
-
  margin-left: 25%;
+
-
 
+
-
  }
+
-
 
+
-
  #content2 h2,
+
-
    #content h3,
+
-
    #content p {
+
-
      margin: 0 0 15px 0;
+
-
 
+
-
  } 
+
-
 
+
-
  </style>
+
-
+
-
<script type="text/javascript">
+
-
function FloatMenu(){
+
-
var animationSpeed=1500;
+
-
var animationEasing='easeOutQuint';
+
-
var scrollAmount=$(document).scrollTop();
+
-
var newPosition=menuPosition+scrollAmount;
+
-
if($(window).height()<$('#fl_menu').height()+$('#fl_menu .menu').height()){
+
-
$('#fl_menu').css('top',menuPosition);
+
-
} else {
+
-
$('#fl_menu').stop().animate({top: newPosition}, animationSpeed, animationEasing);
+
-
}
+
-
}
+
-
$(window).load(function(){
+
-
menuPosition=$('#fl_menu').position().top;
+
-
FloatMenu();
+
-
});
+
-
$(window).scroll(function(){
+
-
FloatMenu();
+
-
});
+
-
$(document).ready(function(){
+
-
var fadeSpeed=500;
+
-
$("#fl_menu").hover(function(){
+
-
$('#fl_menu .label').fadeTo(fadeSpeed, 1);
+
-
$("#fl_menu .menu").fadeIn(fadeSpeed);
+
-
},function(){
+
-
$('#fl_menu .label').fadeTo(fadeSpeed, 0.75);
+
-
$("#fl_menu .menu").fadeOut(fadeSpeed);
+
-
});
+
-
});
+
-
</script>
+
-
<style>
+
-
 
+
-
  .container{
+
-
  width:65%;
+
-
  left: 5%;
+
-
}
+
-
/* fl_menu */
+
-
#fl_menu{position:absolute;top:150px;left:-2px;z-index:9999;
+
-
width:200px;
+
-
height:50px;
+
-
}
+
-
#fl_menu .label{line-height:50px;font-size:18px;font-weight:bold;background: #1B1B1B;color:#fff;letter-spacing:5px;text-align: center;box-shadow: 2px 1px 6px #272727;border-radius: 2px;opacity: 0.75;}
+
-
#fl_menu .label a{color:#83f;text-decoration: none;}
+
-
#fl_menu .label a:hover{color:#38f;}
+
-
 
+
-
</style>
+
-
<!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
+
-
 
+
-
 
+
-
 
+
-
<style type="text/css">.recentcomments a{display:inline !important;padding:0 !important;margin:0 !important;}</style>
+
-
 
+
-
</head>
+
-
<body class="blog developer-wanted">
+
-
<div id="fl_menu">
+
-
<div class="label"><a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Software">Overview</a></div>
+
-
<div class="label"><a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Modules">Modules</a></div>
+
-
<div class="label"><a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Next_version">Next version</a></div>
+
-
<div class="label"><a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Compatibility">Compatibility</a></div>
+
-
<div class="label"><a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/NewStandard">New Standard</a></div>
+
-
<div class="label"><a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Tutorial#">Tutorial</a></div>
+
-
<div class="label"><a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Web-based_trial">Web-based trial</a></div>
+
-
 
+
-
<div class="label"><a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Software_Assessment">Assessment</a></div>
+
-
<div class="label"><a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Downloadsl">Downloads</a></div>
+
-
 
+
-
 
+
-
</div>
+
-
<div id="wrap" style="background:url(https://static.igem.org/mediawiki/igem.org/f/fb/Backgd.jpg);">
+
-
<header class="light">
+
-
<a href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Home" id="logo">logo</a>
+
-
<nav class="menu-main-navigation-container"><a  href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Home"  class="menu-item-20 menu-item menu-item-type-post_type menu-item-object-page">Home</a> <a  href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Team"  class="menu-item-19 menu-item menu-item-type-post_type menu-item-object-page">Team</a> <a  href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Software"  class="menu-item-18 menu-item menu-item-type-post_type menu-item-object-page current-menu-item">Software</a> <a  href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/Requirements"  class="menu-item-17 menu-item menu-item-type-post_type menu-item-object-page">Requirements</a>  <a  href="https://2013.igem.org/Team:Shenzhen_BGIC_0101/HumanPractices"  class="menu-item-15 menu-item menu-item-type-post_type menu-item-object-page">Human Practices</a> </nav>
 
-
<a href="https://2013.igem.org/Main_Page" id="logo1">logo</a>
 
-
</header>
 
-
 
-
 
-
<div id="page-header" style="background: url(https://static.igem.org/mediawiki/igem.org/b/b0/Za.jpg);height: 300px;box-shadow: 4px 3px 25px #000;">
 
-
<h1></h1>
 
-
</div>
 
-
<br/>
 
-
<h2 style="font-family: 'Tangerine', serif;font-size: 48px; text-shadow: 4px 4px 4px #aaa; color: #38f;
 
-
letter-spacing: 0.1em;
 
-
word-spacing: 0.3em;
 
-
font-weight: 700;
 
-
line-height: 36px;
 
-
margin: 0;
 
-
margin-left: 20%;">Tutorial</h2><br/>
 
-
<ul id="tabs">
 
-
      <li><a href="#" name="#tab1">Neochr</a></li>
 
-
      <li><a href="#" name="#tab2">NucleoMod</a></li>
 
-
      <li><a href="#" name="#tab3">SegmMan</a></li>
 
-
         
 
-
  </ul>
 
-
  <div id="content2">
 
-
      <div id="tab1">
 
-
          <p class="tit">1. NeoChr </p>
 
-
<p>
 
-
NeoChr module would assist users to grab related genes in different pathways manually, to rewire genes’ relationship logically*, and to replace genes with ortholog that score higher*. Firstly, it would allow users to define gene order and orientation in DRAG&DROP way. Secondly, decoupled these genes if have overlap and make all genes are non-redundancy. Finally, add chromosome features to build a new chromosome and show in the JBrowse. Moreover, users can drag a window in the JBrowse and delete any gene in the window.<br/>
 
-
Note: <br/>
 
-
*These function are unavailable now, please wait for version 2.<br/>
 
-
**You can also add any thing here including your own water mark.<br/></p>
 
-
          <p class="tit">2. Plugin Scripts </p>
 
-
<p>This module contains three plugins: Decouple.pl, Add.pl and Delete.pl.</p>
 
-
<p class="tit">2.1 Decouple.pl</p>
 
-
<p>This plugin is to decouple the genes which have overlap gene regions. These overlapping genes can be decoupled if meet the following conditions: (1)If two genes have overlap gene regions, the latter gene 5’UTR does not cover the former gene initial codon (ATG); (2)Overlapping region initial coordinate is in the coding DNA sequences(CDS) of gene which is need to be decoupled; (3)The decouple site of CDS have synonymous substitute codon to replace; After decoupling, we use these non-redundancy genes to generate a GFF file and a FASTA file.</p>
 
-
<p class="tit">2.1.1 Internal operation </p>
 
-
<p>First, this plugin extracts base sequence from the genome file according to the gene order list, and records the gene order in the list. And then plugin records the annotation information according to the specie GFF file, moreover, plugin extends gene CDS upstream 600bp as 5’-UTR and downstream 100bp as 3’-UTR if the GFF file does not contain annotated these two features.<br/>
 
-
Second, this plugin detects the overlapping genes in the same chromosome. In case the overlapping genes are detected, it will judge whether the overlapping initial site is located in the CDS region, and identify the site is belong to phase0/1/2.<br/>
 
-
Third, the plugin attempts to synonymous substitute codon to break the initial codon intra the CDS. Printing information whether or not be decoupled successfully, such as:<br/>
 
-
<img src="" alt="data">
 
-
And non-redundancy genes are generated.<br/>
 
-
Finally, the plugin links non-redundancy genes to construct a new chromosome according to the gene order.
 
-
</p>
 
-
<p class="tit">2.2.1 Example</p>
 
-
<p>We have two input forms to execute the plugin:<br/>
 
-
1. Using string format as gene order list input form:<br/>
 
-
    perl GeneDecouple.pl --species saccharomyces_cerevisiae_chr --list_format string --gene_order="YAL054C -,YAL038W +,YBR019C -,YBR145W +,YCL040W +,YCR012W +,YCR105W +,YDL168W +,YPL017C -,YIL177C -,YIL177W-A +,YIL172C -,YIL171W-A +,” --geneset_dir ../gene_set --upstream_extend 600 --downstream_extend 100 --neo_chr_gff neochr.gff --neo_chr_fa neochr.fa<br/>
 
-
2. Using file format as gene order list input form:<br/>
 
-
erl GeneDecouple.pl --species saccharomyces_cerevisiae_chr --list_format file --gene_order gene_ordre.list --geneset_dir ../gene_set --upstream_extend 600 --downstream_extend 100 --neo_chr_gff neochr.gff --neo_chr_fa neochr.fa
 
-
</p>
 
-
  <p class="tit">2.1.3 Parameters </p>
 
-
<p>
 
-
<table border="1">
 
-
  <tr>
 
-
    <th>Parameter</th>
 
-
    <th>Description</th>
 
-
<th></th>
 
-
<th></th>
 
-
  </tr>
 
-
  <tr>
 
-
    <th>list_format</th>
 
-
    <th>set the input form of gene order list</th>
 
-
<th>string</th>
 
-
<th>string/file</th>
 
-
  </tr>
 
-
  <tr>
 
-
    <th>gene_order</th>
 
-
    <th>set the input gene order list file(include pathway genes and addition genes)</th>
 
-
<th></th>
 
-
<th></th>
 
-
  </tr>
 
-
  <tr>
 
-
    <th>Parameter</th>
 
-
    <th>Description</th>
 
-
<th>Default</th>
 
-
<th>Selectable range</th>
 
-
  </tr>
 
-
  <tr>
 
-
    <th>geneset_dir</th>
 
-
    <th>set the species annotation directory</th>
 
-
<th>600</th>
 
-
<th></th>
 
-
  </tr>
 
-
  <tr>
 
-
    <th>upstream_extend</th>
 
-
    <th>set the length of gene downstram(bp)</th>
 
-
<th>100</th>
 
-
<th></th>
 
-
  </tr>
 
-
  <tr>
 
-
    <th>neo_chr_gff</th>
 
-
    <th>set the name of output neochr gff file</th>
 
-
<th></th>
 
-
<th></th>
 
-
  </tr>
 
-
  <tr>
 
-
    <th>neo_chr_fa</th>
 
-
    <th>set the name of output neochr fasta file</th>
 
-
<th></th>
 
-
<th></th>
 
-
  </tr>
 
-
  <tr>
 
-
    <th>help</th>
 
-
    <th>Show help information</th>
 
-
<th></th>
 
-
<th></th>
 
-
  </tr>
 
-
</table>
 
-
</p>
 
-
    <p class="tit">2. Plugin Scripts </p>
 
-
<p>This module contains three plugins: Decouple.pl, Add.pl and Delete.pl.</p>
 
-
    <p class="tit">2. Plugin Scripts </p>
 
-
<p>This module contains three plugins: Decouple.pl, Add.pl and Delete.pl.</p>
 
-
    <p class="tit">2. Plugin Scripts </p>
 
-
<p>This module contains three plugins: Decouple.pl, Add.pl and Delete.pl.</p>
 
-
    <p class="tit">2. Plugin Scripts </p>
 
-
<p>This module contains three plugins: Decouple.pl, Add.pl and Delete.pl.</p>
 
-
   
 
-
      </div>
 
-
      <div id="tab2">
 
-
          <h2>Vivamus fringilla suscipit justo</h2>
 
-
          <p>Aenean dui nulla, egestas sit amet auctor vitae, facilisis id odio. Donec dictum gravida feugiat.</p>
 
-
          <p>Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Cras pretium elit et erat condimentum et volutpat lorem vehicula</p>
 
-
 
-
          <p>Morbi tincidunt pharetra orci commodo molestie. Praesent ut leo nec dolor tempor eleifend.</p>   
 
-
      </div>
 
-
      <div id="tab3">
 
-
          <h2>Phasellus non nibh</h2>
 
-
          <p>Non erat laoreet ullamcorper. Pellentesque magna metus, feugiat eu elementum sit amet, cursus sed diam. Curabitur posuere porttitor lorem, eu malesuada tortor faucibus sed.</p>
 
-
          <h3>Duis pulvinar nibh vel urna</h3>
 
-
          <p>Donec purus leo, porttitor eu molestie quis, porttitor sit amet ipsum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec accumsan ornare elit id imperdiet. </p>
 
-
          <p>Suspendisse ac libero mauris. Cras lacinia porttitor urna, vitae molestie libero posuere et. </p>
 
-
      </div>
 
-
 
 
-
  </div>
 
-
 
-
<script>
 
-
    function resetTabs(){
 
-
        $("#content2 > div").hide(); //Hide all content
 
-
        $("#tabs a").attr("id",""); //Reset id's     
 
-
    }
 
-
 
-
    var myUrl = window.location.href; //get URL
 
-
  var myUrlTab = myUrl.substring(myUrl.indexOf("#")); // For localhost/tabs.html#tab2, myUrlTab = #tab2   
 
-
    var myUrlTabName = myUrlTab.substring(0,4); // For the above example, myUrlTabName = #tab
 
-
 
-
    (function(){
 
-
        $("#content2 > div").hide(); // Initially hide all content
 
-
        $("#tabs li:first a").attr("id","current"); // Activate first tab
 
-
        $("#content2 > div:first").fadeIn(); // Show first tab content
 
-
       
 
-
        $("#tabs a").on("click",function(e) {
 
-
            e.preventDefault();
 
-
            if ($(this).attr("id") == "current"){ //detection for current tab
 
-
            return     
 
-
            }
 
-
            else{           
 
-
            resetTabs();
 
-
            $(this).attr("id","current"); // Activate this
 
-
            $($(this).attr('name')).fadeIn(); // Show content for current tab
 
-
            }
 
-
        });
 
-
 
-
        for (i = 1; i <= $("#tabs li").length; i++) {
 
-
          if (myUrlTab == myUrlTabName + i) {
 
-
              resetTabs();
 
-
              $("a[name='"+myUrlTab+"']").attr("id","current"); // Activate url tab
 
-
              $(myUrlTab).fadeIn(); // Show url tab content       
 
-
          }
 
-
        }
 
-
    })()
 
-
  </script>
 
-
<br/><br/><br/><br/>
 
-
<div class="push"></div>
 
-
</div><!-- wrapper -->
 
-
<footer style>
 
-
<div class="container clearfix">
 
-
<div class="seven columns" id="footer-contact">
 
-
<h3>contact us</h3>
 
-
<p>BGI-Shenzhen, Beishan Industrial Zone<br />
 
-
Yantian District, Shenzhen, 518083, China</p>
 
-
<p> <span>email:</span><br />
 
-
<a href="mailto:gongjianhui@genomics.com">gongjianhui@genomics.com</a></p>
 
-
</div>
 
-
<div class="four columns" id="footer-project">
 
-
<h3>sponsor</h3>
 
-
<p>BGIC<br/></p>
 
-
</div>
 
-
<div class="five columns" id="footer-newsletter">
 
-
<a href="https://2013.igem.org/Main_Page" ><img width="150" height="120" src="https://static.igem.org/mediawiki/2013/0/02/TB_IGEM_official_logo.png" /></a>
 
-
</div>
 
</div>
</div>
-
</footer>
+
</section>
-
 
+
<br/><br/>
-
 
+
-
<script src="https://2013.igem.org/Team:Shenzhen_BGIC_0101/aaa?action=raw&ctype=text/javascript"></script>
+
-
 
+
-
 
+
</body>
</body>
</html>
</html>

Latest revision as of 21:39, 28 October 2013