Team:Tec-Monterrey/microcongreso

From 2011.igem.org

(Difference between revisions)
(Created page with "<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <link href="descriplayou...")
 
(34 intermediate revisions not shown)
Line 1: Line 1:
-
<html xmlns="http://www.w3.org/1999/xhtml">
+
<html xmlns="http://www.w3.org/1999/xhtml"><head>
-
<head>
+
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+
-
<title>Untitled Document</title>
+
-
<link href="descriplayout.css" rel="stylesheet" type="text/css" />
+
-
<script src="SpryAssets/SpryCollapsiblePanel.js" type="text/javascript"></script>
+
-
<link href="SpryAssets/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css" />
+
-
<link href="submenuverticales.css" rel="stylesheet" type="text/css" media="all" />
+
-
</head>
+
 +
<title>wiki</title>
 +
<style type="text/css">
 +
<!--
 +
#top-section {
 +
      height: 100px;
 +
  border: none;
 +
  height:20px
 +
}
-
<script type="text/javascript">
+
#p-logo {
 +
  position: absolute;
 +
  display: none;
 +
 
 +
}
 +
#footer-box {
 +
display:none;
 +
}
-
(function() { // BeginSpryComponent
 
-
if (typeof Spry == "undefined") window.Spry = {}; if (!Spry.Widget) Spry.Widget = {};
+
#catlinks {
 +
    display:none;
 +
}
-
Spry.Widget.CollapsiblePanel = function(element, opts)
+
#search-controls {
-
{
+
  display: none;
-
this.element = this.getElement(element);
+
}
-
this.focusElement = null;
+
-
this.hoverClass = "CollapsiblePanelTabHover";
+
-
this.openClass = "CollapsiblePanelOpen";
+
-
this.closedClass = "CollapsiblePanelClosed";
+
-
this.focusedClass = "CollapsiblePanelFocused";
+
-
this.enableAnimation = true;
+
-
this.enableKeyboardNavigation = true;
+
-
this.animator = null;
+
-
this.hasFocus = false;
+
-
this.contentIsOpen = true;
+
-
this.openPanelKeyCode = Spry.Widget.CollapsiblePanel.KEY_DOWN;
+
#menubar { background: none repeat transparent; }
-
this.closePanelKeyCode = Spry.Widget.CollapsiblePanel.KEY_UP;
+
-
Spry.Widget.CollapsiblePanel.setOptions(this, opts);
 
-
this.attachBehaviors();
+
#menubar ul li a { color: white; }
-
};
+
-
Spry.Widget.CollapsiblePanel.prototype.getElement = function(ele)
 
-
{
 
-
if (ele && typeof ele == "string")
 
-
return document.getElementById(ele);
 
-
return ele;
 
-
};
 
-
Spry.Widget.CollapsiblePanel.prototype.addClassName = function(ele, className)
+
.right-menu li a {
-
{
+
color: black;
-
if (!ele || !className || (ele.className && ele.className.search(new RegExp("\\b" + className + "\\b")) != -1))
+
background: none repeat transparent;
-
return;
+
}
-
ele.className += (ele.className ? " " : "") + className;
+
-
};
+
-
Spry.Widget.CollapsiblePanel.prototype.removeClassName = function(ele, className)
+
#content {
-
{
+
    background: none repeat scroll 0 0 transparent;
-
if (!ele || !className || (ele.className && ele.className.search(new RegExp("\\b" + className + "\\b")) == -1))
+
    border-left: 0 solid;
-
return;
+
    border-right: 0 solid;
-
ele.className = ele.className.replace(new RegExp("\\s*\\b" + className + "\\b", "g"), "");
+
}
-
};
+
#content{
 +
    width: 80%;
 +
}
-
Spry.Widget.CollapsiblePanel.prototype.hasClassName = function(ele, className)
+
#headover ul{
-
{
+
    list-style: none;
-
if (!ele || !className || !ele.className || ele.className.search(new RegExp("\\b" + className + "\\b")) == -1)
+
    display: none;
-
return false;
+
    position: absolute;
-
return true;
+
    top: 1.2em;
-
};
+
    left: 0.2em;
 +
    }
-
Spry.Widget.CollapsiblePanel.prototype.setDisplay = function(ele, display)
+
  .firstHeading {
-
{
+
    display: none;}
-
if( ele )
+
-
ele.style.display = display;
+
-
};
+
-
Spry.Widget.CollapsiblePanel.setOptions = function(obj, optionsObj, ignoreUndefinedProps)
+
body {
-
{
+
font: 12px Tahoma, Geneva, sans-serif;
-
if (!optionsObj)
+
background-image: url(https://static.igem.org/mediawiki/2011/4/43/Lefondoleposter.png);
-
return;
+
        background-repeat:no-repeat;
-
for (var optionName in optionsObj)
+
      background-size: 100%;
-
{
+
margin: 0;
-
if (ignoreUndefinedProps && optionsObj[optionName] == undefined)
+
padding: 0;
-
continue;
+
margin-left: 10%;
-
obj[optionName] = optionsObj[optionName];
+
margin-right: 10%;
-
}
+
color: #FFFFF;
-
};
+
}
-
Spry.Widget.CollapsiblePanel.prototype.onTabMouseOver = function(e)
+
/* ~~ Element/tag selectors ~~ */
-
{
+
ul, ol, dl {
-
this.addClassName(this.getTab(), this.hoverClass);
+
padding: 0;
-
return false;
+
margin: 0;
-
};
+
}
 +
h1, h2, h3, h4, h5, h6, p {
 +
margin-top: 0;
 +
padding-right: 10px;
 +
padding-left: 10px;  
 +
}
 +
a img {
 +
border: none;
 +
}
-
Spry.Widget.CollapsiblePanel.prototype.onTabMouseOut = function(e)
 
-
{
 
-
this.removeClassName(this.getTab(), this.hoverClass);
 
-
return false;
 
-
};
 
-
Spry.Widget.CollapsiblePanel.prototype.open = function()
+
a:link {
-
{
+
-
this.contentIsOpen = true;
+
color: #F90;
-
if (this.enableAnimation)
+
}
-
{
+
a:visited {
-
if (this.animator)
+
color: #c02355;
-
this.animator.stop();
+
text-decoration: underline;
-
this.animator = new Spry.Widget.CollapsiblePanel.PanelAnimator(this, true, { duration: this.duration, fps: this.fps, transition: this.transition });
+
}
-
this.animator.start();
+
a:hover, a:active, a:focus {
-
}
+
text-decoration: none;
-
else
+
}
-
this.setDisplay(this.getContent(), "block");
+
-
this.removeClassName(this.element, this.closedClass);
 
-
this.addClassName(this.element, this.openClass);
 
-
};
 
-
Spry.Widget.CollapsiblePanel.prototype.close = function()
+
.container {
-
{
+
width: 100%;
-
this.contentIsOpen = false;
+
max-width: 1260px;
-
if (this.enableAnimation)
+
min-width: 780px;
-
{
+
overflow: hidden;  
-
if (this.animator)
+
  color:#FFF;
-
this.animator.stop();
+
}
-
this.animator = new Spry.Widget.CollapsiblePanel.PanelAnimator(this, false, { duration: this.duration, fps: this.fps, transition: this.transition });
+
-
this.animator.start();
+
-
}
+
-
else
+
-
this.setDisplay(this.getContent(), "none");
+
-
this.removeClassName(this.element, this.openClass);
 
-
this.addClassName(this.element, this.closedClass);
 
-
};
 
-
Spry.Widget.CollapsiblePanel.prototype.onTabClick = function(e)
+
.sidebar1 {
-
{
+
float: left;
-
if (this.isOpen())
+
width: 15%;
-
this.close();
+
        padding-bottom: 10px;
-
else
+
background-color:#04191d;
-
this.open();
+
-moz-border-radius: 8px;
 +
-webkit-border-radius: 8px;
-
this.focus();
+
}
 +
.content {
 +
 +
padding: none;
 +
width: 80%;
 +
float: left;
 +
 +
}
-
return this.stopPropagation(e);
 
-
};
 
-
Spry.Widget.CollapsiblePanel.prototype.onFocus = function(e)
+
.content ul, .content ol {  
-
{
+
padding: 0 15px 15px 40px;
-
this.hasFocus = true;
+
}
-
this.addClassName(this.element, this.focusedClass);
+
-
return false;
+
-
};
+
-
Spry.Widget.CollapsiblePanel.prototype.onBlur = function(e)
 
-
{
 
-
this.hasFocus = false;
 
-
this.removeClassName(this.element, this.focusedClass);
 
-
return false;
 
-
};
 
-
Spry.Widget.CollapsiblePanel.KEY_UP = 38;
+
ul.nav {
-
Spry.Widget.CollapsiblePanel.KEY_DOWN = 40;
+
list-style: none;  
 +
border-top:none;
 +
margin-bottom: 15px;
-
Spry.Widget.CollapsiblePanel.prototype.onKeyDown = function(e)
+
}
-
{
+
ul.nav li {
-
var key = e.keyCode;
+
border-bottom: 0px solid #04191d;  
-
if (!this.hasFocus || (key != this.openPanelKeyCode && key != this.closePanelKeyCode))
+
-
return true;
+
-
if (this.isOpen() && key == this.closePanelKeyCode)
 
-
this.close();
 
-
else if ( key == this.openPanelKeyCode)
 
-
this.open();
 
-
return this.stopPropagation(e);
+
}
-
};
+
ul.nav a, ul.nav a:visited {
-
Spry.Widget.CollapsiblePanel.prototype.stopPropagation = function(e)
+
padding: 5px 5px 5px 15px;
-
{
+
display: block;  
-
if (e.preventDefault) e.preventDefault();
+
text-decoration: none;
-
else e.returnValue = false;
+
color:#FFF;
-
if (e.stopPropagation) e.stopPropagation();
+
-
else e.cancelBubble = true;
+
-
return false;
+
-
};
+
-
 
+
-
Spry.Widget.CollapsiblePanel.prototype.attachPanelHandlers = function()
+
-
{
+
-
var tab = this.getTab();
+
-
if (!tab)
+
-
return;
+
-
 
+
-
var self = this;
+
-
Spry.Widget.CollapsiblePanel.addEventListener(tab, "click", function(e) { return self.onTabClick(e); }, false);
+
-
Spry.Widget.CollapsiblePanel.addEventListener(tab, "mouseover", function(e) { return self.onTabMouseOver(e); }, false);
+
-
Spry.Widget.CollapsiblePanel.addEventListener(tab, "mouseout", function(e) { return self.onTabMouseOut(e); }, false);
+
-
 
+
-
if (this.enableKeyboardNavigation)
+
-
{
+
-
// XXX: IE doesn't allow the setting of tabindex dynamically. This means we can't
+
-
// rely on adding the tabindex attribute if it is missing to enable keyboard navigation
+
-
// by default.
+
-
 
+
-
// Find the first element within the tab container that has a tabindex or the first
+
-
// anchor tag.
+
-
var tabIndexEle = null;
+
}
-
var tabAnchorEle = null;
+
ul.nav a:hover, ul.nav a:active, ul.nav a:focus {
 +
background: #339dff; /*float amarillo*/
 +
color: #FFF;
 +
}
-
this.preorderTraversal(tab, function(node) {
+
.frame {
-
if (node.nodeType == 1 /* NODE.ELEMENT_NODE */)
+
font:12px arial;
-
{
+
width:700;
-
var tabIndexAttr = tab.attributes.getNamedItem("tabindex");
+
height:350;
-
if (tabIndexAttr)
+
max-height: 350px;
-
{
+
border:none;
-
tabIndexEle = node;
+
overflow:auto;
-
return true;
+
border:0px solid black;
-
}
+
padding:5;
-
if (!tabAnchorEle && node.nodeName.toLowerCase() == "a")
+
}
-
tabAnchorEle = node;
+
.fltrt { 
-
}
+
float: right;
-
return false;
+
margin-left: 8px;
-
});
+
}
 +
.fltlft {
 +
float: left;
 +
margin-right: 8px;
 +
}
 +
.clearfloat {
 +
clear:both;
 +
height:0;
 +
font-size: 1px;
 +
line-height: 0px;
 +
}
-
if (tabIndexEle)
+
/* panel */
-
this.focusElement = tabIndexEle;
+
.panel, .panelcollapsed
-
else if (tabAnchorEle)
+
-
this.focusElement = tabAnchorEle;
+
-
 
+
-
if (this.focusElement)
+
-
{
+
-
Spry.Widget.CollapsiblePanel.addEventListener(this.focusElement, "focus", function(e) { return self.onFocus(e); }, false);
+
-
Spry.Widget.CollapsiblePanel.addEventListener(this.focusElement, "blur", function(e) { return self.onBlur(e); }, false);
+
-
Spry.Widget.CollapsiblePanel.addEventListener(this.focusElement, "keydown", function(e) { return self.onKeyDown(e); }, false);
+
-
}
+
-
}
+
-
};
+
-
 
+
-
Spry.Widget.CollapsiblePanel.addEventListener = function(element, eventType, handler, capture)
+
{
{
-
try
+
margin: 3px;
-
{
+
width: auto;
-
if (element.addEventListener)
+
-moz-border-radius: 4px;
-
element.addEventListener(eventType, handler, capture);
+
-webkit-border-radius: 4px;
-
else if (element.attachEvent)
+
border-top-width: 10px;
-
element.attachEvent("on" + eventType, handler);
+
border-right-width: 0px;
-
}
+
border-bottom-width: 10px;
-
catch (e) {}
+
border-left-width: 3px;
-
};
+
padding-bottom: 5px;
 +
        color: #FFF;
 +
}
-
Spry.Widget.CollapsiblePanel.prototype.preorderTraversal = function(root, func)
 
-
{
 
-
var stopTraversal = false;
 
-
if (root)
 
-
{
 
-
stopTraversal = func(root);
 
-
if (root.hasChildNodes())
 
-
{
 
-
var child = root.firstChild;
 
-
while (!stopTraversal && child)
 
-
{
 
-
stopTraversal = this.preorderTraversal(child, func);
 
-
try { child = child.nextSibling; } catch (e) { child = null; }
 
-
}
 
-
}
 
-
}
 
-
return stopTraversal;
 
-
};
 
-
Spry.Widget.CollapsiblePanel.prototype.attachBehaviors = function()
+
table {
-
{
+
    background: none repeat scroll 0 0 transparent}
-
var panel = this.element;
+
-
var tab = this.getTab();
+
-
var content = this.getContent();
+
-
if (this.contentIsOpen || this.hasClassName(panel, this.openClass))
 
-
{
 
-
this.addClassName(panel, this.openClass);
 
-
this.removeClassName(panel, this.closedClass);
 
-
this.setDisplay(content, "block");
 
-
this.contentIsOpen = true;
 
-
}
 
-
else
 
-
{
 
-
this.removeClassName(panel, this.openClass);
 
-
this.addClassName(panel, this.closedClass);
 
-
this.setDisplay(content, "none");
 
-
this.contentIsOpen = false;
 
-
}
 
-
this.attachPanelHandlers();
+
/* panel heading */
-
};
+
.panel h2, .panelcollapsed h2
-
 
+
-
Spry.Widget.CollapsiblePanel.prototype.getTab = function()
+
{
{
-
return this.getElementChildren(this.element)[0];
+
        color: #FFF;
-
};
+
font-weight: normal;
 +
margin: 0px;
 +
padding: 0px;
 +
-moz-border-radius: 3px;
 +
-webkit-border-radius: 3px;
 +
border-bottom: 0px solid #04191d;  
-
Spry.Widget.CollapsiblePanel.prototype.getContent = function()
+
}
-
{
+
-
return this.getElementChildren(this.element)[1];
+
-
};
+
-
Spry.Widget.CollapsiblePanel.prototype.isOpen = function()
+
/* panel heading on rollover */
-
{
+
.panel h2:hover, .panelcollapsed h2:hover {
-
return this.contentIsOpen;
+
background-color: #339dff;
-
};
+
color: #FFF;
 +
}
-
Spry.Widget.CollapsiblePanel.prototype.getElementChildren = function(element)
+
/* heading of a collapsed panel */
 +
.panelcollapsed h2
{
{
-
var children = [];
+
background-image: url(arrow-dn.gif);
-
var child = element.firstChild;
+
background-repeat: no-repeat;
-
while (child)
+
background-position: 280px;
-
{
+
}
-
if (child.nodeType == 1 /* Node.ELEMENT_NODE */)
+
-
children.push(child);
+
-
child = child.nextSibling;
+
-
}
+
-
return children;
+
-
};
+
-
Spry.Widget.CollapsiblePanel.prototype.focus = function()
+
/* panel content - do not set borders or paddings */
 +
.panelcontent
{
{
-
if (this.focusElement && this.focusElement.focus)
+
overflow: hidden;
-
this.focusElement.focus();
+
font-size: 14px;
-
};
+
}
-
/////////////////////////////////////////////////////
+
/* collapsed panel content */
 +
.panelcollapsed .panelcontent { display: none; }
-
Spry.Widget.CollapsiblePanel.PanelAnimator = function(panel, doOpen, opts)
+
-->
-
{
+
</style><!--[if lte IE 7]>
-
this.timer = null;
+
<style>
-
this.interval = 0;
+
.content { margin-right: -1px; }
 +
ul.nav a { zoom: 1; } 
 +
</style>
 +
<![endif]-->
-
this.fps = 60;
+
<script type="text/javascript">
-
this.duration = 500;
+
<!--
-
this.startTime = 0;
+
-
this.transition = Spry.Widget.CollapsiblePanel.PanelAnimator.defaultTransition;
 
-
this.onComplete = null;
 
-
this.panel = panel;
 
-
this.content = panel.getContent();
 
-
this.doOpen = doOpen;
 
-
Spry.Widget.CollapsiblePanel.setOptions(this, opts, true);
+
i = 0
 +
var speed = 10
-
this.interval = Math.floor(1000 / this.fps);
+
function scrollDown() {
 +
i = i + speed
 +
var div = document.getElementById("frame1")
 +
div.scrollTop = i
 +
if (i > div.scrollHeight - 300) {i = 350}
 +
t1=setTimeout("scrollDown()",100)
 +
}
 +
function scrollUp() {
 +
i = i - speed
 +
var div = document.getElementById("frame1")
 +
div.scrollTop = i
 +
if (i < 0) {i = 0}
 +
t1=setTimeout("scrollUp()",100)
 +
}
-
var c = this.content;
 
-
var curHeight = c.offsetHeight ? c.offsetHeight : 0;
 
-
this.fromHeight = (doOpen && c.style.display == "none") ? 0 : curHeight;
 
-
if (!doOpen)
+
// -----------------------------------------------------------------------------------------------
-
this.toHeight = 0;
+
// PANELS
-
else
+
var PANEL_NORMAL_CLASS    = "panel";
-
{
+
var PANEL_COLLAPSED_CLASS = "panelcollapsed";
-
if (c.style.display == "none")
+
var PANEL_HEADING_TAG    = "h2";
-
{
+
var PANEL_CONTENT_CLASS  = "panelcontent";
-
// The content area is not displayed so in order to calculate the extent
+
var PANEL_COOKIE_NAME    = "panels";
-
// of the content inside it, we have to set its display to block.
+
var PANEL_ANIMATION_DELAY = 20; /*ms*/
 +
var PANEL_ANIMATION_STEPS = 10;
-
c.style.visibility = "hidden";
+
function setUpPanels()
-
c.style.display = "block";
+
-
}
+
-
 
+
-
// Clear the height property so we can calculate
+
-
// the full height of the content we are going to show.
+
-
 
+
-
c.style.height = "";
+
-
this.toHeight = c.offsetHeight;
+
-
}
+
-
 
+
-
this.distance = this.toHeight - this.fromHeight;
+
-
this.overflow = c.style.overflow;
+
-
 
+
-
c.style.height = this.fromHeight + "px";
+
-
c.style.visibility = "visible";
+
-
c.style.overflow = "hidden";
+
-
c.style.display = "block";
+
-
};
+
-
 
+
-
Spry.Widget.CollapsiblePanel.PanelAnimator.defaultTransition = function(time, begin, finish, duration) { time /= duration; return begin + ((2 - time) * time * finish); };
+
-
 
+
-
Spry.Widget.CollapsiblePanel.PanelAnimator.prototype.start = function()
+
{
{
-
var self = this;
+
loadSettings();
-
this.startTime = (new Date).getTime();
+
-
this.timer = setTimeout(function() { self.stepAnimation(); }, this.interval);
+
// get all headings
-
};
+
var headingTags = document.getElementsByTagName(PANEL_HEADING_TAG);
-
 
+
-
Spry.Widget.CollapsiblePanel.PanelAnimator.prototype.stop = function()
+
// go through all tags
-
{
+
for (var i=0; i<headingTags.length; i++)
-
if (this.timer)
+
{
{
-
clearTimeout(this.timer);
+
var el = headingTags[i];
-
 
+
-
// If we're killing the timer, restore the overflow property.
+
// make sure it's the heading inside a panel
 +
if ( el.parentNode.className != PANEL_COLLAPSED_CLASS)
 +
                    if(el.parentNode.className != PANEL_NORMAL_CLASS)
 +
continue;
 +
-
this.content.style.overflow = this.overflow;
+
// get the text value of the tag
 +
var name = el.firstChild.nodeValue;
 +
 +
// look for the name in loaded settings, apply the normal/collapsed class
 +
if (panelsStatus[name] == "false")
 +
el.parentNode.className = PANEL_COLLAPSED_CLASS;
 +
else
 +
if (panelsStatus[name] == "true")
 +
el.parentNode.className = PANEL_NORMAL_CLASS;
 +
else
 +
{
 +
// if no saved setting, see the initial setting
 +
panelsStatus[name] = (el.parentNode.className == PANEL_NORMAL_CLASS) ? "true" : "false";
 +
}
 +
 +
// add the click behavor to headings
 +
el.onclick = function()
 +
{
 +
var target    = this.parentNode;
 +
var name      = this.firstChild.nodeValue;
 +
var collapsed = (target.className == PANEL_COLLAPSED_CLASS);
 +
saveSettings(name, collapsed?"true":"false");
 +
animateTogglePanel(target, collapsed);
 +
};
}
}
 +
}
-
this.timer = null;
+
/**
-
};
+
* Start the expand/collapse animation of the panel
-
 
+
* @param panel reference to the panel div
-
Spry.Widget.CollapsiblePanel.PanelAnimator.prototype.stepAnimation = function()
+
*/
 +
function animateTogglePanel(panel, expanding)
{
{
-
var curTime = (new Date).getTime();
+
// find the .panelcontent div
-
var elapsedTime = curTime - this.startTime;
+
var elements = panel.getElementsByTagName("div");
-
 
+
var panelContent = null;
-
if (elapsedTime >= this.duration)
+
for (var i=0; i<elements.length; i++)
{
{
-
if (!this.doOpen)
+
if (elements[i].className == PANEL_CONTENT_CLASS)
-
this.content.style.display = "none";
+
{
-
this.content.style.overflow = this.overflow;
+
panelContent = elements[i];
-
this.content.style.height = this.toHeight + "px";
+
break;
-
if (this.onComplete)
+
}
-
this.onComplete();
+
-
return;
+
}
}
 +
 +
// make sure the content is visible before getting its height
 +
panelContent.style.display = "block";
 +
 +
// get the height of the content
 +
var contentHeight = panelContent.offsetHeight;
 +
 +
// if panel is collapsed and expanding, we must start with 0 height
 +
if (expanding)
 +
panelContent.style.height = "0px";
 +
 +
var stepHeight = contentHeight / PANEL_ANIMATION_STEPS;
 +
var direction = (!expanding ? -1 : 1);
 +
 +
if (direction > 0)
 +
collapseAll();
 +
setTimeout(function(){animateStep(panelContent,1,stepHeight,direction)}, PANEL_ANIMATION_DELAY);
 +
}
-
var ht = this.transition(elapsedTime, this.fromHeight, this.distance, this.duration);
+
/**
-
 
+
* Change the height of the target
-
this.content.style.height = ((ht < 0) ? 0 : ht) + "px";
+
* @param panelContent reference to the panel content to change height
-
 
+
* @param iteration current iteration; animation will be stopped when iteration reaches PANEL_ANIMATION_STEPS
-
var self = this;
+
* @param stepHeight height increment to be added/substracted in one step
-
this.timer = setTimeout(function() { self.stepAnimation(); }, this.interval);
+
* @param direction 1 for expanding, -1 for collapsing
-
};
+
*/
-
 
+
function animateStep(panelContent, iteration, stepHeight, direction)
-
Spry.Widget.CollapsiblePanelGroup = function(element, opts)
+
{
{
-
this.element = this.getElement(element);
+
if (iteration<PANEL_ANIMATION_STEPS)
-
this.opts = opts;
+
-
 
+
-
this.attachBehaviors();
+
-
};
+
-
 
+
-
Spry.Widget.CollapsiblePanelGroup.prototype.setOptions = Spry.Widget.CollapsiblePanel.prototype.setOptions;
+
-
Spry.Widget.CollapsiblePanelGroup.prototype.getElement = Spry.Widget.CollapsiblePanel.prototype.getElement;
+
-
Spry.Widget.CollapsiblePanelGroup.prototype.getElementChildren = Spry.Widget.CollapsiblePanel.prototype.getElementChildren;
+
-
 
+
-
Spry.Widget.CollapsiblePanelGroup.prototype.setElementWidget = function(element, widget)
+
-
{
+
-
if (!element || !widget)
+
-
return;
+
-
if (!element.spry)
+
-
element.spry = new Object;
+
-
element.spry.collapsiblePanel = widget;
+
-
};
+
-
 
+
-
Spry.Widget.CollapsiblePanelGroup.prototype.getElementWidget = function(element)
+
-
{
+
-
return (element && element.spry && element.spry.collapsiblePanel) ? element.spry.collapsiblePanel : null;
+
-
};
+
-
 
+
-
Spry.Widget.CollapsiblePanelGroup.prototype.getPanels = function()
+
-
{
+
-
if (!this.element)
+
-
return [];
+
-
return this.getElementChildren(this.element);
+
-
};
+
-
 
+
-
Spry.Widget.CollapsiblePanelGroup.prototype.getPanel = function(panelIndex)
+
-
{
+
-
return this.getPanels()[panelIndex];
+
-
};
+
-
 
+
-
Spry.Widget.CollapsiblePanelGroup.prototype.attachBehaviors = function()
+
-
{
+
-
if (!this.element)
+
-
return;
+
-
 
+
-
var cpanels = this.getPanels();
+
-
var numCPanels = cpanels.length;
+
-
for (var i = 0; i < numCPanels; i++)
+
{
{
-
var cpanel = cpanels[i];
+
panelContent.style.height = Math.round(((direction>0) ? iteration : 10 - iteration) * stepHeight) +"px";
-
this.setElementWidget(cpanel, new Spry.Widget.CollapsiblePanel(cpanel, this.opts));
+
iteration++;
 +
setTimeout(function(){animateStep(panelContent,iteration,stepHeight,direction)}, PANEL_ANIMATION_DELAY);
}
}
-
};
+
else
-
 
+
-
Spry.Widget.CollapsiblePanelGroup.prototype.openPanel = function(panelIndex)
+
-
{
+
-
var w = this.getElementWidget(this.getPanel(panelIndex));
+
-
if (w && !w.isOpen())
+
-
w.open();
+
-
};
+
-
 
+
-
Spry.Widget.CollapsiblePanelGroup.prototype.closePanel = function(panelIndex)
+
-
{
+
-
var w = this.getElementWidget(this.getPanel(panelIndex));
+
-
if (w && w.isOpen())
+
-
w.close();
+
-
};
+
-
 
+
-
Spry.Widget.CollapsiblePanelGroup.prototype.openAllPanels = function()
+
-
{
+
-
var cpanels = this.getPanels();
+
-
var numCPanels = cpanels.length;
+
-
for (var i = 0; i < numCPanels; i++)
+
{
{
-
var w = this.getElementWidget(cpanels[i]);
+
// set class for the panel
-
if (w && !w.isOpen())
+
panelContent.parentNode.className = (direction<0) ? PANEL_COLLAPSED_CLASS : PANEL_NORMAL_CLASS;
-
w.open();
+
// clear inline styles
 +
panelContent.style.display = panelContent.style.height = "";
}
}
-
};
+
}
-
Spry.Widget.CollapsiblePanelGroup.prototype.closeAllPanels = function()
+
// -----------------------------------------------------------------------------------------------
 +
// Load-Save
 +
// -----------------------------------------------------------------------------------------------
 +
/**
 +
* Reads the "panels" cookie if exists, expects data formatted as key:value|key:value... puts in panelsStatus object
 +
*/
 +
function loadSettings()
{
{
-
var cpanels = this.getPanels();
+
// prepare the object that will keep the panel statuses
-
var numCPanels = cpanels.length;
+
panelsStatus = {};
-
for (var i = 0; i < numCPanels; i++)
+
 +
// find the cookie name
 +
var start = document.cookie.indexOf(PANEL_COOKIE_NAME + "=");
 +
if (start == -1) return;
 +
 +
// starting point of the value
 +
start += PANEL_COOKIE_NAME.length+1;
 +
 +
// find end point of the value
 +
var end = document.cookie.indexOf(";", start);
 +
if (end == -1) end = document.cookie.length;
 +
 +
// get the value, split into key:value pairs
 +
var cookieValue = unescape(document.cookie.substring(start, end));
 +
var panelsData = cookieValue.split("|");
 +
 +
// split each key:value pair and put in object
 +
for (var i=0; i< panelsData.length; i++)
{
{
-
var w = this.getElementWidget(cpanels[i]);
+
var pair = panelsData[i].split(":");
-
if (w && w.isOpen())
+
panelsStatus[pair[0]] = pair[1];
-
w.close();
+
}
}
-
};
 
-
 
-
})(); // EndSpryComponent
 
-
 
-
</script>
 
-
 
-
 
-
 
-
<style type="text/css">
 
-
.descripmainlayout {
 
-
float: left;
 
-
height: 768px;
 
-
width: 1024px;
 
-
margin-left:auto;
 
-
margin-right:auto;
 
-
background-color: #FFF;
 
-
}
 
-
.descripmainlayout .descriptexto #CollapsiblePanel1 .CollapsiblePanelTab {
 
-
font-family: Tahoma, Geneva, sans-serif;
 
-
color: #4ECDC4;
 
-
background-color: #333;
 
-
padding: 10px;
 
-
margin-top: 0px;
 
-
margin-right: 50px;
 
-
margin-bottom: 0px;
 
-
margin-left: 50px;
 
-
background-image: url(images/panelesup.png);
 
-
}
 
-
.descripmainlayout .descriptexto #CollapsiblePanel1 .CollapsiblePanelContent {
 
-
font-family: Tahoma, Geneva, sans-serif;
 
-
color: #E5E5E5;
 
-
background-color: #333;
 
-
font-size: 16px;
 
-
margin-right: 50px;
 
-
margin-left: 50px;
 
-
padding: 15px;
 
-
}
 
-
.descripmainlayout .descriptexto #CollapsiblePanel1 .CollapsiblePanelContent div p {
 
-
margin: 15px;
 
}
}
-
.descriplanguage {
+
function expandAll()
-
background-color: #E5E5E5;
+
{
-
float: left;
+
for (var key in panelsStatus)
-
height: 111px;
+
saveSettings(key, "true");
-
width: 262px;
+
 +
setUpPanels();
}
}
-
.descriplogosearch {
+
function collapseAll()
-
float: right;
+
{
-
height: 768px;
+
for (var key in panelsStatus)
-
width: 156px;
+
saveSettings(key, "false");
-
}
+
-
.descripmenu {
+
setUpPanels();
-
float: left;
+
-
height: 657px;
+
-
width: 156px;
+
-
}
+
-
.descriptexto {
+
-
background-color: #E5E5E5;
+
-
float: left;
+
-
height: 657px;
+
-
width: 712px;
+
}
}
-
 
+
/**
-
.descripbanner {
+
* Takes data from the panelsStatus object, formats as key:value|key:value... and puts in cookie valid for 365 days
-
float: left;
+
  * @param key key name to save
-
height: 111px;
+
  * @paeam value key value
-
width: 606px;
+
-
background-color: #333;
+
-
background-image: url(images/banner.png);
+
-
background-position: center center;
+
-
}
+
-
.descripmainlayout .descriptexto #CollapsiblePanel1 #CollapsiblePanel6 .CollapsiblePanelContent a {
+
-
font-family: Tahoma, Geneva, sans-serif;
+
-
color: #E5E5E5;
+
-
text-decoration: underline;
+
-
font-size: 18px;
+
-
}
+
-
.descripmainlayout .descriptexto #CollapsiblePanel1 #CollapsiblePanel6 .CollapsiblePanelContent a:hover {
+
-
color: #4ECDC4;
+
-
}
+
-
 
+
-
 
+
-
@charset "utf-8";
+
-
/* CSS Document */
+
-
 
+
-
* {
+
-
margin: 0px;
+
-
padding: 0px;
+
-
}
+
-
.maincontainer .menubar #CollapsiblePanel2 .CollapsiblePanelContent #listaproyecto {
+
-
list-style-type: none;
+
-
width: 150px;
+
-
}
+
-
 
+
-
 
+
-
#listaproyecto li a {
+
-
font-family: Tahoma, Geneva, sans-serif;
+
-
color: #333;
+
-
text-decoration: none;
+
-
display: block;
+
-
height: 25px;
+
-
width: 120px;
+
-
padding-left: 20px;
+
-
list-style-type: none;
+
-
}
+
-
 
+
-
#listaproyecto li a:hover {
+
-
background-color: #4ECDC4;
+
-
}
+
-
 
+
-
 
+
-
#listaproyecto li {
+
-
height: 25px;
+
-
width: 100px;
+
-
list-style-type: none;
+
-
}
+
-
.maincontainer .menubar #CollapsiblePanel3 .CollapsiblePanelContent p a {
+
-
font-family: Tahoma, Geneva, sans-serif;
+
-
font-size: 15px;
+
-
color: #333;
+
-
text-decoration: none;
+
-
list-style-type: none;
+
-
}
+
-
.descripmainlayout .descripmenu #CollapsiblePanel3 .CollapsiblePanelContent ul li a {
+
-
color: #333;
+
-
text-decoration: none;
+
-
list-style-type: none;
+
-
}
+
-
.CollapsiblePanelContent ul li a {
+
-
display: block;
+
-
font-family: Tahoma, Geneva, sans-serif;
+
-
color: #333;
+
-
text-decoration: none;
+
-
font-size: 15px;
+
-
height: 25px;
+
-
width: 120px;
+
-
padding-left: 20px;
+
-
list-style-type: none;
+
-
}
+
-
.descripmainlayout .descripmenu #CollapsiblePanel3 .CollapsiblePanelContent ul li a:hover {
+
-
background-color: #4ECDC4;
+
-
list-style-type: none;
+
-
}
+
-
.descripmainlayout .descripmenu #CollapsiblePanel4 .CollapsiblePanelContent ul li a:hover {
+
-
background-color: #4ECDC4;
+
-
}
+
-
.descripmainlayout .descripmenu #CollapsiblePanel5 .CollapsiblePanelContent ul li a:hover {
+
-
background-color: #4ECDC4;
+
-
}
+
-
 
+
-
@charset "UTF-8";
+
-
 
+
-
 
+
-
@charset "UTF-8";
+
-
.CollapsiblePanel {
+
-
margin: 0px;
+
-
padding: 0px;
+
-
border-top-width: 0px;
+
-
border-right-width: 0px;
+
-
border-bottom-width: 0px;
+
-
border-left-width: 0px;
+
-
border-top-style: none;
+
-
border-right-style: none;
+
-
border-bottom-style: none;
+
-
border-left-style: none;
+
-
border-top-color: #FFF;
+
-
border-right-color: #FFF;
+
-
border-bottom-color: #FFF;
+
-
border-left-color: #FFF;
+
-
}
+
-
 
+
-
.CollapsiblePanelTab {
+
-
font: bold 0.7em sans-serif;
+
-
background-color: #FFF;
+
-
margin: 5px;
+
-
padding: 2px;
+
-
cursor: pointer;
+
-
-moz-user-select: none;
+
-
-khtml-user-select: none;
+
-
font-family: Verdana, Geneva, sans-serif;
+
-
font-size: 20px;
+
-
font-weight: normal;
+
-
border-bottom-style: none;
+
-
}
+
-
 
+
-
/* This is the selector for a CollapsiblePanel's Content area. It's important to note that
+
-
  * you should never put any padding on the content area element if you plan to
+
-
* use the CollapsiblePanel's open/close animations. Placing a non-zero padding on the content
+
-
* element can cause the CollapsiblePanel to abruptly grow in height while the panels animate.
+
-
*
+
-
* The name of the class ("CollapsiblePanelContent") used in this selector is not necessary
+
-
* to make the widget function. You can use any class name you want to style a
+
-
  * CollapsiblePanel content container.
+
  */
  */
-
.CollapsiblePanelContent {
+
function saveSettings(key, value)
-
margin: 5px;
+
{
-
padding: 0px;
+
// put the new value in the object
-
font-family: Verdana, Geneva, sans-serif;
+
panelsStatus[key] = value;
-
font-size: 15px;
+
-
text-decoration: none;
+
// create an array that will keep the key:value pairs
-
list-style-type: none;
+
var panelsData = [];
-
}
+
for (var key in panelsStatus)
-
.descripmainlayout .descripmenu .menubar #CollapsiblePanel3 .CollapsiblePanelContent #listaproyecto li a {
+
panelsData.push(key+":"+panelsStatus[key]);
-
text-decoration: none;
+
-
color: #333;
+
// set the cookie expiration date 1 year from now
-
list-style-type: none;
+
var today = new Date();
 +
var expirationDate = new Date(today.getTime() + 365 * 1000 * 60 * 60 * 24);
 +
// write the cookie
 +
document.cookie = PANEL_COOKIE_NAME + "=" + escape(panelsData.join("|")) + ";expires=" + expirationDate.toGMTString();
}
}
-
 
+
// -----------------------------------------------------------------------------------------------
-
/* An anchor tag can be used inside of a CollapsiblePanelTab so that the
+
// Register setUpPanels to be executed on load
-
* keyboard focus ring appears *inside* the tab instead of around the tab.
+
if (window.addEventListener)
-
* This is an example of how to make the text within the anchor tag look
+
{
-
* like non-anchor (normal) text.
+
// the "proper" way
-
*/
+
window.addEventListener("load", setUpPanels, false);
-
.CollapsiblePanelTab a {
+
-
color: #333;
+
-
text-decoration: none;
+
}
}
-
 
+
else
-
/* This is an example of how to change the appearance of the panel tab that is
+
if (window.attachEvent)
-
* currently open. The class "CollapsiblePanelOpen" is programatically added and removed
+
{
-
* from panels as the user clicks on the tabs within the CollapsiblePanel.
+
// the IE way
-
*/
+
window.attachEvent("onload", setUpPanels);
-
.CollapsiblePanelOpen .CollapsiblePanelTab {
+
-
background-color: #4ECDC4;
+
}
}
 +
-->
 +
</script>
-
/* This is an example of how to change the appearance of the panel tab when the
+
</head>
-
  * CollapsiblePanel is closed. The "CollapsiblePanelClosed" class is programatically added and removed
+
<body>
-
* whenever the CollapsiblePanel is closed.
+
<div class="container">
-
*/
+
   
 +
<div class="topbar">
 +
    <div style="filter:alpha(opacity=70);opacity:.7;">
 +
   
 +
 
 +
<img src="https://static.igem.org/mediawiki/2011/2/20/Logotec.png" alt="ITESM" name="teclogo" width="146" height="52" id="teclogo">
 +
      <a href="https://2011.igem.org/Main_Page"><img src="https://static.igem.org/mediawiki/2011/7/73/Logoigemsmall.png" alt="iGEM" name="logoigem" width="70" height="61" id="logoigem"></a>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
  </div>
 +
 
 +
  <div class="sidebar1">
 +
    <ul class="nav">
 +
      <p>&nbsp;</p>
 +
      <!--this is our menu! D: -->
 +
      <li>
 +
      <div class="panelcollapsed">
 +
  <h2>MAIN</h2>
 +
    <div class="panelcontent" style="">
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey">home</a></p>
 +
    <p><a href="https://2011.igem.org/Team:Tec-Monterrey/projectdescription">abstract</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/video">videos</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/stepbystep">step by step</a></p>
 +
         
 +
       
 +
    </div>
 +
</div>
 +
      </li>
 +
      <li>
 +
     
 +
      <div class="panelcollapsed">
 +
  <h2>PROJECT</h2>
 +
    <div class="panelcontent" style="">
 +
   
 +
              <p><a href="https://2011.igem.org/Team:Tec-Monterrey/projectoverview">overview</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/projectparts">parts</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/projectmodeling">genetic frame</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/projectresults/methods">methods</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/projectresults">results</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/teamha">human approach</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/projectprotocols">protocols</a><p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/safetypage">safety</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/projectnotebook">notebook</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/sampledata">sample data</a></p>
 +
          </div>
 +
</div>
 +
      </li>
 +
      <li>
 +
     
 +
     
 +
      <div class="panelcollapsed">
 +
  <h2>TEAM</h2>
 +
    <div class="panelcontent">
-
.CollapsiblePanelClosed .CollapsiblePanelTab {
+
    <p><a href="https://2011.igem.org/Team:Tec-Monterrey/teammembers">members</a></p>
-
  /* background-color: #EFEFEF */
+
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/teaminstallations">headquarters</a></p>
-
}
+
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/microcongreso">micro congress</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/teamfriends">friends</a></p>
 +
  </div>
 +
</div>
 +
      </li>
 +
  <li>
 +
      <div class="panelcollapsed">
 +
        <h2>EXTRAS</h2>
 +
    <div class="panelcontent">
 +
<p><a href="https://2011.igem.org/Team:Tec-Monterrey/sitemap">site map</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/sponsorsplatinum">sponsors platinum</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/sponsorsgold">sponsors gold</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/sponsorssilver">sponsors silver</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/specialthanks">special thanks</a></p>
 +
            <p><a href="https://2011.igem.org/Team:Tec-Monterrey/followus">follow us!</a></p>
 +
    </div>
 +
  </div>
 +
      </li>
 +
    </ul>
 +
   
 +
</div>
 +
 
 +
<div class="content">
 +
<div style="
 +
text-align:center;">
 +
 +
<!--in sub pages, this divisions should be comments! :D-->
 +
        <div style="
 +
padding:25px 50px;
 +
background-color:#04191d;
 +
color:#333;
 +
text-align:left;
 +
margin:5px 30px;">
 +
 +
</head>
-
/* This is an example of how to change the appearance of the panel tab as the
+
<body>
-
* mouse hovers over it. The class "CollapsiblePanelTabHover" is programatically added
+
<div align="justify">
-
* and removed from panel tab containers as the mouse enters and exits the tab container.
+
<div style="-moz-border-radius: 4px;-webkit-border-radius: 4px;">
-
*/
+
<div class="frame" id="frame1" style="background-color:#e5e5e5;">
-
.CollapsiblePanelTabHover,  .CollapsiblePanelOpen .CollapsiblePanelTabHover {
+
<br>
-
background-color: #4ECDC4;
+
   
-
}
+
<center> 
 +
<br>
 +
 
 +
<center><img src="https://static.igem.org/mediawiki/2011/7/7b/Microcongress01.png" alt="" name="" width="300" height="50" id="tgo"> </center>
-
/* This is an example of how to change the appearance of all the panel tabs when the
+
-
* CollapsiblePanel has focus. The "CollapsiblePanelFocused" class is programatically added and removed
+
<p>      <p><img src="https://static.igem.org/mediawiki/2011/8/85/Photocongreso02.png" alt="micro congress logo" name="microcongress" width="243" height="187" id="microcongress" /></p>
-
* whenever the CollapsiblePanel gains or loses keyboard focus.
+
</center>
-
*/
+
-
.CollapsiblePanelFocused .CollapsiblePanelTab {
+
-
}
+
<br>
 +
    <p class="textojustif"> Synthetic biology has begun an era of creation and development of new and better biological systems that, through engineering, seek to modify the natural behavior of living microorganisms such as bacteria, fungi and yeasts to make them perform tasks that are designed to create high value-added products with useful applications in industry, improving at the same time the life quality of people.
 +
</p>
 +
<br>
 +
<p class="textojustif">iGEM ​​(International Genetically Engineered Machine) is a competition based on synthetic biology, presented by the MIT (Massachusetts Institute of Technology), that allows professional students work in the use of biological parts to build systems operated in living cells. This year it is expected the participation of 165 teams and over 1,700 students from America, Africa, Asia and Europe, from prestigious universities such as Imperial College of London, Harvard, Yale, Cambridge, among others. </p>
 +
<br>
 +
<center>
 +
<p><img src="https://static.igem.org/mediawiki/2011/4/4b/Photocongreso01.png" alt="teamphoto" name="teamphoto" width="350" height="240" id="teamphoto" /></p>
 +
</center>
 +
  <br>
 +
<p>The number of Mexican universities participating in the contest is increasing each year; for this competition it is expected the participation of 5 teams: </p>
 +
    <br/>
 +
    <p><b>Tec Monterrey</b> - Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Monterrey,from Monterrey, Nuevo León, México. </p>
 +
    <p><b>UANL Mty. Mexico</b> - School of Biological Sciences. Universidad Autónoma de Nuevo León from Monterrey, Nuevo León, México. UNAM, </p>
 +
    <p><b>ITESM Mexico City</b> - Institute of Applied Mathematics and Institute of Cellular Physiology at the Universidad Nacional Autónoma de Mexico (UNAM) in conjunction with the ITESM Campus Mexico.</p>
 +
    <p><b>ITESM_Mexico</b> - Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Querétaro. </p>
 +
    <p class="justtext"><b>UNAM-Genomics_Mexico</b> - Center for Genomic Sciences, Universidad Nacional Autónoma de México (UNAM).</p>
 +
<br>
 +
<center>
 +
<p><img src="https://static.igem.org/mediawiki/2011/9/96/Photocongreso04.png" alt="centrobiotecnologia" name="imagetec" width="350" height="270" id="imagetec" /></p>
 +
</center>
 +
<br>
 +
    <p> In order to meet the other 4 Mexican teams and talk about common problems that had arisen along the competition, we organized the &quot;First Micro Congress iGEM&quot;, this June 3 and 4. This event was held at <b>Tec de Monterrey, Campus Monterrey</b>. </span><br />
 +
    </p>
 +
<br>
 +
<center>
 +
    <p><img src="https://static.igem.org/mediawiki/2011/9/92/Photocongreso03.png" alt="photo" name="photo" width="350" height="242" id="photo" /><br />
 +
</center>
 +
<br>
 +
<p><b>PhD. Manuel Zertuche</b>, Director of the School of Biotechnology, inaugurated the event, and conveyed the best wishes for the event. <br />
 +
<br>
 +
      The <b>Master in Science Sergio Garcia</b>, a Biologist from the Universidad Autónoma de Baja California delivered the first conference. He did his Masters in Molecular Biology at the Instituto Potosino  de Investigación Científica y Tecnológica. He is currently a PhD student at Tec de Monterrey, Campus Monterrey. He has worked in Molecular Phylogeny; design, production and purification of recombinant proteins and as an instructor for Tec de Monterrey iGEM teams 2010 and 2011. The conference showed the role of instructor in the iGEM team and some tips that will help teams improve their performance. He also presented the paper &quot;Expression and purification of Deschampsia antarctica peroxidedismutase <i>E. coli</i>".<br />
 +
    </span></p>
 +
<br>
 +
    <p class="justtext"> <b>PhD. Jorge Benavides</b>, Chemical Engineer from the Universidad Autónoma de Nuevo León, presented the second conference. He did his Masters in Biotechnology and a Ph.D. in Engineering Science with specialty in Biotechnology at the Tec de Monterrey, campus Monterrey. Member of the Research Chair in Bioprocess Engineering of ITESM. He specializes in the development of bioprocesses for the production, recovery and purification of biotechnological compounds of commercial interest, the proteomic characterization of crude extracts through combinatorial strategies and expression of heterologous proteins in recombinant expression systems. The conference was titled &quot;Trends and Applications of Biotechnology&quot;, where the means of separation, aqueous phases and some applications such as contact lenses, were discussed.<br />
 +
      </p>
 +
<br>
 +
    <p class="justtext"><b>Manuel Tiscareño</b> presented the conference &quot;Importation of Biological Material to Mexico.&quot; He holds a degree in International Relations from the Universidad Autonoma de Nuevo León. He has served as Branch Assistant Manager of Kentucky Fried Chicken, and is currently manager of Customs Import and Export of FEDEX. This conference had great teachings on the importation of &quot;BioBricks&quot;: standard parts of genetic material with structure and function defined, necessary to make new biological systems. <br />
 +
<br>
 +
      Mr. Tiscareño taught us that cannot be imported, by courier and parcel companies, products falling within the criteria of &quot;difficult to identify&quot; such as dust, gases and liquids. They should be released through the following ways: </p>
 +
<br> 
 +
<p class="justtext">Commit to a customs agent in the city for the release of the products into various points of entry. This agent classifies the package within the different areas of classification that exist in the Tax Administration System (SAT) and the Mexican customs laws. Depending on the physics characteristics, use and function that are present in the product, the package is classified. For example, the value of a pen with an integrated clock will depend on which is the main component, in order to be classified as office or as a decoration item. In this case it must be proportional to the broker's invoice product as well as having a detailed and formal description of it. <br />
 +
<br>   
 +
Register with FedEx Custom Broker. This method of release of packages consists in a small amount of money included in the total cost of shipping a package sent by FedEx. This corresponds to an amount paid to a broker who is in each inner harbor where the parcel is located. It works like a broker customs, however it is possible that the broker can be busy due to the increase of problematic packages. <br />
 +
<br>
 +
      Use a trading company. A person who is already expert in the field of importations can lend its name and create a trading company, although there could be problems of packet loss, theft of merchandise, etc. <br />
 +
      Re-route the package to the American side border, to let a broker customs release the packages with the patent and charge conferred discharged by the ITESM.</p>
 +
<br>
 +
<br>
 +
    <p class="justtext"> Regarding the visit to the <b>FEMSA Biotechnology Center</b>, Tec-Monterrey team was able to show to the attending teams the FEMSA Biotechnology Center, which is dedicated to generating research, transfer knowledge and design business models in biotechnology and food areas. It has the most innovative infrastructure equipment in laboratories, pilot plants and business incubators in the related areas. <br />
 +
    </p>
 +
<br>
 +
    <p class="justtext"><span class="justtext">That night, the teams visited the restaurant <b>Sierra Madre Brewing Co.</b>. This restaurant specializes in brewing within the same establishment and the menu caters to all tastes.</span><br />
 +
    </p>
 +
<br>
 +
<center>
 +
    <p><img src="https://static.igem.org/mediawiki/2011/c/c8/Photocongress05.png" alt="photo2" name="photo2" width="350" height="270" id="photo2" /></p>
 +
    <p>
 +
</center>
 +
<br />
 +
<br>
 +
    <p class="textojustif">The next day began with a talk by <b>PhD. Jose Manuel Aguilar</b>, who showed us the work: "Design of recombinant antigens of A/H1N1/2009 influenza virus". PhD. José Manuel Aguilar is a biologist specialized in molecular biology and professor of Genetic Engineering and Proteins Engineering courses.</p>
 +
<br> 
 +
  <p class="justtext"><b>Adán López</b> commissioned the second conference, to deliver the lecture              &quot;Project Management&quot;. This one will serve us greatly in the future because the recommendations Dr. López gave us about creating a Gantt diagram of an array of responsibilities and lifecycle of projects. He taught us that planning a project arises obvious time and material problems, which can be solved before reaching a big mess. </p>
 +
<br>
 +
<center>
 +
    <p><img src="https://static.igem.org/mediawiki/2011/2/28/Photocongreso06.png" alt="photo3" name="photo3" width="350" height="230" id="photo3" /><br />
 +
      </p>
 +
</center>
 +
<br>
 +
    <p><span class="justtext">Finally, we performed a bioethical panel aimed to discuss the bioethical implications involved in synthetic biology. This panel presented the following expositors: </span></p>
 +
    <p class="justtext"><b>PhD Guy Cardineau</b>, Plant Molecular Biology Specialist.<br />
 +
      <b>PhD Elsy Molina</b>, who has taught courses in Plant Physiology, General Genetics, Biology, Science, Ecology and Sustainable Development, Biostatistics and Experimental Design. </p>
 +
    <p class="justtext"><b>PhD Francisco Serrano</b>, a PhD in Philosophy from the Universidad Complutense de Madrid. His doctoral thesis was based on the subject: &quot;Science, reality and method in the work of Linus Pauling.&quot; He is currently professor at ITESM and coordinator of scientific-technological perspective Campus Monterrey. He is the author of many studies on ethics and history of science among them includes the book: Molecular Biology. Philosophical issues and implications. The panel moderator served the MC. Johari Salgado Gallegos, professor of Laboratory of Genetic Engineering. <br />
 +
    </p>
 +
<br>
 +
    <p class="justtext"> We thank <b>PhD. Marco Antonio Rito</b>, our project instructor, and ITESM Biotechnology department, for all the support that has given to us. <br />
 +
<br>
 +
We also would like to thank our sponsors <b>Promega</b>, <b>Uniparts</b>, <b>AgroBio</b>, <b>Accura Monterrey</b>, and <b>IECSA</b> for giving us a chance to participate in iGEM 2011. </p>
 +
<br>
 +
<center>
 +
    <p><img src="https://static.igem.org/mediawiki/2011/3/3c/Photocongreso07.png" alt="photo4" name="photo4" width="350" height="190" id="photo4" /><br />
 +
    </p>
 +
</center>
 +
<br></p>
 +
</p>
-
</style>
 
-
 
-
 
-
<body>
 
-
<div align="center">
 
-
<div class="descripmainlayout">
 
-
  <div class="descripbanner"></div>
 
-
  <div class="descriplanguage"></div>
 
-
  <div class="descriplogosearch"></div>
 
-
  <div class="descripmenu">
 
-
    <div id="CollapsiblePanel2" class="CollapsiblePanel">
 
-
      <div class="CollapsiblePanelTab" tabindex="0"><a href="https://2011.igem.org/Team:Tec-Monterrey">HOME</a></div>
 
-
    </div>
 
-
    <div id="CollapsiblePanel3" class="CollapsiblePanel">
 
-
      <div class="CollapsiblePanelTab" tabindex="0">PROJECT</div>
 
-
      <div class="CollapsiblePanelContent">
 
-
        <ul>
 
-
          <li><a href="https://2011.igem.org/Team:Tec-Monterrey">parts</a></li>
 
-
          <li><a href="https://2011.igem.org/Team:Tec-Monterrey/safetypage">safety</a></li>
 
-
          <li><a href="https://2011.igem.org/Team:Tec-Monterrey/projectdescription">description</a></li>
 
-
          <li><a href="https://2011.igem.org/Team:Tec-Monterrey">modeling</a></li>
 
-
          <li><a href="https://2011.igem.org/Team:Tec-Monterrey">results</a></li>
 
-
        </ul>
 
-
      </div>
 
-
    </div>
 
-
    <div id="CollapsiblePanel4" class="CollapsiblePanel">
 
-
      <div class="CollapsiblePanelTab" tabindex="0">TEAM</div>
 
-
      <div class="CollapsiblePanelContent">
 
-
        <ul>
 
-
          <li><a href="https://2011.igem.org/Team:Tec-Monterrey">members</a></li>
 
-
          <li><a href="https://2011.igem.org/Team:Tec-Monterrey">profile</a></li>
 
-
          <li><a href="https://2011.igem.org/Team:Tec-Monterrey">gallery</a></li>
 
-
          <li><a href="https://2011.igem.org/Team:Tec-Monterrey">installations</a></li>
 
-
        </ul>
 
-
      </div>
 
-
    </div>
 
-
    <div id="CollapsiblePanel5" class="CollapsiblePanel">
 
-
      <div class="CollapsiblePanelTab" tabindex="0">EXTRAS</div>
 
-
      <div class="CollapsiblePanelContent">
 
-
        <ul>
 
-
          <li><a href="https://2011.igem.org/Team:Tec-Monterrey">site map</a></li>
 
-
          <li><a href="https://2011.igem.org/Team:Tec-Monterrey">human approach</a></li>
 
-
          <li><a href="paginamicrocongreso.html">microcongreso</a></li>
 
-
          <li><a href="https://2011.igem.org/Team:Tec-Monterrey">sponsors</a></li>
 
-
        </ul>
 
-
      </div>
 
-
    </div>
 
-
  </div>
 
-
  <div class="descriptexto">
 
-
    <p>&nbsp;</p>
 
-
    <div id="CollapsiblePanel1" class="CollapsiblePanel">
 
-
      <div class="CollapsiblePanelTab" tabindex="0">1st MICRO-CONGRESS i-GEM 2011</div>
 
-
      <div class="CollapsiblePanelContent"> <div style="text-align: center;">
 
-
        <p> Read about our event here! :D</p>
 
-
<p>&nbsp;</p>
 
-
<p></p>
 
-
      </div>
 
-
    </div>
 
-
      <p>&nbsp;</p>
 
-
    </div>
 
-
  </div>
 
</div>
</div>
-
<script type="text/javascript">
+
<hr>
-
var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1");
+
<br/>
-
var CollapsiblePanel2 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel2");
+
<input type="button" value="   Up  " onmouseover="scrollUp()" onmouseout="clearTimeout(t1)">
-
var CollapsiblePanel3 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel3");
+
<input type="button" value=" Down " onmouseover="scrollDown()" onmouseout="clearTimeout(t1)">
-
var CollapsiblePanel4 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel4");
+
</div></body></html>
-
var CollapsiblePanel5 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel5");
+
-
</script>
+
-
</body>
+
-
</html>
+

Latest revision as of 21:19, 20 October 2011

wiki

iGEM

 

 



micro congress logo


Synthetic biology has begun an era of creation and development of new and better biological systems that, through engineering, seek to modify the natural behavior of living microorganisms such as bacteria, fungi and yeasts to make them perform tasks that are designed to create high value-added products with useful applications in industry, improving at the same time the life quality of people.


iGEM ​​(International Genetically Engineered Machine) is a competition based on synthetic biology, presented by the MIT (Massachusetts Institute of Technology), that allows professional students work in the use of biological parts to build systems operated in living cells. This year it is expected the participation of 165 teams and over 1,700 students from America, Africa, Asia and Europe, from prestigious universities such as Imperial College of London, Harvard, Yale, Cambridge, among others.


teamphoto


The number of Mexican universities participating in the contest is increasing each year; for this competition it is expected the participation of 5 teams:


Tec Monterrey - Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Monterrey,from Monterrey, Nuevo León, México.

UANL Mty. Mexico - School of Biological Sciences. Universidad Autónoma de Nuevo León from Monterrey, Nuevo León, México. UNAM,

ITESM Mexico City - Institute of Applied Mathematics and Institute of Cellular Physiology at the Universidad Nacional Autónoma de Mexico (UNAM) in conjunction with the ITESM Campus Mexico.

ITESM_Mexico - Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Querétaro.

UNAM-Genomics_Mexico - Center for Genomic Sciences, Universidad Nacional Autónoma de México (UNAM).


centrobiotecnologia


In order to meet the other 4 Mexican teams and talk about common problems that had arisen along the competition, we organized the "First Micro Congress iGEM", this June 3 and 4. This event was held at Tec de Monterrey, Campus Monterrey.


photo


PhD. Manuel Zertuche, Director of the School of Biotechnology, inaugurated the event, and conveyed the best wishes for the event.

The Master in Science Sergio Garcia, a Biologist from the Universidad Autónoma de Baja California delivered the first conference. He did his Masters in Molecular Biology at the Instituto Potosino de Investigación Científica y Tecnológica. He is currently a PhD student at Tec de Monterrey, Campus Monterrey. He has worked in Molecular Phylogeny; design, production and purification of recombinant proteins and as an instructor for Tec de Monterrey iGEM teams 2010 and 2011. The conference showed the role of instructor in the iGEM team and some tips that will help teams improve their performance. He also presented the paper "Expression and purification of Deschampsia antarctica peroxidedismutase E. coli".


PhD. Jorge Benavides, Chemical Engineer from the Universidad Autónoma de Nuevo León, presented the second conference. He did his Masters in Biotechnology and a Ph.D. in Engineering Science with specialty in Biotechnology at the Tec de Monterrey, campus Monterrey. Member of the Research Chair in Bioprocess Engineering of ITESM. He specializes in the development of bioprocesses for the production, recovery and purification of biotechnological compounds of commercial interest, the proteomic characterization of crude extracts through combinatorial strategies and expression of heterologous proteins in recombinant expression systems. The conference was titled "Trends and Applications of Biotechnology", where the means of separation, aqueous phases and some applications such as contact lenses, were discussed.


Manuel Tiscareño presented the conference "Importation of Biological Material to Mexico." He holds a degree in International Relations from the Universidad Autonoma de Nuevo León. He has served as Branch Assistant Manager of Kentucky Fried Chicken, and is currently manager of Customs Import and Export of FEDEX. This conference had great teachings on the importation of "BioBricks": standard parts of genetic material with structure and function defined, necessary to make new biological systems.

Mr. Tiscareño taught us that cannot be imported, by courier and parcel companies, products falling within the criteria of "difficult to identify" such as dust, gases and liquids. They should be released through the following ways:


Commit to a customs agent in the city for the release of the products into various points of entry. This agent classifies the package within the different areas of classification that exist in the Tax Administration System (SAT) and the Mexican customs laws. Depending on the physics characteristics, use and function that are present in the product, the package is classified. For example, the value of a pen with an integrated clock will depend on which is the main component, in order to be classified as office or as a decoration item. In this case it must be proportional to the broker's invoice product as well as having a detailed and formal description of it.

Register with FedEx Custom Broker. This method of release of packages consists in a small amount of money included in the total cost of shipping a package sent by FedEx. This corresponds to an amount paid to a broker who is in each inner harbor where the parcel is located. It works like a broker customs, however it is possible that the broker can be busy due to the increase of problematic packages.

Use a trading company. A person who is already expert in the field of importations can lend its name and create a trading company, although there could be problems of packet loss, theft of merchandise, etc.
Re-route the package to the American side border, to let a broker customs release the packages with the patent and charge conferred discharged by the ITESM.



Regarding the visit to the FEMSA Biotechnology Center, Tec-Monterrey team was able to show to the attending teams the FEMSA Biotechnology Center, which is dedicated to generating research, transfer knowledge and design business models in biotechnology and food areas. It has the most innovative infrastructure equipment in laboratories, pilot plants and business incubators in the related areas.


That night, the teams visited the restaurant Sierra Madre Brewing Co.. This restaurant specializes in brewing within the same establishment and the menu caters to all tastes.


photo2



The next day began with a talk by PhD. Jose Manuel Aguilar, who showed us the work: "Design of recombinant antigens of A/H1N1/2009 influenza virus". PhD. José Manuel Aguilar is a biologist specialized in molecular biology and professor of Genetic Engineering and Proteins Engineering courses.


Adán López commissioned the second conference, to deliver the lecture "Project Management". This one will serve us greatly in the future because the recommendations Dr. López gave us about creating a Gantt diagram of an array of responsibilities and lifecycle of projects. He taught us that planning a project arises obvious time and material problems, which can be solved before reaching a big mess.


photo3


Finally, we performed a bioethical panel aimed to discuss the bioethical implications involved in synthetic biology. This panel presented the following expositors:

PhD Guy Cardineau, Plant Molecular Biology Specialist.
PhD Elsy Molina, who has taught courses in Plant Physiology, General Genetics, Biology, Science, Ecology and Sustainable Development, Biostatistics and Experimental Design.

PhD Francisco Serrano, a PhD in Philosophy from the Universidad Complutense de Madrid. His doctoral thesis was based on the subject: "Science, reality and method in the work of Linus Pauling." He is currently professor at ITESM and coordinator of scientific-technological perspective Campus Monterrey. He is the author of many studies on ethics and history of science among them includes the book: Molecular Biology. Philosophical issues and implications. The panel moderator served the MC. Johari Salgado Gallegos, professor of Laboratory of Genetic Engineering.


We thank PhD. Marco Antonio Rito, our project instructor, and ITESM Biotechnology department, for all the support that has given to us.

We also would like to thank our sponsors Promega, Uniparts, AgroBio, Accura Monterrey, and IECSA for giving us a chance to participate in iGEM 2011.


photo4



Retrieved from "http://2011.igem.org/Team:Tec-Monterrey/microcongreso"