Team:UCL PG

From 2013.igem.org

(Difference between revisions)
Line 6: Line 6:
<script type="text/javascript">
<script type="text/javascript">
// <![CDATA[
// <![CDATA[
-
var colour="random"; // in addition to "random" can be set to any valid colour eg "#f0f" or "red"
+
var sparks=75; // how many sparks per clicksplosion
-
var sparkles=50;
+
var speed=33; // how fast - smaller is faster
 +
var bangs=5; // how many can be launched simultaneously (note that using too many can slow the script down)
 +
var colours=new Array('#03f', '#f03', '#0e0', '#93f', '#0cf', '#f93', '#f0c');  
 +
//                    blue    red    green  purple  cyan    orange  pink
/****************************
/****************************
-
* Tinkerbell Magic Sparkle *
+
*   Clicksplosion Effect    *
-
*(c)2005-13 mf2fm web-design*
+
*(c)2012-3 mf2fm web-design *
*  http://www.mf2fm.com/rv  *
*  http://www.mf2fm.com/rv  *
* DON'T EDIT BELOW THIS BOX *
* DON'T EDIT BELOW THIS BOX *
****************************/
****************************/
-
var x=ox=400;
+
var intensity=new Array();
-
var y=oy=300;
+
var Xpos=new Array();
 +
var Ypos=new Array();
 +
var dX=new Array();
 +
var dY=new Array();
 +
var stars=new Array();
 +
var decay=new Array();
 +
var timers=new Array();
var swide=800;
var swide=800;
var shigh=600;
var shigh=600;
var sleft=sdown=0;
var sleft=sdown=0;
-
var tiny=new Array();
+
var count=0;
-
var star=new Array();
+
-
var starv=new Array();
+
-
var starx=new Array();
+
-
var stary=new Array();
+
-
var tinyx=new Array();
+
-
var tinyy=new Array();
+
-
var tinyv=new Array();
+
-
window.onload=function() { if (document.getElementById) {
+
function addLoadEvent(funky) {
-
   var i, rats, rlef, rdow;
+
   var oldonload=window.onload;
-
   for (var i=0; i<sparkles; i++) {
+
   if (typeof(oldonload)!='function') window.onload=funky;
-
    var rats=createDiv(3, 3);
+
  else window.onload=function() {
-
    rats.style.visibility="hidden";
+
     if (oldonload) oldonload();
-
    rats.style.zIndex="999";
+
     funky();
-
    document.body.appendChild(tiny[i]=rats);
+
-
    starv[i]=0;
+
-
    tinyv[i]=0;
+
-
    var rats=createDiv(5, 5);
+
-
    rats.style.backgroundColor="transparent";
+
-
    rats.style.visibility="hidden";
+
-
    rats.style.zIndex="999";
+
-
    var rlef=createDiv(1, 5);
+
-
     var rdow=createDiv(5, 1);
+
-
    rats.appendChild(rlef);
+
-
     rats.appendChild(rdow);
+
-
    rlef.style.top="2px";
+
-
    rlef.style.left="0px";
+
-
    rdow.style.top="0px";
+
-
    rdow.style.left="2px";
+
-
    document.body.appendChild(star[i]=rats);
+
   }
   }
-
  set_width();
 
-
  sparkle();
 
-
}}
 
-
 
-
function sparkle() {
 
-
  var c;
 
-
  if (Math.abs(x-ox)>1 || Math.abs(y-oy)>1) {
 
-
    ox=x;
 
-
    oy=y;
 
-
    for (c=0; c<sparkles; c++) if (!starv[c]) {
 
-
      star[c].style.left=(starx[c]=x)+"px";
 
-
      star[c].style.top=(stary[c]=y+1)+"px";
 
-
      star[c].style.clip="rect(0px, 5px, 5px, 0px)";
 
-
      star[c].childNodes[0].style.backgroundColor=star[c].childNodes[1].style.backgroundColor=(colour=="random")?newColour():colour;
 
-
      star[c].style.visibility="visible";
 
-
      starv[c]=50;
 
-
      break;
 
-
    }
 
-
  }
 
-
  for (c=0; c<sparkles; c++) {
 
-
    if (starv[c]) update_star(c);
 
-
    if (tinyv[c]) update_tiny(c);
 
-
  }
 
-
  setTimeout("sparkle()", 40);
 
}
}
-
function update_star(i) {
+
addLoadEvent(clicksplode);
-
  if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
+
 
-
   if (starv[i]) {
+
function clicksplode() { if (document.getElementById) {
-
    stary[i]+=1+Math.random()*3;
+
  var i, j;
-
    starx[i]+=(i%5-2)/5;
+
  window.onscroll=set_scroll;
-
    if (stary[i]<shigh+sdown) {
+
  window.onresize=set_width;
-
      star[i].style.top=stary[i]+"px";
+
   document.onclick=eksplode;
-
      star[i].style.left=starx[i]+"px";
+
  set_width();
-
     }
+
  set_scroll();
-
    else {
+
  for (i=0; i<bangs; i++) for (j=sparks*i; j<sparks+sparks*i; j++) {
-
      star[i].style.visibility="hidden";
+
    stars[j]=createDiv('*', 13);
-
      starv[i]=0;
+
     document.body.appendChild(stars[j]);
-
      return;
+
-
    }
+
   }
   }
-
  else {
+
}}
-
    tinyv[i]=50;
+
-
    tiny[i].style.top=(tinyy[i]=stary[i])+"px";
+
-
    tiny[i].style.left=(tinyx[i]=starx[i])+"px";
+
-
    tiny[i].style.width="2px";
+
-
    tiny[i].style.height="2px";
+
-
    tiny[i].style.backgroundColor=star[i].childNodes[0].style.backgroundColor;
+
-
    star[i].style.visibility="hidden";
+
-
    tiny[i].style.visibility="visible"
+
-
  }
+
-
}
+
-
function update_tiny(i) {
+
function createDiv(char, size) {
-
   if (--tinyv[i]==25) {
+
   var div, sty;
-
    tiny[i].style.width="1px";
+
   div=document.createElement('div');
-
    tiny[i].style.height="1px";
+
  sty=div.style;
-
   }
+
  sty.font=size+'px monospace';
-
  if (tinyv[i]) {
+
  sty.position='absolute';
-
    tinyy[i]+=1+Math.random()*3;
+
  sty.backgroundColor='transparent';
-
    tinyx[i]+=(i%5-2)/5;
+
  sty.visibility='hidden';
-
    if (tinyy[i]<shigh+sdown) {
+
  sty.zIndex='101';
-
      tiny[i].style.top=tinyy[i]+"px";
+
  div.appendChild(document.createTextNode(char));
-
      tiny[i].style.left=tinyx[i]+"px";
+
   return (div);
-
    }
+
-
    else {
+
-
      tiny[i].style.visibility="hidden";
+
-
      tinyv[i]=0;
+
-
      return;
+
-
    }
+
-
   }
+
-
  else tiny[i].style.visibility="hidden";
+
}
}
-
document.onmousemove=mouse;
+
function bang(N) {
-
function mouse(e) {
+
  var i, Z, A=0;
-
  if (e) {
+
  for (i=sparks*N; i<sparks*(N+1); i++) {  
-
    y=e.pageY;
+
    if (decay[i]) {
-
    x=e.pageX;
+
      Z=stars[i].style;
-
  }
+
      Xpos[i]+=dX[i];
-
  else {
+
      Ypos[i]+=(dY[i]+=1.25/intensity[N]);
-
    set_scroll();
+
      if (Xpos[i]>=swide || Xpos[i]<0 || Ypos[i]>=shigh+sdown || Ypos[i]<0) decay[i]=1;
-
    y=event.y+sdown;
+
  else {
-
    x=event.x+sleft;
+
        Z.left=Xpos[i]+'px';
 +
        Z.top=Ypos[i]+'px';
 +
  }
 +
      if (decay[i]==15) Z.fontSize='7px';
 +
      else if (decay[i]==7) Z.fontSize='2px';
 +
      else if (decay[i]==1) Z.visibility='hidden';
 +
  decay[i]--;
 +
}
 +
else A++;
   }
   }
 +
  if (A!=sparks) timers[N]=setTimeout('bang('+N+')', speed);
}
}
-
window.onscroll=set_scroll;
+
function eksplode(e) {
-
function set_scroll() {
+
  var x, y, i, M, Z, N;
-
   if (typeof(self.pageYOffset)=='number') {
+
  set_scroll();
-
     sdown=self.pageYOffset;
+
   y=(e)?e.pageY:event.y+sdown;
-
     sleft=self.pageXOffset;
+
  x=(e)?e.pageX:event.x+sleft;
 +
  N=++count%bangs;
 +
  M=Math.floor(Math.random()*3*colours.length);
 +
  intensity[N]=5+Math.random()*4;
 +
  for (i=N*sparks; i<(N+1)*sparks; i++) {
 +
     Xpos[i]=x;
 +
    Ypos[i]=y-5;
 +
    dY[i]=(Math.random()-0.5)*intensity[N];
 +
     dX[i]=(Math.random()-0.5)*(intensity[N]-Math.abs(dY[i]))*1.25;
 +
    decay[i]=16+Math.floor(Math.random()*16);
 +
    Z=stars[i].style;
 +
    if (M<colours.length) Z.color=colours[i%2?count%colours.length:M];
 +
    else if (M<2*colours.length) Z.color=colours[count%colours.length];
 +
    else Z.color=colours[i%colours.length];
 +
    Z.fontSize='13px';
 +
    Z.visibility='visible';
   }
   }
-
   else if (document.body && (document.body.scrollTop || document.body.scrollLeft)) {
+
   clearTimeout(timers[N]);
-
    sdown=document.body.scrollTop;
+
   bang(N);
-
    sleft=document.body.scrollLeft;
+
}  
-
   }
+
-
  else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
+
-
    sleft=document.documentElement.scrollLeft;
+
-
    sdown=document.documentElement.scrollTop;
+
-
  }
+
-
  else {
+
-
    sdown=0;
+
-
    sleft=0;
+
-
  }
+
-
}
+
-
window.onresize=set_width;
 
function set_width() {
function set_width() {
   var sw_min=999999;
   var sw_min=999999;
Line 179: Line 134:
     sh_min=600;
     sh_min=600;
   }
   }
-
   swide=sw_min;
+
   swide=sw_min-7;
-
   shigh=sh_min;
+
   shigh=sh_min-7;
}
}
-
function createDiv(height, width) {
+
function set_scroll() {
-
   var div=document.createElement("div");
+
   if (typeof(self.pageYOffset)=='number') {
-
  div.style.position="absolute";
+
    sdown=self.pageYOffset;
-
  div.style.height=height+"px";
+
    sleft=self.pageXOffset;
-
  div.style.width=width+"px";
+
   }
-
  div.style.overflow="hidden";
+
  else if (document.body && (document.body.scrollTop || document.body.scrollLeft)) {
-
   return (div);
+
    sdown=document.body.scrollTop;
-
}
+
    sleft=document.body.scrollLeft;
-
 
+
   }
-
function newColour() {
+
  else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
-
  var c=new Array();
+
    sleft=document.documentElement.scrollLeft;
-
  c[0]=255;
+
    sdown=document.documentElement.scrollTop;
-
   c[1]=Math.floor(Math.random()*256);
+
   }
-
  c[2]=Math.floor(Math.random()*(256-c[1]/2));
+
  else {
-
   c.sort(function(){return (0.5 - Math.random());});
+
    sdown=0;
-
   return ("rgb("+c[0]+", "+c[1]+", "+c[2]+")");
+
    sleft=0;
 +
   }
}
}
// ]]>
// ]]>

Revision as of 03:09, 29 September 2013

    


About iGEM

International Genetically Engineered Machine (iGEM) is an annual world-wide synthetic biology competition aimed at university students. Each year, participating teams from all over the world are challenged to bring their innovative ideas to life by applying engineering methodology in life sciences to ultimately produce “Biobricks” which are modular biological circuit parts that can be utilized to solve global issues.

About us

We are a combination of dedicated graduate students and research assistants from both UCL Cancer Institute and UCL Engineering.

About our idea

Improvising activation of the circuit with light, evolve luminescent proteins. Allow preclinical genetic imaging to study endogenous and disease processes in vivo and to image the genetic behaviour of life.