Team:TU Delft/Modeling/MFA/Pathways
From 2010.igem.org
(Difference between revisions)
(56 intermediate revisions not shown) | |||
Line 2: | Line 2: | ||
<style> | <style> | ||
+ | #pathwayinput_box { | ||
+ | display: block; | ||
+ | padding: 10px; | ||
+ | margin: 5px; | ||
+ | float: left; | ||
+ | margin-top: 20px; | ||
+ | } | ||
- | # | + | #pathwayoutput_box { |
- | + | display: block; | |
- | + | padding: 10px; | |
- | + | margin: 5px; | |
- | + | float: left; | |
- | + | ||
} | } | ||
- | # | + | #arrow { |
- | + | display: block; | |
- | + | float: left; | |
- | + | margin-top: 40px; | |
- | + | ||
} | } | ||
+ | label { | ||
+ | display: block; | ||
+ | clear:both; | ||
+ | } | ||
+ | |||
+ | #pathway_form { | ||
+ | position: absolute; | ||
+ | z-index:99; | ||
+ | } | ||
</style> | </style> | ||
- | + | <form id="pathway_form"> | |
- | <form id=" | + | <div id="pathwayinput_box"> |
- | <div | + | <label for="gluc"><input id="gluc" type="radio" name="pwinput" value="gluc">Glucose</label> |
- | <input id=" | + | <label for="even"><input id="even" type="radio" name="pwinput" value="even" checked="checked">C12-alkane</label> |
- | <input id="odd" type="radio" name=" | + | <label for="odd"><input id="odd" type="radio" name="pwinput" value="odd">C13-alkane</label> |
- | <input id=" | + | </div> |
+ | <img id="arrow" src="https://static.igem.org/mediawiki/2010/2/2f/Arrow_tud2010.png" /> | ||
+ | <div id="pathwayoutput_box"> | ||
+ | <label for="growth"><input id="growth" type="radio" name="pwout" value="growth" checked="checked">Biomass growth</label> | ||
+ | <label for="NOx"><input id="NOx" type="radio" name="pwout" value="NOx">NO3 electron acceptor</label> | ||
+ | <label for="PHB"><input id="PHB" type="radio" name="pwout" value="PHB">PHB</label> | ||
+ | <label for="isoprene"><input id="isoprene" type="radio" name="pwout" value="isoprene">Isoprene</label> | ||
+ | <label for="H2"><input id="H2" type="radio" name="pwout" value="H2">Hydrogen</label> | ||
</div> | </div> | ||
- | |||
</form> | </form> | ||
+ | <div id="imgcontainer"> | ||
+ | <img style="position:absolute;z-index:1;filter:alpha(opacity=25);-moz-opacity:0.25;-khtml-opacity: 0.25;opacity: 0.25;" id="pathwaybackground" src="https://static.igem.org/mediawiki/2010/7/70/Team_TUDelft_All_fluxes.png" width="900"> | ||
+ | <img style="display:none" id="pathwayimg" width="900" /> | ||
+ | </div> | ||
+ | <div style="width:1px;height:1px;overflow:hidden;"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/7/70/Team_TUDelft_All_fluxes.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/1/12/Team_TUDelft_even_growth.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/e/e0/Team_TUDelft_even_H2.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/f/f5/Team_TUDelft_even_isoprene.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/5/5d/Team_TUDelft_even_NOx.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/a/a4/Team_TUDelft_even_PHB.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/1/1f/Team_TUDelft_gluc_growth.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/c/c0/Team_TUDelft_gluc_H2.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/6/62/Team_TUDelft_gluc_isoprene.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/9/9e/Team_TUDelft_gluc_NOx.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/2/2b/Team_TUDelft_gluc_PHB.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/5/52/Team_TUDelft_odd_growth.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/8/84/Team_TUDelft_odd_H2.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/2/2c/Team_TUDelft_odd_isoprene.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/d/dd/Team_TUDelft_odd_NOx.png"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/9/91/Team_TUDelft_odd_PHB.png"> | ||
+ | </div> | ||
+ | <script type="text/javascript"> | ||
- | + | var currentInput = 'even'; | |
+ | var currentOutput = 'growth'; | ||
+ | var currentMid = '1/12'; | ||
- | + | function updatepathway() { | |
+ | if (currentInput == "odd") { | ||
+ | currentMid = '9/91'; | ||
+ | if (currentOutput == "growth") { | ||
+ | currentMid = '5/52'; | ||
+ | } | ||
+ | if (currentOutput == "H2") { | ||
+ | currentMid = '8/84'; | ||
+ | } | ||
+ | if (currentOutput == "isoprene") { | ||
+ | currentMid = '2/2c'; | ||
+ | } | ||
+ | if (currentOutput == "NOx") { | ||
+ | currentMid = 'd/dd'; | ||
+ | } | ||
+ | } | ||
+ | if (currentInput == "even") { | ||
+ | currentMid = 'a/a4'; | ||
+ | if (currentOutput == "growth") { | ||
+ | currentMid = '1/12'; | ||
+ | } | ||
+ | if (currentOutput == "H2") { | ||
+ | currentMid = 'e/e0'; | ||
+ | } | ||
+ | if (currentOutput == "isoprene") { | ||
+ | currentMid = 'f/f5'; | ||
+ | } | ||
+ | if (currentOutput == "NOx") { | ||
+ | currentMid = '5/5d'; | ||
+ | } | ||
+ | } | ||
+ | if (currentInput == "gluc") { | ||
+ | currentMid = '2/2b'; | ||
+ | if (currentOutput == "growth") { | ||
+ | currentMid = '1/1f'; | ||
+ | } | ||
+ | if (currentOutput == "H2") { | ||
+ | currentMid = 'c/c0'; | ||
+ | } | ||
+ | if (currentOutput == "isoprene") { | ||
+ | currentMid = '6/62'; | ||
+ | } | ||
+ | if (currentOutput == "NOx") { | ||
+ | currentMid = '9/9e'; | ||
+ | } | ||
+ | } | ||
- | + | var url = "https://static.igem.org/mediawiki/2010/" + currentMid + "/Team_TUDelft_" + currentInput + "_" + currentOutput + ".png"; | |
+ | $("#pathwayimg").attr ('src', url).show(); | ||
+ | } | ||
$(function() { | $(function() { | ||
+ | $("input[name='pwinput']").click(function() { | ||
+ | currentInput = $(this).val(); | ||
+ | updatepathway(); | ||
+ | }); | ||
+ | $("input[name='pwout']").click(function() { | ||
+ | currentOutput = $(this).val(); | ||
+ | updatepathway(); | ||
+ | }); | ||
+ | updatepathway(); | ||
}); | }); | ||
</script> | </script> | ||
- | |||
</html> | </html> |
Latest revision as of 15:07, 27 October 2010