Difference between revisions of "Team:NCTU Formosa/Parts"

(Prototype team page)
 
 
(48 intermediate revisions by 3 users not shown)
Line 1: Line 1:
−
{{NCTU_Formosa}}
+
{{Team:NCTU_Formosa}}
 
<html>
 
<html>
 +
<head>
 +
<meta charset="UTF-8">
  
 +
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
 +
<link href="https://2016.igem.org/Team:NCTU_Formosa/wiki_reset?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400" rel="stylesheet">
  
  
 +
<style type="text/css">
 +
#sideMenu, #top_title {display:none;}
 +
#content { padding:0px; width:100%; margin-top:-7px; margin-left:0px;}
 +
body {background-color:white; }
 +
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 +
#top_menu_inside {margin-left: 20px; margin-bottom: 0px;}
  
  
 +
html, body, div, span, applet, object, iframe,
 +
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
 +
a, abbr, acronym, address, big, cite, code,
 +
del, dfn, em, font, img, ins, kbd, q, s, samp,
 +
small, strike, strong, sub, tt, var,
 +
b, u, i, center,
 +
dl, dt, dd, ol, ul, li,
 +
fieldset, form, label, legend,
 +
table, caption, tbody, tfoot, thead, tr, th, td {
 +
    margin: 0;
 +
    padding: 0;
 +
    border: 0;
 +
    outline: 0;
 +
    vertical-align: baseline;
 +
    background: transparent;
 +
}
  
−
<div class="column full_size">
+
p{
 +
  font-family: 'Open Sans', sans-serif;
 +
    font-weight: 300;
 +
}
 +
body{
 +
    background-color:rgb(51,51,51) !important;
 +
    line-height:1;
 +
}
  
 +
table {
 +
    border-collapse: collapse;
 +
    border-spacing: 0;
 +
}
 +
/*大圖*/
 +
@media screen and (min-width: 768px) {
 +
  .img-container{
 +
    height:100vh ;
 +
    overflow:hidden ;
 +
    width:100%;
 +
  }
 +
  .main-img{
 +
    top: 0;
 +
    bottom: 0;
 +
    left: 0;
 +
    right: 0;
 +
    width: 100%;
 +
    margin: auto;
 +
    z-index:999;
 +
    }
 +
}
 +
@media screen and (orientation: portrait) {
 +
    .img-container{
 +
        height:auto;
 +
        overflow:none;
 +
        width:100%;
 +
    }
 +
    .main-img{
 +
        top: 0;
 +
        bottom: 0;
 +
        left: 0;
 +
        right: 0;
 +
        width: 100%;
 +
        margin: auto;
 +
        z-index:999;
 +
    }
 +
}
  
−
<p>Each team will make new parts during iGEM and will submit them to the Registry of Standard Biological Parts. The iGEM software provides an easy way to present the parts your team has created. The <code>&lt;groupparts&gt;</code> tag (see below) will generate a table with all of the parts that your team adds to your team sandbox.</p>
 
−
<p>Remember that the goal of proper part documentation is to describe and define a part, so that it can be used without needing to refer to the primary literature. Registry users in future years should be able to read your documentation and be able to use the part successfully. Also, you should provide proper references to acknowledge previous authors and to provide for users who wish to know more.</p>
 
  
 +
/*content*/
 +
.content_container{
 +
    position:relative;
 +
    left:5vw;
 +
    right:5vw;
 +
    margin:0 auto;
 +
    width:60vw;
 +
    height:auto;
  
−
</div>
+
}
 +
.title{
 +
    font-size:25pt !important;
 +
    text-shadow:1px 1px 10px rgb(0, 206, 255);
 +
    border-left:3px solid rgb(0, 206, 255);
 +
    padding-left:10px !important;
 +
    color:rgb(0, 206, 255);
 +
    margin-top:20px;
 +
    margin-bottom:10px;
 +
}
 +
.content{
 +
    font-size:15pt !important;
 +
    text-align:justify;
 +
    text-indent:2em;
 +
    color:#F3F7F7;
 +
    padding-top:15px;
 +
    padding-bottom:15px;
 +
}
 +
/*second title*/
 +
.content-1{
 +
    font-size:19pt !important;
 +
    text-align:justify;
 +
    color:#F3F7F7;
 +
    font-weight: bold !important;
 +
    padding-top:30px;
 +
    padding-bottom:10px
 +
}
  
 +
.content-image{
 +
    color:#F3F7F7 !important;
 +
    font-size:11pt !important;
 +
    padding-top:5px;
 +
    padding-bottom:20px;
 +
    width:50vw;
 +
    margin:auto;
 +
    padding-left:60px;
 +
}
  
 +
.appear{
 +
    display:none;
 +
   
 +
}
 +
.list{
 +
    font-size:15pt !important;
 +
    text-align:justify;
 +
    color:#F3F7F7;
 +
}
 +
.quote{
 +
    font-size:17pt !important;
 +
    text-align:justify;
 +
    color:#F3F7F7;
 +
    text-indent:2em !important;
 +
   
 +
}
  
  
 +
/*image*/
 +
.web{
 +
    position:fixed !important;
 +
    left:0%;
 +
    bottom:0%;
 +
    display:block;
 +
    margin: auto;
 +
}
 +
.right{
 +
    position:fixed !important;
 +
    bottom:-15px;
 +
    right:0vw;
 +
    margin: auto;
 +
}
  
−
<div class="column half_size">
+
.img-position{
−
<div class="highlight">
+
    position:absolute;
−
<h5>Note</h5>
+
    z-index:-1;
−
<p>Note that parts must be documented on the <a href="http://parts.igem.org/Main_Page"> Registry</a>. This page serves to <i>showcase</i> the parts you have made. Future teams and other users and are much more likely to find parts by looking in the Registry than by looking at your team wiki.</p>
+
}
−
</div>
+
.box{
−
</div>
+
    width:auto;
 +
    padding-top:20px;
 +
    padding-bottom:20px;
 +
}
 +
.picture{
 +
    position:relative;
 +
    left:8vw;
 +
    width:80%;
 +
    padding-bottom:10px;
 +
}
  
 +
.picture-1{
 +
    position:relative;
 +
    left:17vw;
 +
    width:50%;
 +
    padding-bottom:10px;
 +
}
  
 +
#groupparts{
 +
margin-left:26vw;
 +
}
 +
</style>
 +
</head>
 +
<body>
  
 +
<!--圖片-->
 +
  <div class="img-container">
 +
        <img src="https://static.igem.org/mediawiki/2016/7/75/NCTU_PARTS_BIG_PICTURE.png" class="main-img" width="100%">
 +
  </div>
  
−
<div class="column half_size">
 
  
−
<h5>Adding parts to the registry</h5>
+
<!------------wiki content------------->
−
<p>You can add parts to the Registry at our <a href="http://parts.igem.org/Add_a_Part_to_the_Registry">Add a Part to the Registry</a> link.</p>
+
 
−
<p>We encourage teams to start completing documentation for their parts on the Registry as soon as you have it available. The sooner you put up your parts, the better you will remember all the details about your parts. Remember, you don't need to send us the DNA sample before you create an entry for a part on the Registry. (However, you <b>do</b> need to send us the DNA sample before the Jamboree. If you don't send us a DNA sample of a part, that part will not be eligible for awards and medal criteria.)</p>
+
<section class="content_container">
 +
  <div>
 +
    <p class="title">Biobrick design<p>
 +
 
 +
    <p class="content">Our goal is to produce a new bio-repellent of insects, PANTIDE, which is successfully an alternative for chemical pesticide. We strive to express PANTIDE that can be used to reduce appetite of the major pests in the farmland. So far, we have already designed two types of BioBricks that three spider toxic peptides are included with and without lectin respectively. We can then do several experiments to test the function of BioBricks and prove that PANTIDE truly works.</p>
 +
 
 +
    <p class="content">We submitted a collection of spider toxins, lectin, and GS linker as basic parts, and the composite parts with T7 promoter and RBS. All in all we have provided twelve new BioBricks to the Registry in total this year. All BioBricks were sequence-confirmed. Our parts are presented in table view at our Registry summary page.(table 1)</p>
 
</div>
 
</div>
 +
</section>
 +
</body>
 +
</html>
  
 +
<groupparts>iGEM2016 NCTU_Formosa</groupparts>
 +
<p class="content-image" style="text-align:center !important;">Table 1. Registry of Standard Biological Parts</p>
  
 +
<html>
 +
  <section class="content_container">
 +
  <div> 
 +
    <p class="content">* Note: The relevant literature information for each part, including their full characterization data can be found at their respective pages in the Registry of Standard Biological Parts.</p>
 +
    <p class="content">* Note: In the composite parts, each of our toxic peptides contains a hexahistidine tag-coding sequence fused at its downstream to facilitate PANTIDE detection and purification.</p>
 +
  </div>
  
  
 +
   
  
−
<div class="column half_size">
+
</section>
  
−
<h5>What information do I need to start putting my parts on the Registry?</h5>
 
−
<p>The information needed to initially create a part on the Registry is:</p>
 
−
<ul>
 
−
<li>Part Name</li>
 
−
<li>Part type</li>
 
−
<li>Creator</li>
 
−
<li>Sequence</li>
 
−
<li>Short Description (60 characters on what the DNA does)</li>
 
−
<li>Long Description (Longer description of what the DNA does)</li>
 
−
<li>Design considerations</li>
 
−
</ul>
 
  
−
<p>
 
−
We encourage you to put up <em>much more</em> information as you gather it over the summer. If you have images, plots, characterization data and other information, please also put it up on the part page. </p>
 
  
−
</div>
+
<!--JS-->
  
 +
<script>
  
−
<div class="column half_size">
+
var $document = $( document.body );
 +
var $revealBar = $( '.red-container' );
 +
var wrapperHeight = $document.height();
 +
var stepDistance = 101;
 +
var documentHeight = window.innerHeight;
 +
var positions = [];
 +
var heights = [];
 +
var elements = $( '.title' );
  
−
<h5>Inspiration</h5>
+
// Cache heights and positions
−
<p>We have a created  a <a href="http://parts.igem.org/Well_Documented_Parts">collection of well documented parts</a> that can help you get started.</p>
+
for( var i = 0; i < elements.length; i++ ) {
 +
  var $element = $(elements[i]);
 +
  var height = $element.offset().top + documentHeight;
 +
  if (height > wrapperHeight) {
 +
    height = wrapperHeight;
 +
  }
 +
  positions.push(height);
 +
  heights.push($element.height());
 +
}
  
−
<p> You can also take a look at how other teams have documented their parts in their wiki:</p>
+
var $nodes = $( '.node' );
−
<ul>
+
−
<li><a href="https://2014.igem.org/Team:MIT/Parts"> 2014 MIT </a></li>
+
−
<li><a href="https://2014.igem.org/Team:Heidelberg/Parts"> 2014 Heidelberg</a></li>
+
−
<li><a href="https://2014.igem.org/Team:Tokyo_Tech/Parts">2014 Tokyo Tech</a></li>
+
−
</ul>
+
−
</div>
+
  
−
<div class="column full_size">
+
// Should totally be debounced /w animation frame. I know,
−
<h5>Part Table </h5>
+
// this whole thing is slightly inefficient.
−
<div class="highlight">
+
// And magic numbers too!
 +
$( document ).scroll( function() {
 +
 
 +
  nodeTop = $document.scrollTop() + documentHeight + 1;
 +
  var current = 0;
 +
 
 +
  // Active/non active states
 +
  for( var i = 0; i < positions.length; i++ ) {
 +
    if(nodeTop >= positions[i]-70) {
 +
      current = i;
 +
      $nodes.eq( i ).addClass( 'active' );
 +
    } else {
 +
      $nodes.eq( i ).removeClass( 'active' );
 +
    }
 +
  }
 +
 
 +
 
 +
  if ( current < elements.length ) {
 +
    var nextStep = (nodeTop - positions[current]) / (positions[current + 1] - positions[current]);
 +
    var totalWidth = ( current * stepDistance ) + (nextStep * stepDistance);
 +
$revealBar.height( totalWidth+10 );
 +
  }
 +
 
 +
})
 +
 
 +
// Clicking the nodes... again, nothing special ;)
 +
$nodes.each( function( index ) {
 +
  var $node = $( this );
 +
  $node.click( function() {
 +
    $('html, body').animate({ scrollTop: (positions[ index ] - documentHeight)-70}, 1000 );
 +
  });
 +
})
 +
//scroll_relocate
 +
function sticky_relocate() {
 +
    var window_top = $(window).scrollTop();
 +
    var div_top = $('.main-img').offset().top;;
 +
    if (window_top > div_top+500) {
 +
        $('#scroll').removeClass('appear');
 +
    } else {
 +
        $('#scroll').addClass('appear');
 +
    };
 +
    if(window_top > div_top+420) {
 +
        $('#web').fadeIn(200);
 +
        $('#right').fadeIn(200);
 +
    } else {
 +
        $('#web').fadeOut(200);
 +
        $('#right').fadeOut(200);
 +
    }
 +
}
 +
 
 +
$(function () {
 +
    $(window).scroll(sticky_relocate);
 +
    sticky_relocate();
 +
});
  
  
−
</html>
 
−
<groupparts>iGEM2016 Example</groupparts>
 
−
<html>
 
−
</div>
 
−
</div>
 
  
 +
$(document).ready(function(
  
 +
){})
  
  
 +
</script>
 +
</body>
 
</html>
 
</html>
 +
{{Team:NCTU_Formosa/footer}}

Latest revision as of 13:31, 14 November 2016

Biobrick design

Our goal is to produce a new bio-repellent of insects, PANTIDE, which is successfully an alternative for chemical pesticide. We strive to express PANTIDE that can be used to reduce appetite of the major pests in the farmland. So far, we have already designed two types of BioBricks that three spider toxic peptides are included with and without lectin respectively. We can then do several experiments to test the function of BioBricks and prove that PANTIDE truly works.

We submitted a collection of spider toxins, lectin, and GS linker as basic parts, and the composite parts with T7 promoter and RBS. All in all we have provided twelve new BioBricks to the Registry in total this year. All BioBricks were sequence-confirmed. Our parts are presented in table view at our Registry summary page.(table 1)

<groupparts>iGEM2016 NCTU_Formosa</groupparts>

Table 1. Registry of Standard Biological Parts

* Note: The relevant literature information for each part, including their full characterization data can be found at their respective pages in the Registry of Standard Biological Parts.

* Note: In the composite parts, each of our toxic peptides contains a hexahistidine tag-coding sequence fused at its downstream to facilitate PANTIDE detection and purification.