Difference between revisions of "Team:Waterloo/Parts"

Line 8: Line 8:
  
 
</html>
 
</html>
−
{{Waterloo/head}}
+
{{Waterloo/head}}
 
<html>
 
<html>
−
 
 
<nav class="navbar navbar-toggleable-md navbar-inverse bg-primary fixed-top"><a class="navbar-brand" href="https://2017.igem.org/Team:Waterloo">Waterloo</a><button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
 
<nav class="navbar navbar-toggleable-md navbar-inverse bg-primary fixed-top"><a class="navbar-brand" href="https://2017.igem.org/Team:Waterloo">Waterloo</a><button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
 
<span class="navbar-toggler-icon"></span>
 
<span class="navbar-toggler-icon"></span>
 
</button><div class="collapse navbar-collapse" id="navbarCollapse"><ul class="navbar-nav mr-auto">
 
</button><div class="collapse navbar-collapse" id="navbarCollapse"><ul class="navbar-nav mr-auto">
−
<li class="nav-item"><a class="nav-link" href="https://2017.igem.org/Team:Waterloo"><span>home</span></a></li>
+
<li class="nav-item"><a class="nav-link" href="https://2017.igem.org/Team:Waterloo"><span>Home</span></a></li>
 
</li>
 
</li>
−
<li class="dropdown nav-item"><a href="#" class="nav-link dropdown-toggle nav-link" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">team<span class="caret"></span></a>
+
<li class="dropdown nav-item"><a href="#" class="nav-link dropdown-toggle nav-link" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Team<span class="caret"></span></a>
 
<ul class="dropdown-menu">
 
<ul class="dropdown-menu">
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Team"><span>team</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Team"><span>Team</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Collaborations"><span>collaborations</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Collaborations"><span>Collaborations</span></a></li>
 
</li>
 
</li>
 
</ul>
 
</ul>
−
<li class="dropdown nav-item"><a href="#" class="nav-link dropdown-toggle nav-link" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">project<span class="caret"></span></a>
+
<li class="dropdown nav-item"><a href="#" class="nav-link dropdown-toggle nav-link" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Project<span class="caret"></span></a>
 
<ul class="dropdown-menu">
 
<ul class="dropdown-menu">
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Description"><span>description</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Description"><span>Description</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Design"><span>design</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Design"><span>Design</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Experiments"><span>experiments</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Experiments"><span>Experiments</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Proof"><span>proof</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Proof"><span>Proof</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Demonstrate"><span>demonstrate</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Demonstrate"><span>Demonstrate</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Results"><span>results</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Results"><span>Results</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Notebook"><span>notebook</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Notebook"><span>Notebook</span></a></li>
 
</li>
 
</li>
 
</ul>
 
</ul>
−
<li class="active dropdown nav-item"><a href="#" class="nav-link dropdown-toggle nav-link" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">parts<span class="caret"></span></a>
+
<li class="active nav-item"><a class="nav-link" href="https://2017.igem.org/Team:Waterloo/Parts"><span>Parts</span></a></li>
−
<ul class="dropdown-menu">
+
−
<li class="active"><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Parts"><span>parts</span></a></li>
+
−
</li>
+
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Basic_Part"><span>basic_part</span></a></li>
+
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Composite_Part"><span>composite_part</span></a></li>
+
<li class="nav-item"><a class="nav-link" href="https://2017.igem.org/Team:Waterloo/Safety"><span>Safety</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Part_Collection"><span>part_collection</span></a></li>
+
<li class="nav-item"><a class="nav-link" href="https://2017.igem.org/Team:Waterloo/Attributions"><span>Attributions</span></a></li>
 
</li>
 
</li>
−
</ul>
+
<li class="dropdown nav-item"><a href="#" class="nav-link dropdown-toggle nav-link" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Human Practices<span class="caret"></span></a>
−
<li class="nav-item"><a class="nav-link" href="https://2017.igem.org/Team:Waterloo/Safety"><span>safety</span></a></li>
+
−
</li>
+
−
<li class="nav-item"><a class="nav-link" href="https://2017.igem.org/Team:Waterloo/Attributions"><span>attributions</span></a></li>
+
−
</li>
+
−
<li class="dropdown nav-item"><a href="#" class="nav-link dropdown-toggle nav-link" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">human_practices<span class="caret"></span></a>
+
 
<ul class="dropdown-menu">
 
<ul class="dropdown-menu">
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Human_Practices"><span>human_practices</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Human_Practices"><span>Human Practices</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/HP-Silver"><span>silver</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/HP-Silver"><span>Silver</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/HP-Gold"><span>gold</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/HP-Gold"><span>Gold</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Integrated_Practices"><span>integrated_practices</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Integrated_Practices"><span>Integrated Practices</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Engagement"><span>engagement</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Engagement"><span>Engagement</span></a></li>
 +
</li>
 +
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Snake35"><span>Snake35</span></a></li>
 
</li>
 
</li>
 
</ul>
 
</ul>
−
<li class="dropdown nav-item"><a href="#" class="nav-link dropdown-toggle nav-link" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">awards<span class="caret"></span></a>
+
<li class="dropdown nav-item"><a href="#" class="nav-link dropdown-toggle nav-link" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Awards<span class="caret"></span></a>
 
<ul class="dropdown-menu">
 
<ul class="dropdown-menu">
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Entrepreneurship"><span>entrepreneurship</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Entrepreneurship"><span>Entrepreneurship</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Hardware"><span>hardware</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Hardware"><span>Hardware</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Software"><span>software</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Software"><span>Software</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Measurement"><span>measurement</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Measurement"><span>Measurement</span></a></li>
 
</li>
 
</li>
−
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Model"><span>model</span></a></li>
+
<li class=""><a class="dropdown-item" href="https://2017.igem.org/Team:Waterloo/Model"><span>Model</span></a></li>
 
</li>
 
</li>
 
</ul>
 
</ul>
 
</ul>
 
</ul>
 
</div></nav>
 
</div></nav>
 +
<style>
 +
 +
.parts{
 +
  background-color:#383838;
 +
  padding: 5%;
 +
}
 +
.plasmid-group{
 +
  margin: 5%;
 +
  text-align:center;
 +
}
 +
.plasmid{
 +
    cursor:pointer;
 +
    margin: 0vw 1vw 0vw 1vw;
 +
    color:#EFEFEF;
 +
    padding: 0 0 0 0;
 +
    background-color: transparent;
 +
    width:15vw;
 +
    height:15vw;
 +
    border-radius: 50%;
 +
    border: 5px solid
 +
    }
 +
.plasmid:hover{
 +
  border-width: 10px;
 +
  font-weight: bold;
 +
}
 +
.plasmid1{
 +
  border-color: #E7E87E;
 +
}
 +
.plasmid2{
 +
    border-color: #B2DF83;
 +
    }
 +
.plasmid3{
 +
    border-color: #00B2A7;
 +
  }
 +
 +
.tips{
 +
  border: 3px solid #00B2A7;
 +
  color: #00B2A7;
 +
  padding: 1vw;
 +
  width: 10vw;
 +
  border-radius: 5%;
 +
  text-align: center;
 +
}
 +
.parts-group-wrapper{
 +
  text-align:center;
 +
  width: 100%;
 +
}
 +
.parts-group-wrapper .btn-primary{
 +
  background-color: #4DC39C;
 +
  border-color: #4DC39C;
 +
  cursor:pointer;
 +
}
 +
 +
 +
.part-img{
 +
  margin: 2vw;
 +
    background-color: white;
 +
    width: 20vw;
 +
    height:20vw;
 +
    opacity: .5;
 +
}
 +
.part-img img{
 +
    width: 20vw;
 +
    height: 20vw;
 +
}
 +
</style>
 
<div class="content">
 
<div class="content">
−
<div class="content" id="content-main"><div class="row"><div class="col"><div class="content-main"><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>
+
<div class="parts">
−
<h5 id="note">Note</h5>
+
 
−
<p>Note that parts must be documented on the <a href="http://parts.igem.org/Main_Page">Registry</a>. This page serves to <em>showcase</em> 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>
+
  <h1> Parts Page</h1>
−
<h5 id="adding-parts-to-the-registry">Adding parts to the registry</h5>
+
  <hr>
−
<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>
+
<div class="plasmid-group">
−
<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&#39;t need to send us the DNA sample before you create an entry for a part on the Registry. (However, you <strong>do</strong> need to send us the DNA sample before the Jamboree. If you don&#39;t send us a DNA sample of a part, that part will not be eligible for awards and medal criteria.)</p>
+
  <h2>Vectors</h2>
−
<h5 id="what-information-do-i-need-to-start-putting-my-parts-on-the-registry-">What information do I need to start putting my parts on the Registry?</h5>
+
  <br>
−
<p>The information needed to initially create a part on the Registry is:</p>
+
  <br>
−
<ul>
+
  <button v-on:click="show=1" class="plasmid plasmid1" >
−
<li>Part Name</li>
+
    PSB1C3
−
<li>Part type</li>
+
  </button>
−
<li>Creator</li>
+
  <button v-on:click="show=2" class="plasmid plasmid2">
−
<li>Sequence</li>
+
    PXP218
−
<li>Short Description (60 characters on what the DNA does)</li>
+
  </button>
−
<li>Long Description (Longer description of what the DNA does)</li>
+
  <button v-on:click="show=3"class="plasmid plasmid3" href="216">
−
<li>Design considerations</li>
+
  PXP216
−
</ul>
+
  </button>
−
<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>
−
<h5 id="inspiration">Inspiration</h5>
+
 
−
<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>
+
  <h2>Inserts</h2>
−
<p>You can also take a look at how other teams have documented their parts in their wiki:</p>
+
 
−
<ul>
+
<div id="inserts">
−
<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>
+
  <div class="parts-group-wrapper">
−
<li><a href="https://2014.igem.org/Team:Tokyo_Tech/Parts">2014 Tokyo Tech</a></li>
+
    <div class="btn-group btn-group-lg" role="group" aria-label="PSB1C3 Parts">
−
</ul>
+
      <button class="btn btn-secondary">Parts</button>
−
<h5 id="part-table">Part Table</h5>
+
  <span class="btn-group btn-group-lg" v-for="item in psb1c3.items">
−
</div></div></div></div>
+
      <button class="btn btn-primary" v-on:click="psb1c3.showing=item.id"> ^^item.title$$  </button>
 +
        </span>  
 +
    </div>
 +
  </div>
 +
 
 +
  <div class="row" v-for="item in psb1c3.items" v-if="psb1c3.showing==item.id">
 +
    <div class="col-md-2"></div>
 +
     
 +
    <div class="col-md-3">
 +
      <div class="part-img">
 +
        <img v-bind:src="item.image" alt="">
 +
         
 +
        </div>
 +
    </div>
 +
     
 +
    <div class="col-md-5">
 +
      <br>
 +
      <br>
 +
      <p>^^item.text$$</p>
 +
      <button v-if="item.biobrick" class="btn btn-primary btn-block">^^item.biobrick$$</button>
 +
    </div>
 +
 +
  </div>
 
</div>
 
</div>
 +
</div>
 +
</div>
 +
<script src="https://unpkg.com/vue"></script>
 +
<script>
 +
var partsPage = new Vue({
 +
  el: ".parts",
 +
  delimiters: ['^^', '$$'],
 +
  data:{
 +
    show: 0,
 +
    psb1c3: {
 +
    parent: "PSB1C3",
 +
    showing:1,
 +
    test: "message",
 +
    items: [
 +
      { id: 1,
 +
        title: "PrD",
 +
      image: "https://www.w3schools.com/css/img_fjords.jpg",
 +
      text: "The aggregation domain is obtained from Saccharomyces cerevisiae Sup35 protein, a translational release factor,  consisting of the N-terminal domain (amino acids 1-123) and a portion of the middle domain (amino acids 124-137). When fused to other proteins, it gives them prion-like properties.This was used in several composite parts to test whether it is possible to increase the function and/or activity of proteins by addition of an aggregation domain.",
 +
      biobrick:"BBa_K4750000"
 +
      },
 +
      {id:2,
 +
      title: "PrD-YFP",
 +
      image: "",
 +
      text: "This composite part consists of the Sup35 aggregation domain fused with yellow fluorescent protein (YFP), which is a fluorescent tag with a theoretical excitation peak at 514 nm and emission peak at 535 nm. This was used, in conjunction with PrD-CFP, in Förster resonance energy transfer (FRET) experiments test if/how the aggregation domain affects the energy transfer from CFP to YFP  expression in aggregate state  (PSI+) and soluble state (PSI-). This part is under control of the Cup1 promoter and CYC1 terminator. Its expression can be modulated by the amount of copper added to the system.",
 +
      biobrick:"BBa_K4750001"
 +
      },
 +
      {id:3,
 +
      title: "PrD-CFP",
 +
      image: "",
 +
      text: "This composite part consists of the Sup35 aggregation domain fused with CFP (cyan fluorescent protein), which is a fluorescent tag with a theoretical excitation peak at 430 nm and emission peak at 485 nm. This was used, in conjunction with PrD-YFP, in Förster resonance energy transfer (FRET)  experiments  to  test if/how the aggregation domain affects the energy transfer from CFP to YFP in PSI+ (aggregate state) and psi- (soluble state). This part is under control of the Cup1 promoter and CYC1 terminator. Its expression can be modulated by the amount of copper added to the system.  ",
 +
      biobrick:"BBa_K4750002"
 +
      },
 +
      {id:4,
 +
      title: "PrD-nYFP",
 +
      image: "",
 +
      text: "This composite part consists of the Sup35 prion domain fused with the n-terminal fragment of the YFP complex. It does not exhibit fluorescence by itself, and must associate with the c-terminal fragment in order for fluorescence to be expressed. This was used, in conjunction with PrD-cYFP, in flow cytometry experiments to test if the aggregation domains encourage joining of the two protein halves and increases YFP expression.This part is under control of the Cup1 promoter and CYC1 terminator. Its expression can be modulated by the amount of copper added to the system.  (Include link to other part for the registry)",
 +
      biobrick:"BBa_K4750003"
 +
      },
 +
      {id:5,
 +
      title: "PrD-cYFP",
 +
      image: "",
 +
      text: "This composite part consists of the Sup35 prion domain fused with the c-terminal fragment of the YFP complex. It does not exhibit fluorescence by itself, and must associate with the n-terminal fragment in order for fluorescence to be expressed. This was used, in conjunction with PrD-nYFP, in flow cytometry experiments to test if the aggregation domains encourage joining of the two protein halves and increases YFP expression. This part is under control of the Cup1 promoter and CYC1 terminator. Its expression can be modulated by the amount of copper added to the system.  ",
 +
      biobrick:"BBa_K4750004"
 +
      },
 +
      {
 +
        id:6,
 +
        title: "Cup1-GFP",
 +
        image: "",
 +
        text: "This part is a transcriptional fusion used to test the effectiveness of the Cup1 Promoter under different conditions of copper. It was developed by the 2016 Waterloo iGEM team, and further characterized for the bronze medal requirement by the 2017 iGEM team.",
 +
        biobrick:"BBa_K2137001"
 +
      }
 +
    ]
 +
  },
 +
  },
 +
});
 +
 +
</script>
 
</html>
 
</html>
 
{{Waterloo/footer}}
 
{{Waterloo/footer}}

Revision as of 00:53, 30 October 2017

Parts Page

Vectors



Inserts



^^item.text$$

Waterloo iGEM 2017

© 2017 Waterloo iGEM