Team:UCSD Software/Parts

From 2014.igem.org

(Difference between revisions)
(Prototype team page)
 
Line 1: Line 1:
-
{{CSS/Main}}
+
{{Team:UCSD Software/CSS}}
<html>
<html>
-
<style type="text/css">
+
<head>
-
#groupparts {text-align: center; margin-left: auto; margin-right: auto;}
+
     
-
</style>
+
        <meta charset="UTF-8">
-
<!--main content -->
+
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
-
<table width="70%" align="center">
+
        <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
 +
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
 +
        <script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
 +
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
 +
       
 +
    <Style>
 +
body{
 +
    background-color: #0174DF;
 +
   
 +
}
 +
#nav{
 +
    background-color: #333;//rgba(0,0,0,0.5);
 +
    color: white;
 +
    //border: 1px solid white;
 +
    padding: 1px;
 +
  box-sizing: border-box;   
 +
}
-
<!--welcome box -->
+
#nav .btn{
-
<tr>
+
    //border-right: 2px solid grey;
-
<td style="border:1px solid black;" colspan="3" align="center" height="150px" bgColor=#FF404B>
+
   
-
<h1 >WELCOME TO iGEM 2014! </h1>
+
   
-
<p>Your team has been approved and you are ready to start the iGEM season!
+
}
-
<br>On this page you can document your project, introduce your team members, document your progress <br> and share your iGEM experience with the rest of the world! </p>
+
p{
-
<br>
+
color: black;
-
<p style="color:#E7E7E7"> <a href="https://2014.igem.org/wiki/index.php?title=Team:UCSD_Software/Parts&action=edit"style="color:#FFFFFF"> Click here  to edit this page!</a> </p>
+
}
-
</td>
+
-
</tr>
+
-
<tr> <td colspan="3"  height="5px"> </td></tr>
+
#nav .btn:hover{
-
<!-- end welcome box -->
+
    color: white;
-
<tr>
+
  background-color: rgba(204,204,204,0.5);
 +
 
 +
}
-
<!--navigation menu -->
+
#nav .btn:active{
-
<td align="center" colspan="3">
+
    color: white;
 +
  background-color: rgba(204,204,204,0.5);
 +
}
-
<table  width="100%">
 
-
<tr heigth="15px"></tr>
 
-
<tr heigth="75px">
 
 +
#thumbnail-preview-indicators {
 +
  position: relative;
 +
  overflow: hidden;
 +
}
 +
#thumbnail-preview-indicators .slides .slide-1,
 +
#thumbnail-preview-indicators .slides .slide-2,
 +
#thumbnail-preview-indicators .slides .slide-3 {
 +
  background-size: cover;
 +
  background-position: center center;
 +
  background-repeat: no-repeat;
 +
}
 +
    #thumbnail-preview-indicators,
 +
    #thumbnail-preview-indicators .slides,
 +
    #thumbnail-preview-indicators .slides .slide-1,
 +
    #thumbnail-preview-indicators .slides .slide-2,
 +
    #thumbnail-preview-indicators .slides .slide-3 {
 +
      height: 480px;
 +
    }
 +
#thumbnail-preview-indicators .slides .slide-1 {
 +
  background-image: url(https://s3.amazonaws.com/ooomf-com-files/wdXqHcTwSTmLuKOGz92L_Landscape.jpg);
 +
}
 +
#thumbnail-preview-indicators .slides .slide-2 {
 +
  background-image: url(https://s3.amazonaws.com/ooomf-com-files/tU3ptNgGSP6U2fE67Gvy_SYDNEY-162.jpg);
 +
}
 +
#thumbnail-preview-indicators .slides .slide-3 {
 +
  background-image: url(https://s3.amazonaws.com/ooomf-com-files/mtNrf7oxS4uSxTzMBWfQ_DSC_0043.jpg);
 +
}
 +
#thumbnail-preview-indicators .carousel-inner .item .carousel-caption {
 +
  top: 20%;
 +
  bottom: inherit;
 +
}
 +
#thumbnail-preview-indicators .carousel-indicators li,
 +
#thumbnail-preview-indicators .carousel-indicators li.active {
 +
  position: relative;
 +
  width: 100px;
 +
  height: 8px; 
 +
}
 +
#thumbnail-preview-indicators .carousel-indicators li > .thumbnail {
 +
  position: absolute;
 +
  top: 0;
 +
  width: 100px;
 +
  display: none;
 +
  opacity: 0;
 +
  left: 50%;
 +
  margin-top: -80px;
 +
  margin-left: -50px;
 +
}
 +
#thumbnail-preview-indicators .carousel-indicators li:hover > .thumbnail,
 +
#thumbnail-preview-indicators .carousel-indicators li.active > .thumbnail {
 +
  display: block;
 +
  opacity: .8;
 +
}
 +
#thumbnail-preview-indicators .carousel-indicators li.active > .thumbnail:hover{
 +
  opacity: 1;
 +
}
 +
@media screen and (max-width : 480px) {   
 +
    #thumbnail-preview-indicators .carousel-indicators li,
 +
    #thumbnail-preview-indicators .carousel-indicators li.active {
 +
      width: 50px;
 +
      height: 8px;
 +
      position: relative;
 +
    }
 +
    #thumbnail-preview-indicators .carousel-indicators li > .thumbnail {
 +
      width: 50px;
 +
      left: 50%;
 +
      margin-top: -50px;
 +
      margin-left: -25px;
 +
    }
 +
}
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7> 
+
/******************************DEFAULT WIKI SETTINGS CSS: CHANGING IT TO REFLECT OUR OWN PAGE********************
-
<a href="https://2014.igem.org/Team:UCSD_Software"style="color:#000000">Home </a> </td>
+
*******************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
******************************* THIS IS TO MAKE THE DISTINCTION CLEAR *******************************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
*******************************
 +
*******************************/
 +
.firstHeading {
 +
width: 975px;
 +
margin: 0px auto;
 +
padding-top: 100px;
 +
margin-bottom: 20px;
 +
font-family: Georgia, Times, "Times New Roman", serif;
 +
}
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
h1, h2, h3, h4, h5 { font-family: Georgia, Times, "Times New Roman", serif;}
-
<a href="https://2014.igem.org/Team:UCSD_Software/Team"style="color:#000000"> Team </a> </td>
+
-
<td style="border:1px solid black;" align="center"  height ="45px"  onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
#top-section { /*-- styling for default menu bar (edit, page, history, etc.) --*/
-
<a href="https://igem.org/Team.cgi?year=2014&team_name=UCSD_Software"style="color:#000000"> Official Team Profile </a></td>
+
background-color: #383838;
 +
border: 0 none;
 +
height: 14px;
 +
z-index: 100;
 +
top: 0;
 +
position: fixed;
 +
width: 975px;
 +
left: 50%;
 +
margin-left: -487px;
 +
}
-
<td style="border:1px solid black" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7> 
+
#top-section-bar { /*-- styling full width bar which hides behind default menu bar (edit, page, history, etc.) --*/
-
<a href="https://2014.igem.org/Team:UCSD_Software/Project"style="color:#000000"> Project</a></td>
+
background-color: #383838;
 +
height: 14px;
 +
display: block;
 +
z-index: 10;
 +
position: fixed;
 +
width: 100%;
 +
top: 0;
 +
}
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
#menubar a:link, #menubar a:active, #menubar a:visited, #menubar a:hover, #menubar:hover { /*-- styling for default menu bar links (edit, page, history, etc.) --*/
-
<a href="https://2014.igem.org/Team:UCSD_Software/Parts"style="color:#000000"> Parts</a></td>
+
color: #727272;
 +
text-decoration: none;
 +
background-color: transparent;
 +
}
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
 
-
<a href="https://2014.igem.org/Team:UCSD_Software/Modeling"style="color:#000000"> Modeling</a></td>
 
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7> 
 
-
<a href="https://2014.igem.org/Team:UCSD_Software/Notebook"style="color:#000000"> Notebook</a></td>
 
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
#globalWrapper, #content { /*-- changes default wiki settings --*/
-
<a href="https://2014.igem.org/Team:UCSD_Software/Safety"style=" color:#000000"> Safety </a></td>
+
width: 100%;
 +
height: 100%;
 +
border: 0px;
 +
background-color: transparent;
 +
margin: 0px;
 +
padding: 0px;
 +
}
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
html, body, .wrapper { /*-- changes default wiki settings --*/
-
<a href="https://2014.igem.org/Team:UCSD_Software/Attributions"style="color:#000000"> Attributions </a></td>
+
width: 100%;  
 +
height: 100%;
 +
background-color: transparent;
 +
}
 +
#contentcontainer { /*-- creates container for all content on page --*/
 +
font-family: Arial, Helvetica, sans-serif;
 +
font-weight: normal;
 +
font-size: 14px;
 +
color: #414141;
 +
width: 960px;
 +
margin-left: auto;
 +
margin-right: auto;
 +
background-color: #transparent;
 +
margin-top: 0px;
 +
}
-
<td align ="center"> <a href="https://2014.igem.org/Main_Page"> <img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px"></a> </td>
+
.sidemenu, .sidemenu li {
-
</tr>
+
list-style-type: none;
-
</table>
+
list-style-image: none;
 +
font-family: verdana;
 +
text-decoration: none;
 +
color:#000;
 +
font-size: 14px;
 +
}
-
<!--end navigation menu -->
+
.sidemenu li {display: block;}
-
</tr>
+
 +
.sidemenu a {
 +
text-decoration:none;
 +
color: #000;
 +
display: block;
 +
width: 180px;
 +
height: 100%;
 +
padding: 3px 5px;
 +
transition: .25s ease-in-out;
 +
-moz-transition: .25s ease-in-out;
 +
-webkit-transition: .25s ease-in-out;
 +
}
-
</tr>
+
.sidemenu a.greyout { color: #909090; }
-
+
 +
.sidemenu a:hover {
 +
color:#666;
 +
background-color: #d9f5aa;
 +
}
 +
.sub-sidemenu {font-size: 10px; margin-bottom: 20px; color: #666; display: none;}
 +
.sub-sidemenu a {color: #666;}
 +
div.underconst
 +
{
 +
padding:10px;
 +
border-radius:5px;
 +
background-color:pink;
 +
text-align:center;
 +
}
-
</td>
+
a.anchor{display: block; position: relative; top: -80px; visibility: hidden;}
-
<tr> <td colspan="3"  height="15px"> </td></tr>
+
.contentpara {margin-bottom: 30px;}
-
<tr><td bgColor="#e7e7e7" colspan="3" height="1px"> </tr>
+
-
<tr> <td colspan="3"  height="5px"> </td></tr>
+
 +
span.email{font-family: monospace; font-weight: normal;}
-
<!--Parts Submitted to the Registry  -->
+
fieldset {border: 1px solid #337f53;}
-
<tr><td > <h3> Parts Submitted to the Registry </h3></td>
+
-
<td ></td >
+
-
<td > <h3>What information do I need to start putting my parts on the Registry? </h3></td>
+
-
</tr>
+
-
<tr>
+
-
<td width="45%"  valign="top">
+
-
<p>
+
-
An important aspect of the iGEM competition is the use and creation of standard  biological parts. Each team will make new parts during iGEM and will submit them to the <a href="http://partsregistry.org"> Registry of Standard Biological Parts</a>. The iGEM software provides an easy way to present the parts your team has created. The "groupparts" tag will generate a table with all of the parts that your team adds to your team sandbox. 
+
-
<p>
+
.greyout {color: #A0A0A0;}
-
<strong>Note that if you want to document a part you need to document it on the <a href="http://partsregistry.org Registry"> Registry</a>, not on your team wiki.</strong> Future teams and other users and are much more likely to find parts on the Registry than on your team wiki.
+
.highlightme {background-color: #FFFF00;}
-
</p>
+
-
<p>
+
#alertContainer { margin-bottom: 10px; width: 936px;}
-
Remember that the goal of proper part documentation is to describe and define a part, so that it can be used without a need to refer to the primary literature. Registry users in future years should be able to read your documentation and be able to use the part successfully. Also, you should provide proper references to acknowledge previous authors and to provide for users who wish to know more.
+
#annContainer {margin-left: 8px;}
-
</p>
+
#newsContainer {border: 1px solid #ccc;}
 +
.newsTitle {
 +
display: block;
 +
color: #414141;
 +
font-size: 25px; 
 +
        font-family: Georgia, Times, "Times New Roman", serif;
 +
padding: 10px 15px 5px 10px;
 +
border-bottom: 1px solid #ccc;
 +
margin-bottom: 0px;
 +
}
 +
.newsItem {
 +
border-bottom: 1px solid #ccc;
 +
display: block;
 +
padding: 5px 15px 0px 10px;
 +
margin-bottom: 0px;
 +
}
-
<h3>When should you put parts into the Registry?</h3>
+
.newsItem h3 {
 +
width: auto;
 +
display: inline;
 +
font-size: 14px;
 +
font-family: Arial, Helvetica, sans-serif;
 +
padding: 0px;
 +
margin: 0px;
 +
}
-
<p>
+
.newsItem img {
-
As soon as possible! We encourage teams to start completing documentation for their parts on the Registry as soon as you have it available. The sooner you put up your parts, the better recall you will have of all details surrounding your parts. Remember you don't need to send us the DNA to create an entry for a part on the Registry. However, you must send us the sample/DNA before the Jamboree. Only parts for which you have sent us samples/DNA are eligible for awards and medal requirements.
+
float: right;
-
</p>
+
clear: right;
-
</td>
+
width: 80px;
 +
padding-left: 15px;
 +
display: inline-block;
 +
}
-
<td > </td>
+
.newsItem .newsDate {
-
<td width="45%" valign="top">
+
font-style: italic;
 +
font-size: 14px;
 +
display: inline-block;
 +
color: #999;
 +
float: right;
 +
padding: 0px 0px 10px 15px;
 +
}
 +
.newsItem p, .newsItem ul, .newsItem li {
 +
padding: 0px;
 +
margin-left: 20px;
 +
font-size: 12px;
 +
line-height: 1.2;
 +
}
 +
 +
.newsItem p {margin-top: 10px;}
 +
 +
.annItem {
 +
border: 2px solid #414141;
 +
display: block;
 +
padding: 0px 15px 10px 10px;
 +
margin-bottom: 18px;
 +
position: relative;
 +
height: 160px;
 +
vertical-align: middle;
 +
}
 +
 +
.annItem .annCentered {
 +
display: table-cell;
 +
vertical-align: middle;
 +
height: 160px;
 +
}
 +
 +
.annCentered h3 {
 +
padding: 0px;
 +
display: block;
 +
margin-left: auto;
 +
margin-right: auto;
 +
text-align: center;
 +
}
 +
 +
.annItem ul, .annItem li {padding: 0px; margin: 0px;}
 +
.annItem li {list-style: none; margin: 5px}
 +
</style>
 +
 +
 
 +
 
 +
    </head>
 +
 +
 +
<body>
 +
<div class="container-fluid" id="allHome">
 +
       
 +
 
 +
<div class="container-fluid">
 +
           
 +
            <!--navbar -->
 +
       
 +
            <nav class="navbar navbar-header nav-justified" role="navigation" id='nav'>
 +
                <div class="btn-group  btn-group btn-group-justified">
 +
                <ul class="nav  navbar-nav" role="navigation" id='nav'>
 +
                    <li class = "active"><div class="btn btn-lg" id="home">Home</div></li>
 +
                    <li><div class="btn btn-lg" id="team">Team</div></li>
 +
 +
                    <li class="dropdown">
 +
              <div class="btn btn-lg dropdown-toggle" data-toggle="dropdown" id="project">Project <span class="caret"></span></div>
 +
              <ul class="dropdown-menu" role="menu">
 +
                <li id = "database"><a href = "#">Database</a></li>
 +
                <li id = "traversal"><a href = "#">Traversal algorithms</a></li>
 +
                <li id = "app"><a href = "#">Web application</a></li>
 +
                <li id = "parts"><a href = "#">Parts</a></li>
 +
                <li id = "modeling"><a href = "#">Modeling</a></li>
 +
              </ul>
 +
            </li>
 +
                    </ul>
 +
                    <ul class="nav  navbar-nav" role="navigation" id='nav'>
 +
                    <li><div class="btn btn-lg" id="notebook">Notebook</div></li>
 +
                    <li><div class="btn btn-lg" id="safety">Safety</div></li>
 +
                    <li><div class="btn btn-lg" id="achieve">Software Achievements</div></li>
 +
                    <li><div class="btn btn-lg" id="attributions">Attributions</div></li>
 +
                    </ul>
 +
              </div>
 +
             
 +
               
 +
               
 +
        </nav>
 +
     
 +
        </div>
 +
 +
<!--slider-->
 +
 +
<!--<div id="thumbnail-preview-indicators" class="carousel slide" data-ride="carousel">
 +
         
 +
          <ol class="carousel-indicators">
 +
            <li data-target="#thumbnail-preview-indicators" data-slide-to="0" class="active">
 +
              <div class="thumbnail">
 +
                <img class="img-responsive" src="">
 +
              </div>
 +
            </li>
 +
            <li data-target="#thumbnail-preview-indicators" data-slide-to="1">
 +
            <div class="thumbnail">
 +
                <img class="img-responsive" src="">
 +
              </div>
 +
            </li>
 +
            <li data-target="#thumbnail-preview-indicators" data-slide-to="2">
 +
            <div class="thumbnail">
 +
                <img class="img-responsive" src="">
 +
              </div>
 +
            </li>
 +
          </ol>
 +
          <div class="carousel-inner">
 +
            <div class="item slides active">
 +
              <div class="slide-1"></div>
 +
              <div class="container">
 +
                <div class="carousel-caption">
 +
                  <h1>SBiDer</h1>
 +
                  <p>Our site</p>
 +
               
 +
                </div>
 +
              </div>
 +
            </div>
 +
            <div class="item slides">
 +
              <div class="slide-2"></div>
 +
              <div class="container">
 +
                <div class="carousel-caption">
 +
                  <h1>Another example headline.</h1>
 +
                  <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
 +
                  <p><a class="btn btn-lg btn-primary" href="#" role="button">Learn more</a></p>
 +
                </div>
 +
              </div>
 +
            </div>
 +
            <div class="item slides">
 +
              <div class="slide-3"></div>
 +
              <div class="container">
 +
                <div class="carousel-caption">
 +
                  <h1>One more for good measure.</h1>
 +
                  <p>Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
 +
                  <p><a class="btn btn-lg btn-primary" href="#" role="button">Browse gallery</a></p>
 +
                </div>
 +
              </div>
 +
            </div>
 +
          </div>
 +
          <a class="left carousel-control" href="#thumbnail-preview-indicators" role="button" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
 +
          <a class="right carousel-control" href="#thumbnail-preview-indicators" role="button" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
 +
      </div>
 +
 +
 +
 +
 +
<!--slider end-->
 +
 +
 +
 +
 +
<div class = "neighborhood-guides">
 +
        <div class = "container">
 +
<h1>SBiDer: Synthetic Biocircuit Developer <p class = "pull-right"><img src = "https://raw.githubusercontent.com/igemsoftware/UCSD-iGEM_2014/Valeriy/CircuitNetwork/web/ProfilePics/igemlogo.png" height = 100px width = 100px></p></h1>
 +
<h3>Abstract</h3>
<p>
<p>
-
The information needed to initially create a part on the Registry is:
+
Genetic circuits are often difficult to engineer, requiring months to design, build, and test each individual genetic device involved in the circuit. SBiDer, a web tool developed by the UCSD Software iGEM team, will leverage existing devices to construct a database with consideration for the function of each device interpreted as boolean logic. The data can be queried by the user through SBiDer's visual interface to explore circuit designs. The displayed circuit's literature reference, characterization data, and images of included devices can be viewed through the built-in table. Basic validation of the circuit performance is also provided within in the interface. SBiDer's web of information can be expanded through user-generated additions to the database to improve the efficiency of the application and the accuracy of the models. 
 +
<p>
 +
 
 +
<h1>Project Description</h1>
 +
<h3>Problem Statement</h3>
 +
<p>
 +
Synthetic genetic circuits created by synthetic biologists have yielded exciting applications such as biofuels production and cancer killing bacteria. These circuits are often difficult to engineer, requiring months to design, build, and test each individual genetic device involved in the circuit. Although there are many genetic devices that have been built, re-using these devices often requires a time-consuming review of the literature. The UCSD Software iGEM team will address this challenge by creating a web-tool that leverages existing genetic devices to create complex genetic circuits. We will accomplish this by:
</p>
</p>
<ol>
<ol>
-
 
+
<li>building a comprehensive database that captures the behavior, composition, and interactions of existing genetic devices in the literature</li>
-
<li>Part Name</li>
+
<li>constructing and visualizing the network of all synthetic genetic circuits that can interact with one another</li>
-
<li>Part type</li>
+
<li>devising algorithms to search this network for the set of genetic devices that can be used to construct a complex genetic circuit.</li>
-
<li>Creator</li>
+
<li>Perform some basic validation via kinetic modelling.</li>
-
<li>Sequence</li>
+
-
<li>Short Description (60 characters on what the DNA does)</li>
+
-
<li>Long Description (Longer description of what the DNA does)</li>
+
-
<li>Design considerations</li>
+
</ol>
</ol>
-
 
+
<h3>Aim 1 - Building a Database</h3>
<p>
<p>
-
We encourage you to put up <em>much more</em> information as you gather it over the summer. If you have images, plots, characterization data and other information, please also put it up on the part page. Check out part <a href="http://parts.igem.org/Part:BBa_K404003">BBa_K404003</a> for an excellent example of a highly characterized part.
+
We will mine the scientific literature for existing genetic devices and then construct a database that captures device characteristics such as:
</p>
</p>
-
 
+
<ol>
 +
<li>composition of devices</li>
 +
<li>function</li>
 +
<li>characterization data</li>
 +
<li>literature reference</li>
 +
</ol>
 +
We will design our database by rigorously constructing an entity relationship diagram and then normalizing these relationships to construct tables for a relational database.
 +
<h3>Aim 2 - Constructing Network of Interacting Devices</h3>
 +
<p>
 +
We will connect known genetic devices together via device input and outputs to create a network of devices that can interact. We define a genetic device as a DNA construct transformed into cells that can cause expression of some protein in response to stimuli (or input). We will  develop a web interface to facilitate access to the complex network that we have constructed. Our Web interface makes extensive use of Cytoscape, an open source bioinformatics software package for metabolic network visualization and simulation.  In addition, the interface will generate SBOL Visual Images, a standard language that is easily understood by synthetic biologists all over the world.  Users can also update our database with additional devices through this interface.  Using the Cynetshare framework, users can share their circuit designs</p>
 +
<h3>Aim 3 - Searching the Network</h3>
<p>
<p>
-
You can add parts to the Registry at our <a href="http://parts.igem.org/Add_a_Part_to_the_Registry"> Add a Part to the Registry</a> link.
+
This interface will allow researchers to query our database network for a circuit design expressed as logical operators such as “AND”, “OR”, and “NOR”, and retrieve the subnetwork of genetic devices that satisfies the circuit design. To Perform our search  we modified several traditional graph search algorithms to traverse this graph, including but not limited to Prim’s algorithm (minimum spanning tree), Dijkstra’s algorithm and a breadth-first search. Results are visualized graphically in our web interface.  
</p>
</p>
-
</td>
+
</div>
-
</tr>
+
</div>
 +
<script>
 +
$(document).ready(function(){
 +
    //redirecting to other pages
 +
    $('h1.firstHeading').remove();
 +
    $("#home").click(function(){
 +
      window.location.href="https://2014.igem.org/Team:UCSD_Software";
 +
    });
 +
   
 +
    $("#database").click(function(){
 +
      window.location.href="https://2014.igem.org/Team:UCSD_Software/Database";
 +
    }); 
 +
   
 +
    $("#database").click(function(){
 +
      window.location.href="https://2014.igem.org/Team:UCSD_Software/Database";
 +
    }); 
 +
 
 +
    $("#app").click(function(){
 +
      window.location.href="https://2014.igem.org/Team:UCSD_Software/App";
 +
    }); 
-
<tr> <td colspan="3" height="15px"> </td></tr>
+
    $("#parts").click(function(){
 +
      window.location.href="https://2014.igem.org/Team:UCSD_Software/Parts";
 +
    }); 
-
<tr><td colspan="3" > <h3> Parts Table</h3></td></tr>
+
    $("#modeling").click(function(){
 +
      window.location.href="https://2014.igem.org/Team:UCSD_Software/Modeling";
 +
    }); 
-
<tr><td width="45%" colspan="3"  valign="top">
+
    $("#traversal").click(function(){
-
Any parts your team has created will appear in this table below:</td></tr>
+
      window.location.href="https://2014.igem.org/Team:UCSD_Software/Traversal";
-
 
+
    }); 
-
</table>
+
   
 +
    $("#team").click(function(){
 +
      window.location.href="https://2014.igem.org/Team:UCSD_Software/Teaml";
 +
    });
 +
    $("#officialTeam").click(function(){
 +
      window.location.href="https://igem.org/Team.cgi?year=2013&team_name=UCSD_Software";
 +
    });
 +
    /*$("#project").click(function(){
 +
      window.location.href="https://2014.igem.org/Team:UCSD_Software/Project";
 +
    });*/
 +
   
 +
    $("#notebook").click(function(){
 +
      window.location.href="https://2014.igem.org/Team:UCSD_Software/Notebook";
 +
    });
 +
    $("#achieve").click(function(){
 +
      window.location.href="https://2014.igem.org/Team:UCSD_Software/SoftwareAchievements";
 +
    });
 +
    $("#safety").click(function(){
 +
      window.location.href="https://2014.igem.org/Team:UCSD_Software/Safety";
 +
    });
 +
    $("#attributions").click(function(){
 +
      window.location.href="https://2014.igem.org/Team:UCSD_Software/Attributions";
 +
    });
 +
   
 +
    });
 +
</script>
 +
</body>
</html>
</html>
-
 
-
<groupparts>iGEM013 UCSD_Software</groupparts>
 

Latest revision as of 00:48, 14 October 2014


SBiDer: Synthetic Biocircuit Developer

Abstract

Genetic circuits are often difficult to engineer, requiring months to design, build, and test each individual genetic device involved in the circuit. SBiDer, a web tool developed by the UCSD Software iGEM team, will leverage existing devices to construct a database with consideration for the function of each device interpreted as boolean logic. The data can be queried by the user through SBiDer's visual interface to explore circuit designs. The displayed circuit's literature reference, characterization data, and images of included devices can be viewed through the built-in table. Basic validation of the circuit performance is also provided within in the interface. SBiDer's web of information can be expanded through user-generated additions to the database to improve the efficiency of the application and the accuracy of the models.

Project Description

Problem Statement

Synthetic genetic circuits created by synthetic biologists have yielded exciting applications such as biofuels production and cancer killing bacteria. These circuits are often difficult to engineer, requiring months to design, build, and test each individual genetic device involved in the circuit. Although there are many genetic devices that have been built, re-using these devices often requires a time-consuming review of the literature. The UCSD Software iGEM team will address this challenge by creating a web-tool that leverages existing genetic devices to create complex genetic circuits. We will accomplish this by:

  1. building a comprehensive database that captures the behavior, composition, and interactions of existing genetic devices in the literature
  2. constructing and visualizing the network of all synthetic genetic circuits that can interact with one another
  3. devising algorithms to search this network for the set of genetic devices that can be used to construct a complex genetic circuit.
  4. Perform some basic validation via kinetic modelling.

Aim 1 - Building a Database

We will mine the scientific literature for existing genetic devices and then construct a database that captures device characteristics such as:

  1. composition of devices
  2. function
  3. characterization data
  4. literature reference
We will design our database by rigorously constructing an entity relationship diagram and then normalizing these relationships to construct tables for a relational database.

Aim 2 - Constructing Network of Interacting Devices

We will connect known genetic devices together via device input and outputs to create a network of devices that can interact. We define a genetic device as a DNA construct transformed into cells that can cause expression of some protein in response to stimuli (or input). We will develop a web interface to facilitate access to the complex network that we have constructed. Our Web interface makes extensive use of Cytoscape, an open source bioinformatics software package for metabolic network visualization and simulation. In addition, the interface will generate SBOL Visual Images, a standard language that is easily understood by synthetic biologists all over the world. Users can also update our database with additional devices through this interface. Using the Cynetshare framework, users can share their circuit designs

Aim 3 - Searching the Network

This interface will allow researchers to query our database network for a circuit design expressed as logical operators such as “AND”, “OR”, and “NOR”, and retrieve the subnetwork of genetic devices that satisfies the circuit design. To Perform our search we modified several traditional graph search algorithms to traverse this graph, including but not limited to Prim’s algorithm (minimum spanning tree), Dijkstra’s algorithm and a breadth-first search. Results are visualized graphically in our web interface.

Retrieved from "http://2014.igem.org/Team:UCSD_Software/Parts"