Team:Buenos Aires/ objetive

From 2013.igem.org

(Difference between revisions)
Line 5: Line 5:
         <meta name="description" content="iGem Buenos Aires" />
         <meta name="description" content="iGem Buenos Aires" />
         <meta name="keywords" content="biosensing, igem, buenos aires, UBA, arsenic"/>
         <meta name="keywords" content="biosensing, igem, buenos aires, UBA, arsenic"/>
-
<link rel="stylesheet" type="text/css" rel="stylesheet" href="https://2013.igem.org/Team:Buenos_Aires/css/style.css?action=raw&ctype=text/css" />
 
<link  href="http://fonts.googleapis.com/css?family=PT+Sans+Narrow:regular,bold" rel="stylesheet" type="text/css" />
<link  href="http://fonts.googleapis.com/css?family=PT+Sans+Narrow:regular,bold" rel="stylesheet" type="text/css" />
Line 15: Line 14:
/* Author: Pieter van Boheemen */
/* Author: Pieter van Boheemen */
/* Team: TU Delft */
/* Team: TU Delft */
 +
body{background:transparent;color:#000;}
#globalWrapper { background-color: transparent; border: none; margin: 0; padding: 0; width: 100%; height:100%;}
#globalWrapper { background-color: transparent; border: none; margin: 0; padding: 0; width: 100%; height:100%;}
#content { background-color: transparent; border: none; padding: 0; margin: 0; width: 100%; overflow: scroll; height:100%;overflow:hidden;}
#content { background-color: transparent; border: none; padding: 0; margin: 0; width: 100%; overflow: scroll; height:100%;overflow:hidden;}
Line 38: Line 38:
-
li{
+
</style>
-
color:#FFF;
+
</head>
-
}
+
</html>
-
h1{
 
-
color:#FFF;
 
-
border:none;
 
-
}
 
-
#texto{
 
-
background:#111;
 
-
position:relative;
 
-
text-align:justify;
 
-
font-size:18px;
 
-
text-transform:none;
 
-
border-bottom:1px dotted #333;
 
-
padding:1&nbsp;30px 10px 0 10px;
 
-
text-indent:20px;
 
-
margin-bottom:15px;
 
-
margin-left:20%;
 
-
margin-right:20%;
 
-
opacity:0.8;
 
-
        color:#FFF;
 
-
}
+
= Welcome to Buenos Aires 2012 iGEM Wiki! =
-
H1{
+
{|
-
font-size:35px;
+
|
-
text-align:center;
+
'''What are you looking for?'''
-
}
+
-
.ac_bgimage{
+
* Check the [[Team:Buenos_Aires/DataPage | Data page]]
-
background:#656500;
+
-
}
+
-
</style>
+
* Check the [[Team:Buenos_Aires/Safety|safety questions]] and [[ Team:Buenos_Aires/Attributions | attributions]].
 +
* Meet [[Team:Buenos_Aires/Team/Members | the team]]. You can also read a little about [[Team:Buenos_Aires/Team/BsAs | where we come from]].
 +
* Learn about [[Team:Buenos_Aires/Project | our project]] (and don't forget to check [[Team:Buenos_Aires/Project/Schemes | all the schemes]]  we thought to solve the problem).
 +
* Don't miss our yeast [[Team:Buenos_Aires/Results/Strains| strains characterization]], and the [[Team:Buenos_Aires/Results/Bb1 |main biobricks and devices ]] we designed and added to the registry. You can also find information about our ''planB'' [[Team:Buenos_Aires/Results/Bb2 | backup biobrick]] ''(aka. thank-you-customs biobrick)'' .
-
    </head>
+
* Take a look at our [[Team:Buenos_Aires/Project/Model | mathematical model]] of a synthetic ecology. And if you dare, take a look at the [[Team:Buenos_Aires/Project/ModelAdvance | advanced model]].
-
    <body>
+
-
<div id="contenedor">
+
* What we did outside the lab ''(aka. human practices)'' to [[Team:Buenos_Aires/HP/GarageLab | teach what synBio is about]], [[Team:Buenos_Aires/HP/GarageLab | start solving local problems ]] and [[ Team:Buenos_Aires/HP/EMBO | seed SynBio in Latin America]].
-
<div id="ac_background" class="ac_background">
+
* Watch an [http://youtu.be/bkczB60RziU online presentation] of our team and our project.
-
<img class="ac_bgimage" src="https://static.igem.org/mediawiki/2013/9/91/Pattern.png" alt="Background"/>
+
-
<div class="ac_overlay"></div>
+
-
<div class="ac_loading"></div>
+
-
</div>
+
-
<div id="texto">
+
* If you understand spanish, you can also check our [http://www.youtube.com/watch?v=oEMXc6cmmgo presentation video].
-
<H1><img align="middle" src="https://static.igem.org/mediawiki/2013/0/01/Logo-igem-project.png"> <p>Objectives</p> </H1> <a class="volver" href="javascript:$.pageslide.close()"> (Back) </a>
 
-
<p> The project will focus on the <b>development of a specific water biosensor </b>, but with a modular and scalable approach. Thereby you could easily afford multiple measurements with the very same device.</p>
 
-
<p>The device will be designed in a way that its collected data will be easily accessible via a web interface, and later it could be transferred to the relevant agencies upon request. </p>
+
|
 +
{| style="width: 100%"
 +
| align="center" | [[File:Bsas2012-The Team.png‎|400px]]
 +
|}
-
<p> At the end of this project we expect to have a prototype of measuring device and a diagram of a system for the distribution, collection and centralization of data. </p>
+
|}
-
<p> The project will focus on the measurement of a primary pollutant: <b> arsenic </b>. However, its <b>modular and scalable design</b> provides an easy way for incorporate various contaminants already identified, such as nitrate / nitrite, lead and hydrocarbons. </p>
+
== Impact in the media ==
-
+
-
<p>With the data collected is expected that <b>any user with minimal training</b> (image-based Instruction) can easily and quickly determine the <b>presence and level of the contaminant</b> on his water consumption. Also with the systematic use of this tool by the enforcement authorities, can implement specific public policies based on current and reliable information.</p>
+
-
<p> <a class="volver" href="javascript:$.pageslide.close()"> (Back) </ a> </ p>
+
 +
* "[http://www.eldia.com.ar/edis/20121022/alumnos-argentinos-primera-vez-mundial-biologia-informaciongeneral1.htm Alumnos argentinos, por primera vez en un “Mundial” de biología]" Diario el Día, 10/22/12.
-
</div>
+
* "[http://www.diariohoy.net/accion-verNota-id-213948-titulo-Argentinos_clasificaron_para_el_concurso_mundial_de_biolog%C3%ADa_sint%C3%A9tica_ Argentinos clasificaron para el concurso mundial de biología sintética]" Diario Hoy, 10/22/12.
-
+
-
<!-- The JavaScript -->
+
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
+
-
<script type="text/javascript" src="http://jquery-swip.googlecode.com/svn-history/r4/trunk/jquery.easing.1.3.js"></script>
+
-
    <script src="https://2013.igem.org/Team:Buenos_Aires/css/jquery.pageslide.js?action=raw&ctype=text/js"></script>
+
* "[http://www.aptus.com.ar/noticia/2932-competencia-mundial-de-biologia-sintetica Competencia mundial de Biología Sintética]" Aptus Noticias educativas, 10/21/12.
-
  <script>
+
-
        /* Default pageslide, moves to the right */
+
-
        $(".first").pageslide();
+
-
       
+
-
        /* Slide to the left, and make it model (you'll have to call $.pageslide.close() to close) */
+
-
        $(".second").pageslide({ direction: "left", modal: true });
+
-
    </script>
+
-
+
* "[http://www.telam.com.ar/nota/41479/ Argentinos clasificaron para el concurso mundial de biología sintética]" Agencia de noticias TELAM, 10/20/12.
-
<script type="text/javascript">
+
 
-
$(function() {
+
* "[http://www.tvperu.gob.pe/noticias/tecnologia/otros/38160-argentinos-clasificaron-para-el-concurso-mundial-de-biologia-sintetica.html Argentinos clasificaron para el concurso mundial de biología sintética]" TV Perú Noticias , 10/20/12.
-
var $ac_background = $('#ac_background'),
+
 
-
$ac_bgimage = $ac_background.find('.ac_bgimage'),
+
* "[http://www.agenciacyta.org.ar/2012/10/debut-y-exito-argentino-en-olimpiadas-de-biologia-sintetica/ Debut y éxito argentino en olimpiadas de biología sintética]" Nota en el portal CyTA. 10/19/12.
-
$ac_loading = $ac_background.find('.ac_loading'),
+
 
-
+
* "[http://www.tomamateyavivate.com.ar/formacion-y-universidades-argentinas/debut-y-exito-argentino-en-olimpiadas-de-biologia-sintetica/ Debut y éxito argentino en olimpiadas de biología sintética]" Tomamateyavivate, 10/19/12.
-
$ac_content = $('#ac_content'),
+
 
-
$title = $ac_content.find('h1'),
+
* "[http://www.conicet.gov.ar/?p=2827 Estudiantes argentinos pasan a la etapa final de un certamen mundial]" Nota en la página de noticias del CONICET, 10/19/2012.
-
$menu = $ac_content.find('.ac_menu'),
+
 
-
$mainNav = $menu.find('ul:first'),
+
* "[http://www.pagina12.com.ar/diario/sociedad/3-206038-2012-10-21.html Elegidos del Conicet]" Página 12, 20/10/12.
-
$menuItems = $mainNav.children('li'),
+
 
-
totalItems = $menuItems.length,
+
* "[http://blogs.scientificamerican.com/lab-rat/2012/09/09/igem-buenos-aires-synthetic-bacterial-communities/ iGEM Buenos Aires: Synthetic bacterial communities]" Lab Rat blog at scientificamerican.com 9/9/12.
-
$ItemImages = new Array();
+
-
+
-
/*
+
-
for this menu, we will preload all the images.  
+
-
let's add all the image sources to an array,
+
-
including the bg image
+
-
*/
+
-
$menuItems.each(function(i) {
+
-
$ItemImages.push($(this).children('a:first').attr('href'));
+
-
});
+
-
$ItemImages.push($ac_bgimage.attr('src'));
+
-
 
+
-
+
-
var Menu = (function(){
+
-
var init = function() {
+
-
loadPage();
+
-
initWindowEvent();
+
-
},
+
-
loadPage = function() {
+
-
/*
+
-
1- loads the bg image and all the item images;
+
-
2- shows the bg image;
+
-
3- shows / slides out the menu;
+
-
4- shows the menu items;
+
-
5- initializes the menu items events
+
-
*/
+
-
$ac_loading.show();//show loading status image
+
-
$.when(loadImages()).done(function(){
+
-
$.when(showBGImage()).done(function(){
+
-
//hide the loading status image
+
-
$ac_loading.hide();
+
-
$.when(slideOutMenu()).done(function(){
+
-
$.when(toggleMenuItems('up')).done(function(){
+
-
initEventsSubMenu();
+
-
});
+
-
});
+
-
});
+
-
});
+
-
},
+
-
showBGImage = function() {
+
-
return $.Deferred(
+
-
function(dfd) {
+
-
//adjusts the dimensions of the image to fit the screen
+
-
adjustImageSize($ac_bgimage);
+
-
$ac_bgimage.fadeIn(1000, dfd.resolve);
+
-
}
+
-
).promise();
+
-
},
+
-
slideOutMenu = function() {
+
-
/* calculate new width for the menu */
+
-
var new_w = $(window).width() - $title.outerWidth(true);
+
-
return $.Deferred(
+
-
function(dfd) {
+
-
//slides out the menu
+
-
$menu.stop()
+
-
.animate({
+
-
width : new_w + 'px'
+
-
}, 700, dfd.resolve);
+
-
}
+
-
).promise();
+
-
},
+
-
/* shows / hides the menu items */
+
-
toggleMenuItems = function(dir) {
+
-
return $.Deferred(
+
-
function(dfd) {
+
-
/*
+
-
slides in / out the items.  
+
-
different animation time for each one.
+
-
*/
+
-
$menuItems.each(function(i) {
+
-
var $el_title = $(this).children('a:first'),
+
-
marginTop, opacity, easing;
+
-
if(dir === 'up'){
+
-
marginTop = '0px';
+
-
opacity = 1;
+
-
easing = 'easeOutBack';
+
-
}
+
-
else if(dir === 'down'){
+
-
marginTop = '60px';
+
-
opacity = 0;
+
-
easing = 'easeInBack';
+
-
}
+
-
$el_title.stop()
+
-
.animate({
+
-
marginTop : marginTop,
+
-
opacity : opacity
+
-
}, 200 + i * 200 , easing, function(){
+
-
if(i === totalItems - 1)
+
-
dfd.resolve();
+
-
});
+
-
});
+
-
}
+
-
).promise();
+
-
},
+
-
initEventsSubMenu = function() {
+
-
$menuItems.each(function(i) {
+
-
var $item = $(this), // the <li>
+
-
$el_title = $item.children('a:first'),
+
-
el_image = $el_title.attr('href'),
+
-
$sub_menu = $item.find('.ac_subitem'),
+
-
$ac_close = $sub_menu.find('.ac_close');
+
-
+
-
/* user clicks one item : appetizers | main course | desserts | wines | specials */
+
-
$el_title.bind('click.Menu', function(e) {
+
-
$.when(toggleMenuItems('down')).done(function(){
+
-
openSubMenu($item, $sub_menu, el_image);
+
-
});
+
-
return false;
+
-
});
+
-
/* closes the submenu */
+
-
$ac_close.bind('click.Menu', function(e) {
+
-
$.pageslide.close();
+
-
toggleMenuItems('up');
+
-
$(".ac_subitem").css("height", "0px");
+
-
return false;
+
-
});
+
-
});
+
-
},
+
-
openSubMenu = function($item, $sub_menu, el_image) {
+
-
$sub_menu.stop()
+
-
.animate({
+
-
height : '400px',
+
-
marginTop : '-200px'
+
-
}, 400, function() {
+
-
//the bg image changes
+
-
showItemImage(el_image);
+
-
});
+
-
},
+
-
/* changes the background image */
+
-
showItemImage = function(source) {
+
-
//if its the current one return
+
-
if($ac_bgimage.attr('src') === source)
+
-
return false;
+
-
+
-
var $itemImage = $('<img src="'+source+'" alt="Background" class="ac_bgimage"/>');
+
-
$itemImage.insertBefore($ac_bgimage);
+
-
adjustImageSize($itemImage);
+
-
$ac_bgimage.fadeOut(1500, function() {
+
-
$(this).remove();
+
-
$ac_bgimage = $itemImage;
+
-
});
+
-
$itemImage.fadeIn(1500);
+
-
},
+
-
/*
+
-
on window resize, ajust the bg image dimentions,
+
-
and recalculate the menus width
+
-
*/
+
-
initWindowEvent = function() {
+
-
/* on window resize set the width for the menu */
+
-
$(window).bind('resize.Menu' , function(e) {
+
-
adjustImageSize($ac_bgimage);
+
-
/* calculate new width for the menu */
+
-
var new_w = $(window).width() - $title.outerWidth(true);
+
-
$menu.css('width', new_w + 'px');
+
-
});
+
-
},
+
-
/* makes an image "fullscreen" and centered */
+
-
adjustImageSize = function($img) {
+
-
var w_w = $(window).width(),
+
-
w_h = $(window).height(),
+
-
r_w = w_h / w_w,
+
-
i_w = $img.width(),
+
-
i_h = $img.height(),
+
-
r_i = i_h / i_w,
+
-
new_w,new_h,
+
-
new_left,new_top;
+
-
+
-
if(r_w > r_i){
+
-
new_h = w_h;
+
-
new_w = w_h / r_i;
+
-
}
+
-
else{
+
-
new_h = w_w * r_i;
+
-
new_w = w_w;
+
-
}
+
-
+
-
$img.css({
+
-
width : new_w + 'px',
+
-
height : new_h + 'px',
+
-
+
-
});
+
-
},
+
-
/* preloads a set of images */
+
-
loadImages = function() {
+
-
return $.Deferred(
+
-
function(dfd) {
+
-
var total_images = $ItemImages.length,
+
-
loaded = 0;
+
-
for(var i = 0; i < total_images; ++i){
+
-
$('<img/>').load(function() {
+
-
++loaded;
+
-
if(loaded === total_images)
+
-
dfd.resolve();
+
-
}).attr('src' , $ItemImages[i]);
+
-
}
+
-
}
+
-
).promise();
+
-
};
+
-
+
-
return {
+
-
init : init
+
-
};
+
-
})();
+
-
+
-
/*
+
-
call the init method of Menu
+
-
*/
+
-
Menu.init();
+
-
});
+
-
</script>
+
-
    </body>
+
-
</html>
+

Revision as of 18:52, 31 May 2013

iGem Buenos Aires


Welcome to Buenos Aires 2012 iGEM Wiki!

What are you looking for?


400px

Impact in the media