Team:Harvard/virtual

From 2010.igem.org

(Difference between revisions)
 
(20 intermediate revisions not shown)
Line 1: Line 1:
-
<html onLoad="game()">
+
<html>
-
 
+
-
<script type="text/javascript">
+
-
document.getElementsByTagName('body')[0].innerHTML="
+
-
 
+
-
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" charset="utf-8"></script>
+
   <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
   <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
-
<link href="css.css" rel="stylesheet" type="text/css" />
+
  <style type="text/css" src="http://www.hcs.harvard.edu/usundergrad/test/css.css"></style>
   <script type="text/javascript">
   <script type="text/javascript">
     $(document).ready(function()  
     $(document).ready(function()  
Line 36: Line 31:
   $(".suboption2").fadeOut("slow");
   $(".suboption2").fadeOut("slow");
$("#description1").fadeIn(1100);
$("#description1").fadeIn(1100);
-
$("#img1").html("<img src='miraculinbbcut.gif' width='250px' />");
+
$("#img1").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/miraculinbbcut.gif' width='250px' />");
$("#img1").fadeIn(1100);
$("#img1").fadeIn(1100);
-
$("#img2").html("<img src='miraculingene.gif' width='70px' />");
+
$("#img2").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/miraculingene.gif' width='70px' />");
$("#img2").fadeIn(1100);
$("#img2").fadeIn(1100);
-
$("#img3").html("<img src='mcs1.gif' width='60px'  />");
+
$("#img3").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/mcs1.gif' width='60px'  />");
$("#img3").fadeIn(1100);
$("#img3").fadeIn(1100);
-
$("#img4").html("<img src='mcs2.gif' width='60px'  />");
+
$("#img4").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/mcs2.gif' width='60px'  />");
$("#img4").fadeIn(1100);
$("#img4").fadeIn(1100);
$("#enz1").fadeIn(1100);
$("#enz1").fadeIn(1100);
Line 49: Line 44:
$("#enz4").fadeIn(1100);
$("#enz4").fadeIn(1100);
$("#enz5").fadeIn(1100);
$("#enz5").fadeIn(1100);
-
$("#scissor1").html("<img src='scissors.gif' width='38px' />").fadeIn(1100);
+
$("#scissor1").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/scissors.gif' width='38px' />").fadeIn(1100);
-
$("#scissor2").html("<img src='scissors.gif' width='38px' />").fadeIn(1100);
+
$("#scissor2").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/scissors.gif' width='38px' />").fadeIn(1100);
-
$("#scissor3").html("<img src='scissors.gif' width='38px' />").fadeIn(1100);
+
$("#scissor3").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/scissors.gif' width='38px' />").fadeIn(1100);
-
$("#scissor4").html("<img src='scissors.gif' width='38px' />").fadeIn(1100);
+
$("#scissor4").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/scissors.gif' width='38px' />").fadeIn(1100);
-
$("#scissor5").html("<img src='scissors.gif' width='38px' />").fadeIn(1100);
+
$("#scissor5").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/scissors.gif' width='38px' />").fadeIn(1100);
  flavor="miraculin";
  flavor="miraculin";
  }
  }
Line 68: Line 63:
   $(".suboption2").fadeOut("slow");
   $(".suboption2").fadeOut("slow");
$("#description1").html("The DNA sequence that codes for the brazzein protein is kept in the V0120 vector. The brazzein gene is bordered on both sides by restriction enzyme sites. Drag enzymes over the restriction enzyme sites to cut the gene out of the vector.").fadeIn(1100);
$("#description1").html("The DNA sequence that codes for the brazzein protein is kept in the V0120 vector. The brazzein gene is bordered on both sides by restriction enzyme sites. Drag enzymes over the restriction enzyme sites to cut the gene out of the vector.").fadeIn(1100);
-
$("#img1").html("<img src='miraculinbbcut.gif' width='250px' />");
+
$("#img1").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/miraculinbbcut.gif' width='250px' />");
$("#img1").fadeIn(1100);
$("#img1").fadeIn(1100);
-
$("#img2").html("<img src='brazzeingene.png' width='70px' />");
+
$("#img2").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/brazzeingene.png' width='70px' />");
$("#img2").fadeIn(1100);
$("#img2").fadeIn(1100);
-
$("#img3").html("<img src='mcs1.gif' width='60px'  />");
+
$("#img3").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/mcs1.gif' width='60px'  />");
$("#img3").fadeIn(1100);
$("#img3").fadeIn(1100);
-
$("#img4").html("<img src='mcs2.gif' width='60px'  />");
+
$("#img4").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/mcs2.gif' width='60px'  />");
$("#img4").fadeIn(1100);
$("#img4").fadeIn(1100);
$("#enz1").fadeIn(1100);
$("#enz1").fadeIn(1100);
Line 81: Line 76:
$("#enz4").fadeIn(1100);
$("#enz4").fadeIn(1100);
$("#enz5").fadeIn(1100);
$("#enz5").fadeIn(1100);
-
$("#scissor1").html("<img src='scissors.gif' width='38px' />").fadeIn(1100);
+
$("#scissor1").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/scissors.gif' width='38px' />").fadeIn(1100);
-
$("#scissor2").html("<img src='scissors.gif' width='38px' />").fadeIn(1100);
+
$("#scissor2").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/scissors.gif' width='38px' />").fadeIn(1100);
-
$("#scissor3").html("<img src='scissors.gif' width='38px' />").fadeIn(1100);
+
$("#scissor3").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/scissors.gif' width='38px' />").fadeIn(1100);
-
$("#scissor4").html("<img src='scissors.gif' width='38px' />").fadeIn(1100);
+
$("#scissor4").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/scissors.gif' width='38px' />").fadeIn(1100);
-
$("#scissor5").html("<img src='scissors.gif' width='38px' />").fadeIn(1100);
+
$("#scissor5").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/scissors.gif' width='38px' />").fadeIn(1100);
  flavor="brazzein";
  flavor="brazzein";
  }
  }
Line 122: Line 117:
  if($(ui.draggable).attr("id")=="scissor1")
  if($(ui.draggable).attr("id")=="scissor1")
  {
  {
-
$("#img3").html("<img src='eco.gif' width='60px' />");
+
$("#img3").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/eco.gif' width='60px' />");
score=score+1;
score=score+1;
Line 134: Line 129:
  if($(ui.draggable).attr("id")=="scissor2")
  if($(ui.draggable).attr("id")=="scissor2")
  {
  {
-
$("#img3").html("<img src='not.gif' width='60px' />");
+
$("#img3").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/not.gif' width='60px' />");
score=score+2;
score=score+2;
Line 146: Line 141:
  if($(ui.draggable).attr("id")=="scissor3")
  if($(ui.draggable).attr("id")=="scissor3")
  {
  {
-
$("#img3").html("<img src='xba.gif' width='60px' />");
+
$("#img3").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/xba.gif' width='60px' />");
score=score+3;
score=score+3;
Line 163: Line 158:
  if($(ui.draggable).attr("id")=="scissor4")
  if($(ui.draggable).attr("id")=="scissor4")
  {
  {
-
$("#img4").html("<img src='spe.gif' width='60px' />");
+
$("#img4").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/spe.gif' width='60px' />");
score=score+10;
score=score+10;
-
if(score>10 && score<14)
+
if(score>10)
{
{
-
digested(score);
+
if (score<14) {digested(score);}
}
}
$(".droppable2").droppable( "disable" );
$(".droppable2").droppable( "disable" );
Line 175: Line 170:
  if($(ui.draggable).attr("id")=="scissor2")
  if($(ui.draggable).attr("id")=="scissor2")
  {
  {
-
$("#img4").html("<img src='not2.gif' width='60px' />");
+
$("#img4").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/not2.gif' width='60px' />");
score=score+20;
score=score+20;
-
if(score>20 && score<24)
+
if(score>20)
{
{
-
digested(score);
+
if (score<24) {digested(score);}
}
}
$(".droppable2").droppable( "disable" );
$(".droppable2").droppable( "disable" );
Line 187: Line 182:
  if($(ui.draggable).attr("id")=="scissor5")
  if($(ui.draggable).attr("id")=="scissor5")
  {
  {
-
$("#img4").html("<img src='pst.gif' width='60px' />");
+
$("#img4").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/pst.gif' width='60px' />");
score=score+30;
score=score+30;
-
if(score>30 && score<34)
+
if(score>30)
{
{
-
digested(score);
+
if (score<34) {digested(score);}
}
}
$(".droppable2").droppable( "disable" );
$(".droppable2").droppable( "disable" );
Line 317: Line 312:
-
$("#digested").html("<img src='"+ insert +"' width='250px' />");
+
$("#digested").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/"+ insert +"' width='250px' />");
$(".droppable2").delay(300).fadeOut("slow");
$(".droppable2").delay(300).fadeOut("slow");
$(".droppable1").delay(300).fadeOut("slow");
$(".droppable1").delay(300).fadeOut("slow");
Line 337: Line 332:
$("#digested").animate({left:"7px",top:"50px",opacity:.7});  
$("#digested").animate({left:"7px",top:"50px",opacity:.7});  
$("#description1").fadeOut("fast").delay(1000).html("The mirculin gene that you cut out does not include a promoter or terminator. You need to insert the gene into the iGarden V9 plasmid. The V9 plasmid contains a promoter and a terminator surrounding restriction enzyme sites. First, you need to digest the V9 plasmid so that it's ready for the insertion of the miraculin gene.").fadeIn("slow");
$("#description1").fadeOut("fast").delay(1000).html("The mirculin gene that you cut out does not include a promoter or terminator. You need to insert the gene into the iGarden V9 plasmid. The V9 plasmid contains a promoter and a terminator surrounding restriction enzyme sites. First, you need to digest the V9 plasmid so that it's ready for the insertion of the miraculin gene.").fadeIn("slow");
-
$("#V9bb").html("<img src='V9bb.gif' width='270px' />").fadeIn("slow");
+
$("#V9bb").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/V9bb.gif' width='270px' />").fadeIn("slow");
-
$("#bbmcs").html("<img src='bbmcs.gif' width='70px' />").fadeIn("slow");
+
$("#bbmcs").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/bbmcs.gif' width='70px' />").fadeIn("slow");
if (score==11)
if (score==11)
Line 423: Line 418:
$("#ecoli").fadeOut("fast");
$("#ecoli").fadeOut("fast");
$("#V9andinsert").fadeOut("fast");
$("#V9andinsert").fadeOut("fast");
-
$("#petridish").html("<img src='petridish.png' width='200px' />").fadeIn("slow").draggable({containment: 'window'});
+
$("#petridish").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/petridish.png' width='200px' />").fadeIn("slow").draggable({containment: 'window'});
-
$("#ecolitransformed1").html("<img src='ecoli.gif' width='50px' />").fadeIn("slow").draggable({containment: 'window'});
+
$("#ecolitransformed1").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecoli.gif' width='50px' />").fadeIn("slow").draggable({containment: 'window'});
-
$("#ecolitransformed2").html("<img src='ecolimir.png' width='50px' />").fadeIn("slow").draggable({containment: 'window'});
+
$("#ecolitransformed2").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecolimir.png' width='50px' />").fadeIn("slow").draggable({containment: 'window'});
-
$("#ecolitransformed3").html("<img src='ecoli.gif' width='50px' />").fadeIn("slow").draggable({containment: 'window'});
+
$("#ecolitransformed3").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecoli.gif' width='50px' />").fadeIn("slow").draggable({containment: 'window'});
-
$("#ecolitransformed4").html("<img src='ecolimir.png' width='50px' />").fadeIn("slow").draggable({containment: 'window'});
+
$("#ecolitransformed4").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecolimir.png' width='50px' />").fadeIn("slow").draggable({containment: 'window'});
-
$("#ecolitransformed5").html("<img src='ecolimir.png' width='50px' />").fadeIn("slow").draggable({containment: 'window'});
+
$("#ecolitransformed5").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecolimir.png' width='50px' />").fadeIn("slow").draggable({containment: 'window'});
des2=3;
des2=3;
}
}
Line 436: Line 431:
$("#description1").fadeOut("fast").delay(800).html("Pick a colony and put in the culture tube").fadeIn("fast");
$("#description1").fadeOut("fast").delay(800).html("Pick a colony and put in the culture tube").fadeIn("fast");
$(".description2").animate({right:"0px"});
$(".description2").animate({right:"0px"});
-
$("#bigtube").html("<img src='bigtube.png' width='45px' />").fadeIn("slow");
+
$("#bigtube").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/bigtube.png' width='45px' />").fadeIn("slow");
$(".ecoli").draggable({disabled:false, containment: 'window'});
$(".ecoli").draggable({disabled:false, containment: 'window'});
des2=4;
des2=4;
Line 453: Line 448:
$("#ecolismall6").fadeOut("slow");
$("#ecolismall6").fadeOut("slow");
$("#ecolismall7").fadeOut("slow");
$("#ecolismall7").fadeOut("slow");
-
$("#ecoli2").html("<img src='ecolimir.png' width='175px' />").fadeIn().delay(1000).hide("explode", 1000);
+
$("#ecoli2").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecolimir.png' width='175px' />").fadeIn().delay(1000).hide("explode", 1000);
if (flavor=="miraculin")
if (flavor=="miraculin")
{
{
-
$("#V9andinsert").css({left:"220px",top:"200px"}).html("<img src='miraculininserted.gif' width='175px' />").delay(1500).fadeIn("fast");
+
$("#V9andinsert").css({left:"220px",top:"200px"}).html("<img src='http://www.hcs.harvard.edu/usundergrad/test/miraculininserted.gif' width='175px' />").delay(1500).fadeIn("fast");
}
}
if (flavor=="brazzein")
if (flavor=="brazzein")
{
{
-
$("#V9andinsert").css({left:"220px",top:"200px"}).html("<img src='brazzeininserted.gif' width='175px' />").delay(1500).fadeIn("fast");
+
$("#V9andinsert").css({left:"220px",top:"200px"}).html("<img src='http://www.hcs.harvard.edu/usundergrad/test/brazzeininserted.gif' width='175px' />").delay(1500).fadeIn("fast");
}
}
$(".description3").delay(1300).html("insert into agrobacterium >>>").fadeIn("slow");
$(".description3").delay(1300).html("insert into agrobacterium >>>").fadeIn("slow");
Line 491: Line 486:
if (flavor=="miraculin")
if (flavor=="miraculin")
{
{
-
$("#V9andinsert").draggable({ disabled: true }).html("<img src='miraculininserted.gif' width='75px' />").css({"left":"100px","top":"200px","z-index":20}).fadeIn("slow").animate({"left":"327px","top":"340px"},3000);
+
$("#V9andinsert").draggable({ disabled: true }).html("<img src='http://www.hcs.harvard.edu/usundergrad/test/miraculininserted.gif' width='75px' />").css({"left":"100px","top":"200px","z-index":20}).fadeIn("slow").animate({"left":"327px","top":"340px"},3000);
}
}
else if (flavor=="brazzein")
else if (flavor=="brazzein")
{
{
-
$("#V9andinsert").draggable({ disabled: true }).html("<img src='brazzeininserted.gif' width='75px' />").css({"left":"100px","top":"200px","z-index":20}).fadeIn("slow").animate({"left":"327px","top":"340px"},3000);
+
$("#V9andinsert").draggable({ disabled: true }).html("<img src='http://www.hcs.harvard.edu/usundergrad/test/brazzeininserted.gif' width='75px' />").css({"left":"100px","top":"200px","z-index":20}).fadeIn("slow").animate({"left":"327px","top":"340px"},3000);
}
}
des3=3;
des3=3;
Line 511: Line 506:
$("#agro2").fadeOut("fast");
$("#agro2").fadeOut("fast");
$("#V9andinsert").fadeOut("fast");
$("#V9andinsert").fadeOut("fast");
-
$("#petridish2").html("<img src='petridish.png' width='200px' />").fadeIn("slow");
+
$("#petridish2").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/petridish.png' width='200px' />").fadeIn("slow");
-
$("#agrotransformed1").html("<img src='agrobacterium.png' width='50px' />").fadeIn("slow").draggable({disabled:false, containment: 'window'});
+
$("#agrotransformed1").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/agrobacterium.png' width='50px' />").fadeIn("slow").draggable({disabled:false, containment: 'window'});
-
$("#agrotransformed2").html("<img src='agromir.png' width='50px' />").fadeIn("slow").draggable({disabled:false, containment: 'window'});
+
$("#agrotransformed2").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/agromir.png' width='50px' />").fadeIn("slow").draggable({disabled:false, containment: 'window'});
-
$("#agrotransformed3").html("<img src='agrobacterium.png' width='50px' />").fadeIn("slow").draggable({disabled:false, containment: 'window'});
+
$("#agrotransformed3").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/agrobacterium.png' width='50px' />").fadeIn("slow").draggable({disabled:false, containment: 'window'});
-
$("#agrotransformed4").html("<img src='agromir.png' width='50px' />").fadeIn("slow").draggable({disabled:false, containment: 'window'});
+
$("#agrotransformed4").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/agromir.png' width='50px' />").fadeIn("slow").draggable({disabled:false, containment: 'window'});
-
$("#agrotransformed5").html("<img src='agromir.png' width='50px' />").fadeIn("slow").draggable({disabled:false, containment: 'window'});
+
$("#agrotransformed5").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/agromir.png' width='50px' />").fadeIn("slow").draggable({disabled:false, containment: 'window'});
des4=2;
des4=2;
}
}
Line 522: Line 517:
else if(des4==2)
else if(des4==2)
{
{
-
$("#petridish3").html("<img src='petridish.png' width='200px' />").fadeIn("slow");
+
$("#petridish3").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/petridish.png' width='200px' />").fadeIn("slow");
$(".description4").animate({right:"0px"});
$(".description4").animate({right:"0px"});
$("#description1").fadeOut("fast").delay(1000).html("Pick one of the colonies and tranfer to the other petri dish to create a lawn plate.").fadeIn("fast");
$("#description1").fadeOut("fast").delay(1000).html("Pick one of the colonies and tranfer to the other petri dish to create a lawn plate.").fadeIn("fast");
Line 556: Line 551:
$(".agro").fadeOut("slow").draggable({ disabled: true });
$(".agro").fadeOut("slow").draggable({ disabled: true });
$("#petridish2").fadeOut("slow");
$("#petridish2").fadeOut("slow");
-
$("#petridish3").html("<img src='lawn.png' width='200px' />").fadeIn("slow");
+
$("#petridish3").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/lawn.png' width='200px' />").fadeIn("slow");
$("#flower").fadeIn("slow").draggable({disabled:false, containment: 'window'});
$("#flower").fadeIn("slow").draggable({disabled:false, containment: 'window'});
$("#description1").fadeOut("fast").delay(1000).html("Dip the flower in the agrobacteria to carry out the transformation.").fadeIn("slow");
$("#description1").fadeOut("fast").delay(1000).html("Dip the flower in the agrobacteria to carry out the transformation.").fadeIn("slow");
Line 588: Line 583:
  if($(ui.draggable).attr("id")=="scissor1")
  if($(ui.draggable).attr("id")=="scissor1")
  {
  {
-
$("#cut1").html("<img src='ecocut.gif' width='60px' />").fadeIn("slow");
+
$("#cut1").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecocut.gif' width='60px' />").fadeIn("slow");
score=score+1;
score=score+1;
  }
  }
Line 594: Line 589:
  if($(ui.draggable).attr("id")=="scissor2")
  if($(ui.draggable).attr("id")=="scissor2")
  {
  {
-
$("#cut1").html("<img src='notcut.gif' width='60px' />").fadeIn("slow");
+
$("#cut1").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/notcut.gif' width='60px' />").fadeIn("slow");
score=score+2;
score=score+2;
  }
  }
Line 600: Line 595:
  if($(ui.draggable).attr("id")=="scissor3")
  if($(ui.draggable).attr("id")=="scissor3")
  {
  {
-
$("#cut1").html("<img src='xbacut.gif' width='60px' />").fadeIn("slow");
+
$("#cut1").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/xbacut.gif' width='60px' />").fadeIn("slow");
score=score+3;
score=score+3;
  }
  }
Line 606: Line 601:
  if($(ui.draggable).attr("id")=="scissor4")
  if($(ui.draggable).attr("id")=="scissor4")
  {
  {
-
$("#cut2").html("<img src='specut.gif' width='60px' />").fadeIn("slow");
+
$("#cut2").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/specut.gif' width='60px' />").fadeIn("slow");
score=score+10;
score=score+10;
  }
  }
Line 612: Line 607:
  if($(ui.draggable).attr("id")=="scissor5")
  if($(ui.draggable).attr("id")=="scissor5")
  {
  {
-
$("#cut2").html("<img src='pstcut.gif' width='60px' />").fadeIn("slow");
+
$("#cut2").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/pstcut.gif' width='60px' />").fadeIn("slow");
score=score+30;
score=score+30;
  }
  }
Line 626: Line 621:
if (score==11)
if (score==11)
{
{
-
$("#V9bbcut").html("<img src='V9bbecospe.gif' width= '270px'/>").fadeIn(2100);
+
$("#V9bbcut").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/V9bbecospe.gif' width= '270px'/>").fadeIn(2100);
$("#description1").fadeOut("fast").delay(1000).html("You digested the V9 with EcoRI and SpeI. Drag the miraculin insert over the vector backbone to carry out the ligation.").fadeIn(2100);
$("#description1").fadeOut("fast").delay(1000).html("You digested the V9 with EcoRI and SpeI. Drag the miraculin insert over the vector backbone to carry out the ligation.").fadeIn(2100);
$("#digested").css({"z-index":100,cursor:"grab",cursor:"-moz-grab"}).animate({opacity:1}).draggable({containment: 'window'});  
$("#digested").css({"z-index":100,cursor:"grab",cursor:"-moz-grab"}).animate({opacity:1}).draggable({containment: 'window'});  
Line 633: Line 628:
if (score==31)
if (score==31)
{
{
-
$("#V9bbcut").html("<img src='V9bbecopst.gif' width= '270px'/>").fadeIn(2100);
+
$("#V9bbcut").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/V9bbecopst.gif' width= '270px'/>").fadeIn(2100);
$("#description1").fadeOut("fast").delay(1000).html("You digested the V9 plasmid with EcoRI and PstI. Drag the miraculin insert over the vector backbone to carry out the ligation.").fadeIn(2100);
$("#description1").fadeOut("fast").delay(1000).html("You digested the V9 plasmid with EcoRI and PstI. Drag the miraculin insert over the vector backbone to carry out the ligation.").fadeIn(2100);
$("#digested").css({"z-index":100,cursor:"grab",cursor:"-moz-grab"}).animate({opacity:1}).draggable({containment: 'window'});  
$("#digested").css({"z-index":100,cursor:"grab",cursor:"-moz-grab"}).animate({opacity:1}).draggable({containment: 'window'});  
Line 640: Line 635:
if (score==13)
if (score==13)
{
{
-
$("#V9bbcut").html("<img src='V9bbxbaspe.gif' width= '270px'/>").fadeIn(2100);
+
$("#V9bbcut").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/V9bbxbaspe.gif' width= '270px'/>").fadeIn(2100);
$("#description1").fadeOut("fast").delay(1000).html("You digested the V9 with XbaI and SpeI. Drag the miraculin insert over the vector backbone to carry out the ligation.").fadeIn(2100);
$("#description1").fadeOut("fast").delay(1000).html("You digested the V9 with XbaI and SpeI. Drag the miraculin insert over the vector backbone to carry out the ligation.").fadeIn(2100);
$("#digested").css({"z-index":100,cursor:"grab",cursor:"-moz-grab"}).animate({opacity:1}).draggable({containment: 'window'});  
$("#digested").css({"z-index":100,cursor:"grab",cursor:"-moz-grab"}).animate({opacity:1}).draggable({containment: 'window'});  
Line 647: Line 642:
if (score==33)
if (score==33)
{
{
-
$("#V9bbcut").html("<img src='V9bbxbapst.gif' width= '270px'/>").fadeIn(2100);
+
$("#V9bbcut").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/V9bbxbapst.gif' width= '270px'/>").fadeIn(2100);
$("#description1").fadeOut("fast").delay(1000).html("You digested the V9 plasmid with XbaI and PstI. Drag the miraculin insert over the vector backbone to carry out the ligation.").fadeIn(2100);
$("#description1").fadeOut("fast").delay(1000).html("You digested the V9 plasmid with XbaI and PstI. Drag the miraculin insert over the vector backbone to carry out the ligation.").fadeIn(2100);
$("#digested").css({"z-index":100,cursor:"grab",cursor:"-moz-grab"}).animate({opacity:1}).draggable({containment: 'window'});  
$("#digested").css({"z-index":100,cursor:"grab",cursor:"-moz-grab"}).animate({opacity:1}).draggable({containment: 'window'});  
Line 662: Line 657:
$("#V9bbcut").fadeOut("slow");
$("#V9bbcut").fadeOut("slow");
$("#digested").fadeOut("slow");
$("#digested").fadeOut("slow");
-
$("#tube").html("<img src='tubeclosed.png' />").fadeIn("slow");
+
$("#tube").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/tubeclosed.png' />").fadeIn("slow");
if (flavor=="miraculin")
if (flavor=="miraculin")
{
{
-
$("#V9andinsert").html("<img src='miraculininserted.gif' width='150px' />").fadeIn("slow");
+
$("#V9andinsert").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/miraculininserted.gif' width='150px' />").fadeIn("slow");
}
}
else if (flavor=="brazzein")
else if (flavor=="brazzein")
{
{
-
$("#V9andinsert").html("<img src='brazzeininserted.gif' width='150px' />").fadeIn("slow");
+
$("#V9andinsert").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/brazzeininserted.gif' width='150px' />").fadeIn("slow");
}
}
-
$("#ecoli").html("<img src='ecoli.gif' width='80px' />").fadeIn("slow");
+
$("#ecoli").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecoli.gif' width='80px' />").fadeIn("slow");
}});
}});
Line 679: Line 674:
       if (firstopen==1)
       if (firstopen==1)
       {
       {
-
$("#tube").html("<img src='tube.png' />");
+
$("#tube").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/tube.png' />");
$("#V9andinsert").draggable({containment: 'window'});
$("#V9andinsert").draggable({containment: 'window'});
$("#ecoli").draggable({containment: 'window'});
$("#ecoli").draggable({containment: 'window'});
Line 695: Line 690:
if (mixcount==2)
if (mixcount==2)
{
{
-
$("#tube").html("<img src='tubeclosed.png' />");
+
$("#tube").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/tubeclosed.png' />");
$("#description1").fadeOut("fast").delay(1000).html("Heat shock the E. coli to make them take in the plasmid.").fadeIn(2100);
$("#description1").fadeOut("fast").delay(1000).html("Heat shock the E. coli to make them take in the plasmid.").fadeIn(2100);
$("#tube").draggable({containment: 'window'});
$("#tube").draggable({containment: 'window'});
-
$("#heatshock").html("<img src='heatshock.png' width='320px' />").fadeIn("slow");
+
$("#heatshock").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/heatshock.png' width='320px' />").fadeIn("slow");
}
}
}});
}});
Line 711: Line 706:
if (flavor=="miraculin")
if (flavor=="miraculin")
{
{
-
$("#V9andinsert").draggable({ disabled: true }).html("<img src='miraculininserted.gif' width='75px' />").css({"left":"100px","top":"200px","z-index":20}).fadeIn("slow").animate({"left":"225px","top":"300px"},3000);
+
$("#V9andinsert").draggable({ disabled: true }).html("<img src='http://www.hcs.harvard.edu/usundergrad/test/miraculininserted.gif' width='75px' />").css({"left":"100px","top":"200px","z-index":20}).fadeIn("slow").animate({"left":"225px","top":"300px"},3000);
}
}
else if (flavor=="brazzein")
else if (flavor=="brazzein")
{
{
-
$("#V9andinsert").draggable({ disabled: true }).html("<img src='brazzeininserted.gif' width='75px' />").css({"left":"100px","top":"200px","z-index":20}).fadeIn("slow").animate({"left":"225px","top":"300px"},3000);
+
$("#V9andinsert").draggable({ disabled: true }).html("<img src='http://www.hcs.harvard.edu/usundergrad/test/brazzeininserted.gif' width='75px' />").css({"left":"100px","top":"200px","z-index":20}).fadeIn("slow").animate({"left":"225px","top":"300px"},3000);
}
}
-
$("#ecoli").draggable({ disabled: true }).html("<img src='ecoli.gif' width='150px' />").css({"left":"200px","top":"200px"}).fadeIn("slow");
+
$("#ecoli").draggable({ disabled: true }).html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecoli.gif' width='150px' />").css({"left":"200px","top":"200px"}).fadeIn("slow");
$("#description1").fadeOut("fast").delay(1000).html("Inside the tube...").fadeIn("fast");
$("#description1").fadeOut("fast").delay(1000).html("Inside the tube...").fadeIn("fast");
$(".description2").css({top:"450px",right:"600px"}).html("plate your transformed cells >>>").fadeIn("slow");
$(".description2").css({top:"450px",right:"600px"}).html("plate your transformed cells >>>").fadeIn("slow");
Line 767: Line 762:
$("#description1").fadeOut("fast").delay(1000).html("The cells multiply").fadeIn("fast");
$("#description1").fadeOut("fast").delay(1000).html("The cells multiply").fadeIn("fast");
$(".ecoli").draggable({ disabled: true });
$(".ecoli").draggable({ disabled: true });
-
$("#ecolismall1").html("<img src='ecolimir.png' width='10px' />").fadeIn("slow");
+
$("#ecolismall1").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecolimir.png' width='10px' />").fadeIn("slow");
-
$("#ecolismall2").html("<img src='ecolimir.png' width='10px' />").fadeIn("slow");
+
$("#ecolismall2").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecolimir.png' width='10px' />").fadeIn("slow");
-
$("#ecolismall3").html("<img src='ecolimir.png' width='10px' />").fadeIn("slow");
+
$("#ecolismall3").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecolimir.png' width='10px' />").fadeIn("slow");
-
$("#ecolismall4").html("<img src='ecolimir.png' width='10px' />").fadeIn("slow");
+
$("#ecolismall4").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecolimir.png' width='10px' />").fadeIn("slow");
-
$("#ecolismall5").html("<img src='ecolimir.png' width='10px' />").fadeIn("slow");
+
$("#ecolismall5").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecolimir.png' width='10px' />").fadeIn("slow");
-
$("#ecolismall6").html("<img src='ecolimir.png' width='10px' />").fadeIn("slow");
+
$("#ecolismall6").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecolimir.png' width='10px' />").fadeIn("slow");
-
$("#ecolismall7").html("<img src='ecolimir.png' width='10px' />").fadeIn("slow");
+
$("#ecolismall7").html("<img src='http://www.hcs.harvard.edu/usundergrad/test/ecolimir.png' width='10px' />").fadeIn("slow");
$(".description2").css({top:"450px",right:"600px"}).html("obtain DNA >>>").fadeIn("slow");
$(".description2").css({top:"450px",right:"600px"}).html("obtain DNA >>>").fadeIn("slow");
}});
}});
Line 787: Line 782:
  
  
  </script>   
  </script>   
 +
   
 +
<div id="newbody">
 +
            <div id="green" class="option1">add flavor</div>
 +
            <div id="blue" class="option2">add color</div>
 +
            <div id="red" class="option3">knockdown<br />allergen</div>
 +
            <div class="logo"><img src="http://www.hcs.harvard.edu/usundergrad/test/igemlogo.gif" height="170px"/></div>
 +
            <div class="suboption1" id="blue"></div>
 +
            <div class="suboption2" id="blue"></div>
 +
            <div id="photo"><img src="http://www.hcs.harvard.edu/usundergrad/test/plantphoto.png" width="550px"/></div>
 +
            <div id="bar"></div>
 +
            <div id="description1">The DNA sequence that codes for the miraculin protein is kept in the V0120 vector. The miraculin gene is bordered on both sides by restriction enzyme sites. Drag enzymes over the restriction enzyme sites to cut the gene out of the vector.</div>
 +
            <div class="description2"></div>
 +
            <div class="description3"></div>
 +
            <div class="description4"></div>
 +
            <div id="img1" class="plasmid"></div>
 +
            <div id="img2" class="plasmid"></div>
 +
            <div id="img3" class='droppable1'></div>
 +
            <div id="img4" class='droppable2'></div>
 +
            <div id="enz1" class="enz">EcoRI (E)</div>
 +
            <div id="enz2" class="enz">NotI (N)</div>
 +
            <div id="enz3" class="enz">XbaI (X)</div>
 +
            <div id="enz4" class="enz">SpeI (S)</div>
 +
            <div id="enz5" class="enz">PstI (P)</div>
 +
            <div id="scissor1" class="draggable"></div>
 +
            <div id="scissor3" class="draggable"></div>
 +
            <div id="scissor2" class="draggable"></div>
 +
            <div id="scissor4" class="draggable"></div>
 +
            <div id="scissor5" class="draggable"></div>
 +
<div id="digested"></div>
 +
<div id="V9bb"></div>
 +
<div id="bbmcs" class="droppable3"></div>
 +
<div id="cut1"></div>
 +
<div id="cut2"></div>
 +
<div id="V9bbcut"></div>
 +
<div id="tube"></div>
 +
<div id="V9andinsert" class="draggable2"></div>
 +
<div id="ecoli" class="draggable2"></div>
 +
<div id="heatshock"></div>
 +
<div id="petridish"></div>
 +
<div id="petridish2"></div>
 +
<div id="petridish3"></div>
 +
<div id="ecolitransformed1" class="ecoli"></div>
 +
<div id="ecolitransformed2" class="ecoli"></div>
 +
<div id="ecolitransformed3" class="ecoli"></div>
 +
<div id="ecolitransformed4" class="ecoli"></div>
 +
<div id="ecolitransformed5" class="ecoli"></div>
 +
<div id="agrotransformed1" class="agro"></div>
 +
<div id="agrotransformed2" class="agro"></div>
 +
<div id="agrotransformed3" class="agro"></div>
 +
<div id="agrotransformed4" class="agro"></div>
 +
<div id="agrotransformed5" class="agro"></div>
 +
<div id="ecolismall1" class="ecolismall"></div>
 +
<div id="ecolismall2" class="ecolismall"></div>
 +
<div id="ecolismall3" class="ecolismall"></div>
 +
<div id="ecolismall4" class="ecolismall"></div>
 +
<div id="ecolismall5" class="ecolismall"></div>
 +
<div id="ecolismall6" class="ecolismall"></div>
 +
<div id="ecolismall7" class="ecolismall"></div>
 +
<div id="bigtube"></div>
 +
<div id="ecoli2"></div>
 +
<div id="agro" class="draggable2"><img src="http://www.hcs.harvard.edu/usundergrad/test/agrobacterium.png" width="60px" /></div>
 +
<div id="agro2" class="draggable2"><img src="http://www.hcs.harvard.edu/usundergrad/test/agrobacterium.png" width="160px" /></div>
 +
<div id="cuvette"><img src="http://www.hcs.harvard.edu/usundergrad/test/cuvette.png" width="60px" /></div>
 +
<div id="flower" class="agro"><img src="http://www.hcs.harvard.edu/usundergrad/test/flower.png" width="70px" /></div>
 +
<div id="pot"><img src="http://www.hcs.harvard.edu/usundergrad/test/pot.png" width="160px" /></div>
 +
<div id="plant"><img src="http://www.hcs.harvard.edu/usundergrad/test/plant.png" width="160px" /></div>
 +
<div id="seed"><img src="http://www.hcs.harvard.edu/usundergrad/test/seed.png" width="40px" /></div>
-
 
+
    </div>
-
";
+
<script type="text/javascript">
-
 
+
var nb = document.getElementById("newbody");
 +
var gw = document.getElementById("globalWrapper");
 +
document.body.replaceChild(nb,gw);
 +
var newCss = document.createElement("link");
 +
newCss.type="text/css";
 +
newCss.href="http://www.hcs.harvard.edu/usundergrad/test/css.css";
 +
newCss.rel="stylesheet";
 +
newCss.media="screen";
 +
document.getElementsByTagName("head")[0].appendChild(newCss);
</script>
</script>
-
 
-
</html>
 

Latest revision as of 20:58, 2 August 2010

add flavor
add color
knockdown
allergen
The DNA sequence that codes for the miraculin protein is kept in the V0120 vector. The miraculin gene is bordered on both sides by restriction enzyme sites. Drag enzymes over the restriction enzyme sites to cut the gene out of the vector.
EcoRI (E)
NotI (N)
XbaI (X)
SpeI (S)
PstI (P)

Retrieved from "http://2010.igem.org/Team:Harvard/virtual"