SUSTC-SZ-B 2013iGEM

From 2013.igem.org

(Difference between revisions)
 
(122 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
-
<style>
+
  <head>
-
* {
+
    <meta charset="utf-8" />
-
margin: 0;
+
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
-
padding: 0;
+
 
-
}
+
    <meta name="description" content="" />
-
html, body {
+
    <meta name="author" content="SUSTC-ShenZhen-B" />
-
height: 100%;
+
 
-
}
+
    <title>SUSTC-ShenZhen-B</title>
-
#top_section {
+
 
-
background: black no-repeat 50% 0;  
+
    <style type="text/css">
-
height: 100%;  
+
      #globalWrapper {width: 100%;font-size: 100%;}
-
overflow: hidden;
+
      #top-section {width: 100%; height:100%; border:none;}
-
}
+
      #p-logo {display:none;}
-
ul li {
+
      #search-controls {display:none;}
-
display: inline-block;
+
      .printfooter {display:none;}
-
padding: 15px;
+
      #footer-box {border:none;}
-
}
+
      .firstHeading {display:none;}
-
ul li a {
+
      #content { border:none !important; width:1024px !important; background: url('') !important;}
-
text-decoration: none;
+
      #bodyContent {border:none;}
-
color: white;
+
      #catlinks {display:none;}
-
font-size: big;
+
      #footer-box {display:none;}
-
}
+
      #menubar {display:none;}
-
</style>
+
      body {
-
<script>
+
        padding: 0;
-
window.onload = function () {
+
      }
-
var menu = document.getElementById('menu');
+
 
-
var init = menu.offsetTop;
+
      .caret {
-
var docked;
+
        display: inline-block;
-
window.onscroll = function () {
+
        width: 0;
-
            if (!docked && (menu.offsetTop - scrollTop() < 0)) {
+
        height: 0;
-
menu.style.top = 0;
+
        margin-left: 2px;
-
menu.style.position = 'fixed';
+
        vertical-align: middle;
-
menu.className = 'docked';
+
        border-top: 4px solid #000000;
-
docked = true;
+
        border-right: 4px solid transparent;
-
            } else if (docked && scrollTop() <= init) {
+
        border-bottom: 0 dotted;
-
menu.style.position = 'absolute';
+
        border-left: 4px solid transparent;
-
menu.style.top = init + 'px';
+
        content: "";
-
menu.className = menu.className.replace('docked', '');
+
      }
-
docked = false;
+
      .icon.caret {
-
            }
+
        opacity: 0.75;
-
};
+
      }
-
function scrollTop() {
+
      .white.caret {
-
return document.body.scrollTop || document.documentElement.scrollTop;
+
        border-top-color: #FFFFFF;
-
}
+
      }
-
};
+
      .main.menu {
-
</script>
+
        top: 0;
-
</head>
+
      }
-
<body style="background: black;">
+
      .script.image {
-
<div id="top_section" style="color: white; margin:0px">
+
        display: none;
-
<div class="text-center" style="width:50%; line-height: 1; position: relative; left: 25%; top: 10%; padding: 20px">
+
      }
-
<img src="img/logo.png" style="width: 35%; padding-bottom: 5%;" />
+
      .logo img {
-
<h1 style="font-size: 80px; margin-bottom: 5%;">Biomiao</h1>
+
        width: 100%;
-
<p>Welcome to the wiki of SUSTC-Shenzhen B! This is the second year that SUSTC takes part in the iGEM. In our wiki, you can learn every aspect of our project: the software itself, team menbers, human pracrice, and notebook is also included.</p>
+
      }
-
<a href="" class="btn btn-success">Go To Biomiao</a>
+
.cp-logo {
-
<p>Or</p>
+
      max-width: 100%;
-
<h2>Move down to see more...</h2>
+
    }
-
</div>
+
    .cp-logo img.cl {
-
</div>
+
      position: absolute;
-
<div id="menu" style="width:100%; background: rgba(0,0,0,1); position: relative; top: -60px; height:50px; z-index: 1000;";>
+
      /* transform: rotate(-90deg); */
-
<ul style="list-style-type: none; float: right;">
+
    }
-
<li><a href="#project">Project</a></li>
+
    .cp-logo img.background {
-
<li><a href="#team">Team</a></li>
+
      width: 1200px;
-
<li><a href="#human">Human Practice</a></li>
+
    }
-
<li><a href="#notebook">Notebook</a></li>
+
    .cp-logo img.big {
-
</ul>
+
      top: 31px;
-
</div>
+
      left: 46px;
-
<div id="project" style="background: url(img/2.jpg); height: 800px;">
+
      width: 290px;
-
<div style="position: relative; top: 20%; left: 50%; color: #888; margin: 5%; width: 40%;">
+
    }
-
<h1>Biomiao.org</h1>
+
    .cp-logo img.software {
-
<p>A repositry of gene citcuits in Synthetic Biology</p>
+
      top: 225px;
-
<p>A platform that holds light-weight Apps to re-utility the circuits information. LGD, TTEC are  provided.</p>
+
      left: 277px;
-
<p>In the future, you can say hello to other scientits to work collaboratly.</p>
+
      width: 164px;
-
<h3>Project Abstract</h3>
+
    }
-
<p style="text-indent: 2em;">Our project, 3 Miao synthetic biology platform, is different from all the iGem software projects in the past, for we have an ambition to create a community for the whole synthetic biology. In this community, we offer a platform for the collection of handy tools provided by either the iGem teams or the company to facilitate users to study synthetic biology more conveniently. Among these handy tools, Mind Road, LGD and TTEC are uploaded by us. Mind Road is for projects review and divergent thinking. LGD is a genetic circuit designer which can present the logical relationship of related parts. On the other hand, the community allows users to learn the basic knowledge of synthetic biology, go through the break news of synthetic biology, post their own ideas, comment on others’ work, discuss with other people and so on, just like the Facebook and Twitter. In this way, our community will greatly popularize synthetic biology.</p>
+
    .cp-logo img.mindmap {
-
<a href="project.html" class="btn btn-primary">See More</a>
+
      top: 245px;
-
</div>
+
      left: 441px;
-
</div>
+
      width: 142px;
-
<div id="team" style="background: url(img/3.png) #66c000 no-repeat 50% 100%; background-position: right bottom;height: 800px;">
+
    }
-
<div style="padding-top: 80px; width: 280px; margin-left: 40px;">
+
    .cp-logo img.lgd {
-
<h1>Team</h1>
+
      top: 276px;
-
<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>
+
      left: 571px;
-
<a href="team.html" class="btn btn-primary">See More</a>
+
      width: 102px;
-
</div>
+
    }
-
</div>
+
    .cp-logo img.labmanager {
-
<div id="human" style="background: red no-repeat 50% 100%; height: 800px;">
+
      top: 245px;
-
<div style="margin-top:0px; padding-top: 80px">
+
      left: 667px;
-
<h1>Project Description</h1>
+
      width: 121px;
-
<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>
+
    }
-
<a href="" class="btn btn-primary">See More</a>
+
    .cp-logo img.technistandard {
-
</div>
+
      top: 230px;
-
</div>
+
      left: 781px;
-
<div id="notebook" style="background: yellow no-repeat 50% 100%; height: 800px;">
+
      width: 164px;
-
<div style="margin-top:0px; padding-top: 80px">
+
    }
-
<h1>Project Description</h1>
+
    .cp-logo img.clotho {
-
<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>
+
      top: 257px;
-
<a href="notebook.html" class="btn btn-primary">See More</a>
+
      left: 940px;
-
</div>
+
      width: 75px;
-
</div>
+
    }
-
</body>
+
    .cp-logo img.humanpractice {
 +
      top: 265px;
 +
      left: 1010px;
 +
      width: 94px;
 +
    }
 +
    </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="http://circuitplus.org" class="item">Visit Circuit+</a>
 +
        </div>
 +
        <div href="/" class="ui dropdown link active item">
 +
          iGEM
 +
          <span class="icon white caret"></span>
 +
          <div class="menu">
 +
            <a href="https://2013.igem.org/Main_Page" class="item">iGEM homepage</a>
 +
            <a href="/Team:SUSTC-Shenzhen-B" class="item">wiki homepage</a>
 +
            <a href="https://igem.org/User_Information" class="item">My Account</a>
 +
            <a href="https://2013.igem.org/wiki/index.php?title=SUSTC-SZ-B_2013iGEM&action=edit" class="item">Edit</a>
 +
          </div>
 +
        </div>
 +
        <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/project.html" class="item">Overview</a>
 +
        <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/standard.html" class="item">Standard and database</a>
 +
        <div href="/" class="ui dropdown link item">
 +
          Software
 +
          <span class="white caret"></span>
 +
          <div class="menu">
 +
            <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/circuitplus.html" class="item">Circuit+</a>
 +
            <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/tutorial.html" class="item">Tutorial</a>
 +
            <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/safety.html" class="item">Safety</a>
 +
            <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/feedback.html" class="item">Feedback</a>
 +
            <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/future.html" class="item">Future</a>
 +
            <a href="/Team:SUSTC-Shenzhen-B/lab.html" class="item">Lab Manager</a>
 +
            <a href="/Team:SUSTC-Shenzhen-B/clotho.html" class="item">Clotho</a>
 +
          </div>
 +
        </div>
 +
        <div href="/" class="ui dropdown link item">
 +
          Human practice
 +
          <span class="white caret"></span>
 +
          <div class="menu">
 +
            <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/workshop.html" class="item">Workshop meeting</a>
 +
            <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/publicity.html" class="item">Publicity</a>
 +
          </div>
 +
        </div>
 +
        <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/achievement.html" class="item">Achievement</a>
 +
        <div href="/" class="ui dropdown link item">
 +
          Team
 +
          <span class="white caret"></span>
 +
          <div class="menu">
 +
            <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/about.html" class="item">About us</a>
 +
            <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/notebook.html" class="item">Notebook</a>
 +
            <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/acknowledgement.html" class="item">Acknoledgement</a>
 +
          </div>
 +
        </div>
 +
      </div>
 +
    </div>
 +
    <div class="header">
 +
      <div class="segment">
 +
        <div id="overview" class="container">
 +
    <div class="cp-logo">
 +
      <!-- <img class="background" src="/wiki/images/2/26/Background.png" /> -->
 +
      <a href="http://circuitplus.org"><img class="cl odd big" src="/wiki/images/c/c9/Logo.png" /></a>
 +
      <img class="cl even software" src="/wiki/images/f/fd/Software.png" />
 +
      <img class="cl odd mindmap" src="/wiki/images/4/4b/Mind_map.png" />
 +
      <img class="cl even lgd" src="/wiki/images/f/f9/LGD.png" />
 +
      <img class="cl odd labmanager" src="/wiki/images/4/4b/Lab_manager.png" />
 +
      <img class="cl even technistandard" src="/wiki/images/5/53/Technistandard.png" />
 +
      <img class="cl odd clotho" src="/wiki/images/9/94/Clotho.png" />
 +
      <img class="cl even humanpractice" src="/wiki/images/4/4f/Human_practice.png" />
 +
    </div>
 +
        </div>
 +
      </div>
 +
    </div>
 +
    <div class="main container page index">
 +
      <p>Welcome to our wiki! This is SUSTC-Shenzhen-B.</p>
 +
      <p>This year, we have developed Circuit+. Circuit+ is an online registry of standard gene circuits.</p>
 +
      <p>Detail information of software can be found in software part of this wiki.</p>
 +
      <p>We also have developed Circuit List and TTEC on Clotho, and Lab Manager. See <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/clotho.html">Clotho</a> and <a href="https://2013.igem.org/Team:SUSTC-Shenzhen-B/lab.html">Lab Manager</a> for details.</p>
 +
    </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);
 +
        }); */
 +
      }
 +
 
 +
      function logoFun() {
 +
        var r = 0;
 +
        setInterval(function () {
 +
          $('img.cl.odd').attr('style', '-webkit-transform: rotate(' + r + 'deg); -moz-transform: rotate(' + r + 'deg); transform: rotate(' + r + 'deg);');
 +
          $('img.cl.even').attr('style', '-webkit-transform: rotate(-' + r + 'deg); -moz-transform: rotate(' + r + 'deg); transform: rotate(' + r + 'deg);');
 +
          r += 2;
 +
          if (r >= 360) r = 0;
 +
        }, 100);
 +
      }
 +
 
 +
      $(document).ready(function () {
 +
        baseRemove();
 +
        loadJavascript();
 +
        logoFun();
 +
      });
 +
    </script>
 +
  </body>
</html>
</html>

Latest revision as of 04:00, 29 October 2013

SUSTC-ShenZhen-B

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

Welcome to our wiki! This is SUSTC-Shenzhen-B.

This year, we have developed Circuit+. Circuit+ is an online registry of standard gene circuits.

Detail information of software can be found in software part of this wiki.

We also have developed Circuit List and TTEC on Clotho, and Lab Manager. See Clotho and Lab Manager for details.

© SUSTC-ShenZhen-B

Retrieved from "http://2013.igem.org/SUSTC-SZ-B_2013iGEM"