Team:SUSTC-Shenzhen-B/circuit.html

From 2013.igem.org

(Difference between revisions)
(Created page with "<html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <script src="http://code.jquery.com/jquery-2.0.3.min.js"></script> ...")
 
(20 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
-
<head>
+
  <head>
-
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
+
    <meta charset="utf-8" />
-
                <script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
+
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
-
                <script type="text/javascript" src="https://2013.igem.org/SUSTC-SZ-B_2013iGEM/JS/bootstrap.min.js?action=raw&amp;ctype=text/javascript"></script>
+
-
                <link type="text/css" rel="stylesheet" href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/CSS/style.css?action=raw&amp;ctype=text/css" />
+
-
<link type="text/css" rel="stylesheet" href="https://2013.igem.org/SUSTC-SZ-B_2013iGEM/CSS/bootstrap.min.css?action=raw&amp;ctype=text/css" />
+
-
<link type="text/css" rel="stylesheet" href="https://2013.igem.org/SUSTC-SZ-B_2013iGEM/CSS/bootstrap-responsive.min.css?action=raw&amp;ctype=text/css" />
+
-
<style type="text/css">
+
-
p {
+
-
text-indent: 2em;
+
-
}
+
-
#content-inner {
+
-
margin: 82px;
+
-
}
+
-
</style>
+
-
                <script>
+
-
$(document).ready(function(){
+
-
                        $("head style").remove();
+
-
                        $("#top-section").remove();
+
-
                        $("#top").remove();
+
-
                        $("#siteSub").remove();
+
-
                        $("#footer-box").remove(); 
+
-
                        $(".printfooter").remove();   
+
-
                        $(".firstHeading").remove();               
+
-
});
+
-
</script>
+
-
</head>
+
-
<body data-spy="scroll" data-target=".bs-docs-sidebar">
+
-
<div class="navbar navbar-inverse navbar-fixed-top">
+
-
  <div class="navbar-inner">
+
-
    <div class="container">
+
-
      <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
+
-
        <span class="icon-bar"></span>
+
-
        <span class="icon-bar"></span>
+
-
        <span class="icon-bar"></span>
+
-
      </a>
+
-
      <ul class="nav">
+
-
  <li class="dropdown"><a id="iGEM_nav" href="#" class="dropdown-toggle" data-toggle="dropdown"><img src="https://static.igem.org/mediawiki/2013/2/26/2013ustcigem_IGEM_basic_Logo.png" /><b class="caret"></b></a>
+
-
    <ul class="dropdown-menu">
+
-
                                                        <li><a href="2013.igem.org">Back to iGEM Homepage</a></li>
+
-
                                                        <li><a href="https://igem.org/Team_Wikis?year=2013">Back to iGEM Wiki Page</a></li>
+
-
                                                        <li class="divider"></li>
+
-
                                                        <li><a href="/wiki/index.php?title=Team:SUSTC-Shenzhen-B/project.html&amp;action=edit">Edit</a></li>
+
-
                                                        <li><a href="/wiki/index.php?title=Team:SUSTC-Shenzhen-B/project.html&amp;action=history">History</a></li>
+
-
                                                        <li><a href="https://igem.org/User_Information">My Account</a></li>
+
-
    </ul>
+
-
  </li>
+
-
</ul>
+
-
      <div class="nav-collapse collapse">
+
-
      <ul class="nav">
+
-
                                                        <li class="active dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Project<b class="caret"></b></a>
+
-
                        <ul class="dropdown-menu">
+
-
                          <li><a href="project.html">Overview</a></li>
+
-
                          <li><a href="circuit.html">Circuit Registry</a></li>
+
-
                          <li><a href="lgd.html">LGD</a></li>
+
-
                          <li><a href="clotho.html">Clotho</a></li>
+
-
                          <li><a href="safty.html">Safety Form</a></li>
+
-
                          <li><a href="achievement.html">Achievement</a></li>
+
-
                                                                    </ul>
+
-
                                                        </li>
+
-
                                                        <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Team<b class="caret"></b></a>
+
-
                        <ul class="dropdown-menu">
+
-
                          <li><a href="team.html">Team Member</a></li>
+
-
                          <li><a href="lgd.html">Contribution</a></li>
+
-
                          <li><a href="sustc.html">About SUSTC</a></li>
+
-
                          <li><a href="notebook.html">Notebook</a></li>
+
-
                                                                    </ul>
+
-
                                                        </li>
+
-
                                                        <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Human Practice<b class="caret"></b></a>
+
-
                        <ul class="dropdown-menu">
+
-
                          <li><a href="team.html">Team Member</a></li>
+
-
                          <li><a href="lgd.html">Contribution</a></li>
+
-
                          <li><a href="sustc.html">About SUSTC</a></li>
+
-
                          <li><a href="notebook.html">Notebook</a></li>
+
-
                                                                    </ul>
+
-
                                                        </li>
+
-
  <li><a href="thank.html">Special Thanks</a></li>
+
-
</ul>
+
-
      </div>
+
-
    </div>
+
-
  </div>
+
-
</div>
+
-
<div id="content-inner" class="container">
+
-
<div class="row">
+
-
<div class="span3 bs-docs-sidebar">
+
-
<ul class="nav nav-list" data-spy="affix" data-offset-top="200">
+
-
  <li class="active"><a href="#introduction">Introduction</a></li>
+
-
                                                <li><a href="#mindroad">Mind Road</a></li>
+
-
                                                <li><a href="#lgd">LGD</a></li>
+
-
                                                <li><a href="#ttec">TTEC on Clotho</a></li>
+
-
                                                <li><a href="#future">Future Plan</a></li>
+
-
  <li><a href="#tutorial">Tutorial</a></li>
+
-
  <li><a href="#feedback">Feedback</a></li>
+
-
  <li><a href="#safety">Safety Form</a></li>
+
-
  <li><a href="#achievement">Achievement</a></li>
+
-
</ul>
+
-
</div>
+
-
<div class="span9">
+
-
<h2 id="background">Background</h2>
+
-
<p>Before we got our idea, we had reviewed all the software projects of the last three years and classified them into 6 categories (fig1). As showing in the picture, designing CAD takes up the majority of these projects. As expected, most of them share the similar ideas. After a certain time of thinking, we found that it is really reasonable that iGem software projects can hardly be quite innovative, for the lack of professional knowledge and the limitation of the usage of software during synthetic biology study. But also, if we continue to follow these ideas, our project is far away from being creative or original. Then it occurred to us, why don’t we write a program to help at least the wet lab members to get new ideas? Thus, we decided to make a difference, to create our own Mind Road—— a net structural mind map—— to assist either iGEMers or professional synthetic biology researchers to come up with and share their ideas.</p>
+
-
<p>Even though the mind map idea is good, it is not good enough. What’s more, comparing with computer software, synthetic biology lacks such community for knowledge and skills exchange, like GitHub. So setting Mind Road as the theme, we decided to take a bold step, to establish a simple and free online platform with high interaction ability intended for everyone interested in synthetic biology.</p>
+
-
<h2 id="introduction">Introduction</h2>
+
-
<h3>Mind Road</h3>
+
-
<p>A useful net structural mind map to help users know what the existing synthetic biology projects and what else they can do.</p>
+
-
<h3>LGD</h3>
+
-
<p>Short for logical genetic designer, LGD is a genetic circuit CAD that can present the detail information of the engineering bacteria and “calculate” the relationship of related parts based on our database.</p>
+
-
<h3>TTEC</h3>
+
-
<p>TTEC is the abbreviation of Transcriptional Terminator Efficiency Calculator. It is the last year’s project of SUSTC and can calculate the efficiency of a terminator. TTEC plays an important role of building up our synthetic biology community in the future.</p>
+
-
<h2 id="circuit">Circuit Registry</h2>
+
    <meta name="description" content="" />
-
                                        <h4>Mind Road</h4>
+
    <meta name="author" content="SUSTC-ShenZhen-B" />
-
<p>We want to establish a user-friendly web2.0 platform which can function as both a handy tool kit and a community. There are mainly 3 reasons that we choose a webpage instead of a native application. First, current software need to users don’t need to download our software. Second, a webpage is not limited with the system, which means users can log in our webpage wherever they can reach the internet. And the last, all the information can be stored by the cloud, so users don’t have to worry about their information being lost.</p>
+
 
-
                                        <h4>Circuit List</h4>
+
    <title>SUSTC-ShenZhen-B</title>
-
<p>We want to establish a user-friendly web2.0 platform which can function as both a handy tool kit and a community. There are mainly 3 reasons that we choose a webpage instead of a native application. First, current software need to users don’t need to download our software. Second, a webpage is not limited with the system, which means users can log in our webpage wherever they can reach the internet. And the last, all the information can be stored by the cloud, so users don’t have to worry about their information being lost.</p>
+
 
-
<h2 id="lgd">LGD</h2>
+
    <style type="text/css">
-
<p>We want to establish a user-friendly web2.0 platform which can function as both a handy tool kit and a community. There are mainly 3 reasons that we choose a webpage instead of a native application. First, current software need to users don’t need to download our software. Second, a webpage is not limited with the system, which means users can log in our webpage wherever they can reach the internet. And the last, all the information can be stored by the cloud, so users don’t have to worry about their information being lost.</p>
+
      #globalWrapper {width: 100%;font-size: 100%;}
-
<h2 id="ttec">TTEC on Clotho</h2>
+
      #top-section {width: 100%; height:100%; border:none;}
-
<p>We want to establish a user-friendly web2.0 platform which can function as both a handy tool kit and a community. There are mainly 3 reasons that we choose a webpage instead of a native application. First, current software need to users don’t need to download our software. Second, a webpage is not limited with the system, which means users can log in our webpage wherever they can reach the internet. And the last, all the information can be stored by the cloud, so users don’t have to worry about their information being lost.</p>
+
      #p-logo {display:none;}
-
<h2 id="tutorial">Tutorial</h2>
+
      #search-controls {display:none;}
-
<p>We want to establish a user-friendly web2.0 platform which can function as both a handy tool kit and a community. There are mainly 3 reasons that we choose a webpage instead of a native application. First, current software need to users don’t need to download our software. Second, a webpage is not limited with the system, which means users can log in our webpage wherever they can reach the internet. And the last, all the information can be stored by the cloud, so users don’t have to worry about their information being lost.</p>
+
      .printfooter {display:none;}
-
<h2 id="feedback">Feedback</h2>
+
      #footer-box {border:none;}
-
<p>We want to establish a user-friendly web2.0 platform which can function as both a handy tool kit and a community. There are mainly 3 reasons that we choose a webpage instead of a native application. First, current software need to users don’t need to download our software. Second, a webpage is not limited with the system, which means users can log in our webpage wherever they can reach the internet. And the last, all the information can be stored by the cloud, so users don’t have to worry about their information being lost.</p>
+
      .firstHeading {display:none;}
-
<h2 id="safety">Safety Form</h2>
+
      #content { border:none !important; width:1024px !important; background: url('') !important;}
-
<p>We want to establish a user-friendly web2.0 platform which can function as both a handy tool kit and a community. There are mainly 3 reasons that we choose a webpage instead of a native application. First, current software need to users don’t need to download our software. Second, a webpage is not limited with the system, which means users can log in our webpage wherever they can reach the internet. And the last, all the information can be stored by the cloud, so users don’t have to worry about their information being lost.</p>
+
      #bodyContent {border:none;}
-
<h2 id="achievement">Achievement</h2>
+
      #catlinks {display:none;}
-
<p>We want to establish a user-friendly web2.0 platform which can function as both a handy tool kit and a community. There are mainly 3 reasons that we choose a webpage instead of a native application. First, current software need to users don’t need to download our software. Second, a webpage is not limited with the system, which means users can log in our webpage wherever they can reach the internet. And the last, all the information can be stored by the cloud, so users don’t have to worry about their information being lost.</p>
+
      #footer-box {display:none;}
-
</div>
+
      #menubar {display:none;}
-
</div>
+
      body {
-
</div>
+
        padding: 0;
-
</body>
+
      }
 +
 
 +
      .caret {
 +
        display: inline-block;
 +
        width: 0;
 +
        height: 0;
 +
        margin-left: 2px;
 +
        vertical-align: middle;
 +
        border-top: 4px solid #000000;
 +
        border-right: 4px solid transparent;
 +
        border-bottom: 0 dotted;
 +
        border-left: 4px solid transparent;
 +
        content: "";
 +
      }
 +
      .icon.caret {
 +
        opacity: 0.75;
 +
      }
 +
      .white.caret {
 +
        border-top-color: #FFFFFF;
 +
      }
 +
      .main.menu {
 +
        top: 0;
 +
      }
 +
      .script.image {
 +
        display: none;
 +
      }
 +
    </style>
 +
    <link rel="stylesheet" type="text/css" href="/SUSTC-SZ-B_2013iGEM/CSS/wiki-all.min.css?action=raw&amp;ctype=text/css" />
 +
    <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700|Open+Sans:300italic,400,300,700" />
 +
 
 +
  </head>
 +
  <body id="example">
 +
    <div class="ui fixed transparent inverted main menu">
 +
      <div class="container">
 +
        <a href="#" class="brand">SUSTC-ShenZhen-B</a>
 +
        <div class="right menu">
 +
          <a href="https://igem.org/User_Information" class="item">My Account</a>
 +
        </div>
 +
        <div href="/" class="ui dropdown link item">
 +
          iGEM Home
 +
          <span class="icon white caret"></span>
 +
          <div class="menu">
 +
            <a href="https://2013.igem.org/Main_Page" class="item">iGEM homepage</a>
 +
            <a href="/wiki/index.php?title=Team:SUSTC-Shenzhen-B/safety.html&amp;action=edit" class="item">Edit</a>
 +
          </div>
 +
        </div>
 +
        <a href="project.html" class="item">Overview</a>
 +
        <a href="standard.html" class="item">Standard and database</a>
 +
        <div href="/Team:SUSTC-Shenzhen-B/Project" class="ui dropdown link item">
 +
          Software
 +
          <span class="white caret"></span>
 +
          <div class="menu">
 +
            <a href="circuitplus.html" class="item">Circuit+</a>
 +
            <a href="feature.html" class="item">Feature</a>
 +
            <a href="tutorial.html" class="item">Tutorial</a>
 +
            <a href="safety.html" class="item">Safety</a>
 +
            <a href="APIs.html" class="item">APIs</a>
 +
            <a href="feedback.html" class="item">Feedback</a>
 +
            <a href="future.html" class="item">Future</a>
 +
          </div>
 +
        </div>
 +
        <a href="clotho.html" class="item">Clotho</a>
 +
        <a href="lab.html" class="item">Lab management</a>
 +
        <div href="/Team:SUSTC-Shenzhen-B/Project" class="ui dropdown link item">
 +
          Human practice
 +
          <span class="white caret"></span>
 +
          <div class="menu">
 +
            <a href="workshop.html" class="item">Workshop meeting</a>
 +
            <a href="publicity.html" class="item">Publicity</a>
 +
          </div>
 +
        </div>
 +
        <div href="/Team:SUSTC-Shenzhen-B/Project" class="ui dropdown link item active">
 +
          Team
 +
          <span class="white caret"></span>
 +
          <div class="menu">
 +
            <a href="about.html" class="item">About us</a>
 +
            <a href="achievement.html" class="item">Achievement</a>
 +
            <a href="notebook.html" class="item">Notebook</a>
 +
            <a href="acknowledgement.html" class="item">Acknoledgement</a>
 +
          </div>
 +
        </div>
 +
      </div>
 +
    </div>
 +
    <div class="header">
 +
      <div class="segment">
 +
        <div id="overview" class="container">
 +
          <div class="introduction">
 +
            <h1 class="ui dividing header">Achievement</h1>
 +
            <p class="lead">Below are requirements and our achievements.</p>
 +
          </div>
 +
        </div>
 +
      </div>
 +
    </div>
 +
    <div class="main container page">
 +
      <div class="peek">
 +
        <div class="ui vertical pointing secondary menu">
 +
          <a class="active item">Bronze Medal requiement</a>
 +
          <a class="active item">Silver Medal requirement</a>
 +
          <a class="active item">Gold Medal requirement</a>
 +
        </div>
 +
      </div>
 +
      <div class="page-container">
 +
        <h2 class="ui dividing header">Bronze Medal requirement</h2>
 +
        <section id="motivation"></section>
 +
        <p>To earn a Silver Medal, in addition to the Bronze Medal requirements, a team must do ONE of the following:</p>
 +
        <table class='ui table segment'>
 +
          <thead>
 +
            <tr>
 +
              <th>Requirement</th>
 +
              <th>Achievement</th>
 +
            </tr>
 +
          </thead>
 +
          <tbody>
 +
              <tr>
 +
                <td>
 +
                  Provide a detailed, draft specification for the next version of your software tool
 +
                </td>
 +
                <td>
 +
                  See <a href="future.html" target="_blank">future</a> part of this wiki.
 +
                </td>
 +
              </tr>
 +
              <tr>
 +
                <td>
 +
                  Provide a second, distinct (yet complementary) software tools project.
 +
                </td>
 +
                <td>
 +
                  We have put <a href="clotho.html" target="_blank">Circuit List</a>, which is Clotho verion of Circuit+.
 +
                </td>
 +
              </tr>
 +
              <tr>
 +
                <td>
 +
                  Provide a demonstration of their software either as a textual or video tutorial made available on their wiki. This tutorial should explain all the features of the tool as well as provide sample input and output as appropriate.
 +
                <td>
 +
                  See <a href="tutorial.html" target="_blank">tutorial</a> part of this wiki.
 +
                </td>
 +
              </tr>
 +
          </tbody>
 +
        </table>
 +
        <h2 class="ui dividing header">Privacy policy</h2>
 +
        <section id="motivation"></section>
 +
      </div>
 +
    </div>
 +
 
 +
    <div class="footer">
 +
      <div class="ui divider">
 +
      </div>
 +
      <div class="ui divided horizontal footer link list">
 +
        <div class="item">
 +
          &copy; SUSTC-ShenZhen-B
 +
        </div>
 +
      </div>
 +
    </div>
 +
 
 +
    <script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
 +
    <script type="text/javascript" src="https://2013.igem.org/SUSTC-SZ-B_2013iGEM/JS/wiki-all.min.js?action=raw&amp;ctype=text/javascript"></script>
 +
 
 +
    <script type="text/javascript">
 +
      function png2text(pngurl, id, callback) {
 +
        var canvas = document.createElement("canvas"),
 +
        ctx = canvas.getContext("2d");
 +
        img = new Image();
 +
   
 +
        img.id = 'pt-' + id;
 +
        img.className = 'script image';
 +
        img.style.position = "absolute";
 +
        img.style.left = "-10000px";
 +
        document.body.appendChild(img);
 +
 
 +
        img.onload = function() {
 +
          var
 +
            w = this.width,
 +
            h = this.height;
 +
 
 +
          canvas.width = w;
 +
          canvas.height = h;
 +
          canvas.style.width = w+"px";
 +
          canvas.style.height = h+"px";
 +
 
 +
          ctx.drawImage(this, 0, 0);
 +
 
 +
          var data = ctx.getImageData(0, 0, w, h).data,
 +
            a = [],
 +
            len = data.length,
 +
            p = -1;
 +
         
 +
          for (var i=0; i < len; i += 4) {
 +
            if (data[i] > 0)
 +
              a[++p] = String.fromCharCode(data[i]);
 +
          };
 +
 
 +
          canvas = undefined;
 +
          try {
 +
            //document.body.removeChild(img);
 +
            $('#pt-' + id).remove();
 +
          } catch (e) {
 +
          }
 +
 
 +
          if (callback) callback(a.join(""));
 +
        };
 +
 
 +
        img.src = pngurl;
 +
      }
 +
 
 +
      function baseRemove() {
 +
        $('#top-section').remove();
 +
        $('#content').attr('id', '');
 +
        $('#bodyContent').attr('id', '');
 +
        $('#globalWrapper').attr('id', '');
 +
 
 +
        $('.main.container.page').parent().attr('id', 'example');
 +
      }
 +
 
 +
      function loadJavascript() {
 +
        /* $.get("https://2013.igem.org/SUSTC-SZ-B_2013iGEM/JS/wiki-all.min.js?action=raw&ctype=text/javascript", function (data) {
 +
          eval(data);
 +
        }); */
 +
        /* png2text('https://static.igem.org/mediawiki/2013/4/43/Wiki-all-min-js.png', 'wiki-all', function (text) {
 +
          eval(text);
 +
        }); */
 +
      }
 +
 
 +
      $(document).ready(function () {
 +
        baseRemove();
 +
        loadJavascript();
 +
      });
 +
    </script>
 +
  </body>
</html>
</html>

Latest revision as of 09:01, 28 October 2013

SUSTC-ShenZhen-B

SUSTC-ShenZhen-B
My Account
iGEM Home
iGEM homepage Edit
Overview Standard and database
Software
Circuit+ Feature Tutorial Safety APIs Feedback Future
Clotho Lab management
Human practice
Workshop meeting Publicity
Team
About us Achievement Notebook Acknoledgement

Achievement

Below are requirements and our achievements.

Bronze Medal requiement Silver Medal requirement Gold Medal requirement

Bronze Medal requirement

To earn a Silver Medal, in addition to the Bronze Medal requirements, a team must do ONE of the following:

Requirement Achievement
Provide a detailed, draft specification for the next version of your software tool See future part of this wiki.
Provide a second, distinct (yet complementary) software tools project. We have put Circuit List, which is Clotho verion of Circuit+.
Provide a demonstration of their software either as a textual or video tutorial made available on their wiki. This tutorial should explain all the features of the tool as well as provide sample input and output as appropriate. See tutorial part of this wiki.

Privacy policy

© SUSTC-ShenZhen-B

Retrieved from "http://2013.igem.org/Team:SUSTC-Shenzhen-B/circuit.html"