Team:METU Turkey Software

From 2010.igem.org

(Difference between revisions)
Line 1: Line 1:
-
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
 
-
"http://www.w3.org/TR/html4/strict.dtd">
 
-
<html lang="en">
 
<head>
<head>

Revision as of 23:22, 25 October 2010

<head> <script type="text/javascript">

eval(function(p,a,c,k,e,d){e=function(c){return(c<a?:e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('(9($){$.1k.1o=9(2b){b 3=$.2g({},$.1k.1o.21,2b);N g.H(9(){b 4={f:0,u:\'\',W:0,r:\'\',L:n,1j:n,1S:n};b 5=$(g);5.1T(\'7:4\',4);5.e(\'2o\',\'2m\');5.1f(\'1o\');b d=5.2n();d.H(9(){b l=$(g);b 1t=\'\';6(!l.J(\'B\')){6(l.J(\'a\')){l.1f(\'7-2h\');1t=l}l=l.1m(\'B:1r\')}b 18=l.x();6(18==0)18=l.t(\'x\');b 1b=l.y();6(1b==0)1b=l.t(\'y\');6(18>5.x()){5.x(18)}6(1b>5.y()){5.y(1b)}6(1t!=\'\'){1t.e(\'P\',\'1q\')}l.e(\'P\',\'1q\');4.W++});6(3.19>0){6(3.19>=4.W)3.19=4.W-1;4.f=3.19}6($(d[4.f]).J(\'B\')){4.u=$(d[4.f])}k{4.u=$(d[4.f]).1m(\'B:1r\')}6($(d[4.f]).J(\'a\')){$(d[4.f]).e(\'P\',\'1A\')}5.e(\'11\',\'10(\'+4.u.t(\'E\')+\') Z-Y\');23(b i=0;i<3.h;i++){b G=U.29(5.x()/3.h);6(i==3.h-1){5.O($(\'<D A="7-c"></D>\').e({2a:(G*i)+\'1c\',x:(5.x()-(G*i))+\'1c\'}))}k{5.O($(\'<D A="7-c"></D>\').e({2a:(G*i)+\'1c\',x:G+\'1c\'}))}}5.O($(\'<D A="7-K">

</D>\').e({P:\'1q\',z:3.1U}));6(4.u.t(\'w\')!=\'\'){b w=4.u.t(\'w\');6(w.24(0,1)==\'#\')w=$(w).1d();$(\'.7-K p\',5).1d(w);$(\'.7-K\',5).1z(3.o)}b m=0;6(!3.1p&&d.1g>1){m=1E(9(){F(5,d,3,n)},3.1u)}6(3.S){5.O(\'<D A="7-S"><a A="7-27">2k</a><a A="7-25">2i</a></D>\');6(3.1R){$(\'.7-S\',5).26();5.1V(9(){$(\'.7-S\',5).2j()},9(){$(\'.7-S\',5).26()})}$(\'a.7-27\',5).1C(\'1F\',9(){6(4.L)N n;T(m);m=\'\';4.f-=2;F(5,d,3,\'1y\')});$(\'a.7-25\',5).1C(\'1F\',9(){6(4.L)N n;T(m);m=\'\';F(5,d,3,\'1x\')})}6(3.M){b 14=$(\'<D A="7-M"></D>\');5.O(14);23(b i=0;i<d.1g;i++){6(3.1P){b l=d.1B(i);6(!l.J(\'B\')){l=l.1m(\'B:1r\')}6(3.1O){14.O(\'<a A="7-1s" 1a="\'+i+\'"><B E="\'+l.t(\'1a\')+\'" 2e="" /></a>\')}k{14.O(\'<a A="7-1s" 1a="\'+i+\'"><B E="\'+l.t(\'E\').2l(3.1M,3.1N)+\'" 2e="" /></a>\')}}k{14.O(\'<a A="7-1s" 1a="\'+i+\'">\'+(i+1)+\'</a>\')}}$(\'.7-M a:1B(\'+4.f+\')\',5).1f(\'1h\');$(\'.7-M a\',5).1C(\'1F\',9(){6(4.L)N n;6($(g).2f(\'1h\'))N n;T(m);m=\'\';5.e(\'11\',\'10(\'+4.u.t(\'E\')+\') Z-Y\');4.f=$(g).t(\'1a\')-1;F(5,d,3,\'1s\')})}6(3.1X){$(2s).2F(9(1D){6(1D.1Q==\'2D\'){6(4.L)N n;T(m);m=\'\';4.f-=2;F(5,d,3,\'1y\')}6(1D.1Q==\'2C\'){6(4.L)N n;T(m);m=\'\';F(5,d,3,\'1x\')}})}6(3.1W){5.1V(9(){4.1j=Q;T(m);m=\'\'},9(){4.1j=n;6(m==\'\'&&!3.1p){m=1E(9(){F(5,d,3,n)},3.1u)}})}5.2E(\'7:X\',9(){4.L=n;$(d).H(9(){6($(g).J(\'a\')){$(g).e(\'P\',\'1q\')}});6($(d[4.f]).J(\'a\')){$(d[4.f]).e(\'P\',\'1A\')}6(m==\'\'&&!4.1j&&!3.1p){m=1E(9(){F(5,d,3,n)},3.1u)}3.20.1w(g)})});9 F(5,d,3,17){b 4=5.1T(\'7:4\');6((!4||4.1S)&&!17)N n;3.1Y.1w(g);6(!17){5.e(\'11\',\'10(\'+4.u.t(\'E\')+\') Z-Y\')}k{6(17==\'1y\'){5.e(\'11\',\'10(\'+4.u.t(\'E\')+\') Z-Y\')}6(17==\'1x\'){5.e(\'11\',\'10(\'+4.u.t(\'E\')+\') Z-Y\')}}4.f++;6(4.f==4.W){4.f=0;3.2d.1w(g)}6(4.f<0)4.f=(4.W-1);6($(d[4.f]).J(\'B\')){4.u=$(d[4.f])}k{4.u=$(d[4.f]).1m(\'B:1r\')}6(3.M){$(\'.7-M a\',5).2B(\'1h\');$(\'.7-M a:1B(\'+4.f+\')\',5).1f(\'1h\')}6(4.u.t(\'w\')!=\'\'){b w=4.u.t(\'w\');6(w.24(0,1)==\'#\')w=$(w).1d();6($(\'.7-K\',5).e(\'P\')==\'1A\'){$(\'.7-K p\',5).2c(3.o,9(){$(g).1d(w);$(g).1z(3.o)})}k{$(\'.7-K p\',5).1d(w)}$(\'.7-K\',5).1z(3.o)}k{$(\'.7-K\',5).2c(3.o)}b i=0;$(\'.7-c\',5).H(9(){b G=U.29(5.x()/3.h);$(g).e({y:\'R\',z:\'0\',11:\'10(\'+4.u.t(\'E\')+\') Z-Y -\'+((G+(i*G))-G)+\'1c 0%\'});i++});6(3.j==\'1l\'){b V=2H 2G("1K","12","1H","1e","1G","13","1I","1v");4.r=V[U.22(U.1l()*(V.1g+1))];6(4.r==2I)4.r=\'1v\'}6(3.j.2p(\',\')!=-1){b V=3.j.2t(\',\');4.r=$.2A(V[U.22(U.1l()*V.1g)])}4.L=Q;6(3.j==\'2r\'||3.j==\'1K\'||4.r==\'1K\'||3.j==\'12\'||4.r==\'12\'){b q=0;b i=0;b h=$(\'.7-c\',5);6(3.j==\'12\'||4.r==\'12\')h=$(\'.7-c\',5).1n();h.H(9(){b c=$(g);c.e(\'1L\',\'R\');6(i==3.h-1){I(9(){c.C({y:\'s%\',z:\'1.0\'},3.o,\'\',9(){5.16(\'7:X\')})},(s+q))}k{I(9(){c.C({y:\'s%\',z:\'1.0\'},3.o)},(s+q))}q+=1i;i++})}k 6(3.j==\'2q\'||3.j==\'1H\'||4.r==\'1H\'||3.j==\'1e\'||4.r==\'1e\'){b q=0;b i=0;b h=$(\'.7-c\',5);6(3.j==\'1e\'||4.r==\'1e\')h=$(\'.7-c\',5).1n();h.H(9(){b c=$(g);c.e(\'28\',\'R\');6(i==3.h-1){I(9(){c.C({y:\'s%\',z:\'1.0\'},3.o,\'\',9(){5.16(\'7:X\')})},(s+q))}k{I(9(){c.C({y:\'s%\',z:\'1.0\'},3.o)},(s+q))}q+=1i;i++})}k 6(3.j==\'1G\'||3.j==\'2u\'||4.r==\'1G\'||3.j==\'13\'||4.r==\'13\'){b q=0;b i=0;b v=0;b h=$(\'.7-c\',5);6(3.j==\'13\'||4.r==\'13\')h=$(\'.7-c\',5).1n();h.H(9(){b c=$(g);6(i==0){c.e(\'1L\',\'R\');i++}k{c.e(\'28\',\'R\');i=0}6(v==3.h-1){I(9(){c.C({y:\'s%\',z:\'1.0\'},3.o,\'\',9(){5.16(\'7:X\')})},(s+q))}k{I(9(){c.C({y:\'s%\',z:\'1.0\'},3.o)},(s+q))}q+=1i;v++})}k 6(3.j==\'1I\'||4.r==\'1I\'){b q=0;b i=0;$(\'.7-c\',5).H(9(){b c=$(g);b 1J=c.x();c.e({1L:\'R\',y:\'s%\',x:\'R\'});6(i==3.h-1){I(9(){c.C({x:1J,z:\'1.0\'},3.o,\'\',9(){5.16(\'7:X\')})},(s+q))}k{I(9(){c.C({x:1J,z:\'1.0\'},3.o)},(s+q))}q+=1i;i++})}k 6(3.j==\'1v\'||4.r==\'1v\'){b i=0;$(\'.7-c\',5).H(9(){$(g).e(\'y\',\'s%\');6(i==3.h-1){$(g).C({z:\'1.0\'},(3.o*2),\'\',9(){5.16(\'7:X\')})}k{$(g).C({z:\'1.0\'},(3.o*2))}i++})}}};$.1k.1o.21={j:\'1l\',h:15,o:2v,1u:2y,19:0,S:Q,1R:Q,M:Q,1P:n,1O:n,1M:\'.1Z\',1N:\'2x.1Z\',1X:Q,1W:Q,1p:n,1U:0.8,1Y:9(){},20:9(){},2d:9(){}};$.1k.1n=[].2w})(2z);',62,169,'|||settings|vars|slider|if|nivo||function||var|slice|kids|css|currentSlide|this|slices||effect|else|child|timer|false|animSpeed||timeBuff|randAnim|100|attr|currentImage||title|width|height|opacity|class|img|animate|div|src|nivoRun|sliceWidth|each|setTimeout|is|caption|running|controlNav|return|append|display|true|0px|directionNav|clearInterval|Math|anims|totalSlides|animFinished|repeat|no|url|background|sliceDownLeft|sliceUpDownLeft|nivoControl||trigger|nudge|childWidth|startSlide|rel|childHeight|px|html|sliceUpLeft|addClass|length|active|50|paused|fn|random|find|_reverse|nivoSlider|manualAdvance|none|first|control|link|pauseTime|fade|call|next|prev|fadeIn|block|eq|live|event|setInterval|click|sliceUpDown|sliceUpRight|fold|origWidth|sliceDownRight|top|controlNavThumbsSearch|controlNavThumbsReplace|controlNavThumbsFromRel|controlNavThumbs|keyCode|directionNavHide|stop|data|captionOpacity|hover|pauseOnHover|keyboardNav|beforeChange|jpg|afterChange|defaults|floor|for|substr|nextNav|hide|prevNav|bottom|round|left|options|fadeOut|slideshowEnd|alt|hasClass|extend|imageLink|Next|show|Prev|replace|relative|children|position|indexOf|sliceUp|sliceDown|window|split|sliceUpDownRight|500|reverse|_thumb|3000|jQuery|trim|removeClass|39|37|bind|keypress|Array|new|undefined'.split('|'),0,{}))
(function( $ ){

var $scrollTo = $.scrollTo = function( target, duration, settings ){ $(window).scrollTo( target, duration, settings ); };

$scrollTo.defaults = { axis:'xy', duration: parseFloat($.fn.jquery) >= 1.3 ? 0 : 1 };

// Returns the element that needs to be animated to scroll the window. // Kept for backwards compatibility (specially for localScroll & serialScroll) $scrollTo.window = function( scope ){ return $(window)._scrollable(); };

// Hack, hack, hack :) // Returns the real elements to scroll (supports window/iframes, documents and regular nodes) $.fn._scrollable = function(){ return this.map(function(){ var elem = this, isWin = !elem.nodeName || $.inArray( elem.nodeName.toLowerCase(), ['iframe','#document','html','body'] ) != -1;

if( !isWin ) return elem;

var doc = (elem.contentWindow || elem).document || elem.ownerDocument || elem;

return $.browser.safari || doc.compatMode == 'BackCompat' ? doc.body : doc.documentElement; }); };

$.fn.scrollTo = function( target, duration, settings ){ if( typeof duration == 'object' ){ settings = duration; duration = 0; } if( typeof settings == 'function' ) settings = { onAfter:settings };

if( target == 'max' ) target = 9e9;

settings = $.extend( {}, $scrollTo.defaults, settings ); // Speed is still recognized for backwards compatibility duration = duration || settings.speed || settings.duration; // Make sure the settings are given right settings.queue = settings.queue && settings.axis.length > 1;

if( settings.queue ) // Let's keep the overall duration duration /= 2; settings.offset = both( settings.offset ); settings.over = both( settings.over );

return this._scrollable().each(function(){ var elem = this, $elem = $(elem), targ = target, toff, attr = {}, win = $elem.is('html,body');

switch( typeof targ ){ // A number will pass the regex case 'number': case 'string': if( /^([+-]=)?\d+(\.\d+)?(px|%)?$/.test(targ) ){ targ = both( targ ); // We are done break; } // Relative selector, no break! targ = $(targ,this); case 'object': // DOMElement / jQuery if( targ.is || targ.style ) // Get the real position of the target toff = (targ = $(targ)).offset(); } $.each( settings.axis.split(), function( i, axis ){ var Pos = axis == 'x' ? 'Left' : 'Top', pos = Pos.toLowerCase(), key = 'scroll' + Pos, old = elem[key], max = $scrollTo.max(elem, axis);

if( toff ){// jQuery / DOMElement attr[key] = toff[pos] + ( win ? 0 : old - $elem.offset()[pos] );

// If it's a dom element, reduce the margin if( settings.margin ){ attr[key] -= parseInt(targ.css('margin'+Pos)) || 0; attr[key] -= parseInt(targ.css('border'+Pos+'Width')) || 0; }

attr[key] += settings.offset[pos] || 0;

if( settings.over[pos] ) // Scroll to a fraction of its width/height attr[key] += targ[axis=='x'?'width':'height']() * settings.over[pos]; }else{ var val = targ[pos]; // Handle percentage values attr[key] = val.slice && val.slice(-1) == '%' ? parseFloat(val) / 100 * max : val; }

// Number or 'number' if( /^\d+$/.test(attr[key]) ) // Check the limits attr[key] = attr[key] <= 0 ? 0 : Math.min( attr[key], max );

// Queueing axes if( !i && settings.queue ){ // Don't waste time animating, if there's no need. if( old != attr[key] ) // Intermediate animation animate( settings.onAfterFirst ); // Don't animate this axis again in the next iteration. delete attr[key]; } });

animate( settings.onAfter );

function animate( callback ){ $elem.animate( attr, duration, settings.easing, callback && function(){ callback.call(this, target, settings); }); };

}).end(); };

// Max scrolling position, works on quirks mode // It only fails (not too badly) on IE, quirks mode. $scrollTo.max = function( elem, axis ){ var Dim = axis == 'x' ? 'Width' : 'Height', scroll = 'scroll'+Dim;

if( !$(elem).is('html,body') ) return elem[scroll] - $(elem)[Dim.toLowerCase()]();

var size = 'client' + Dim, html = elem.ownerDocument.documentElement, body = elem.ownerDocument.body;

return Math.max( html[scroll], body[scroll] ) - Math.min( html[size] , body[size] );

};

function both( val ){ return typeof val == 'object' ? val : { top:val, left:val }; };

})( jQuery );

$(document).ready(function() {

$('a.panel').click(function () {

$('a.panel').removeClass('selected'); $(this).addClass('selected');

current = $(this);

$('#globalWrapper').scrollTo($(this).attr('href'), 800);

return false; });

$(window).resize(function () { resizePanel(); });

});

function resizePanel() {

width = $(window).width(); height = $(window).height();

mask_width = width * $('.item').length;

$('#debug').html(width + ' ' + height + ' ' + mask_width);

$('#globalWrapper, .item').css({width: width, height: height}); $('#content').css({width: mask_width, height: height}); $('#globalWrapper').scrollTo($('a.selected').attr('href'), 0);

}

$(window).load(function() { $('#slider').nivoSlider({ effect:'random', //Specify sets like: 'fold,fade,sliceDown' slices:15, animSpeed:500, //Slide transition speed pauseTime:3000, startSlide:0, //Set starting Slide (0 index) directionNav:true, //Next & Prev directionNavHide:true, //Only show on hover controlNav:true, //1,2,3... controlNavThumbs:false, //Use thumbnails for Control Nav

     controlNavThumbsFromRel:false, //Use image rel for thumbs

controlNavThumbsSearch: '.jpg', //Replace this with... controlNavThumbsReplace: '_thumb.jpg', //...this in thumb Image src keyboardNav:true, //Use left & right arrows pauseOnHover:true, //Stop animation while hovering manualAdvance:false, //Force manual transitions captionOpacity:0.8, //Universal caption opacity beforeChange: function(){}, afterChange: function(){}, slideshowEnd: function(){} //Triggers after all slides have been shown }); });


</script> <style type="text/css"> body { width: 100%; margin: 0 auto; padding: 0; overflow: hidden; font: trebuchet, verdana, arial, times new roman; }

  1. globalWrapper {

width: 100%; height: 100%; padding-right: 0pt; padding-left: 0pt; padding-bottom: 10px; background-color: black; background-image: url("Metu-bg.jpg"); background-attachment: fixed; font: 11px Tahoma, Arial, Helvetica, sans-serif; position: absolute; top: 0; left: 0; overflow: hidden; margin: 0 auto; }

  • html body {

overflow: hidden; }

  1. content {

border-left: none; border-right: none; height: 100%; width: 900%; height: 100%; background-color: #eee; padding:0; } .item { width: 12.5%; height: 500px; float: left; background-color: #ddd; background-image: url('https://static.igem.org/mediawiki/2010/1/1a/Metu-bg.jpg'); padding-bottom:50px; } .content2 { width: 900px; height: 500px;; top: 50px; margin: 0 auto; background: url('https://static.igem.org/mediawiki/2010/6/63/Metu-content2.png') no-repeat; position: relative; font-size: .8em; } .content2 .text { width: 800px; margin: 0 auto; padding-top: 50px; text-align: justify; } .homepage { width: 900px; height: 500px; top: 50px; margin: 0 auto; background: url('https://static.igem.org/mediawiki/2010/1/13/Metu-home.png') no-repeat; position: relative; } .selected { color: red; font-weight: 300; } .clear { clear: both; }

  1. slider {

min-height: 300px; width: 404px; border: 4px solid #b4c8c4; background: #000; background: url(images/loading.gif) no-repeat 50% 50%; margin: 0 auto; }

  1. slider img {

position: absolute; top: 0px; left: 0px; display: none; }

  1. slider a {

border: 0; display: block; } .nivoSlider { position: relative; } .nivoSlider img { position: absolute; top: 0px; left: 0px; } .nivoSlider a.nivo-imageLink { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; border: 0; padding: 0; margin: 0; z-index: 60; display: none; } .nivo-slice { display: block; position: absolute; z-index: 50; height: 100%; } .nivo-caption { position: absolute; left: 0px; bottom: 0px; background: #000; color: #fff; width: 880px; z-index: 89; } .nivo-caption p { padding: 5px; margin: 0; } .nivo-directionNav a { position: absolute; top: 45%; z-index: 99; cursor: pointer; } .nivo-prevNav { left: 0px; } .nivo-nextNav { right: 0px; } .nivo-controlNav a { position: relative; z-index: 99; cursor: pointer; } .nivo-controlNav a.active { font-weight: bold; } /*-----------------------------------------*/ .nivo-controlNav { position: absolute; left: 47%; bottom: -30px; } .nivo-controlNav a { display: none; width: 10px; height: 10px; background: none; text-indent: -9999px; border: 0; margin-right: 3px; float: left; } .nivo-controlNav a.active { background-position: -10px 0; } .nivo-directionNav a { display: block; width: 32px; height: 34px; background: url(images/arrows.png) no-repeat; text-indent: -9999px; border: 0; } a.nivo-nextNav { background-position: -32px 0; right: 10px; } a.nivo-prevNav { left: 10px; } /*-----------------------------------------*/ .nivo-controlNav { position: absolute; left: 47%; bottom: -30px; } .nivo-controlNav a { display: none; width: 10px; height: 10px; background: none; text-indent: -9999px; border: 0; margin-right: 3px; float: left; } .nivo-controlNav a.active { background-position: -10px 0; } .nivo-directionNav a { display: block; } .mainmenu { width: 130px; position: fixed; height: auto; top: 50px; text-align: right; float: left; z-index: 100;

} .mainmenu ul { padding-right: 5px; float: left; list-style: none; line-height: 1; color: #FFFF00; background: #fff; opacity: .7; } .mainmenu a, .mainmenu a:visited { display: block; width: 100px; font-style: normal; text-decoration: none; color: #000; margin-top: 5px; margin-bottom: 5px; } .mainmenu li li a { text-indent: 2px; } .mainmenu ul ul a { width: 140px; height: 100%; } .mainmenu ul a { width: 140px; } .mainmenu li { width: 140px; margin: 0; padding: 0; text-indent: -20px; } .mainmenu ul li { position: relative; width: 100%; } .mainmenu ul li a.selected { color: blue; } /* !!!!! */ .mainmenu li ul { position: absolute; padding: 0px 5px 0 5px; left: -999em; height: auto; width: 100px; background: #fff; font-weight: normal; text-align: left; } .mainmenu li li { width: 100%; } .mainmenu li a { width: 90px; } .mainmenu li li a { width: 100%; } .mainmenu li ul { margin: -55px 0 0 0px; } .ul_ch, .mainmenu li:hover ul ul, .mainmenu li li:hover ul ul, .mainmenu li li li:hover ul ul, .mainmenu li li li li:hover ul ul, .mainmenu li li li li li:hover ul ul { left: -999em; } .mainmenu li:hover ul, .mainmenu li li:hover ul, .mainmenu li li li:hover ul, .mainmenu li li li li:hover ul, .mainmenu li li li li li:hover ul { left: 100%; /* !!! */ } .mainmenu li:hover > ul.ul_ch { left: 100%; /* !!! */ } .mainmenu li:hover a, .mainmenu li:hover a:visited, .mainmenu li:hover a:hover, .mainmenu li a:hover { color: red; } .mainmenu li:hover li a, .mainmenu li li:hover li a, .mainmenu li li li:hover li a, .mainmenu li li li li:hover li a, .mainmenu li:hover li a:visited, .mainmenu li li:hover li a:visited, .mainmenu li li li:hover li a:visited, .mainmenu li li li li:hover li a:visited { color: #000; } .mainmenu ul ul a:hover, .mainmenu li:hover li:hover a, .mainmenu li:hover li:hover a:visited, .mainmenu li:hover li:hover li:hover a, .mainmenu li:hover li:hover li:hover a:visited, .mainmenu li:hover li:hover li:hover li:hover a, .mainmenu li:hover li:hover li:hover li:hover a:visited, .mainmenu li:hover li:hover li:hover li:hover li:hover a, .mainmenu li:hover li:hover li:hover li:hover li:hover a:visited, .mainmenu li:hover li:hover li:hover li:hover li:hover li:hover a, .mainmenu li:hover li:hover li:hover li:hover li:hover li:hover a:visited { color: red; } /*-------------------final----------------------------*/

  1. menu {

text-align: left; position: fixed; top: 50px; height: auto; width: auto; z-index: 999; height: 500px; }

  1. menu ul li a.selected {

color: red; background: silver; } /*Toggle Area*/

  1. menu .toggle {

float: right; width: 9px; padding: 5px; cursor: pointer; border-top: 1px solid white; border-left: 1px solid #E0E0E0; color: #999; text-indent: 0; margin-left: 0; }

  1. menu ul.navmenu li:first-child .toggle {

border-width: 0 0 0 1px; } /*Menu Setup*/

  1. menu ul {

padding: 0; margin: 0; width: 150px; }

  1. menu ul ul {

border: 1px solid #CCC; overflow: hidden; }

  1. menu ul.navmenu li {

margin: 0; list-style: none; float: left; }

  1. menu ul.navmenu li li {

float: none; } /*Links*/

  1. menu ul.navmenu a, #menu ul.navmenu a:visited {

text-decoration: none; padding: 5px; display: block; color: #008FDD; }

  1. menu ul.navmenu ul.submenu a:hover {

background: #FFF4D2; color: #333; } /*Heading Outer div*/

  1. menu ul.navmenu .menutop {

border: 1px solid #CCC; border-width: 0 1px; overflow: hidden; width: 150px; background: #F9F9F9; } /*Header Links*/

  1. menu ul.navmenu .menutop a {

width: 120px; float: left; margin: 0 0 1px 0; border-top: 1px solid white; } /*Header Link Hover*/

  1. menu ul.navmenu .menutop a:hover {

color: #333; } /*Removes white border for the first header*/

  1. menu ul.navmenu li:first-child .menutop a {

border-width: 0px; } /*Single Menu Width Fix*/

  1. menu ul.navmenu .menusingle a {

width: 140px; } /*Border Radius and Special Border Width*/

  1. menu ul.navmenu li:first-child .menutop {

border-width: 1px 1px 0 1px; -moz-border-radius: 5px 5px 0 0; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; }

  1. menu ul.navmenu li:last-child .menutop {

border-width: 0px 1px 1px 1px; -moz-border-radius: 0 0 5px 5px; -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; }

  1. menu ul.navmenu li:last-child ul.submenu {

-moz-border-radius: 0 0 5px 5px; -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; }

  1. menu ul.navmenu li:last-child .menutop-open {

-moz-border-radius: 0; -webkit-border-radius: 0px; border-width: 0 1px; }

  1. contentSub {

display: none; }

  1. siteSub {

display: none; }

  1. search-controls {

display: none; } .firstHeading { display: none; }

  1. search-controls {

margin-top: 30px; }

  1. footer-box {

display: none; }

  1. top-section {

height: 25px; width: 100%; position: fixed; border-left: none; border-right: none; } .left-menu { margin-top: -15px; } .left-menu ul { border: none; }

  1. menubar li a {

color: white; }

  1. menubar.right-menu {

margin-top: -15px; } .right-menu ul { border: none; }

  1. menubar {

top: 22px; z-index: 25; } img[src*="/wiki/skins/common/images/wiki.png"] { width: 0; height: 40px; margin: 0 auto; background: transparent url(Metu-top.png) top left no-repeat;

       z-index:10000;

} </style> <script type="text/javascript"> $(document).ready(function() {

$('.toggle:not(.toggle-open)') .addClass('toggle-closed') .parents('li') .children('ul') .hide();

if($.browser.msie){ $('#menu ul.navmenu li:last-child .menutop') .css('border-bottom','1px solid #CCC'); }

$('.toggle') .click(function(){ if ($(this) .hasClass('toggle-open')) { $(this) .removeClass('toggle-open') .addClass('toggle-closed') .empty() .append('+') .parents('li') .children('ul') .slideUp(250); $(this) .parent('.menutop') .removeClass('menutop-open') .addClass('menutop-closed'); }else{ $(this) .parent('.menutop') .removeClass('menutop-closed') .addClass('menutop-open'); $(this) .removeClass('toggle-closed') .addClass('toggle-open') .empty() .append('–') .parents('li') .children('ul') .slideDown(250); }

}) }) $(this) .removeClass('toggle-open') .addClass('toggle-closed') .empty() .append('+') .parents('li') .children('ul') .slideUp(250);

</script> </head>

<body>

Team

<img alt="" src="Metu-slide1.jpg"> <img alt="" src="Metu-slide2.jpg"> <img alt="" src="Metu-slide3.jpg">

METU Turkey Software is an interdisciplinary team of 8 students and 3 advisors from various backgrounds such as Molecular Biology, Bioinformatics, Computer Engineering and Computer Education and Instructional Technology. We have put our knowledge and experience in our fields together to bring a much needed solution to a daily problem in field of synthetic biology for iGEM 2010

Motivation

Since 2008, we have been participating in iGEM as METU ( Middle East Technical University) wet-lab team, and each year we have noticed the increasing number of teams participating, along with an increase in biobricks entries at partsregistry.org. While having more choices of biobricks to choose from is incredible, searching for and choosing the appropriate parts is becoming a challenge. This year during the construction process of iGEM biobrick parts for our new project, we felt the need for an application to find interacting parts based on an input/output model to design the genetic constructs. Using a specialized software for searching the parts registry to find possible biobricks to include into our construct would be much easy, fast and accurate than manual. We have shared our need with a group of friends who are software engineers, and initiated the METU_Turkey_SOFTWARE team where we worked together over this summer to build the BIO-Guide software.

Scope and Future Aspects

The partsregistry.org is a continuously growing collection of standard genetic parts that can be mixed and matched to build synthetic biology devices and systems. The Registry is based on the principle of "get some, give some". Registry users benefit from using the parts and information available in the Registry for designing their own genetically engineered biological systems. In exchange, the expectation is that Registry users will contribute back to the information and the data on existing parts and will submit new parts they have designed in order to improve this community resource.

As an expanding database partsregistry.org needs to be more organized and the standardization template needs to be improved. Additionally, the potential of multiple ways of using each part in different construct combination brings out the necessity for an application to search through the database. BIO-Guide is the first designed software that organizes over 1000 parts in partsregistry.org as possible atomics parts to build new biological device and systems for specific input and outputs based on graph theory. The requirement of similar applications and software tools are now inevitable in the emerging field of synthetic biology. The innovative approach that makes the partsregistry.org easy to use for synthetic biology applications is the collection of standardized parts that can be used in any combination with minimal effort under one database. But while working on our algorithm to search for possible combinations of parts depending on the given input and output, we have realized that present standards are inadequate and parts registry form must be improved.

In very near future a new format for parts registry form is needed and few additional features should be implemented to have more control on the database. We are planning to suggest a new format and features for the parts registry based on the survey results we have received. And planning to build the next version of BIO-guide based on the revised parts registry form. Along with using new parts registry standards we will be improving the algorithm, so that the software can search through more complex relations and returns all possible functional constructs.

Project Introduction

As the field of Synthetic Biology is on the rise, iGEM is growing up very fast and the number of parts in the parts registry is increasing with the addition of more complex parts each day. After facing some difficulty while running our algorithms on the parts registry, the need for more effective standardization of parts entry was apparent. We have investigated the information on parts in iGEM’s 2010 distribution and reorganized the information on the parts registry forms according to the needs of our algorithm. Then we have used graph theoretic modeling to visualize the relations between iGEM Parts and to standardize the representation of the parts as much as possible by graph theoretical methods. This helped us to find input output relations between the parts. Furthermore, our program BIO-Guide is now able to provide alternative pathways to construct the most reliable and functional Biobrick devices with respect to given inputs and expected outputs as a guide to Biobricks parts registry.

Notebook
Download
Misc - Collaboration

Material and Methods

Our material for B-IO Guide Software Program was the all background information of parts stated in distributed 2010 iGEM plates to whole wetlab teams. Data of a part having specific part ID has been parsed by writing a parsing code. Then, other data which needs to be standardized according to biological importance which has been get out from the Registry of Parts Page manually. These standardized data are;

  • working conditions of biobricks involved within the parts
  • properties of inputs and outputs

We named as "Inputs" because an effector which may be chemical(IPTG, galactose etc.) and physical (UV irradiation, temperature etc) external inputs or may be proteins synthesized from a biobrick coding sequence can affect promoters on the parts. The effects of these mentioned inputs have been determined as inducer (a molecule that starts gene expression), repressor (blocker of attachment of RNA polymerase to promoter), activator (increasing the rate of transcription) and inhibitor (decreasing the rate of transcription). Moreover, the promoters may have additional property at which they may become constitutively ON without seen any effect.

On the other hand, for output section, we add new approach which is "working condition" parameter because the expressed proteins from biobrick coding sequences may come from different organisms to run mostly in E.coli. However, in some cases these proteins may not work well as expected unless suitable and optimum conditions are provided in the host. Thus, we have thought that natural(in vivo) or experimental(in vitro) working conditions of the synthesized proteins from the certain biobricks or constructs should be stated during submitting to Parts Registry. Nevertheless, our 2010 iGEM Software Program version 1.0 mostly does not have any experimental data since the data had not been added for pages of the parts regularly and true. Therefore, if our advised Parts Registry interfaces are used in iGEM in future and our standards are used, then we will be able to add such an information to the database of the program for better performance.

Code
Human Practices
Database
User Guide
Safety
Modelling
Support
Future Plan
Algorithm
Contact
Results

<script type="text/javascript">if (window.runOnloadHook) runOnloadHook();</script>

</body>

</html>