Team:SUSTC-Shenzhen-B/clotho.html

From 2013.igem.org

(Difference between revisions)
m
 
(16 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" />
+
    <meta name="description" content="" />
-
<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" />
+
    <meta name="author" content="SUSTC-ShenZhen-B" />
-
<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">
+
    <title>SUSTC-ShenZhen-B</title>
-
p {
+
 
-
text-indent: 2em;
+
    <style type="text/css">
-
}
+
      #globalWrapper {width: 100%;font-size: 100%;}
-
#content-inner {
+
      #top-section {width: 100%; height:100%; border:none;}
-
margin: 82px;
+
      #p-logo {display:none;}
-
}
+
      #search-controls {display:none;}
-
</style>
+
      .printfooter {display:none;}
-
                <script>
+
      #footer-box {border:none;}
-
$(document).ready(function(){
+
      .firstHeading {display:none;}
-
                        $("head style").remove();
+
      #content { border:none !important; width:1024px !important; background: url('') !important;}
-
                        $("#top-section").remove();
+
      #bodyContent {border:none;}
-
                        $("#top").remove();
+
      #catlinks {display:none;}
-
                        $("#siteSub").remove();
+
      #footer-box {display:none;}
-
                        $("#footer-box").remove();    
+
      #menubar {display:none;}
-
                        $(".printfooter").remove();   
+
      body {
-
                        $(".firstHeading").remove();               
+
        padding: 0;
-
});
+
      }
-
</script>
+
 
-
</head>
+
      .caret {
-
<body data-spy="scroll" data-target=".bs-docs-sidebar">
+
        display: inline-block;
-
<div class="navbar navbar-inverse navbar-fixed-top">
+
        width: 0;
-
  <div class="navbar-inner">
+
        height: 0;
-
    <div class="container">
+
        margin-left: 2px;
-
      <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
+
        vertical-align: middle;
-
        <span class="icon-bar"></span>
+
        border-top: 4px solid #000000;
-
        <span class="icon-bar"></span>
+
        border-right: 4px solid transparent;
-
        <span class="icon-bar"></span>
+
        border-bottom: 0 dotted;
-
      </a>
+
        border-left: 4px solid transparent;
-
      <ul class="nav">
+
        content: "";
-
  <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">
+
      .icon.caret {
-
                                                        <li><a href="2013.igem.org">Back to iGEM Homepage</a></li>
+
        opacity: 0.75;
-
                                                        <li><a href="https://igem.org/Team_Wikis?year=2013">Back to iGEM Wiki Page</a></li>
+
      }
-
                                                        <li class="divider"></li>
+
      .white.caret {
-
                                                        <li><a href="/wiki/index.php?title=Team:SUSTC-Shenzhen-B/clotho.html&amp;action=edit">Edit</a></li>
+
        border-top-color: #FFFFFF;
-
                                                        <li><a href="/wiki/index.php?title=Team:SUSTC-Shenzhen-B/clotho.html&amp;action=history">History</a></li>
+
      }
-
                                                        <li><a href="https://igem.org/User_Information">My Account</a></li>
+
      .main.menu {
-
    </ul>
+
        top: 0;
-
  </li>
+
      }
-
</ul>
+
      .script.image {
-
      <div class="nav-collapse collapse">
+
        display: none;
-
      <ul class="nav">
+
      }
-
                                                        <li class="active dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Project<b class="caret"></b></a>
+
      .minimize {
-
                        <ul class="dropdown-menu">
+
        max-width: 90%;
-
                          <li><a href="project.html">Overview</a></li>
+
      }
-
                          <li><a href="circuit.html">Circuit Registry</a></li>
+
    </style>
-
                          <li><a href="lgd.html">LGD</a></li>
+
    <link rel="stylesheet" type="text/css" href="/SUSTC-SZ-B_2013iGEM/CSS/wiki-all.min.css?action=raw&amp;ctype=text/css" />
-
                          <li><a href="clotho.html">Clotho</a></li>
+
    <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700|Open+Sans:300italic,400,300,700" />
-
                          <li><a href="safty.html">Safety Form</a></li>
+
 
-
                          <li><a href="achievement.html">Achievement</a></li>
+
   </head>
-
                                                                    </ul>
+
  <body id="example">
-
                                                        </li>
+
    <div class="ui fixed transparent inverted main menu">
-
                                                        <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Team<b class="caret"></b></a>
+
      <div class="container">
-
                        <ul class="dropdown-menu">
+
        <a href="#" class="brand">SUSTC-ShenZhen-B</a>
-
                          <li><a href="team.html">Team Member</a></li>
+
        <div class="right menu">
-
                          <li><a href="sustc.html">About SUSTC</a></li>
+
          <a href="http://circuitplus.org" class="item">Visit Circuit+</a>
-
                          <li><a href="notebook.html">Notebook</a></li>
+
        </div>
-
                          <li><a href="thank.html">Special Thanks</a></li>
+
        <div href="/" class="ui dropdown link item">
-
                                                                    </ul>
+
          iGEM
-
                                                        </li>
+
          <span class="icon white caret"></span>
-
                                                        <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Human Practice<b class="caret"></b></a>
+
          <div class="menu">
-
                        <ul class="dropdown-menu">
+
            <a href="https://2013.igem.org/Main_Page" class="item">iGEM homepage</a>
-
                          <li><a href="meeting.html">Exchange Meeting</a></li>
+
            <a href="/Team:SUSTC-Shenzhen-B" class="item">wiki homepage</a>
-
                          <li><a href="publicity.html">Publicity</a></li>
+
            <a href="https://igem.org/User_Information" class="item">My Account</a>
-
                          <li><a href="lecture.html">Lecture</a></li>
+
            <a href="/wiki/index.php?title=Team:SUSTC-Shenzhen-B/clotho.html&amp;action=edit" class="item">Edit</a>
-
                                                                    </ul>
+
          </div>
-
                                                        </li>
+
        </div>
-
</ul>
+
        <a href="project.html" class="item">Overview</a>
-
      </div>
+
        <a href="standard.html" class="item">Standard and database</a>
-
    </div>
+
        <div href="/Team:SUSTC-Shenzhen-B/Software" class="ui dropdown link active item">
-
  </div>
+
          Software
-
</div>
+
          <span class="white caret"></span>
-
<div id="content-inner" class="container">
+
          <div class="menu">
-
<div class="row">
+
            <a href="circuitplus.html" class="item">Circuit+</a>
-
<div class="span3 bs-docs-sidebar">
+
            <a href="tutorial.html" class="item">Tutorial</a>
-
<ul class="nav nav-list" data-spy="affix" data-offset-top="200">
+
            <a href="safety.html" class="item">Safety</a>
-
                                                <li class="nav-header">Clotho</li>
+
            <a href="feedback.html" class="item">Feedback</a>
-
  <li class="active"><a href="#introduction">Introduction</a></li>
+
            <a href="future.html" class="item">Future</a>
-
                                                <li><a href="#ttec">TTEC</a></li>
+
            <a href="lab.html" class="item">Lab Manager</a>
-
                                                <li><a href="#circuitlist">Circuit List</a></li>
+
            <a href="clotho.html" class="item">Clotho</a>
-
</ul>
+
          </div>
-
</div>
+
        </div>
-
<div class="span9">
+
        <div href="/Team:SUSTC-Shenzhen-B/HumanPractice" class="ui dropdown link item">
-
                                        <div id="introduction">
+
          Human practice
-
<h2>Introduction</h2>
+
          <span class="white caret"></span>
-
<p>Clotho is for engineering synthetic biological systems and managing the data which is used to create them. It also provides a mechanism to begin the process of creating standardized data, algorithms, and methodologies for synthetic biology. (from Wikipedia)</p>
+
          <div class="menu">
-
<p>So, in order to enrich the function of Clotho, our team developed two Apps. One is TTEC,another is Circuit List. The more details are show below.</p>
+
            <a href="workshop.html" class="item">Workshop meeting</a>
-
                                        </div>
+
            <a href="publicity.html" class="item">Publicity</a>
-
                                        <div id="ttec">
+
          </div>
-
<h2>TTEC</h2>
+
        </div>
-
<p>TTEC developed by SUSTC-Shenzhen-B in 2012, to calculate the efficiency of terminator, and it can draw structure of it, so we transfer it, users can use TTEC through the Clotho Media.</p>
+
        <a href="achievement.html" class="item">Achievement</a>
-
                                        <img title="The main interface of TTEC" src="https://static.igem.org/mediawiki/2013/1/1f/SUSTC-BClotho1.png" class="img-polaroid">
+
        <div href="/Team:SUSTC-Shenzhen-B/Team" class="ui dropdown link item">
-
                                        <img title="The function interface" src=https://static.igem.org/mediawiki/2013/9/92/SUSTC-BClotho2.png" class="img-polaroid">
+
          Team
-
</div>
+
          <span class="white caret"></span>
-
                                        <div id="circuitlist">
+
          <div class="menu">
-
<h2>Circuit List</h2>
+
            <a href="about.html" class="item">About us</a>
-
<p>We are committed to build a database like parts registry but Circuit list based on genetic circuit, users can get brief information about genetic circuit, and can get more information such like Protocol about circuit. It is good for making the Synthetic biology more standardized, more modular and more procedural.</p>
+
            <a href="notebook.html" class="item">Notebook</a>
-
                                        <img title="The function interface" src=https://static.igem.org/mediawiki/2013/2/2f/SUSTC-BCL1.png" class="img-polaroid">
+
            <a href="acknowledgement.html" class="item">Acknoledgement</a>
-
                                        <img title="The function interface" src=https://2013.igem.org/File:SUSTC-BCL2.png" class="img-polaroid">
+
          </div>
-
</div>
+
        </div>
-
</div>
+
      </div>
-
</div>
+
    </div>
-
</body>
+
    <div class="header">
 +
      <div class="segment">
 +
        <div id="overview" class="container">
 +
          <div class="introduction">
 +
            <h1 class="ui dividing header">Clotho</h1>
 +
            <p class="lead">Clotho applications.</p>
 +
          </div>
 +
        </div>
 +
      </div>
 +
    </div>
 +
    <div class="main container page">
 +
      <div class="peek">
 +
        <div class="ui vertical pointing secondary menu">
 +
          <a class="active item">Introduction</a>
 +
          <a class="item">Circuit List</a>
 +
          <a class="item">TTEC</a>
 +
          <a class="active item" href="/Team:SUSTC-Shenzhen-B">Back to Homepage</a>
 +
        </div>
 +
      </div>
 +
      <div class="page-container">
 +
        <h2 class="ui dividing header">Introduction</h2>
 +
        <section id=""></section>
 +
        <p>Clotho is a popular software framework in synthetic biology. It provides many applications which are very useful in synthetic biology. It can also extend itself by utilizing applications developed by others. So, in order to enrich the function of Clotho and to make more people experience our software, we developed two applications, Circuit List and TTEC.</p>
 +
        <h2 class="ui dividing header">Circuit List</h2>
 +
        <section id=""></section>
 +
        <p>We developed a Clotho verion of Circuit+, Circuit List. Though it's not very perfect, it can make users experience Circuit+ on Clotho.</p>
 +
        <img class="minimize" src="https://static.igem.org/mediawiki/2013/e/eb/Circuit_list_all.png" />
 +
        <h2 class="ui dividing header">TTEC</h2>
 +
        <section id=""></section>
 +
        <p>TTEC, which is short for Transcriptional Terminator Efficiency Calculator, was developed by team SUSTC-Shenzhen-B in 2012. It calculate the efficiency of transcription terminator from the primary nucleotide sequences. We transplanted TTEC to Clotho platform to make more people use this useful tool. And this is prompted by iGEM that use existing iGEM software to develop new tools.If you want to know more about TTEC, the older one, please visit <a href="https://2012.igem.org/Team:SUSTC-Shenzhen-B">wiki of SUSTC-Shenzhen-B 2012</a>. </p>
 +
        <img class="minimize" src="https://static.igem.org/mediawiki/2013/7/71/Ttec_all.png" />
 +
      </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 03:53, 29 October 2013

SUSTC-ShenZhen-B

Clotho

Clotho applications.

Introduction

Clotho is a popular software framework in synthetic biology. It provides many applications which are very useful in synthetic biology. It can also extend itself by utilizing applications developed by others. So, in order to enrich the function of Clotho and to make more people experience our software, we developed two applications, Circuit List and TTEC.

Circuit List

We developed a Clotho verion of Circuit+, Circuit List. Though it's not very perfect, it can make users experience Circuit+ on Clotho.

TTEC

TTEC, which is short for Transcriptional Terminator Efficiency Calculator, was developed by team SUSTC-Shenzhen-B in 2012. It calculate the efficiency of transcription terminator from the primary nucleotide sequences. We transplanted TTEC to Clotho platform to make more people use this useful tool. And this is prompted by iGEM that use existing iGEM software to develop new tools.If you want to know more about TTEC, the older one, please visit wiki of SUSTC-Shenzhen-B 2012.