|
|
(29 intermediate revisions not shown) |
Line 6: |
Line 6: |
| {{:Team:Heidelberg/Templates/IncludeJS|:Team:Heidelberg/js/bootstrapjs}} | | {{:Team:Heidelberg/Templates/IncludeJS|:Team:Heidelberg/js/bootstrapjs}} |
| {{:Team:Heidelberg/Templates/IncludeJS|:Team:Heidelberg/js/wikipage}} | | {{:Team:Heidelberg/Templates/IncludeJS|:Team:Heidelberg/js/wikipage}} |
- | {{:Team:Heidelberg/Templates/IncludeJS|:Team:Heidelberg/js/scrollTo}}
| |
- |
| |
| <html> | | <html> |
- | <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/knockout/3.1.0/knockout-min.js"></script>
| |
| <style type="text/css"> | | <style type="text/css"> |
| #myContainer { | | #myContainer { |
Line 50: |
Line 47: |
| -moz-transition:-moz-transform 0.15s ease; | | -moz-transition:-moz-transform 0.15s ease; |
| -o-transition:-o-transform 0.15s ease; | | -o-transition:-o-transform 0.15s ease; |
- | }
| |
- |
| |
- | .panel.panel-default {
| |
- | border: solid 2px #de4230;
| |
- | font-size: 1.2em;
| |
- | background-color: rgb(81,81,81);
| |
- | background-color: rgba(81,81,81,0.7);
| |
- | margin-bottom: 40px;
| |
| } | | } |
| | | |
Line 78: |
Line 67: |
| <div class="col-lg-12"> | | <div class="col-lg-12"> |
| <span class="middle">use the <span class="red-text">intein</span></span> | | <span class="middle">use the <span class="red-text">intein</span></span> |
- | </div> | + | </div> |
| </div> | | </div> |
| <div class="row"> | | <div class="row"> |
| <div class="col-lg-12" style="position: relative; top: -20px;"> | | <div class="col-lg-12" style="position: relative; top: -20px;"> |
| <span class="large">TOOLBOX </span><span class="middle" >to</span> | | <span class="large">TOOLBOX </span><span class="middle" >to</span> |
- | </div> | + | </div> |
| </div> | | </div> |
| <div class="row toolbox-icons-bar"> | | <div class="row toolbox-icons-bar"> |
| <div class="col-lg-2 col-lg-offset-1 col-md-offset-1 col-md-2 col-sm-4 col-xs-6"> | | <div class="col-lg-2 col-lg-offset-1 col-md-offset-1 col-md-2 col-sm-4 col-xs-6"> |
- | <a href="https://2014.igem.org/Team:Heidelberg/Toolbox/Circularization"><span class="col-lg-offset-3 col-lg-6 col-md-offset-2 col-md-8 col-sm-12 nopadding nofloat"><img src="/wiki/images/5/58/Heidelberg_Toolbox_Circularization.png" class="img-responsive" /></span>CIRCULARIZE</a> | + | <a href="https://2014.igem.org/Team:Heidelberg/Toolbox_Guide/Circularization"><span class="col-lg-offset-3 col-lg-6 col-md-offset-2 col-md-8 col-sm-12 nopadding nofloat"><img src="/wiki/images/5/58/Heidelberg_Toolbox_Circularization.png" class="img-responsive" /></span>CIRCULARIZE</a> |
| </div> | | </div> |
| <div class="col-lg-2 col-md-2 col-sm-4 col-xs-6"> | | <div class="col-lg-2 col-md-2 col-sm-4 col-xs-6"> |
- | <a href="https://2014.igem.org/Team:Heidelberg/Toolbox/Oligomerization"><span class="col-lg-offset-3 col-lg-6 col-md-offset-2 col-md-8 col-sm-12 nopadding nofloat"><img src="/wiki/images/4/40/Oligomerization.png" class="img-responsive" /></span>OLIGOMERIZE</a> | + | <a href="https://2014.igem.org/Team:Heidelberg/Toolbox_Guide/Localization"><span class="col-lg-offset-3 col-lg-6 col-md-offset-2 col-md-8 col-sm-12 nopadding nofloat"><img src="/wiki/images/3/3a/Heidelberg_Localize_button.png" class="img-responsive" /></span>LOCALIZE</a> |
| </div> | | </div> |
| <div class="col-lg-2 col-md-2 col-sm-4 col-xs-6"> | | <div class="col-lg-2 col-md-2 col-sm-4 col-xs-6"> |
- | <a href="https://2014.igem.org/Team:Heidelberg/Toolbox/Fusion"><span class="col-lg-offset-3 col-lg-6 col-md-offset-2 col-md-8 col-sm-12 nopadding nofloat"><img src="/wiki/images/8/87/Heidelberg_Toolbox_Fusion.png" class="img-responsive" /></span>FUSE & TAG</a> | + | <a href="https://2014.igem.org/Team:Heidelberg/Toolbox_Guide/Fusion"><span class="col-lg-offset-3 col-lg-6 col-md-offset-2 col-md-8 col-sm-12 nopadding nofloat"><img src="/wiki/images/8/87/Heidelberg_Toolbox_Fusion.png" class="img-responsive" /></span>ATTACH</a> |
| </div> | | </div> |
| <div class="col-lg-2 col-md-2 col-sm-4 col-xs-6"> | | <div class="col-lg-2 col-md-2 col-sm-4 col-xs-6"> |
- | <a href="https://2014.igem.org/Team:Heidelberg/Toolbox/Purification"><span class="col-lg-offset-3 col-lg-6 col-md-offset-2 col-md-8 col-sm-12 nopadding nofloat"><img src="/wiki/images/0/04/Heidelberg_Toolbox_Purification.png" class="img-responsive" /></span>PURIFY</a> | + | <a href="https://2014.igem.org/Team:Heidelberg/Toolbox_Guide/Purification"><span class="col-lg-offset-3 col-lg-6 col-md-offset-2 col-md-8 col-sm-12 nopadding nofloat"><img src="/wiki/images/0/04/Heidelberg_Toolbox_Purification.png" class="img-responsive" /></span>PURIFY</a> |
- | </div>
| + | |
- | <div class="col-lg-2 col-md-2 col-sm-4 col-xs-6">
| + | |
- | <a href="https://2014.igem.org/Team:Heidelberg/Toolbox/OnOff"><span class="col-lg-offset-3 col-lg-6 col-md-offset-2 col-md-8 col-sm-12 nopadding nofloat"><img src="/wiki/images/c/c2/Heidelberg_Toolbox_On-Off.png" class="img-responsive" /></span>ACTIVATE &<br />DEACTIVATE</a>
| + | |
| </div> | | </div> |
- | </div>
| + | <!--<div class="col-lg-2 col-md-2 col-sm-4 col-xs-6"> |
- | <div class="col-lg-12" style="color:white;"> | + | <a href="https://2014.igem.org/Team:Heidelberg/Toolbox_Guide/OnOff"><span class="col-lg-offset-3 col-lg-6 col-md-offset-2 col-md-8 col-sm-12 nopadding nofloat"><img src="/wiki/images/c/c2/Heidelberg_Toolbox_On-Off.png" class="img-responsive" /></span>ACTIVATE &<br />DEACTIVATE</a> |
- | <h3>Please go to <a href="http://www.rcsb.org/">www.rcsb.org</a> and get a pdb file of your protein. If the 3D structure of your protein is known, we will be able to provide you an appropriate linker.</h3>
| + | </div>--> |
- | <h4>If the 3D structure is unknown, we will help you to find a set of potentially suitable linkers. </h4>
| + | |
- | <div class="panel panel-default">
| + | |
- | <div class="panel-body">
| + | |
- | <div class="radio">
| + | |
- | <label>
| + | |
- | <input type="radio" data-bind="checked: data.gotProteinStructure, checkedValue: true, click: data.q9A.bind(null, true)" name="ko_unique_1" value="true">
| + | |
- | I’ve found one.
| + | |
- | </label>
| + | |
- | </div>
| + | |
- | <div class="radio">
| + | |
- | <label> | + | |
- | <input type="radio" data-bind="checked: data.gotProteinStructure, checkedValue: false, click: data.q9A.bind(null, true)" name="ko_unique_2" value="false">
| + | |
- | The 3D structure of my protein is unknown
| + | |
- | </label>
| + | |
| </div> | | </div> |
| </div> | | </div> |
- | </div>
| |
- |
| |
- | <div data-bind="fadeVisible: data.q9A" style="display: none;" class="panel panel-default">
| |
- | <div class="panel-body">
| |
- | Additionally, check the DNA sequence of your proteins for EcoRI, XbaI, SpeI, PstI and BsaI recognition sites. If there are E/X/S/P sites, you might have problems to change your backbone or add a promotor. If there is a BsaI recognition site, the cloning will be more difficult.
| |
- |
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.hasBsaI, checkedValue: false, click: data.q0A.bind(null, true)" />
| |
- | There is no BsaI site.
| |
- | </label>
| |
- | </div>
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.hasBsaI, checkedValue: true, click: data.q0A.bind(null, true)" />
| |
- | There is a BsaI site.
| |
- | </label>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- | <div data-bind="fadeVisible: data.q0A">
| |
- | <h3>2. Do you want to use split inteins or sortase to circularize your protein?</h3>
| |
- | <div class="panel panel-default">
| |
- | <div class="panel-body">
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.useSortase, checkedValue: false, click: data.q1A.bind(null, true)" />
| |
- | NpuDnaE intein RFC <span data-bind="value: RFCnumber"></span> circularization construct
| |
- | </label>
| |
- | <ul>
| |
- | <li>Successfully used in our project</li>
| |
- | <li>High efficiency</li>
| |
- | <li>In vivo circularization</li>
| |
- | </ul>
| |
- | </div>
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.useSortase, checkedValue: true, click: data.q1A.bind(null, true)" />
| |
- | Sortase A circularization construct
| |
- | </label>
| |
- | <ul>
| |
- | <li>In vitro only</li>
| |
- | <li>Well-purified protein required</li>
| |
- | <li>Not successfully tested yet</li>
| |
- | </ul>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- |
| |
- | <div data-bind="fadeVisible: data.q1A">
| |
- | <h3>3. Can your protein be easily expressed in <i>E. coli</i>?</h3>
| |
- | <div class="panel panel-default">
| |
- | <div class="panel-body">
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.needsSmt3, checkedValue: false, click: data.q2A.bind(null, true)" />
| |
- | Yes, no problem.
| |
- | </label>
| |
- | </div>
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.needsSmt3, checkedValue: true, click: data.q2A.bind(null, true)" />
| |
- | No, I will have to add <a href="http://parts.igem.org/Part:BBa_K1362429">Smt3</a>.
| |
- | </label>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- | <div data-bind="fadeVisible: data.q2A() && !data.useSortase()">
| |
- | <h3>4. Which exteins do you want to use? They will remain as scars in your circular protein.</h3>
| |
- | <div class="panel panel-default">
| |
- | <div class="panel-body">
| |
- | <!-- ko foreach: availableExteins -->
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: $parent.data.exteins, checkedValue: $data, click: $parent.data.q3A.bind(null, true)" />
| |
- | <span data-bind="text: N"></span>/<span data-bind="text: C"></span>
| |
- | <!-- ko if: comment -->
| |
- | (<span data-bind="text: comment"></span>)
| |
- | <!-- /ko -->
| |
- | <ul data-bind="foreach: notes">
| |
- | <li data-bind="text: $data"></li>
| |
- | </ul>
| |
- | </label>
| |
- | </div>
| |
- | <!-- /ko -->
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- | <!-- ko if: data.gotProteinStructure -->
| |
- | <div data-bind="fadeVisible: data.q3A() || (data.q2A() && data.useSortase())">
| |
- | <h3><span data-bind="text: data.useSortase() ? 4 : 5"></span>. If you want to save time, check manually whether the ends are close together (approx. <span data-bind="text: !data.useSortase() && data.exteins().N == 'XXX' ? 5 : 15"></span> Å or closer). For example, you can use the <a href="http://spdbv.vital-it.ch/">Swiss-PdbViewer</a> or <a href="http://www.pymol.org/">PyMOL</a>.</h3>
| |
- | <div class="panel panel-default" >
| |
- | <div class="panel-body">
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.endsAreClose, checkedValue: true, click: data.q4A.bind(null, true)" />
| |
- | They are close together.
| |
- | </label>
| |
- | </div>
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.endsAreClose, checkedValue: false, click: data.q4A.bind(null, true)" />
| |
- | I want/have to use <span data-bind="text: softwareName"></span>.
| |
- | </label>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- |
| |
- | <div data-bind="fadeVisible: data.q4A() && !data.endsAreClose()">
| |
- | Please use <span data-bind="text: softwareName"></span> to generate a linker for your circular protein. [LINK]
| |
- |
| |
- | This step might take up to 11 days.<br />
| |
- |
| |
- | NILS – hier könnte dein instruction-file-ersatz stehen <br />
| |
- |
| |
- |
| |
- | NILS – hier auch<br />
| |
- |
| |
- |
| |
- | NILS – hier immernoch<br />
| |
- |
| |
- |
| |
- | NILS – hier ebnfalls und auch gerne noch umfangreicher<br />
| |
- |
| |
- |
| |
- | Please save this link:<br />
| |
- | <code id="comebackurl" style="display:inline-block; width:80%; overflow-y:hidden; vertical-align: middle;">https://2014.igem.org/<span id="pagename"></span>#<span data-bind="text: comeBackHash"></span></code><div style="display:inline-block; width: 20%; color:#de4230; vertical-align: middle;" id="copy-to-clip"> <img src="/wiki/images/c/c6/Heidelberg_Clipboard.png" alt="Clipboard icon" /> Copy to clipboard</div>
| |
- |
| |
- |
| |
- | In order to generate your linker, <span data-bind="text: softwareName"></span> needs to know the scar amino acid sequence that is caused by circularization. In your case, it is <span data-bind="text: data.useSortase() ? 'LPETG' : data.exteins().N == 'XXX' ? 'just C' : (data.exteins().N + data.exteins().C)"></span>.
| |
- | </div>
| |
- |
| |
- | <div data-bind="fadeVisible: data.comingBack">
| |
- | <h3><span data-bind="text: data.useSortase() ? 5 : 6"></span>. Hello again. What is the result of <span data-bind="text: softwareName"></span>?</h3>
| |
- | <div class="panel panel-default">
| |
- | <div class="panel-body">
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.linkerLength, checkedValue: 0, click: data.q5A.bind(null, true)" />
| |
- | I do not need a linker.
| |
- | </label>
| |
- | </div>
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.linkerLength, checkedValue: 1, click: data.q5A.bind(null, true)" />
| |
- | The linker + scars are < 15 amino acids in length.
| |
- | </label>
| |
- | </div>
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.linkerLength, checkedValue: 2, click: data.q5A.bind(null, true)" />
| |
- | The linker + scars are betweeen 16 and 30 amino acids in length.
| |
- | </label>
| |
- | </div>
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.linkerLength, checkedValue: 3, click: data.q5A.bind(null, true)" />
| |
- | The linker + scars are > 30 amino acids in length.
| |
- | </label>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- | <div data-bind="fadeVisible: data.q5A">
| |
- | <h3><span data-bind="text: data.useSortase() ? 6 : 7"></span>. Have you decided to use one linker or try different linkers?</h3>
| |
- | <div class="panel panel-default">
| |
- | <div class="panel-body">
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.testSeveral, checkedValue: false, click: data.q6A.bind(null, true)" />
| |
- | I trust <span data-bind="text: softwareName"></span>. One should be enough.
| |
- | </label>
| |
- | </div>
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.testSeveral, checkedValue: true, click: data.q6A.bind(null, true)" />
| |
- | I want to test several linkers.
| |
- | </label>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- | <!-- /ko -->
| |
- |
| |
- | <div data-bind="if: data.q3A() && !data.gotProteinStructure()">
| |
- | <h3>How large is your protein?</h3>
| |
- | <div class="panel panel-default">
| |
- | <div class="panel-body">
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.proteinSize, checkedValue: 0, click: data.q7A.bind(null, true)" name="ko_unique_17" value="0">
| |
- | Less than 50 amino acids
| |
- | </label>
| |
- | </div>
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.proteinSize, checkedValue: 1, click: data.q7A.bind(null, true)" name="ko_unique_18" value="1">
| |
- | 50-150 amino acids
| |
- | </label>
| |
- | </div>
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.proteinSize, checkedValue: 2, click: data.q7A.bind(null, true)" name="ko_unique_18" value="2">
| |
- | 151-300 amino acids
| |
- | </label>
| |
- | </div>
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.proteinSize, checkedValue: 3, click: data.q7A.bind(null, true)" name="ko_unique_18" value="3">
| |
- | 301-500 amino acids
| |
- | </label>
| |
- | </div>
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.proteinSize, checkedValue: 4, click: data.q7A.bind(null, true)" name="ko_unique_18" value="4">
| |
- | 501-700 amino acids
| |
- | </label>
| |
- | </div>
| |
- | <div class="radio">
| |
- | <label>
| |
- | <input type="radio" data-bind="checked: data.proteinSize, checkedValue: 5, click: data.q7A.bind(null, true)" name="ko_unique_18" value="5">
| |
- | More than 700 amino acids
| |
- | </label>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- |
| |
- | <div class="col-lg-12">
| |
- | <div data-bind="if: (data.q4A() && data.endsAreClose()) || (data.q5A() && data.linkerLength() == 0) || data.q6A() || data.q7A()">
| |
- |
| |
- | <h3>Protocol:</h3>
| |
- | <!--Module 1 -->
| |
- | Get BBa_K136200<span data-bind="if: !data.useSortase()&&!data.needsSmt3()">0</span><span data-bind="if: !data.useSortase()&&data.needsSmt3()">1</span><span data-bind="if: data.useSortase()&&!data.needsSmt3()">2</span><span data-bind="if: data.useSortase()&&data.needsSmt3()">3</span><span data-bind="if: !data.useSortase()">NpuDnaE intein RFC ???</span><span data-bind="if: data.useSortase()">Sortase A</span>circularization construct <span data-bind="if: !data.useSortase()&&data.needsSmt3()">(with FLAG and Smt3)</span><span data-bind="if: data.useSortase()&&!data.needsSmt3()">(with His6)</span><span data-bind="if: data.useSortase()&&data.needsSmt3()">(with Smt3 and His6)</span> from the registry.
| |
- |
| |
- | <!-- Module 2 -->
| |
- | Get the DNA of the protein you want to circularize.
| |
- |
| |
- | <!-- Module 3 -->
| |
- | <p data-bind="if: !data.gotProteinStructure()">We recommend you to try circularization without a linker and with flexible GS-linkers of different lenghts up to <span data-bind="if: data.proteinSize() == 0">8</span><span data-bind="if: data.proteinSize() == 1">10</span><span data-bind="if: data.proteinSize() == 2">15</span><span data-bind="if: data.proteinSize() == 3">20</span><span data-bind="if: data.proteinSize() == 4">25</span><span data-bind="if: data.proteinSize() == 5">30</span> amino acids (including exteins).</p>
| |
- | Backtranslate the amino acid sequence of your linker[ data.testSeveral() || !data.gotProteinStructure() |s] to a nucleic acid sequence. Be aware of:
| |
- | <ul>
| |
- | <li>Balanced GC-content</li>
| |
- | <li>Restriction sites (especially PstI)</li>
| |
- | <li>Codon usage</li>
| |
- | <li>Avoid self annealing</li>
| |
- | </ul>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
| </div> | | </div> |
| </html> | | </html> |
- | {{:Team:Heidelberg/Templates/IncludeJS|:Team:Heidelberg/js/toolboxguide}}
| |