Team:Peking/drawingcurvetest

From 2013.igem.org

(Difference between revisions)
 
(40 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
-
<body>
 
<style type="text/css">
<style type="text/css">
-
#Dear_Profstoy{position:relative; width:700px; height:400px; background-color:#ffffff; font-family:calibri,Arial;}
+
/* hiding the top section*/
-
#Dear_Profstoy code{background-color:transparent;  font-family:calibri,Arial;}
+
body{position:absolute; top:0px; width:100%; height:1300px;}
-
#Dear_ProfAxis{position:absolute; left:0px; top:0px; width:600px;}
+
#top-section{
-
#Dear_ProfsCanvas{ position:absolute; left:37px; top:12px; border:0px;}
+
  height:0px;
-
.Dear_ProfsControlPanel{position:absolute; left:600px; height:200px;}
+
    border:none;
-
.Dear_ProfsControlPanel img{height:35px;}
+
    width:980px;
-
.Dear_ProfsControlPanel h1{position:relative; border-bottom:0px;}
+
    margin:0 auto;
-
#Dear_ProfsControlPanel1{top:0px;}
+
    padding:0 0 0 0;
-
#Dear_ProfsControlPanel2{top:200px;}
+
    background-color:transparent;
-
</style>
+
    overflow:hide;
-
<div id="Dear_Profstoy" >
+
}
-
    <img id="Dear_ProfAxis" src="https://static.igem.org/mediawiki/2013/b/bd/Peking2013_DearProfstoy_Axis.png" />
+
#p-logo{display:none;}
-
    <canvas id="Dear_ProfsCanvas" height="350px" width="495px">
+
#search-controls{display:none;}
-
Your browser does not support the HTML5 canvas tag.
+
#top{display:none;}
-
     </canvas>
+
.firstHeading{display:none;}
-
     <div class="Dear_ProfsControlPanel" id="Dear_ProfsControlPanel1">
+
/* end of hiding the top section*/
-
          <img id="KphiPlus" src="https://static.igem.org/mediawiki/igem.org/e/e5/Peking2013_DearProf_ArrowUpInactivated.png">
+
 
-
          <h1 id="KphiShow">Kphi=</h1>
+
/* global setting*/
-
          <h1 id="KphiMinus">-</h1>
+
#globalWrapper{position:absolute; top:0px;left:0px; width:100%; padding:0 0 0 0;margin:0 0 0 0;height:100%;font-family: calibri, Arial, Helvetica, sans-serif;}
-
     </div>
+
#content{
-
<div class="Dear_ProfsControlPanel" id="Dear_ProfsControlPanel2">
+
     background-color:transparent;
-
          <h1 id="ncIPlus">+</h1>
+
     border:none;
-
          <h1 id="ncIShow">ncI=</h1>
+
    width:1200px;
-
          <h1 id="ncIMinus">-</h1>
+
    height:700px;
-
     </div>
+
    marign:0 auto;
 +
     padding:0 0 0 0;
 +
    top:-40px;
 +
    }
 +
#bodyContent{
 +
    background-color:transparent;
 +
     border:none;
      
      
-
      
+
     }
-
</div>
+
siteSub{
 +
    display:none;
 +
    border:none;
 +
    }
 +
contentSub{
 +
    display:none;
 +
    }
 +
/* end of global setting*/
 +
/*hiding the footer-box*/
 +
#footer-box{display:none;}
 +
#catlinks{display:none;}
 +
/*end of hiding the footer book*/
 +
/* menu (page, edit ...) */
 +
#menubar {
 +
    background-color:transparent;
 +
    position: relative;
 +
    float:left;
 +
    white-space: nowrap;
 +
    top:-6px;
 +
    width: 490px;
 +
    z-index: 5000;
 +
    font-family: sans-serif;
 +
    font-size: 95%;
 +
    line-height: 1em;
 +
    z-index:99;
 +
}
-
<script type="text/javascript">
 
-
var c=document.getElementById("Dear_ProfsCanvas");
 
-
var ctx=c.getContext("2d");
 
-
var convasheight=c.height, CorXmin=0, CorXmax=495;
 
-
var Kphi=10; ncI=1;
 
-
document.getElementById("KphiShow").innerHTML="K<sub><code>&phi;</code>R73</sub>="+Kphi.toFixed(1);
 
-
document.getElementById("ncIShow").innerHTML="n<sub>cI</sub>="+ncI.toFixed(1);
 
 +
.left-menu, .left-menu a {
 +
    text-align: left;
 +
    color:#999999;
 +
    text-transform: lowercase;
 +
}
-
document.getElementById("KphiPlus").onmousedown=function()  //Kphi plus button down
+
.left-menu:hover {
-
{
+
    color: #D00000;
-
  document.getElementById("KphiPlus").src="https://static.igem.org/mediawiki/igem.org/2/2f/Peking2013_DearProf_ArrowUpActivated.png";
+
    background-color: transparent;
-
 
+
}
}
-
document.getElementById("KphiPlus").onmouseup=function()  //Kphi plus button up
+
 
-
{
+
.right-menu{width:400px; float:right}
-
  sleep(10);
+
.right-menu, .right-menu a {
-
  document.getElementById("KphiPlus").src="https://static.igem.org/mediawiki/igem.org/e/e5/Peking2013_DearProf_ArrowUpInactivated.png";
+
    right: 0px;
 +
    text-align: right;
 +
    color: #999999;
}
}
 +
#menubar ul {
 +
    color: #999999;
 +
    list-style: none;
 +
}
 +
#menubar li {
 +
    display: inline;
 +
    position: relative;
 +
    cursor: pointer;
 +
    padding-left: 0px;
 +
    padding-right: 0px;
 +
}
 +
.left-menu li a {
 +
    padding: 0px 10px 0px 0px;
 +
}
 +
.left-menu .selected {
 +
#    color: #999999;
 +
}
 +
#.left-menu .selected:hover {
 +
#    color: #999999;
 +
#}
 +
.left-menu:hover a {
 +
    color: #999999;;
 +
}
 +
.left-menu li a:hover {
 +
    color: #D00000;
 +
    text-decoration: underline;
 +
}
-
document.getElementById("KphiPlus").onclick=function()        //increase Kphi
 
-
{
 
-
  if(Kphi<1000)                                         
 
-
  {
 
-
  Kphi=Kphi*2;
 
-
ctx.clearRect(0,0,c.width,c.height);
 
-
DrawCurve(ctx,convasheight,CorXmin,CorXmax,300,0.01,1000,Kphi,ncI);
 
-
document.getElementById("KphiShow").innerHTML="K<sub><code>&phi;</code>R73</sub>="+Kphi.toFixed(1);
 
-
  }
 
-
};
+
.right-menu li {
 +
#    background-color: transparent;
 +
}
 +
.right-menu li a {
 +
    padding: 0px 15px 0px 0px;
 +
    color: #999999;;
 +
    background-color: transparent;
 +
}
 +
.right-menu li a:hover {
 +
    color: #D00000;
 +
    text-decoration: underline;
 +
}
 +
/* end menu (edit, page ...) */
-
document.getElementById("KphiMinus").onclick=function()  //decrease Kphi
+
/* navigation bar*/
-
{
+
-
  if(Kphi>0.1)
+
-
  {
+
-
  Kphi=Kphi/2;
+
-
ctx.clearRect(0,0,c.width,c.height);
+
-
DrawCurve(ctx,convasheight,CorXmin,CorXmax,300,0.01,1000,Kphi,ncI);
+
-
document.getElementById("KphiShow").innerHTML="K<sub><code>&phi;</code>R73</sub>="+Kphi.toFixed(1);
+
-
  }
+
-
};
+
#navigationblock{background-color:#fafaf8; position:fixed; top:0px; width:1200px; height:130px; overflow:hidden; font-family:Calibri, Arial; float:left; margin:0px; padding:0px; z-index:1000; border-bottom:1px solid #d3d7d8;}
 +
#navbarlogo{position:absolute; top:0px; left:0px; width:1200px}
 +
#navigationbar{position:absolute; left:460px; top:38px; font-size:16px; font-weight:100; color:black;}
 +
#navigationbar > li {display:block; list-style-type:none; float:left; width:75px; height:30px; text-align:center; }
-
document.getElementById("ncIPlus").onclick=function()        //increase ncI
+
.Navbar_Item{background-color:transparent;}
-
{
+
.Navbar_Item a {color:black; text-decoration:none;}
-
  if(ncI<4)
+
.Navbar_Item > ul {display:none; width:900px; height:80px; text-align:center; color:black; z-index:1100; }
-
  {
+
.Navbar_Item > ul > li {float:left; list-style:none; text-align:center; background-color:transparent; position:relative; top:10px; padding:0 10px;}
-
  ncI=ncI+0.5;
+
.Navbar_Item:hover{ border-bottom:1px solid #D00000; color:#D00000; background-color:#fafaf8;}
-
ctx.clearRect(0,0,c.width,c.height);
+
.Navbar_Item:hover > ul{zoom:1; display:block;}
-
DrawCurve(ctx,convasheight,CorXmin,CorXmax,300,0.01,1000,Kphi,ncI);
+
.Navbar_Item:hover >a {color:#D00000; background-color:#fafaf8;}
-
document.getElementById("ncIShow").innerHTML="n<sub>cI</sub>="+ncI.toFixed(1);
+
.Navbar_Item > ul > li:hover {border-bottom:1px solid #D00000; color:#D00000; background-color:#fafaf8;}
-
  }
+
.Navbar_Item > ul > li:hover >a {color:#D00000}
 +
.BackgroundofSublist{position:absolute; left:-1000px; width:2000px; height:80px; background-color:#ffffff; opacity:0;}
-
};
 
-
document.getElementById("ncIMinus").onclick=function()        //decrease ncI
+
#Home_Sublist{position:relative; top:0px; left:-50px;}
-
{
+
#Team_Sublist{position:relative; top:0px; left:-110px;}
-
  if(ncI>0.5)
+
#Project_Sublist{position:relative; top:0px; left:-180px;}
-
  {
+
#Model_Sublist{position:relative; top:0px; left:-140px;}
-
  ncI=ncI-0.5;
+
#DataPage_Sublist{position:relative; top:0px; left:-60px;}
-
ctx.clearRect(0,0,c.width,c.height);
+
#Safety_Sublist{position:relative; top:0px; left:-180px;}
-
DrawCurve(ctx,convasheight,CorXmin,CorXmax,300,0.01,1000,Kphi,ncI);
+
#HumanPractice_Sublist{position:relative; top:0px; left:-420px;}
-
document.getElementById("ncIShow").innerHTML="n<sub>cI</sub>="+ncI.toFixed(1);
+
-
  }
+
-
};
+
#iGEM_logo{position:absolute; top:30px; left:1090px; height:80px;}
 +
/*end navigation bar*/
 +
/*Major body*/
 +
#MajorBody{position:absolute; top:0px; left:0px; width:1200px; height:1380px; background-color:#f9f9f7;}
 +
#ProjectTitle{position:absolute; left:0px; width:1200px; height:184px; top:150px; z-index:600;}
 +
#TitleBackground{position:absolute; left:0px; top:0px; width:1200px;}
 +
#LittleScout{position:relative; left:0px; top:-3px; width:70px;}
 +
#ProjectName{position:absolute; left:405px; top:20px; border-bottom:0px; color:#FFFFFF; font-size:48px; font-family:calibri,Arial, Helvetica, sans-serif;}
 +
#ProjectSubname{position:absolute; left:0px; width:1200px; top:105px; border-bottom:0px; color:#FFFFFF; font-size:18px;  font-family: calibri, Arial, Helvetica, sans-serif; text-align:center;}
-
var concentration=[0.1,0.4,1,4,10,40,100,400,1000];
+
#MajorBodyBackground{position:absolute; top:334px; left:0px; width:1200px;}
 +
#PreLocation{font-size:14px; font-family:arial,helvetica,sans-serif; color:#ca4321;position:absolute;top:190px;left:0px;text-align:center;width:1200px;line-height:20px; font-weight:bold;}
-
DrawCurve(ctx,convasheight,CorXmin,CorXmax,300,0.01,1000,10,2);
+
#AbstractBox{position:absolute; left:430px; top:390px; width:710px; height:540px; background-color:transparent;}
 +
#AbstractBackground{width:100%; height:100%; background-color:#FFFFFF; opacity:0.8;}
 +
#AbstractContent{position:absolute; left:55px; top:25px; width:600px; font-size:18px; line-height:25px ; font-family: calibri, Arial, sans-serif; text-align:justify;}
 +
#AbstractContent:first-letter{font-size:30px;}
 +
.SmallBoxes{width:340px; height:250px;background-color:#FFFFFF; overflow:hidden;font-family: calibri, Arial, Helvetica, sans-serif; }
 +
.SmallBoxes > img{position:absolute; left:0px; top:0px;}
 +
.SmallBoxes p{position:absolute; left:20px; top:75px; width:300px; font-size:14px; color:#ffffff; text-align:justify;}
 +
.SmallBoxes a{position:absolute; left:240px; top:220px; width:300px; font-size:12px; color:#ffffff; text-align:justify;}
-
function GetCoordinates(Cheight,Xmin,Xmax,Ymax,Concmin,Concmax,Kphi,ncI)
+
#AppendixBox1{position:absolute; left:60px; top:390px; background-color:#aa4630;}
-
{
+
#Appendix1Title{position:absolute; left:0px; top:70px; width:340px; text-align:center; color:#ffffff; font-size:16px; border-bottom:0px; line-height:28px;}
-
+
#Appendix1Cover{position:absolute; left:0px; top:170px; width:370px; height:280px;}
-
var coor=[];
+
#AppendixBox2{position:absolute; left:60px; top:680px; background-color:#e98d70;}
-
   
+
#Appendix2Title{position:absolute; left:0px; top:70px; width:340px; text-align:center; color:#ffffff; font-size:16px; border-bottom:0px; line-height:28px;}
-
for(var i=0;Xmin+3*i<Xmax;i++)
+
#Appendix2Cover{position:absolute; left:0px; top:170px; width:370px; height:280px;}
-
{
+
#AppendixBox3{position:absolute; left:60px; top:970px; background-color:#f37021;}
 +
#Appendix3Title{position:absolute; left:0px; top:70px; width:340px; text-align:center; color:#ffffff; font-size:16px; border-bottom:0px; line-height:28px;}
 +
#Appendix3Cover{position:absolute; left:0px; top:170px; width:370px; height:280px;}
 +
#AppendixBox4{position:absolute; left:430px; top:970px; background-color:#1f8a70;}
 +
#Appendix4Title{position:absolute; left:0px; top:70px; width:340px; text-align:center; color:#ffffff; font-size:16px; border-bottom:0px; line-height:28px;}
 +
#Appendix4Cover{position:absolute; left:0px; top:170px; width:370px; height:280px;}
 +
#AppendixBox5{position:absolute; left:800px; top:970px; background-color:#004258;}
 +
#Appendix5Title{position:absolute; left:0px; top:70px; width:340px; text-align:center; color:#ffffff; font-size:16px; border-bottom:0px; line-height:28px;}
 +
#Appendix5Cover{position:absolute; left:0px; top:170px; width:370px; height:280px;}
 +
 
 +
.AppendixHeadLine{position:absolute; left:20px; top:20px; width:250px;border-bottom:0px; font-size:23px; color:#ffffff;}
 +
.AppendixIcon{position:absolute; left:270px; top:20px; width:50px; }
 +
 
 +
 
 +
/*end of Major body*/
 +
#AcknowledgementBox{ position:absolute; left:0px; top:1280px; width:1200px;}
 +
 
 +
 
 +
</style>
 +
 
 +
 
 +
<!--navigationbar-->
 +
 
 +
<div id="navigationblock">
 +
<img id="navbarlogo" src="https://static.igem.org/mediawiki/igem.org/c/c9/Peking_Logo.jpg"/>
 +
       
 +
<ul id="navigationbar">
 +
<li id="PKU_navbar_Home" class="Navbar_Item">
 +
                       
 +
<a href="https://2013.igem.org/Team:Peking">Home</a>
 +
<ul id="Home_Sublist" >
 +
</ul>
 +
</li>
 +
<li id="PKU_navbar_Team" class="Navbar_Item">
 +
<a >Team</a>
 +
<ul id="Team_Sublist">
 +
                                <div class="BackgroundofSublist"></div>
 +
<li><a href="https://2013.igem.org/Team:Peking/Team/Members">Members</a></li>
 +
<li><a href="https://2013.igem.org/Team:Peking/Team/Notebook">Notebook</a></li>
 +
<li><a href="https://2013.igem.org/Team:Peking/Team/Attributions">Attributions</a></li>
 +
</ul>
 +
</li>
 +
<li id="PKU_navbar_Project" class="Navbar_Item">
 +
<a href="https://2013.igem.org/Team:Peking/Project">Project</a>
 +
<ul id="Project_Sublist">
 +
                                <div class="BackgroundofSublist"></div>
 +
                                <li><a href="https://2013.igem.org/Team:Peking/Project/SensorMining">Biosensor Mining</a></li>
 +
<li><a href="https://2013.igem.org/Team:Peking/Project/BioSensors">Biosensors</a></li>
 +
<li><a href="https://2013.igem.org/Team:Peking/Project/Plugins">Adaptors</a></li>
 +
<li><a href="https://2013.igem.org/Team:Peking/Project/BandpassFilter">Band-pass Filter</a></li>
 +
</ul>
 +
</li>
 +
<li id="PKU_navbar_Model" class="Navbar_Item">
 +
<a href="https://2013.igem.org/Team:Peking/Model">Model</a>
 +
<ul id="Model_Sublist">
 +
</ul>
 +
</li>
 +
                        <li id="PKU_navbar_HumanPractice" class="Navbar_Item" style="width:90px">
 +
<a >Data page</a>
 +
<ul id="DataPage_Sublist">
 +
                                <div class="BackgroundofSublist"></div>
 +
                                <li><a href="https://2013.igem.org/Team:Peking/DataPage/Parts">Parts</a></li>
 +
<li><a href="https://2013.igem.org/Team:Peking/DataPage/JudgingCriteria">Judging Criteria</a></li>
 +
 
 +
</ul>
 +
</li>
 +
<li id="PKU_navbar_Safety" class="Navbar_Item">
 +
<a href="https://2013.igem.org/Team:Peking/Safety">Safety</a>
 +
<ul id="Safety_Sublist">
 +
</ul>
 +
</li>
 +
<li id="PKU_navbar_HumanPractice" class="Navbar_Item" style="width:120px">
 +
<a href="https://2013.igem.org/Team:Peking/HumanPractice">Human Practice</a>
 +
<ul id="HumanPractice_Sublist">
 +
                                <div class="BackgroundofSublist"></div>
 +
                                <li><a href="https://2013.igem.org/Team:Peking/HumanPractice/Questionnaire">Questionnaire</a></li>
 +
<li><a href="https://2013.igem.org/Team:Peking/HumanPractice/FactoryVisit">Factory Visit</a></li>
 +
                                <li><a href="https://2013.igem.org/Team:Peking/HumanPractice/ModeliGEM">Practical Analysis</a></li>
 +
<li><a href="https://2013.igem.org/Team:Peking/HumanPractice/iGEMWorkshop">Team Coummunication</a></li>
 +
 
 +
</ul>
 +
</li>
-
coor.push(Xmin+3*i);
+
</ul>
-
coor.push(Cheight-Ymax*HillFunction(Concmin*Math.exp(Math.log(Concmax/Concmin)*3*i/(Xmax-Xmin)),Kphi,ncI));
+
        <a href="https://igem.org/Team_Wikis?year=2013"><img id="iGEM_logo" src="https://static.igem.org/mediawiki/igem.org/4/48/Peking_igemlogo.jpg"/></a>
-
+
</div>
-
+
<!--end navigationbar-->
-
}
+
-
return coor;
+
-
}
+
 +
<!--MajorBody-->
 +
<div id="MajorBody"> 
 +
<div id="ProjectTitle">
 +
                <img id="TitleBackground" src="https://static.igem.org/mediawiki/igem.org/c/c5/Peking2013_home_title.jpg" />
 +
               
 +
<h1 id="ProjectName">Aromatics Scouts<img id="LittleScout" src="https://static.igem.org/mediawiki/igem.org/8/8a/Peking2013_home_Telescope.png" /></h1>
 +
                <h1 id="ProjectSubname">A Comprehensive Biosensor Toolkit for Profiling Aromatic Compounds in the Environment</h1>
 +
 +
<p id="PreLocation">
 +
<B>★Presentation:</B> LT 6, Saturday, 9:30 PM
 +
      &ensp;&ensp;&ensp;&ensp;<B>★Poster:</B> Poster area C, #52
 +
</p>
-
function HillFunction(x,Kphi,ncI)
 
-
{
 
-
var A=1,
 
-
    nphi=1,
 
-
KcI=100,
 
-
    y=0;
 
-
 
-
y=A*( Math.pow(x, nphi)/ (Math.pow(x, nphi)+ Math.pow(Kphi, nphi)))*(Math.pow(KcI, ncI)/ (Math.pow(x, ncI)+ Math.pow(KcI, ncI)));
 
-
return y;
 
-
}
 
-
function DrawCurve(ctx,Cheight,Xmin,Xmax,Ymax,Concmin,Concmax,Kphi,ncI)
+
</div>
-
{
+
        <img id="MajorBodyBackground" src="https://static.igem.org/mediawiki/igem.org/9/97/Peking2013_Home_background.jpg" />
-
var Coor=[];
+
        <div id="AbstractBox">
-
Coor=GetCoordinates(Cheight,Xmin,Xmax,Ymax,Concmin,Concmax,Kphi,ncI);
+
            <div id="AbstractBackground"></div>
 +
              <p id="AbstractContent">Monitoring aromatic compounds in the environment remains a substantial challenge today. Noting the power of biosensors for quick and convenient testing, Peking iGEM has developed a functionally comprehensive biosensor toolkit to profile aromatics in the environment.
 +
<br/><br/>
 +
Transcriptional regulators that each detect a specific class of aromatics were first bioinformatically determined; and then utilized to build a comprehensive set of biosensor circuits. Characterization on the detection profiles of individual biosensors and the orthogonality/crosstalk between them proved that these biosensors are very capable at profiling aromatics present in water.
 +
<br/><br/>
 +
Moreover, for the ease of practical applications, two types of genetic devices were also developed as plug-ins for biosensors: "Adaptors", a set of conceptually novel devices to convert undetectable compounds into detectable compounds, and "Band-pass Filter", a "concentration filter" that allows the detection of analyte concentration within a specific range.
 +
<br/><br/>
 +
We expect that these novel biosensors, together with the plug-in devices, will serve as intriguing synthetic biological tools for diverse practical applications.
 +
</p>
 +
        </div>
 +
        <div id="AppendixBox1" class="SmallBoxes" >
 +
              <h1 id="Appendix1Title"><i>Mining aromatics-sensing Biobricks <br/>from the genomic database</i></h1>
 +
              <div id="Appendix1Cover" >
 +
                    <img id="AppendixImg1" src="https://static.igem.org/mediawiki/igem.org/e/ec/Peking2013_homepage_appendix1.jpg" />
 +
                    <h1 class="AppendixHeadLine">Biosensor Mining</h1>
 +
                    <img id="Appendix1Icon" class="AppendixIcon" src="https://static.igem.org/mediawiki/igem.org/1/13/Peking2013_home_appendix1icon.png" />
 +
                    <p>The core component of our biosensor toolkit is the transcriptional regulators that sense aromatics. For the comprehensiveness of aromatics-sensing, a data-mining process was conducted to mine transcriptional regulators for each typical class of aromatics from the database Uniprot. </p>
 +
                    <a href="https://2013.igem.org/Team:Peking/Project/SensorMining">LEARN MORE</a>
 +
              </div>
 +
        </div>
 +
        <div id="AppendixBox2" class="SmallBoxes">
 +
              <h1 id="Appendix2Title"><i>High-performance, profile-<br/>specific biosensors</i> </h1>
 +
              <div id="Appendix2Cover" >
 +
                    <img id="AppendixImg2" src="https://static.igem.org/mediawiki/igem.org/1/17/Peking2013_home_appendix2.jpg" />
 +
                    <h1 class="AppendixHeadLine">Biosensors</h1>
 +
                    <img id="Appendix2Icon" class="AppendixIcon"  src="https://static.igem.org/mediawiki/igem.org/b/b2/Peking2013_home_appendix2icon.png" />
 +
                    <p>A comprehensive set of biosensor circuits have been implemented using the aromatics-sensing transcriptional regulators. Each biosensor has a specific aromatics-sensing profile. Furthermore, the orthogonality of their sensing profiles was carefully assessed for practical applications.</p>
 +
                    <a href="https://2013.igem.org/Team:Peking/Project/BioSensors">LEARN MORE</a>
 +
              </div>
 +
        </div>
 +
        <div id="AppendixBox3" class="SmallBoxes">
 +
              <h1 id="Appendix3Title"><i>Converting the undetectable into<br/>the detectable</i></h1>
 +
              <div id="Appendix3Cover" >
 +
                    <img id="AppendixImg3" src="https://static.igem.org/mediawiki/igem.org/1/1b/Peking2013_home_appendix3.jpg" />
 +
                    <h1 class="AppendixHeadLine">Adaptors</h1>
 +
                    <img id="Appendix3Icon"  class="AppendixIcon" src="https://static.igem.org/mediawiki/igem.org/c/cd/Peking2013_home_appendix3icon.png" />
 +
                    <p> To expand the detection profiles of some biosensors, aromatics-metabolizing enzymes were taken from natural metabolic pathways, working as Adaptors to convert undetectable chemicals into detectable aromatics when coupled with biosensor circuits.</p>
 +
                    <a href="https://2013.igem.org/Team:Peking/Project/Plugins">LEARN MORE</a>
 +
              </div>
 +
        </div>
 +
        <div id="AppendixBox4" class="SmallBoxes">
 +
              <h1 id="Appendix4Title"><i>Rapidly tell the concentration <br/> of the analyte</i></h1>
 +
              <div id="Appendix4Cover" >
 +
                    <img id="AppendixImg4" src="https://static.igem.org/mediawiki/igem.org/e/e6/Peking2013_home_appendix4.jpg" />
 +
                    <h1 class="AppendixHeadLine">Band-pass Filter</h1>
 +
                    <img id="Appendix4Icon" class="AppendixIcon"  src="https://static.igem.org/mediawiki/igem.org/4/42/Peking2013_home_appendix4icon.png" />
 +
                    <p>For the ease of practical analysis, a genetic device called "Band-pass Filter" has been constructed to allow the detection of analyte concentration within a specific range. Biosensors equipped with the Band-pass Filter can robustly quantify the aromatics in environmental samples. </p>
 +
                    <a href="https://2013.igem.org/Team:Peking/Project/BandpassFilter">LEARN MORE</a>
 +
              </div>
 +
        </div>
 +
        <div id="AppendixBox5" class="SmallBoxes">
 +
              <h1 id="Appendix5Title"><i>Communications, Questionnaire,  and <br/>Factory Visit</i></h1>
 +
              <div id="Appendix5Cover" >
 +
                    <img id="AppendixImg5" src="https://static.igem.org/mediawiki/igem.org/d/da/Peking2013_home_appendix5.jpg" />
 +
                    <h1 class="AppendixHeadLine">Human Practice</h1>
 +
                    <img id="Appendix5Icon" class="AppendixIcon"  src="https://static.igem.org/mediawiki/igem.org/8/85/Peking2013_home_appendix5icon.png" />
 +
                    <p>To obtain the information about public awareness and the situation of aromatics pollution, a survey including factory visiting and questionnaires has been conducted. We also guided an iGEM HS team and held "Model iGEM" as a competition without competitiveness.</p>
 +
                    <a href="https://2013.igem.org/Team:Peking/HumanPractice">LEARN MORE</a>
 +
              </div>
 +
        </div>       
-
ctx.beginPath();
+
</div><!--end of major body-->
 +
<img id="AcknowledgementBox" src="https://static.igem.org/mediawiki/igem.org/c/c4/Peking_Sponsors.jpg">
 +
<!--end of acknowledgement box-->
 +
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
 +
<script type="text/javascript">
 +
$(window).scroll(function(){
 +
  if(0==document.getElementById("content").offsetLeft){ $('#navigationblock').css('left',-$(window).scrollLeft());}
 +
  else{$('#navigationblock').css('left',document.getElementById("content").offsetLeft); }
 +
});
-
    ctx.moveTo(Coor[0], Coor[1]);
+
$(window).resize(function(){
 +
  if(0==document.getElementById("content").offsetLeft){ $('#navigationblock').css('left',-$(window).scrollLeft());}
 +
  else{$('#navigationblock').css('left',document.getElementById("content").offsetLeft); }
 +
});
-
    for(i=2;i<Coor.length-1;i+=2)  
+
document.getElementById("AppendixBox1").onmouseover=function(){MoveInSlide("#Appendix1Cover")};
 +
document.getElementById("AppendixBox1").onmouseout=function(){MoveOutSlide("#Appendix1Cover")};
 +
document.getElementById("AppendixBox2").onmouseover=function(){MoveInSlide("#Appendix2Cover")};
 +
document.getElementById("AppendixBox2").onmouseout=function(){MoveOutSlide("#Appendix2Cover")};
 +
document.getElementById("AppendixBox3").onmouseover=function(){MoveInSlide("#Appendix3Cover")};
 +
document.getElementById("AppendixBox3").onmouseout=function(){MoveOutSlide("#Appendix3Cover")};
 +
document.getElementById("AppendixBox4").onmouseover=function(){MoveInSlide("#Appendix4Cover")};
 +
document.getElementById("AppendixBox4").onmouseout=function(){MoveOutSlide("#Appendix4Cover")};
 +
document.getElementById("AppendixBox5").onmouseover=function(){MoveInSlide("#Appendix5Cover")};
 +
document.getElementById("AppendixBox5").onmouseout=function(){MoveOutSlide("#Appendix5Cover")};
 +
 
 +
function MoveInSlide(SlideId)
{
{
-
+
$(SlideId).stop().animate({top:"0px"},"fast");
-
ctx.lineTo(Coor[i], Coor[i+1]);
+
         
-
}
+
};
-
ctx.stroke();
+
 
-
}
+
 
 +
 
 +
function MoveOutSlide(SlideId)
 +
{
 +
$(SlideId).stop().animate({top:"170px"},"fast");
 +
       
 +
};
 +
 
-
function sleep(n)
+
</script>
-
  {
+
-
    var start=new Date().getTime();
+
-
    while(true) if(new Date().getTime()-start>n) break;
+
-
  }
+
-
</script>
 
-
</body>
 
</html>
</html>

Latest revision as of 03:28, 28 September 2013

Aromatics Scouts

A Comprehensive Biosensor Toolkit for Profiling Aromatic Compounds in the Environment

★Presentation: LT 6, Saturday, 9:30 PM     ★Poster: Poster area C, #52

Monitoring aromatic compounds in the environment remains a substantial challenge today. Noting the power of biosensors for quick and convenient testing, Peking iGEM has developed a functionally comprehensive biosensor toolkit to profile aromatics in the environment.

Transcriptional regulators that each detect a specific class of aromatics were first bioinformatically determined; and then utilized to build a comprehensive set of biosensor circuits. Characterization on the detection profiles of individual biosensors and the orthogonality/crosstalk between them proved that these biosensors are very capable at profiling aromatics present in water.

Moreover, for the ease of practical applications, two types of genetic devices were also developed as plug-ins for biosensors: "Adaptors", a set of conceptually novel devices to convert undetectable compounds into detectable compounds, and "Band-pass Filter", a "concentration filter" that allows the detection of analyte concentration within a specific range.

We expect that these novel biosensors, together with the plug-in devices, will serve as intriguing synthetic biological tools for diverse practical applications.

Mining aromatics-sensing Biobricks
from the genomic database

Biosensor Mining

The core component of our biosensor toolkit is the transcriptional regulators that sense aromatics. For the comprehensiveness of aromatics-sensing, a data-mining process was conducted to mine transcriptional regulators for each typical class of aromatics from the database Uniprot.

LEARN MORE

High-performance, profile-
specific biosensors

Biosensors

A comprehensive set of biosensor circuits have been implemented using the aromatics-sensing transcriptional regulators. Each biosensor has a specific aromatics-sensing profile. Furthermore, the orthogonality of their sensing profiles was carefully assessed for practical applications.

LEARN MORE

Converting the undetectable into
the detectable

Adaptors

To expand the detection profiles of some biosensors, aromatics-metabolizing enzymes were taken from natural metabolic pathways, working as Adaptors to convert undetectable chemicals into detectable aromatics when coupled with biosensor circuits.

LEARN MORE

Rapidly tell the concentration
of the analyte

Band-pass Filter

For the ease of practical analysis, a genetic device called "Band-pass Filter" has been constructed to allow the detection of analyte concentration within a specific range. Biosensors equipped with the Band-pass Filter can robustly quantify the aromatics in environmental samples.

LEARN MORE

Communications, Questionnaire, and
Factory Visit

Human Practice

To obtain the information about public awareness and the situation of aromatics pollution, a survey including factory visiting and questionnaires has been conducted. We also guided an iGEM HS team and held "Model iGEM" as a competition without competitiveness.

LEARN MORE