Team:Glasgow/test

From 2011.igem.org

(Difference between revisions)
(Created page with "<html> <img src="https://static.igem.org/mediawiki/2011/7/7c/Patternformation.png" width="800" height="725" alt="Pattern Formation" usemap="#patternformation" /> <map name="patternform...")
 
(92 intermediate revisions not shown)
Line 1: Line 1:
 +
{{Team:Glasgow/Header}}
<html>
<html>
-
<img src="https://static.igem.org/mediawiki/2011/7/7c/Patternformation.png" width="800" height="725" alt="Pattern Formation" usemap="#patternformation" />
+
<head>
-
<map name="patternformation">
+
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
-
   <area shape="rect" coords="696,443,743,715" alt="Product Selection" href="productselection.htm" />
+
<script type="text/javascript">
-
   <area shape="rect" coords="743,443,789,716" alt="Product Selection" href="productselection.htm" />
+
$(document).ready(function(){
-
  <area shape="rect" coords="48,99,219,205" alt="Pattern Forming Device" href="https://2011.igem.org/Team:Glasgow/Pattern_Forming_Device" />
+
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/0/0b/Patternformation02.png');
-
  <area shape="rect" coords="48,244,220,349" alt="Structure Fixing Device" href="https://2011.igem.org/Team:Glasgow/Structure_Fixing_Device" />
+
  $("#but1").click(function() {
-
   <area shape="rect" coords="591,55,763,161" alt="Product 1 Generating Device" href="https://2011.igem.org/Team:Glasgow/Product_1_Generating_Device" />
+
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/0/0b/Patternformation02.png');
-
   <area shape="rect" coords="591,173,763,280" alt="Product 2 Generating Device" href="https://2011.igem.org/Team:Glasgow/Product_2_Generating_Device" />
+
  });
-
   <area shape="rect" coords="591,293,763,397" alt="Product 3 Generating Device" href="https://2011.igem.org/Team:Glasgow/Product_3_Generating_Device" />
+
  $("#but2").click(function() {
-
</map>
+
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/7/7c/Productselection02.png');
 +
  });
 +
  $("#but3").click(function() {
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/e/eb/Structurefixation02.png');
 +
  });
 +
  $("#but4").hover(function() {
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/0/0b/Patternformation02.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/9/9b/Patternformingdevice.png');
 +
}
 +
  },
 +
function(){
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/9/9b/Patternformingdevice.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/0/0b/Patternformation02.png');
 +
}
 +
  });
 +
  $("#but5").hover(function() {
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/e/eb/Structurefixation02.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/b/b6/Structurefixingdevice.png');
 +
}
 +
   },
 +
function(){
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/b/b6/Structurefixingdevice.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/e/eb/Structurefixation02.png');
 +
}
 +
  });
 +
  $("#but6").hover(function() {
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/6/61/Product1BL.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/8/80/Product1device.png');
 +
}
 +
  },
 +
function(){
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/8/80/Product1device.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/6/61/Product1BL.png');
 +
}
 +
  });
 +
  $("#but7").hover(function() {
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/2/24/Product1RL.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/c/c2/Product2device.png');
 +
}
 +
   },
 +
function(){
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/c/c2/Product2device.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/2/24/Product1RL.png');
 +
}
 +
  });
 +
  $("#but8").hover(function() {
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/c/ce/Product1GL.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/3/31/Product3device.png');
 +
}
 +
  },
 +
function(){
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/3/31/Product3device.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/c/ce/Product1GL.png');
 +
}
 +
  });
 +
  $("#but9").click(function() {
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/e/eb/Structurefixation02.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/0/0b/Patternformation02.png');
 +
}
 +
else if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/7/7c/Productselection02.png') || $('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/6/61/Product1BL.png') || $('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/2/24/Product1RL.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/c/ce/Product1GL.png');
 +
}
 +
  });
 +
  $("#but10").click(function() {
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/0/0b/Patternformation02.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/e/eb/Structurefixation02.png');
 +
}
 +
else if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/7/7c/Productselection02.png') || $('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/c/ce/Product1GL.png') || $('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/2/24/Product1RL.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/6/61/Product1BL.png');
 +
}
 +
  });
 +
  $("#but11").click(function() {
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/7/7c/Productselection02.png') || $('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/6/61/Product1BL.png') || $('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/c/ce/Product1GL.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/2/24/Product1RL.png');
 +
}
 +
  });
 +
  $("#switch").click(function() {
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/0/0b/Patternformation02.png') || $('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/e/eb/Structurefixation02.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/7/7c/Productselection02.png');
 +
}
 +
else if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/7/7c/Productselection02.png') || $('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/6/61/Product1BL.png') || $('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/c/ce/Product1GL.png') || $('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/2/24/Product1RL.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/0/0b/Patternformation02.png');
 +
}
 +
  });
 +
$("#switchdevice").hover(function() {
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/0/0b/Patternformation02.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/2/26/Switchpatternformation.png');
 +
}
 +
else if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/2/24/Product1RL.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/3/33/Switchproductselection.png');
 +
}
 +
else if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/6/61/Product1BL.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/f/f3/Switchproductselection2.png');
 +
}
 +
else if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/c/ce/Product1GL.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/4/4d/Switchproductselection3.png');
 +
}
 +
else if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/e/eb/Structurefixation02.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/f/f9/Switchstructurefixation.png');
 +
}
 +
   },
 +
function(){
 +
if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/2/26/Switchpatternformation.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/0/0b/Patternformation02.png');
 +
}
 +
else if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/3/33/Switchproductselection.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/2/24/Product1RL.png');
 +
}
 +
else if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/f/f3/Switchproductselection2.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/6/61/Product1BL.png');
 +
}
 +
else if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/4/4d/Switchproductselection3.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/c/ce/Product1GL.png');
 +
}
 +
else if ($('#mainpic').attr('src') == ('https://static.igem.org/mediawiki/2011/f/f9/Switchstructurefixation.png'))
 +
{
 +
  $('#mainpic').attr('src', 'https://static.igem.org/mediawiki/2011/e/eb/Structurefixation02.png');
 +
}
 +
  });
 +
});
 +
</script>
 +
<style type="text/css">
 +
#systemdiagram {
 +
   width:680px;
 +
  position:relative;}
 +
#mainpic {
 +
  width:680px;}
 +
#but1 {
 +
  width:182px;
 +
  height:32px;
 +
  position:absolute;
 +
  left:50px;
 +
  top:370px;
 +
  z-index:2;
 +
  ;}
 +
#but2 {
 +
  width:182px;
 +
  height:32px;
 +
  position:absolute;
 +
  left:258px;
 +
  top:370px;
 +
  z-index:2;
 +
  ;}
 +
#but3 {
 +
  width:180px;
 +
  height:32px;
 +
  position:absolute;
 +
  left:460px;
 +
  top:370px;
 +
  z-index:2;
 +
  ;}
 +
#but4 {
 +
  width:155px;
 +
  height:100px;
 +
  position:absolute;
 +
  left:35px;
 +
  top:80px;
 +
  z-index:2;
 +
  ;}
 +
#but5 {
 +
  width:150px;
 +
  height:100px;
 +
  position:absolute;
 +
  left:40px;
 +
  top:200px;
 +
  z-index:2;
 +
  ;}
 +
#but6 {
 +
  width:145px;
 +
  height:90px;
 +
  position:absolute;
 +
  left:505px;
 +
  top:45px;
 +
  z-index:2;
 +
  ;}
 +
#but7 {
 +
  width:150px;
 +
  height:90px;
 +
  position:absolute;
 +
  left:500px;
 +
  top:150px;
 +
  z-index:2;
 +
  ;}
 +
#but8 {
 +
  width:145px;
 +
  height:90px;
 +
  position:absolute;
 +
  left:505px;
 +
  top:250px;
 +
  z-index:2;
 +
  ;}
 +
#but9 {
 +
  width:38px;
 +
  height:38px;
 +
  position:absolute;
 +
  left:280px;
 +
  top:310px;
 +
  z-index:2;
 +
  ;}
 +
#but10 {
 +
  width:38px;
 +
  height:38px;
 +
  position:absolute;
 +
  left:370px;
 +
  top:310px;
 +
  z-index:2;
 +
  ;}
 +
#but11 {
 +
  width:38px;
 +
  height:38px;
 +
  position:absolute;
 +
  left:325px;
 +
  top:310px;
 +
  z-index:2;
 +
  ;}
 +
#switch {
 +
  width:60px;
 +
  height:30px;
 +
  position:absolute;
 +
  left:312px;
 +
  top:138px;
 +
  z-index:2;
 +
  ;}
 +
#switchdevice {
 +
  width:115px;
 +
  height:80px;
 +
  position:absolute;
 +
  left:315px;
 +
  top:200px;
 +
  z-index:2;
 +
  ;}
 +
</style>
 +
</head>
 +
<body>
 +
<h2>System Design</h2>
 +
<p>The system we have designed for iGEM 2011 takes advantage of the modular nature of synthetic biology and combines relatively few parts to create a complex and highly regulated system of gene expression. This diagram shows how the biobricks we intend to create can be organised to allow for the bio-photo-lithography process.</p>
 +
 
 +
<p><b>Use the switch and the different colours of light to choose which device is active! Mousing over the highlighted devices will display the biobrick constructs we have designed to perform the device functions. Clicking the Pattern Formation, Product Selection or the Structure Fixation tab will highlight the devices used for the selected stage.</b></p>
 +
 
 +
<div align=center>
 +
<div id="systemdiagram">
 +
<img id="mainpic" />
 +
  <div id="but1">
 +
  </div>
 +
  <div id="but2">
 +
  </div>
 +
  <div id="but3">
 +
  </div>
 +
  <div id="but4">
 +
  </div>
 +
  <div id="but5">
 +
  </div>
 +
  <div id="but6">
 +
  </div>
 +
   <div id="but7">
 +
  </div>
 +
  <div id="but8">
 +
  </div>
 +
  <div id="but9">
 +
  </div>
 +
  <div id="but10">
 +
  </div>
 +
  <div id="but11">
 +
  </div>
 +
  <div id="switch">
 +
  </div>
 +
  <div id="switchdevice">
 +
  </div>
 +
</div>
 +
 
 +
 
 +
<div>
 +
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" style="width:440px;height:272px" id="701d80e9-ebdd-883f-508c-d0cb53ea4853" ><param name="movie" value="http://static.issuu.com/webembed/viewers/style1/v2/IssuuReader.swf?mode=mini&amp;backgroundColor=%23222222&amp;documentId=110921163609-d9b481c1344248b58f66acf6a92e7688" /><param name="allowfullscreen" value="true"/><param name="menu" value="false"/><param name="wmode" value="transparent"/><embed src="http://static.issuu.com/webembed/viewers/style1/v2/IssuuReader.swf" type="application/x-shockwave-flash" allowfullscreen="true" menu="false" wmode="transparent" style="width:420px;height:297px" flashvars="mode=mini&amp;backgroundColor=%23222222&amp;documentId=110921163609-d9b481c1344248b58f66acf6a92e7688" /></object>
 +
</div>
 +
<br/>
 +
</body>
</html>
</html>

Latest revision as of 18:00, 21 September 2011

System Design

The system we have designed for iGEM 2011 takes advantage of the modular nature of synthetic biology and combines relatively few parts to create a complex and highly regulated system of gene expression. This diagram shows how the biobricks we intend to create can be organised to allow for the bio-photo-lithography process.

Use the switch and the different colours of light to choose which device is active! Mousing over the highlighted devices will display the biobrick constructs we have designed to perform the device functions. Clicking the Pattern Formation, Product Selection or the Structure Fixation tab will highlight the devices used for the selected stage.