Team:Queens-Canada/full/animat0r.js

From 2010.igem.org

(Difference between revisions)
(Undo revision 171890 by Glh (Talk))
Line 1: Line 1:
-
{{:Team:Queens-Canada/head}}
+
var transitioning = 0;
-
<h1>Objective</h1>
+
var width = 0;
 +
var fading = 0;
 +
var T2 = null;
-
Our goal this summer was to build a toolkit for the nematode ''Caenorhabditis elegans'' to facilitate its future use as a synthetic biology chassis. Our focus was on finding and selecting viable promoters, protein domains, and other key components for use by future teams.
+
function resizeIframe() {
 +
var height = document.getElementById('tier0p').clientHeight;
 +
var ifr = document.getElementById('the_frame');
 +
ifr.style.height = height + "px";
 +
}
-
The motivation for our project is simple enough: to date, there has been little interest in using complex eukaryotic and multicellular organisms in iGEM, and we feel that the advantages of multicellular organisms outweigh the challenges involved in working with them. With the benefit of the documentation and components we hope that most of these issues.
+
function prep() {
 +
var ifr = document.getElementById("the_frame");
 +
 +
ifr.style.opacity = 0;
 +
/*@cc_on
 +
ifr.style.filter = "alpha(opacity=0)";
 +
@*/
-
The jump from working with ''E. coli'' to ''C. elegans'' not an insurmountable one; the worm has a short generation time, is grown at room temperature on agar plates, can be frozen, and it can be transformed using standard BioBrick plasmids assembled in ''E. coli''.  
+
if (ifr.addEventListener) {
 +
ifr.addEventListener("load", showPage, false)
 +
} else if(ifr.attachEvent) {
 +
ifr.detachEvent("onload", showPage) // Bug fix line
 +
ifr.attachEvent("onload", showPage)
 +
}
 +
 +
showPage();
 +
resizeIframe();
 +
window.onresize = resizeIframe;
 +
}
-
Through WormGuide, future teams will be able to easily and quickly learn all about the worm and the possibilities that it holds.  The parts that we have submitted will then provide them with a solid base from which they can build their projects.
+
function strpos(haystack, needle, offset) {
 +
    var i = (haystack+'').indexOf(needle, (offset || 0));
 +
    return i === -1 ? false : i;
 +
}
-
The benefits of working in a complicated organism like ''C. elegans'' are significant.  It has been extensively studied as a model organism for developmental biology and was the first multicellular organism sequenced. As such, the worm represents one of the best and most accessible opportunities for iGEM-style synthetic biology to make inroads into higher forms of life.
+
function showPage() {
 +
var ifr = document.getElementById("the_frame");
 +
 +
animateFade(1, 0);
 +
if(strpos(ifr.contentDocument.URL, 'project') != false) { hideT2(); showProject(); }
 +
if(strpos(ifr.contentDocument.URL, 'idea') != false) { showProject(1); hideT2(progress, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'notebook') != false) { showProject(1); hideT2(progress, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'safety') != false) { showProject(1); hideT2(progress, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'team') != false)  { hideT2(); showProject(); }
 +
if(strpos(ifr.contentDocument.URL, 'contributors') != false) { showProject(1); hideT2(people, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'parts') != false) { showProject(1); hideT2(parts, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'contributing') != false) { showProject(1); hideT2(biobricks, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'sponsors') != false) { showProject(); }
-
<html><div class="section"><h2>R.<i>C. elegans</i></h2></html>
+
if(strpos(ifr.contentDocument.URL, 'guide') != false) { hideT2(); showGuide(); }
 +
if(strpos(ifr.contentDocument.URL, 'intro') != false) { showGuide(1); hideT2(context, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'history') != false) { showGuide(1); hideT2(context, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'resources') != false) { showGuide(1); hideT2(context, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'exterior') != false) { showGuide(1); hideT2(anatomy, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'pseudocoelom') != false) { showGuide(1); hideT2(anatomy, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'digestive') != false) { showGuide(1); hideT2(anatomy, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'nervous') != false) { showGuide(1); hideT2(anatomy, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'reproductive') != false) { showGuide(1); hideT2(anatomy, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'promoter') != false) { showGuide(1); hideT2(genetics, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'transcripts') != false) { showGuide(1); hideT2(genetics, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'rnai') != false) { showGuide(1); hideT2(genetics, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'strains') != false) { showGuide(1); hideT2(genetics, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'transformation') != false) { showGuide(1); hideT2(practical, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'care') != false) { showGuide(1); hideT2(practical, 1); }
 +
if(strpos(ifr.contentDocument.URL, 'protocols') != false) { showGuide(1); hideT2(practical, 1); }
 +
 +
document.body.style.cursor = 'default';
 +
}
-
One diagnostic tool which has received a lot of attention recently are the '''channelrhodopsins''', which were isolated from the green algae ''Chlamydomonas reinhardtii'', and serve as light-activated nonspecific cation channels which can cause nerve cells to depolarise in response to certain wavelengths of light. These have been used extensively in research biology to interrogate the roles of the neurons in ''C. elegans'' and other species, allowing researchers to, for example, cause nematodes to contract all of their muscles at once and seize up in response to specific wavelengths of light.{{:Team:Queens-Canada/footnote-anchor|1}}
+
function toPage(url) {
 +
animateFade(0, 1, url);
 +
}
-
Acting as counterpart to the channelrhodopsins is a channel called '''halorhodopsin''', isolated from halophilic archaeans, which causes the cell to uptake chloride anions, and thus can be used to hyperpolarise a neuron and prevent it from firing. Importantly, the halorhodopsin excitation frequency is well-separated from the excitation frequency of channelrhodopsin-2, and so they can be used in the same organism, or even the same cell, without significant cross-talk.
+
function animateFade(to, at, url) {
 +
if((to == 1) && fading == 0) fading = 1;
 +
if((to == 0) && fading == 1) return;
 +
var ifr = document.getElementById("the_frame");
 +
opa = at;
 +
ifr.style.opacity = opa;
 +
/*@cc_on
 +
ifr.style.filter = "alpha(opacity=" + opa * 100 + ")";
 +
@*/
-
By combining these proteins in a single transgenic organism, behind specifically-chosen promoters which target only certain neurons, we hope to make a "remote control" worm, which can be instructed to move either forward or backward by exposing it to the appropriate wavelengths of light.<html></div></html>
+
if(to == 1) opa = opa + 0.1;
 +
if(to == 0) opa = opa - 0.1;
 +
if((opa < to) && to == 0) {
 +
document.body.style.cursor = 'wait';
 +
ifr.src = url;
-
<html><div class="section" id="footnotes"><h2>Footnotes and Citations</h2>
+
ifr.style.opacity = 0;
-
<style type="text/css">
+
/*@cc_on
-
    #footnotes p {
+
ifr.style.filter = "alpha(opacity=0)";
-
        text-align: left;
+
@*/
-
    }
+
-
</style></html>
+
// ifr.onload = 'animateFade(1, 0)';
-
{{:Team:Queens-Canada/footnote|1|Nagel G et al., 2003 <html><a target="_new" href="http://www.ncbi.nlm.nih.gov/pmc/articles/PMC283525/">Channelrhodopsin-2, a directly light-gated cation-selective membrane channel</a></html>. PNAS 100(24). doi:10.1073/pnas.1936192100}}
+
// setTimeout('animateFade(1, 0)', 20);
 +
return;
 +
}
 +
if((opa > to) && to == 1) {
 +
fading = 0;
 +
ifr.style.opacity = 1;
 +
/*@cc_on
 +
ifr.style.filter = "alpha(opacity=100)";
 +
@*/
 +
 +
return;
 +
}
-
{{:Team:Queens-Canada/footnote|2|Han X, Boyden ES, 2007 <html><a target="_new" href="http://www.plosone.org/article/info:doi/10.1371/journal.pone.0000299">Multiple-Color Optical Activation, Silencing, and Desynchronization of Neural Activity, with Single-Spike Temporal Resolution</a></html>. PLoS ONE 2(3): e299. doi:10.1371/journal.pone.0000299}}
+
setTimeout('animateFade(' + to + ',' + opa + ',"' + url + '")', 1);
-
<html></div></html>
+
}
-
{{:Team:Queens-Canada/foot}}
+
 
 +
function animateShowT2(percentDone) {
 +
var t2 = document.getElementById("tier2");
 +
t2.style.top = (100 + percentDone * 35) + "px";
 +
if(percentDone == 0.01) transitioning = 1;
 +
 +
percentDone = 1 - ((1 - percentDone) / 1.6);
 +
if(percentDone > 0.995) { transitioning = 0; t2.style.top = '135px'; return; }
 +
 
 +
setTimeout('animateShowT2(' + percentDone + ')', 40);
 +
}
 +
 
 +
function showT2() {
 +
setTimeout('animateShowT2(0.01)', 20);
 +
}
 +
 
 +
function mt(name, title) {
 +
if(title == null) title = name;
 +
width2 = width;
 +
/*@cc_on
 +
width2 -= 1;
 +
@*/
 +
return '<div style="width: ' + width2 + '%;" class="tier2item" id="' + name + '" title="'+title+'"><div class="tier2item_p" id="tier2_'+name+'"></div><div class="tier2item_l"></div><div class="tier2item_r"></div><div class="tier2item_m" onclick="toPage(\'' + name + '\')"><div class="tier2item_m2">' + title + '</div></div></div>';
 +
}
 +
 
 +
function progress() {
 +
var t2 = document.getElementById("tier2");
 +
width = 100/3;
 +
t2.innerHTML = mt('idea', 'overview') + mt('notebook', 'notebook') + mt('safety', 'safety');
 +
showT2();
 +
}
 +
 
 +
function biobricks() {
 +
var t2 = document.getElementById("tier2");
 +
width = 100/2;
 +
t2.innerHTML = mt('parts', 'the parts') + mt('contributing', 'contributing');
 +
showT2();
 +
}
 +
 
 +
function sponsors() {
 +
toPage("sponsors");
 +
}
 +
 
 +
function people() {
 +
toPage("team");
 +
// var t2 = document.getElementById("tier2");
 +
// width = 100/2;
 +
// t2.innerHTML = mt('team', 'the team') + mt('contributors');
 +
// showT2();
 +
}
 +
 
 +
function practical() {
 +
var t2 = document.getElementById("tier2");
 +
width = 100/3;
 +
t2.innerHTML =  mt('transformation') + mt('care') + mt('protocols', 'miscellaneous');
 +
showT2();
 +
}
 +
 
 +
function anatomy() {
 +
var t2 = document.getElementById("tier2");
 +
width = 100/5;
 +
t2.innerHTML = mt('pseudocoelom') + mt('digestive') + mt('nervous') + mt('skin', 'exterior') + mt('reproductive');
 +
showT2();
 +
}
 +
 
 +
function genetics() {
 +
var t2 = document.getElementById("tier2");
 +
width = 100/4;
 +
t2.innerHTML = mt('promoter', "the promoter and 5' utr") + mt('transcripts', 'introns and transcripts') + mt('rnai', "rna interference and 3' utr") + mt('strains', 'strains and mutants');
 +
showT2();
 +
}
 +
 
 +
function context() {
 +
var t2 = document.getElementById("tier2");
 +
width = 100/3;
 +
t2.innerHTML = mt('intro', 'introduction') + mt('history', 'history in science') + mt('resources', 'online resources');
 +
showT2();
 +
}
 +
 
 +
function hideT2(callback, force) {
 +
if(callback == T2) return;
 +
T2 = callback;
 +
var t2 = document.getElementById("tier2");
 +
if(t2.style.top == '100px') {
 +
if(callback != null) callback();
 +
} else {
 +
if(transitioning == 1 && force == 0) return;
 +
transitioning = 1;
 +
animateHideT2(0.01, callback);
 +
}
 +
}
 +
 
 +
function animateHideT2(percentDone, callback) {
 +
var t2 = document.getElementById("tier2");
 +
t2.style.top = (135 - percentDone * 35) + "px";
 +
 +
percentDone = 1 - ((1 - percentDone) / 1.6);
 +
if(percentDone > 0.995) {
 +
t2.style.top = '100px';
 +
if(callback != null) { callback(); }
 +
transitioning = 0;
 +
} else {
 +
setTimeout('animateHideT2(' + percentDone + ',' + callback + ')', 40);
 +
}
 +
}
 +
 
 +
function showGuide(force) {
 +
var tp = document.getElementById("t_project");
 +
var tg = document.getElementById("t_guide");
 +
 +
if(tp.style.left == "auto") return;
 +
if(transitioning == 1) return;
 +
var ig = document.getElementById("i_guide");
 +
 
 +
ig.src = "https://static.igem.org/mediawiki/2010/c/c1/Qgem_full_guide.gif";
 +
 
 +
var flexSpace = document.getElementById("tier0tm2").clientWidth - 307 - 73 - 83;
 +
if(flexSpace < 5) return;
 +
 
 +
if(force != 1) hideT2();
 +
 
 +
transitioning = 1;
 +
 
 +
tg.style.width = '73px';
 +
tg.style.right = 'auto';
 +
tp.style.width = (83 + flexSpace - 5) + 'px';
 +
tp.style.left = 'auto';
 +
 
 +
animateGuide(0.01);
 +
}
 +
 
 +
function animateGuide(percentDone) {
 +
var tp = document.getElementById("t_project");
 +
var tg = document.getElementById("t_guide");
 +
 +
var flexSpace = document.getElementById("tier0tm2").clientWidth - 307 - 73 - 83;
 +
var fS = flexSpace * percentDone;
 +
 +
tg.style.width = (73 + fS - 5) + "px";
 +
tp.style.width = (83 + flexSpace - fS) + "px";
 +
percentDone = 1 - ((1 - percentDone) / 1.6);
 +
if(percentDone > 0.995) { finishGuide(); return; }
 +
 
 +
setTimeout('animateGuide(' + percentDone + ')', 40);
 +
}
 +
 
 +
function finishGuide() {
 +
var tp = document.getElementById("t_project");
 +
var tg = document.getElementById("t_guide");
 +
var ip = document.getElementById("i_project");
 +
 
 +
ip.src = "https://static.igem.org/mediawiki/2010/e/e3/Qgem_full_project_closed.gif";
 +
 
 +
tg.style.left = '0px';
 +
tg.style.right = '395px';
 +
tg.style.width = 'auto';
 +
tp.style.left = 'auto';
 +
tp.style.right = '307px';
 +
tp.style.width = '83px';
 +
transitioning = 0;
 +
}
 +
 
 +
// reverse
 +
function showProject(force) {
 +
var tp = document.getElementById("t_project");
 +
var tg = document.getElementById("t_guide");
 +
 +
if(tg.style.right == "auto") return;
 +
if(transitioning == 1) return;
 +
var ip = document.getElementById("i_project");
 +
 
 +
ip.src = "https://static.igem.org/mediawiki/2010/0/04/Qgem_full_project.gif";
 +
 
 +
var flexSpace = document.getElementById("tier0tm2").clientWidth - 307 - 73 - 83;
 +
if(flexSpace < 5) return;
 +
 
 +
hideT2();
 +
 +
if(force != 1) hideT2();
 +
 +
tg.style.width = (73 + flexSpace - 5) + 'px';
 +
tg.style.right = 'auto';
 +
tp.style.width = '83px';
 +
tp.style.left = 'auto';
 +
 
 +
animateProject(0.01);
 +
}
 +
 
 +
function animateProject(percentDone) {
 +
var tp = document.getElementById("t_project");
 +
var tg = document.getElementById("t_guide");
 +
 +
var flexSpace = document.getElementById("tier0tm2").clientWidth - 307 - 73 - 83;
 +
var fS = flexSpace * percentDone;
 +
 +
tg.style.width = (73 + flexSpace - fS) + "px";
 +
tp.style.width = (83 + fS - 5) + "px";
 +
percentDone = 1 - ((1 - percentDone) / 1.6);
 +
if(percentDone > 0.995) { finishProject(); return; }
 +
 
 +
setTimeout('animateProject(' + percentDone + ')', 40);
 +
}
 +
 
 +
function finishProject() {
 +
var tp = document.getElementById("t_project");
 +
var tg = document.getElementById("t_guide");
 +
var ig = document.getElementById("i_guide");
 +
 
 +
ig.src = "https://static.igem.org/mediawiki/2010/b/b7/Qgem_full_guide_closed.gif";
 +
 
 +
tg.style.left = '0px';
 +
tg.style.right = 'auto';
 +
tg.style.width = '73px';
 +
tp.style.left = '78px';
 +
tp.style.right = '307px';
 +
tp.style.width = 'auto';
 +
transitioning = 0;
 +
}

Revision as of 02:38, 27 October 2010

var transitioning = 0; var width = 0; var fading = 0; var T2 = null;

function resizeIframe() { var height = document.getElementById('tier0p').clientHeight; var ifr = document.getElementById('the_frame'); ifr.style.height = height + "px"; }

function prep() { var ifr = document.getElementById("the_frame");

ifr.style.opacity = 0; /*@cc_on ifr.style.filter = "alpha(opacity=0)"; @*/

if (ifr.addEventListener) { ifr.addEventListener("load", showPage, false) } else if(ifr.attachEvent) { ifr.detachEvent("onload", showPage) // Bug fix line ifr.attachEvent("onload", showPage) }

showPage(); resizeIframe(); window.onresize = resizeIframe; }

function strpos(haystack, needle, offset) { 

   var i = (haystack+).indexOf(needle, (offset || 0));
   return i === -1 ? false : i;

}

function showPage() { var ifr = document.getElementById("the_frame");

animateFade(1, 0); if(strpos(ifr.contentDocument.URL, 'project') != false) { hideT2(); showProject(); } if(strpos(ifr.contentDocument.URL, 'idea') != false) { showProject(1); hideT2(progress, 1); } if(strpos(ifr.contentDocument.URL, 'notebook') != false) { showProject(1); hideT2(progress, 1); } if(strpos(ifr.contentDocument.URL, 'safety') != false) { showProject(1); hideT2(progress, 1); } if(strpos(ifr.contentDocument.URL, 'team') != false) { hideT2(); showProject(); } if(strpos(ifr.contentDocument.URL, 'contributors') != false) { showProject(1); hideT2(people, 1); } if(strpos(ifr.contentDocument.URL, 'parts') != false) { showProject(1); hideT2(parts, 1); } if(strpos(ifr.contentDocument.URL, 'contributing') != false) { showProject(1); hideT2(biobricks, 1); } if(strpos(ifr.contentDocument.URL, 'sponsors') != false) { showProject(); }

if(strpos(ifr.contentDocument.URL, 'guide') != false) { hideT2(); showGuide(); } if(strpos(ifr.contentDocument.URL, 'intro') != false) { showGuide(1); hideT2(context, 1); } if(strpos(ifr.contentDocument.URL, 'history') != false) { showGuide(1); hideT2(context, 1); } if(strpos(ifr.contentDocument.URL, 'resources') != false) { showGuide(1); hideT2(context, 1); } if(strpos(ifr.contentDocument.URL, 'exterior') != false) { showGuide(1); hideT2(anatomy, 1); } if(strpos(ifr.contentDocument.URL, 'pseudocoelom') != false) { showGuide(1); hideT2(anatomy, 1); } if(strpos(ifr.contentDocument.URL, 'digestive') != false) { showGuide(1); hideT2(anatomy, 1); } if(strpos(ifr.contentDocument.URL, 'nervous') != false) { showGuide(1); hideT2(anatomy, 1); } if(strpos(ifr.contentDocument.URL, 'reproductive') != false) { showGuide(1); hideT2(anatomy, 1); } if(strpos(ifr.contentDocument.URL, 'promoter') != false) { showGuide(1); hideT2(genetics, 1); } if(strpos(ifr.contentDocument.URL, 'transcripts') != false) { showGuide(1); hideT2(genetics, 1); } if(strpos(ifr.contentDocument.URL, 'rnai') != false) { showGuide(1); hideT2(genetics, 1); } if(strpos(ifr.contentDocument.URL, 'strains') != false) { showGuide(1); hideT2(genetics, 1); } if(strpos(ifr.contentDocument.URL, 'transformation') != false) { showGuide(1); hideT2(practical, 1); } if(strpos(ifr.contentDocument.URL, 'care') != false) { showGuide(1); hideT2(practical, 1); } if(strpos(ifr.contentDocument.URL, 'protocols') != false) { showGuide(1); hideT2(practical, 1); }

document.body.style.cursor = 'default'; }

function toPage(url) { animateFade(0, 1, url); }

function animateFade(to, at, url) { if((to == 1) && fading == 0) fading = 1; if((to == 0) && fading == 1) return; var ifr = document.getElementById("the_frame"); opa = at; ifr.style.opacity = opa; /*@cc_on ifr.style.filter = "alpha(opacity=" + opa * 100 + ")"; @*/

if(to == 1) opa = opa + 0.1; if(to == 0) opa = opa - 0.1; if((opa < to) && to == 0) { document.body.style.cursor = 'wait'; ifr.src = url;

ifr.style.opacity = 0; /*@cc_on ifr.style.filter = "alpha(opacity=0)"; @*/

// ifr.onload = 'animateFade(1, 0)'; // setTimeout('animateFade(1, 0)', 20); return; } if((opa > to) && to == 1) { fading = 0; ifr.style.opacity = 1; /*@cc_on ifr.style.filter = "alpha(opacity=100)"; @*/

return; }

setTimeout('animateFade(' + to + ',' + opa + ',"' + url + '")', 1); }

function animateShowT2(percentDone) { var t2 = document.getElementById("tier2"); t2.style.top = (100 + percentDone * 35) + "px"; if(percentDone == 0.01) transitioning = 1;

percentDone = 1 - ((1 - percentDone) / 1.6); if(percentDone > 0.995) { transitioning = 0; t2.style.top = '135px'; return; }

setTimeout('animateShowT2(' + percentDone + ')', 40); }

function showT2() { setTimeout('animateShowT2(0.01)', 20); }

function mt(name, title) { if(title == null) title = name; width2 = width; /*@cc_on width2 -= 1; @*/

return '
' + title + '
';

}

function progress() { var t2 = document.getElementById("tier2"); width = 100/3; t2.innerHTML = mt('idea', 'overview') + mt('notebook', 'notebook') + mt('safety', 'safety'); showT2(); }

function biobricks() { var t2 = document.getElementById("tier2"); width = 100/2; t2.innerHTML = mt('parts', 'the parts') + mt('contributing', 'contributing'); showT2(); }

function sponsors() { toPage("sponsors"); }

function people() { toPage("team"); // var t2 = document.getElementById("tier2"); // width = 100/2; // t2.innerHTML = mt('team', 'the team') + mt('contributors'); // showT2(); }

function practical() { var t2 = document.getElementById("tier2"); width = 100/3; t2.innerHTML = mt('transformation') + mt('care') + mt('protocols', 'miscellaneous'); showT2(); }

function anatomy() { var t2 = document.getElementById("tier2"); width = 100/5; t2.innerHTML = mt('pseudocoelom') + mt('digestive') + mt('nervous') + mt('skin', 'exterior') + mt('reproductive'); showT2(); }

function genetics() { var t2 = document.getElementById("tier2"); width = 100/4; t2.innerHTML = mt('promoter', "the promoter and 5' utr") + mt('transcripts', 'introns and transcripts') + mt('rnai', "rna interference and 3' utr") + mt('strains', 'strains and mutants'); showT2(); }

function context() { var t2 = document.getElementById("tier2"); width = 100/3; t2.innerHTML = mt('intro', 'introduction') + mt('history', 'history in science') + mt('resources', 'online resources'); showT2(); }

function hideT2(callback, force) { if(callback == T2) return; T2 = callback; var t2 = document.getElementById("tier2"); if(t2.style.top == '100px') { if(callback != null) callback(); } else { if(transitioning == 1 && force == 0) return; transitioning = 1; animateHideT2(0.01, callback); } }

function animateHideT2(percentDone, callback) { var t2 = document.getElementById("tier2"); t2.style.top = (135 - percentDone * 35) + "px";

percentDone = 1 - ((1 - percentDone) / 1.6); if(percentDone > 0.995) { t2.style.top = '100px'; if(callback != null) { callback(); } transitioning = 0; } else { setTimeout('animateHideT2(' + percentDone + ',' + callback + ')', 40); } }

function showGuide(force) { var tp = document.getElementById("t_project"); var tg = document.getElementById("t_guide");

if(tp.style.left == "auto") return; if(transitioning == 1) return; var ig = document.getElementById("i_guide");

ig.src = "Qgem_full_guide.gif";

var flexSpace = document.getElementById("tier0tm2").clientWidth - 307 - 73 - 83; if(flexSpace < 5) return;

if(force != 1) hideT2();

transitioning = 1;

tg.style.width = '73px'; tg.style.right = 'auto'; tp.style.width = (83 + flexSpace - 5) + 'px'; tp.style.left = 'auto';

animateGuide(0.01); }

function animateGuide(percentDone) { var tp = document.getElementById("t_project"); var tg = document.getElementById("t_guide");

var flexSpace = document.getElementById("tier0tm2").clientWidth - 307 - 73 - 83; var fS = flexSpace * percentDone;

tg.style.width = (73 + fS - 5) + "px"; tp.style.width = (83 + flexSpace - fS) + "px"; percentDone = 1 - ((1 - percentDone) / 1.6); if(percentDone > 0.995) { finishGuide(); return; }

setTimeout('animateGuide(' + percentDone + ')', 40); }

function finishGuide() { var tp = document.getElementById("t_project"); var tg = document.getElementById("t_guide"); var ip = document.getElementById("i_project");

ip.src = "Qgem_full_project_closed.gif";

tg.style.left = '0px'; tg.style.right = '395px'; tg.style.width = 'auto'; tp.style.left = 'auto'; tp.style.right = '307px'; tp.style.width = '83px'; transitioning = 0; }

// reverse function showProject(force) { var tp = document.getElementById("t_project"); var tg = document.getElementById("t_guide");

if(tg.style.right == "auto") return; if(transitioning == 1) return; var ip = document.getElementById("i_project");

ip.src = "Qgem_full_project.gif";

var flexSpace = document.getElementById("tier0tm2").clientWidth - 307 - 73 - 83; if(flexSpace < 5) return;

hideT2();

if(force != 1) hideT2();

tg.style.width = (73 + flexSpace - 5) + 'px'; tg.style.right = 'auto'; tp.style.width = '83px'; tp.style.left = 'auto';

animateProject(0.01); }

function animateProject(percentDone) { var tp = document.getElementById("t_project"); var tg = document.getElementById("t_guide");

var flexSpace = document.getElementById("tier0tm2").clientWidth - 307 - 73 - 83; var fS = flexSpace * percentDone;

tg.style.width = (73 + flexSpace - fS) + "px"; tp.style.width = (83 + fS - 5) + "px"; percentDone = 1 - ((1 - percentDone) / 1.6); if(percentDone > 0.995) { finishProject(); return; }

setTimeout('animateProject(' + percentDone + ')', 40); }

function finishProject() { var tp = document.getElementById("t_project"); var tg = document.getElementById("t_guide"); var ig = document.getElementById("i_guide");

ig.src = "Qgem_full_guide_closed.gif";

tg.style.left = '0px'; tg.style.right = 'auto'; tg.style.width = '73px'; tp.style.left = '78px'; tp.style.right = '307px'; tp.style.width = 'auto'; transitioning = 0; }

Retrieved from "http://2010.igem.org/Team:Queens-Canada/full/animat0r.js"