(Prototype team page) |
|||
Line 1: | Line 1: | ||
− | |||
<html> | <html> | ||
+ | <!-- ####################################################### --> | ||
+ | <!-- # This html was produced by the igemwiki generator # --> | ||
+ | <!-- # https://github.com/igemuoftATG/generator-igemwiki # --> | ||
+ | <!-- ####################################################### --> | ||
+ | <!-- repo for this wiki: https://github.com/igem-waterloo/wiki2018 --> | ||
− | <div class=" | + | </html> |
− | < | + | {{Waterloo/head}} |
− | < | + | <html> |
− | < | + | <nav class="navbar navbar-toggleable-md navbar-inverse bg-primary fixed-top"><a class="navbar-brand" href="https://2018.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"> |
− | </div> | + | <span class="navbar-toggler-icon"></span> |
+ | </button><div class="collapse navbar-collapse" id="navbarCollapse"><ul class="navbar-nav mr-auto"> | ||
+ | <li class="nav-item"><a class="nav-link" href="https://2018.igem.org/Team:Waterloo"><span>Home</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">Team<span class="caret"></span></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Team"><span>Team</span></a></li> | ||
+ | </li> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Collaborations"><span>Collaborations</span></a></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">Project<span class="caret"></span></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Contribution"><span>Contribution</span></a></li> | ||
+ | </li> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Description"><span>Description</span></a></li> | ||
+ | </li> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Design"><span>Design</span></a></li> | ||
+ | </li> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Experiments"><span>Experiments</span></a></li> | ||
+ | </li> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Proof"><span>Proof</span></a></li> | ||
+ | </li> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Demonstrate"><span>Demonstrate</span></a></li> | ||
+ | </li> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Results"><span>Results</span></a></li> | ||
+ | </li> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Notebook"><span>Notebook</span></a></li> | ||
+ | </li> | ||
+ | </ul> | ||
+ | <li class="active nav-item"><a class="nav-link" href="https://2018.igem.org/Team:Waterloo/Parts"><span>Parts</span></a></li> | ||
+ | </li> | ||
+ | <li class="nav-item"><a class="nav-link" href="https://2018.igem.org/Team:Waterloo/Safety"><span>Safety</span></a></li> | ||
+ | </li> | ||
+ | <li class="nav-item"><a class="nav-link" href="https://2018.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"> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Human_Practices"><span>Human Practices</span></a></li> | ||
+ | </li> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/HP_Silver"><span>Silver</span></a></li> | ||
+ | </li> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/HP_Gold"><span>Gold</span></a></li> | ||
+ | </li> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Integrated_Practices"><span>Integrated Practices</span></a></li> | ||
+ | </li> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Engagement"><span>Engagement</span></a></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">Awards<span class="caret"></span></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Software"><span>Software</span></a></li> | ||
+ | </li> | ||
+ | <li class=""><a class="dropdown-item" href="https://2018.igem.org/Team:Waterloo/Model"><span>Model</span></a></li> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </ul> | ||
+ | </div></nav> | ||
+ | <style> | ||
− | + | .parts{ | |
− | + | background-color:#383838; | |
− | + | padding-bottom: 20%; | |
− | + | } | |
− | + | .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; | ||
+ | } | ||
+ | .item-text{ | ||
+ | margin: 0 15vw 0 15vw; | ||
+ | } | ||
+ | .part-img{ | ||
+ | text-align: center; | ||
+ | margin: 5vh auto 1vh auto | ||
+ | } | ||
+ | .part-img img{ | ||
+ | width: 50vw; | ||
+ | } | ||
+ | a{ | ||
+ | color: white; | ||
+ | } | ||
+ | a:hover{ | ||
+ | color: white; | ||
+ | } | ||
+ | a:visited{ | ||
+ | color: white; | ||
+ | } | ||
+ | </style> | ||
+ | <div class="content"> | ||
+ | |||
+ | <div class="titleBox row" style="background: url(undefined)"> | ||
+ | <div class="layer shade"> | ||
+ | <div class="squiggle squiggleForward col-xs-4"></div> | ||
+ | <div class="titleCaption col-xs-4"> | ||
+ | <h1> | ||
+ | Parts | ||
+ | </h1> | ||
+ | </div> | ||
+ | <div class="squiggle squiggleBackward col-xs-4"></div> | ||
+ | </div> | ||
+ | </div> | ||
− | <div class=" | + | <div class="parts"> |
− | + | ||
− | < | + | <h2>Parts</h2> |
− | < | + | |
+ | <div id="inserts"> | ||
− | < | + | <div class="parts-group-wrapper"> |
− | <div class=" | + | <div class="btn-group btn-group-lg" role="group" aria-label="PSB1C3 Parts"> |
− | <a href="http://parts.igem.org/ | + | <button class="btn btn-secondary">Parts</button> |
− | + | <span class="btn-group btn-group-lg" v-for="item in psb1c3.items"> | |
− | </ | + | <button class="btn btn-primary" v-on:click="psb1c3.showing=item.id"> ^^item.title$$ </button> |
+ | </span> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div v-for="item in psb1c3.items" v-if="psb1c3.showing==item.id"> | ||
+ | |||
+ | <div class="part-img"> | ||
+ | <img v-bind:src="item.image" alt="????"> | ||
+ | </div> | ||
+ | |||
+ | <div class="item-text"> | ||
+ | <br> | ||
+ | <br> | ||
+ | <p>^^item.text$$</p> | ||
+ | <br> | ||
+ | <div class="text-center"> | ||
+ | <a v-bind:href="'http://parts.igem.org/Part:' + item.biobrick" v-if="item.biobrick" class="btn btn-outline-secondary">^^item.biobrick$$</a> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
</div> | </div> | ||
− | |||
− | |||
+ | <div class="plasmid-group"> | ||
+ | <h2>Vectors</h2> | ||
+ | <br> | ||
+ | <br> | ||
+ | <button v-on:click="show=1" class="plasmid plasmid1" > | ||
+ | PSB1C3 | ||
+ | </button> | ||
+ | <button v-on:click="show=2" class="plasmid plasmid2"> | ||
+ | PXP218 | ||
+ | </button> | ||
+ | <button v-on:click="show=3"class="plasmid plasmid3" href="216"> | ||
+ | PXP216 | ||
+ | </button> | ||
+ | </div> | ||
− | <div | + | <div v-for="plasmid in plasmids" v-if="plasmid.id == show"> |
− | <div class=" | + | <h2>^^plasmid.title$$</h2> |
− | < | + | <div class="col-md-8 col-md-offset-2"> |
− | <p> | + | <br> |
+ | <br> | ||
+ | <p>^^plasmid.text$$</p> | ||
+ | </div> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
</div> | </div> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
</div> | </div> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
</div> | </div> | ||
+ | <script src="https://unpkg.com/vue"></script> | ||
+ | <script> | ||
+ | var partsPage = new Vue({ | ||
+ | el: ".parts", | ||
+ | delimiters: ['^^', '$$'], | ||
+ | data:{ | ||
+ | show: 0, | ||
+ | plasmids: [ | ||
+ | { | ||
+ | id: 1, | ||
+ | title: "pSB1C3 (2070 bp)", | ||
+ | text: "pSB1C3 is a high-copy BioBrick assembly plasmid that is the Registry’s main backbone for the shipping and maintenance of samples. It carries chloramphenicol resistance and can be cut with standard Biobrick restriction enzymes. " | ||
+ | }, | ||
+ | { | ||
+ | id: 2, | ||
+ | title: "pXP218 (6226 bp)", | ||
+ | text: "pXP218 is a modified pUC18 plasmid backbone used as a shuttle vector for yeast expression (Fang et al., 2011). It carries pBR322 and 2µ origins of replication as well as ampicillin resistance and URA3 nutrient-deficiency for both E. coli and S. cerevisiae expression (Fang et al., 2011). For our experiments, it was cut using the SpeI and SphI restriction sites, but it has a varied multiple cloning site." | ||
+ | }, | ||
+ | { | ||
+ | id: 3, | ||
+ | title: "pXP216 (6115 bp)", | ||
+ | text: "pXP216 is a modified pUC18 plasmid backbone used as a shuttle vector for yeast expression (Fang et al., 2011). It carries pBR322 and 2µ origins of replication as well as ampicillin resistance and TRP1 nutrient-deficiency for both E. coli and S. cerevisiae expression (Fang et al., 2011). For our experiments, it was cut using the SpeI and SphI restriction sites, but it has a varied multiple cloning site." | ||
+ | }, | ||
+ | ], | ||
+ | psb1c3: { | ||
+ | parent: "PSB1C3", | ||
+ | showing:0, | ||
+ | items: [ | ||
+ | { id: 1, | ||
+ | title: "PrD", | ||
+ | image: "https://static.igem.org/mediawiki/2017/6/60/Prionpart.png", | ||
+ | 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_K2475000" | ||
+ | }, | ||
+ | {id:2, | ||
+ | title: "PrD-YFP", | ||
+ | image: "https://static.igem.org/mediawiki/2017/1/1c/CUP1_YFP.svg", | ||
+ | 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_K2475001" | ||
+ | }, | ||
+ | {id:3, | ||
+ | title: "PrD-CFP", | ||
+ | image: "https://static.igem.org/mediawiki/2017/9/9e/CUP1_CFP.svg", | ||
+ | text: "This composite part consists of the Sup35 aggregation domain fused with CFP (cyan fluorescent protein), which is a fluorescent tag with a theoreticgual 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_K2475002" | ||
+ | }, | ||
+ | {id:4, | ||
+ | title: "PrD-nYFP", | ||
+ | image: "https://static.igem.org/mediawiki/2017/f/fd/CUP1_YFP-N.svg", | ||
+ | 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_K2475003" | ||
+ | }, | ||
+ | {id:5, | ||
+ | title: "PrD-cYFP", | ||
+ | image: "https://static.igem.org/mediawiki/2017/e/e0/CUP1_YFP-C.svg", | ||
+ | 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_K2475004" | ||
+ | }, | ||
+ | { | ||
+ | id:6, | ||
+ | title: "Cup1-GFP", | ||
+ | image: "https://static.igem.org/mediawiki/2017/d/d7/GFPpart.png", | ||
+ | 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}} |
Revision as of 01:37, 13 October 2018