Team:Harvard/virtual

From 2010.igem.org

(Difference between revisions)
 
(18 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
-
    <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 32: 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 45: 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 64: 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 77: 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 118: 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 130: 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 142: 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 159: 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;
Line 171: 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;
Line 183: 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)
if(score>30)
Line 313: 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 333: 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 419: 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 432: 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 449: 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 487: 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 507: 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 518: 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 552: 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 584: 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 590: 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 596: 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 602: 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 608: 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 622: 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 629: 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 636: 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 643: 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 658: 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 675: 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 691: 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 707: 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 763: 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 788: Line 787:
             <div id="blue" class="option2">add color</div>
             <div id="blue" class="option2">add color</div>
             <div id="red" class="option3">knockdown<br />allergen</div>
             <div id="red" class="option3">knockdown<br />allergen</div>
-
             <div class="logo"><img src="igemlogo.gif" height="170px"/></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="suboption1" id="blue"></div>
             <div class="suboption2" id="blue"></div>
             <div class="suboption2" id="blue"></div>
-
             <div id="photo"><img src="plantphoto.png" width="550px"/></div>
+
             <div id="photo"><img src="http://www.hcs.harvard.edu/usundergrad/test/plantphoto.png" width="550px"/></div>
             <div id="bar"></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 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>
Line 843: Line 842:
  <div id="bigtube"></div>
  <div id="bigtube"></div>
  <div id="ecoli2"></div>
  <div id="ecoli2"></div>
-
  <div id="agro" class="draggable2"><img src="agrobacterium.png" width="60px" /></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="agrobacterium.png" width="160px" /></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="cuvette.png" width="60px" /></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="flower.png" width="70px" /></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="pot.png" width="160px" /></div>
+
  <div id="pot"><img src="http://www.hcs.harvard.edu/usundergrad/test/pot.png" width="160px" /></div>
-
  <div id="plant"><img src="plant.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="seed.png" width="40px" /></div>
+
  <div id="seed"><img src="http://www.hcs.harvard.edu/usundergrad/test/seed.png" width="40px" /></div>
     </div>
     </div>
Line 856: Line 855:
var gw = document.getElementById("globalWrapper");
var gw = document.getElementById("globalWrapper");
document.body.replaceChild(nb,gw);
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>

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)