Team:Imperial College London

From 2011.igem.org

(Difference between revisions)
 
(64 intermediate revisions not shown)
Line 2: Line 2:
<html>
<html>
<head>
<head>
 +
<style type="text/css">
<style type="text/css">
-
div.rssincl-trial-header{display:none;}
+
 
 +
/*Example CSS for the two demo scrollers*/
 +
 
 +
#pscroller1{
 +
width: 930px;
 +
height: 120px;
 +
border: 1px solid #225323;
 +
padding: 0px;
 +
background-color: white;
 +
}
 +
 
 +
#pscroller1 a{
 +
color: #225323;
 +
}
 +
 
 +
#pscroller1 h2{
 +
color: #000000;
 +
font-style:italic;
 +
}
 +
 
 +
#pscroller1 h3{
 +
color: #225323;
 +
text-align:right;
 +
}
 +
 
 +
 
 +
.someclass{ //class to apply to your scroller(s) if desired
 +
}
 +
 
</style>
</style>
-
</head>
 
-
<body>
 
-
<table width="975px">
+
<script type="text/javascript">
-
<tr>
+
/*Example message arrays for the two demo scrollers*/
-
<td colspan="2">
+
-
<h1 style="text-align:center;">Welcome to the Imperial College London iGEM 2011 website</h1><br><br>
+
-
</td>
+
-
</tr>
+
-
<tr valign="top">
+
var pausecontent=new Array()
-
<td style="width:688px;">
+
pausecontent[0]='<h2>"Application of indole-3-acetic acid (IAA) or IAA-related metabolites stimulates lateral root (LR) and root hair formation."</h2><h3><a href="" target="_blank">Spaepen S, Vanderleyden J, Remans R (2007)</a></h3>'
-
<h2>Project Outline</h2>
+
pausecontent[1]='<h2>"It is important to note that soil erosion is a world-wide issue and, as such, preventing it or at least helping ameliorate it, would have world-wide impact."</h2><h3><a href="https://2011.igem.org/Team:Imperial_College_London/Human_Implementation" target="_blank">Prof. Stuart John Dunbar, Senior Syngenta Fellow</a></h3>'
-
<p><b>Engineering bacteria to help fight soil erosion</b></p>
+
pausecontent[2]='<h2>"Plant synthetic biology has been under-appreciated."</h2><h3><a href="http://www.hms.harvard.edu/agingresearch/pages/pamelasilver.htm" target="_blank">Prof. Pamela Silver, Harden Conference 2011</a></h3>'
-
<p>In arid areas of the world soil erosion is a massive problem. It is caused by wind and rain sweeping away the fertile top soil and can eventually result in <i>desertification</i>.</p>
+
pausecontent[3]='<h2>"The technology you are describing is indeed promising. However, I also forsee some hurdles which need to be taken into account, such as legislation and acceptance by the consumer."</h2><h3><a href="https://2011.igem.org/Team:Imperial_College_London/Human_Overview" target="_blank">Dr. Frans Tetteroo, Senior Scientist at Incotec</a></h3>'
 +
pausecontent[4]='<h2>"I was really impressed with your project, its really cool how you have so many modules built into one system"</h2><h3><a href="http://igemwatch.net/?p=80" target="_blank">Lars Christian, iGEM Watch</a></h3>'
-
<p>Climate change and unsustainable farming practices are accelerating the rate of desertification to over 31,000 hectares/day. That’s 62, 000 football pitches in a day or half the size of the UK every year.</p>
+
</script>
-
<p>In ordinary circumstances the roots of well established plants help to hold down the top soil, protecting it from erosion. In areas that suffer desertification however plants do not get the chance to establish large enough root networks to anchor the soil and themselves before erosion occurs.</p>
+
<script type="text/javascript">
-
<p>This year, Imperial College’s iGEM team have joined the international effort to fight desertification.</p>
+
/***********************************************
 +
* Pausing up-down scroller- © Dynamic Drive (www.dynamicdrive.com)
 +
* This notice MUST stay intact for legal use
 +
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
 +
***********************************************/
-
<p>We hope to engineer bacteria to accelerate plant root development. The bacteria will be designed to secrete the hormone auxin. Seeds will be coated with the bacteria and then planted in the soil. Once the seeds germinate the bacteria will move towards the roots and be taken in by the plant. Inside the roots the bacteria will release auxin – promoting growth and protecting the soil from erosion.</p>
+
function pausescroller(content, divId, divClass, delay){
 +
this.content=content //message array content
 +
this.tickerid=divId //ID of ticker div to display information
 +
this.delay=delay //Delay between msg change, in miliseconds.
 +
this.mouseoverBol=0 //Boolean to indicate whether mouse is currently over scroller (and pause it if it is)
 +
this.hiddendivpointer=1 //index of message array for hidden div
 +
document.write('<div id="'+divId+'" class="'+divClass+'" style="position: relative; overflow: hidden"><div class="innerDiv" style="position: absolute; width: 100%" id="'+divId+'1">'+content[0]+'</div><div class="innerDiv" style="position: absolute; width: 100%; visibility: hidden" id="'+divId+'2">'+content[1]+'</div></div>')
 +
var scrollerinstance=this
 +
if (window.addEventListener) //run onload in DOM2 browsers
 +
window.addEventListener("load", function(){scrollerinstance.initialize()}, false)
 +
else if (window.attachEvent) //run onload in IE5.5+
 +
window.attachEvent("onload", function(){scrollerinstance.initialize()})
 +
else if (document.getElementById) //if legacy DOM browsers, just start scroller after 0.5 sec
 +
setTimeout(function(){scrollerinstance.initialize()}, 500)
 +
}
-
<img src="https://static.igem.org/mediawiki/2011/b/bb/ICL_Modules.jpg" width="648px" /></p>
+
// -------------------------------------------------------------------
 +
// initialize()- Initialize scroller method.
 +
// -Get div objects, set initial positions, start up down animation
 +
// -------------------------------------------------------------------
-
<table width="688px">
+
pausescroller.prototype.initialize=function(){
-
<tr valign="top">
+
this.tickerdiv=document.getElementById(this.tickerid)
-
<td style="width:344px;height:400px;">
+
this.visiblediv=document.getElementById(this.tickerid+"1")
-
<h2>Team</h2>
+
this.hiddendiv=document.getElementById(this.tickerid+"2")
-
<p>Description</p>
+
this.visibledivtop=parseInt(pausescroller.getCSSpadding(this.tickerdiv))
-
</td>
+
//set width of inner DIVs to outer DIV's width minus padding (padding assumed to be top padding x 2)
-
<td style="width:344px;height:400px;">
+
this.visiblediv.style.width=this.hiddendiv.style.width=this.tickerdiv.offsetWidth-(this.visibledivtop*2)+"px"
-
<h2>Experiments</h2>
+
this.getinline(this.visiblediv, this.hiddendiv)
-
<p>Description</p>
+
this.hiddendiv.style.visibility="visible"
-
</td>
+
var scrollerinstance=this
-
</tr>
+
document.getElementById(this.tickerid).onmouseover=function(){scrollerinstance.mouseoverBol=1}
-
</table>
+
document.getElementById(this.tickerid).onmouseout=function(){scrollerinstance.mouseoverBol=0}
 +
if (window.attachEvent) //Clean up loose references in IE
 +
window.attachEvent("onunload", function(){scrollerinstance.tickerdiv.onmouseover=scrollerinstance.tickerdiv.onmouseout=null})
 +
setTimeout(function(){scrollerinstance.animateup()}, this.delay)
 +
}
-
<table width="688px">
 
-
<tr valign="top">
 
-
<td style="width:229.33px;height:400px">
 
-
<h3>Human Practice</h3>
 
-
<p>Description</p>
 
-
</td>
 
-
<td style="width:229.33px;height:400px">
 
-
<h3>Outreach & Collaboration</h3>
 
-
<p>Description</p>
 
-
</td>
 
-
<td style="width:229.33px;height:400px">
 
-
<h3>Manufacturing</h3>
 
-
<p>Description</p>
 
-
</td>
 
-
</tr>
 
-
</table>
 
-
</td>
 
-
<td style="width:287px;">
+
// -------------------------------------------------------------------
-
<h3 style="padding-left:0px;font-size:1.3em;">European Jamboree Countdown</h3>
+
// animateup()- Move the two inner divs of the scroller up and in sync
-
<div style="padding-top:10px;">
+
// -------------------------------------------------------------------
-
<script src="https://2011.igem.org/Team:Imperial/countdown?action=raw&ctype=text/js"></script>
+
 
-
<script>
+
pausescroller.prototype.animateup=function(){
-
deadline("2011-10-1-0-0-0", "265", "45", "digital", "#000000", "#FF0000", "#FFFF33");
+
var scrollerinstance=this
 +
if (parseInt(this.hiddendiv.style.top)>(this.visibledivtop+5)){
 +
this.visiblediv.style.top=parseInt(this.visiblediv.style.top)-5+"px"
 +
this.hiddendiv.style.top=parseInt(this.hiddendiv.style.top)-5+"px"
 +
setTimeout(function(){scrollerinstance.animateup()}, 50)
 +
}
 +
else{
 +
this.getinline(this.hiddendiv, this.visiblediv)
 +
this.swapdivs()
 +
setTimeout(function(){scrollerinstance.setmessage()}, this.delay)
 +
}
 +
}
 +
 
 +
// -------------------------------------------------------------------
 +
// swapdivs()- Swap between which is the visible and which is the hidden div
 +
// -------------------------------------------------------------------
 +
 
 +
pausescroller.prototype.swapdivs=function(){
 +
var tempcontainer=this.visiblediv
 +
this.visiblediv=this.hiddendiv
 +
this.hiddendiv=tempcontainer
 +
}
 +
 
 +
pausescroller.prototype.getinline=function(div1, div2){
 +
div1.style.top=this.visibledivtop+"px"
 +
div2.style.top=Math.max(div1.parentNode.offsetHeight, div1.offsetHeight)+"px"
 +
}
 +
 
 +
// -------------------------------------------------------------------
 +
// setmessage()- Populate the hidden div with the next message before it's visible
 +
// -------------------------------------------------------------------
 +
 
 +
pausescroller.prototype.setmessage=function(){
 +
var scrollerinstance=this
 +
if (this.mouseoverBol==1) //if mouse is currently over scoller, do nothing (pause it)
 +
setTimeout(function(){scrollerinstance.setmessage()}, 100)
 +
else{
 +
var i=this.hiddendivpointer
 +
var ceiling=this.content.length
 +
this.hiddendivpointer=(i+1>ceiling-1)? 0 : i+1
 +
this.hiddendiv.innerHTML=this.content[this.hiddendivpointer]
 +
this.animateup()
 +
}
 +
}
 +
 
 +
pausescroller.getCSSpadding=function(tickerobj){ //get CSS padding value, if any
 +
if (tickerobj.currentStyle)
 +
return tickerobj.currentStyle["paddingTop"]
 +
else if (window.getComputedStyle) //if DOM2
 +
return window.getComputedStyle(tickerobj, "").getPropertyValue("padding-top")
 +
else
 +
return 0
 +
}
 +
 
</script>
</script>
-
</div>
 
-
<h3 style="padding-left:0px;">Follow us on</h3>
 
-
<a href="http://www.flickr.com/photos/64732447@N05/" target="_new"><img src="https://static.igem.org/mediawiki/2011/d/d7/ICL_flickr.png" /></a>
 
-
<a href="http://twitter.com/#!/ImperialiGEM11" target="_new"><img src="https://static.igem.org/mediawiki/2011/d/d7/ICL_twitter.png" /></a>
 
-
<a href="http://imperialigem.blogspot.com/" target="_new"><img src="https://static.igem.org/mediawiki/2011/7/7d/ICL_blogger.png" /></a>
 
-
<a href="http://www.youtube.com/user/ImperialiGEM" target="_new"><img src="https://static.igem.org/mediawiki/2011/d/d3/ICL_youtube.png" /></a>
 
-
<h3 style="padding-left:0px;">News</h3>
+
<script src="https://2011.igem.org/Team:Imperial_College_London/swfobject?action=raw&ctype=text/js" type="text/javascript"></script>
-
<div style="padding-top:10px;">
+
<script src="https://2011.igem.org/Team:Imperial_College_London/flashgallery?action=raw&ctype=text/js" type="text/javascript"></script>
-
<script type="text/javascript" src="http://output39.rssinclude.com/output?type=js&amp;id=302753&amp;hash=1964570c70873abce82ad55ca78b9adc"></script>
+
-
</div>
+
-
<h3 style="padding-left:0px;">Twitter</h3>
+
 
-
<div style="padding-top:10px;">
+
</head>
-
<script src="http://widgets.twimg.com/j/2/widget.js"></script>
+
 
-
<script>
+
<body>
-
new TWTR.Widget({
+
 
-
  version: 2,
+
<table width="975px">
-
  type: 'profile',
+
<tr style="text-align:center;" valign="top">
-
  rpp: 15,
+
<td style="width:650px;">
-
  interval: 6000,
+
<p>If you cannot view the photo gallery below, please click <a href="https://2011.igem.org/Team:Imperial_College_London/Alternative"><b>here</b></a> to view our alternative home page or download the Adobe Flash Player <a href="http://www.adobe.com/support/flashplayer/downloads.html" target="_blank"><b>here</b></a>.</p>
-
  width: 260,
+
<div style="margin-left:20px;">
-
  height: 200,
+
<script type="text/javascript"> jQuery.flashgallery('https://static.igem.org/mediawiki/2011/c/c0/ArtGallery.swf ', 'https://2011.igem.org/Team:Imperial_College_London/gallery?action=raw&ctype=text/xml ', {width: '630px', height: '550px', background: '#000000'});
-
  theme: {
+
-
    shell: {
+
-
      background: '#00a652',
+
-
      color: '#F5F5F5'
+
-
    },
+
-
    tweets: {
+
-
      background: '#F5F5F5',
+
-
      color: '#4A4A4A',
+
-
      links: '#00a652'
+
-
    }
+
-
  },
+
-
  features: {
+
-
    scrollbar: true,
+
-
    loop: false,
+
-
    live: false,
+
-
    hashtags: true,
+
-
    timestamp: true,
+
-
    avatars: false,
+
-
    behavior: 'all'
+
-
  }
+
-
}).render().setUser('ImperialiGEM11').start();
+
</script>
</script>
 +
 +
<div style="font-size:7pt">&copy;copyright <a href="http://flash-gallery.com" target="_blank" title="Flash-Gallery.com - Art Photo Gallery free version">Flash Slideshow by Flash-Gallery.com</a> </div>
 +
<div style="padding-top:20px">&nbsp;</div>
</div>
</div>
 +
</td>
 +
<td>
 +
 +
<a href="https://2011.igem.org/Team:Imperial_College_London/Tour"><img src="https://static.igem.org/mediawiki/2011/b/ba/ICL_btn1.png" width="250px" style="padding:0px 0px 10px 0px;" /></a>
 +
<a href="https://2011.igem.org/Team:Imperial_College_London/Achievements"><img src="https://static.igem.org/mediawiki/2011/7/7d/ICL_btn3.png" width="250px" style="padding:0px 0px 10px 0px;" /></a>
 +
<a href="https://2011.igem.org/Team:Imperial_College_London/Data"><img src="https://static.igem.org/mediawiki/2011/f/f1/ICL_btn2.png" width="250px" style="padding:0px 0px 10px 0px;" /></a>
 +
 +
<h2 style="padding-left:0px;">Follow us on</h2>
 +
<a href="http://www.flickr.com/photos/64732447@N05/" target="_new" alt="Flickr"><img src="https://static.igem.org/mediawiki/2011/d/d7/ICL_flickr.png" /></a>
 +
<a href="http://twitter.com/#!/ImperialiGEM11" target="_new" alt="Twitter"><img src="https://static.igem.org/mediawiki/2011/d/d7/ICL_twitter.png" /></a>
 +
<a href="http://imperialigem.blogspot.com/" target="_new" alt="Blog"><img src="https://static.igem.org/mediawiki/2011/7/7d/ICL_blogger.png" /></a>
 +
<a href="http://www.youtube.com/user/ImperialiGEM" target="_new" alt="Youtube"><img src="https://static.igem.org/mediawiki/2011/d/d3/ICL_youtube.png" /></a>
 +
<a href="http://www.spreaker.com/page#!/show/the_radio_igem_show" target="_new" alt="Radio iGEM"><img src="https://static.igem.org/mediawiki/2011/b/b3/ICL_RadioLogo.jpg" width="48px" /></a>
<br/><br/>
<br/><br/>
-
<a href="http://s07.flagcounter.com/more/ivzl"><img src="http://s07.flagcounter.com/count/ivzl/bg_FFFFFF/txt_00a652/border_00a652/columns_3/maxflags_12/viewers_0/labels_0/pageviews_0/flags_0/" alt="Free counters!" border="0"></a>
+
 
 +
<object width="300" height="330"><param name="wmode" value="transparent" /><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://staticcdn.spreaker.com/swf/player.swf?API_BASE_URL=http%3A%2F%2Fapi.spreaker.com&SITE_BASE_URL=http%3A%2F%2Fwww.spreaker.com&CHAT_BASE_URL=http%3A%2F%2Fpush.spreaker.com&STATION_URL=http%3A%2F%2Fapi.spreaker.com%2Fshow%2F180289%2Fepisode%2Flatest&AUTOPLAY=false&EXTERNAL_INTERFACE=false&DEBUG=false&REFERRER=embedded&EMBEDDED=true" /><embed src="http://staticcdn.spreaker.com/swf/player.swf?API_BASE_URL=http%3A%2F%2Fapi.spreaker.com&SITE_BASE_URL=http%3A%2F%2Fwww.spreaker.com&CHAT_BASE_URL=http%3A%2F%2Fpush.spreaker.com&STATION_URL=http%3A%2F%2Fapi.spreaker.com%2Fshow%2F180289%2Fepisode%2Flatest&AUTOPLAY=false&EXTERNAL_INTERFACE=false&DEBUG=false&REFERRER=embedded&EMBEDDED=true" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" wmode="transparent" width="300" height="330"></embed></object>
</td>
</td>
</tr>
</tr>
 +
</table>
 +
 +
<table width="975px">
 +
<tr>
 +
<td style="padding:0px 0px 0px 18px;">
 +
 +
<script type="text/javascript">
 +
 +
//new pausescroller(name_of_message_array, CSS_ID, CSS_classname, pause_in_miliseconds)
 +
 +
new pausescroller(pausecontent, "pscroller1", "someclass", 5000)
 +
 +
</script>
 +
</td>
 +
</tr>
 +
</table>
 +
<br/>
 +
<h1>Sponsored by:</h1>
 +
<table width="975px" cellpadding="0px">
<tr>
<tr>
-
<td colspan="2">
+
<td>
-
<h3>Sponsors</h3>
+
<p>
<p>
<a href="http://www.wellcome.ac.uk/" target="_new">  
<a href="http://www.wellcome.ac.uk/" target="_new">  

Latest revision as of 18:34, 16 October 2011



If you cannot view the photo gallery below, please click here to view our alternative home page or download the Adobe Flash Player here.

 

Follow us on




Sponsored by: