Line 92: | Line 92: | ||
</div> | </div> | ||
+ | |||
+ | |||
+ | <div class="row flex-center sm-no-flex"> | ||
+ | |||
+ | <div class="sm-no-float col-md-12"> | ||
+ | <div class="wrapper12"> | ||
+ | <div class="card2"> | ||
+ | |||
+ | <!--Size dropdown menu--> | ||
+ | <h2 style="text-align: center;">Pick your Promoter</h2> | ||
+ | |||
+ | <div class="promotergenerator"> | ||
+ | <select id="size_select"> | ||
+ | <option value="option1">An12g07450</option> | ||
+ | <option value="option2">An07g00070</option> | ||
+ | |||
+ | </select> | ||
+ | |||
+ | </div> | ||
+ | <!--Size dropdown content--> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </div> | ||
+ | <div class="card1 trigger"> | ||
+ | |||
+ | <div class="cardimg"> | ||
+ | <img class="size_chart option1" id="imoption1" src="https://static.igem.org/mediawiki/2019/f/f4/T--DTU-Denmark--promotersugar.svg" title="Comming soon" style="margin: 50px 20px;"> | ||
+ | <img id="imoption2" class="size_chart option2" src="https://static.igem.org/mediawiki/2019/b/b0/T--DTU-Denmark--devilpromoterdesc.svg" title="Comming soon" style="margin: 40px 30px;"> | ||
+ | </div> | ||
+ | |||
+ | <div class="collecter"> | ||
+ | |||
+ | |||
+ | |||
+ | <div class=" header"> | ||
+ | <div id="option1" class="size_chart profile option1"> | ||
+ | <h2>An12g07450</h2> | ||
+ | <p><b>Alias:</b> PmstA<br><br></p> | ||
+ | <p>mstA encodes a high-affinity sugar transporter, and has been shown to be expressed when <i>A. niger</i> starts to run out of sugar. It doesn't care about the age/phase of the culture, only about sugar | ||
+ | </p> | ||
+ | <div class="data-box"> | ||
+ | <span class="data" data-name="log(exp) " data-value="84"> | ||
+ | <p class="info"></p> | ||
+ | </span> | ||
+ | </div> | ||
+ | <div class="data-box"> | ||
+ | <span class="data" data-name="log(post) " data-value="81"> | ||
+ | <p class="info"></p> | ||
+ | </span> | ||
+ | </div> | ||
+ | <div class="data-box"> | ||
+ | <span id="versionstat" class="data" data-name="Versions: " data-value="40"> | ||
+ | <p class="info"></p> | ||
+ | </span> | ||
+ | </div> | ||
+ | <p><b>Special Ability:</b> sensitive sugar sensor, turns on when sugar is limited</p> | ||
+ | <p><b>Versions:</b> 1 naturalistic & 1 synthetically enhanced</p> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | <div id="option2" class="profile size_chart option2"> | ||
+ | <h2>An07g00070</h2> | ||
+ | |||
+ | <p>A homolog of the <i>A. fumigatus</i> tpcK gene, part of the synthesis pathway for a mycotoxin, this gene represents a classical secondary metabolite, and its promoter acts accordingly: with relatively low leakiness, it turns on hard when the fungi reach stationary phase, a boon for growth-decoupled industrial production. <br>Despite the scary story of the gene it regulates, the promoter is perfectly tame, harmless, and ready to help. | ||
+ | </p> | ||
+ | <div class="data-box"> | ||
+ | <span class="data" data-name="log(exp) " data-value="34"> | ||
+ | <p class="info"></p> | ||
+ | </span> | ||
+ | </div> | ||
+ | <div class="data-box"> | ||
+ | <span class="data" data-name="log(post) " data-value="87.79"> | ||
+ | <p class="info"></p> | ||
+ | </span> | ||
+ | </div> | ||
+ | <div class="data-box"> | ||
+ | <span id="versionstat1" class="data" data-name="Versions: " data-value="120"> | ||
+ | <p class="info"></p> | ||
+ | </span> | ||
+ | </div> | ||
+ | |||
+ | <p><b>Versions:</b> 6 versions, with 4 levels: synthetically enhanced 1x, naturalistic-ish 2x, sorta weakened 2x, even more weakened 1x</p> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <div class="logo1"> | ||
+ | <img src="https://static.igem.org/mediawiki/2019/6/6e/T--DTU-Denmark--dtubiobuilders.svg" title="Comming soon" style="margin: 20px 10px;"> | ||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
<div class="row flex-center sm-no-flex"> | <div class="row flex-center sm-no-flex"> | ||
Line 193: | Line 306: | ||
</div></div> | </div></div> | ||
+ | <script> | ||
+ | |||
+ | $(document).ready(function(){ | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | //Print skills titles: | ||
+ | $(".data").each(function(){ | ||
+ | var statName = $(this).attr("data-name") + " " + $(this).attr("data-value") + "%"; | ||
+ | $(this).find(".info").text(statName); | ||
+ | |||
+ | var infoname = $("#versionstat").attr("data-name") + " " + $("#versionstat").attr("data-value")/20 ; | ||
+ | $("#versionstat").find(".info").text(infoname); | ||
+ | }); | ||
+ | |||
+ | //Trigger skills animation: | ||
+ | |||
+ | $(".data").each(function(){ | ||
+ | var statValue = $(this).attr("data-value"); | ||
+ | $(this).animate({"width": statValue + "%"}, 800); | ||
+ | console.log("hello"); | ||
+ | console.log($(this).find(".info")); | ||
+ | }); | ||
+ | |||
+ | |||
+ | |||
+ | //hides dropdown content | ||
+ | $(".size_chart").hide(); | ||
+ | |||
+ | //unhides first option content | ||
+ | $(".option1").show(); | ||
+ | |||
+ | |||
+ | |||
+ | //listen to dropdown for change | ||
+ | $("#size_select").change(function(){ | ||
+ | |||
+ | //rehide content on change | ||
+ | $('.size_chart').hide(); | ||
+ | //unhides current item | ||
+ | $('.'+$(this).val()).show(); | ||
+ | |||
+ | $(".data").each(function(){ | ||
+ | var statName = $(this).attr("data-name") + " " + $(this).attr("data-value") + "%"; | ||
+ | $(this).find(".info").text(statName); | ||
+ | |||
+ | var infoname = $("#versionstat").attr("data-name") + " " + $("#versionstat").attr("data-value")/20 ; | ||
+ | $("#versionstat").find(".info").text(infoname); | ||
+ | |||
+ | var infoname = $("#versionstat1").attr("data-name") + " " + $("#versionstat1").attr("data-value")/20 ; | ||
+ | $("#versionstat1").find(".info").text(infoname); | ||
+ | |||
+ | |||
+ | |||
+ | $(".data").each(function(){ | ||
+ | var statValue = $(this).attr("data-value"); | ||
+ | //$(this).animate({"width": 0 + "%"}, 800); | ||
+ | $(this).animate({"width": statValue + "%"}, 800); | ||
+ | //console.log("hello"); | ||
+ | //console.log($(this).find(".info")); | ||
+ | }); | ||
+ | |||
+ | |||
+ | }); | ||
+ | }); | ||
+ | |||
+ | |||
+ | |||
+ | }); | ||
+ | </script> | ||
</html> | </html> |
Revision as of 07:36, 20 October 2019
Results
Comming soon
Text will also be comming soon.
Pick your Promoter
An12g07450
Alias: PmstA
mstA encodes a high-affinity sugar transporter, and has been shown to be expressed when A. niger starts to run out of sugar. It doesn't care about the age/phase of the culture, only about sugar
Special Ability: sensitive sugar sensor, turns on when sugar is limited
Versions: 1 naturalistic & 1 synthetically enhanced
An07g00070
A homolog of the A. fumigatus tpcK gene, part of the synthesis pathway for a mycotoxin, this gene represents a classical secondary metabolite, and its promoter acts accordingly: with relatively low leakiness, it turns on hard when the fungi reach stationary phase, a boon for growth-decoupled industrial production.
Despite the scary story of the gene it regulates, the promoter is perfectly tame, harmless, and ready to help.
Versions: 6 versions, with 4 levels: synthetically enhanced 1x, naturalistic-ish 2x, sorta weakened 2x, even more weakened 1x
More text soon
Soon.
Sources here will also come soon