Difference between revisions of "Template:Groningen"

@@ Line 1: / Line 1: @@
 <html>
-<!--- THIS IS WHERE THE HTML BEGINS --->
 <!-- This tells the browser that your page is responsive -->
@@ Line 15: / Line 13: @@
 <header id="content-header">
 	<span id="logo-container" class="menu-item">
-		<div><img src="https://static.igem.org/mediawiki/2016/5/5d/T--Groningen--logo-200.png" alt="CryptoGE®M" /></div>
+		<div><a class="img" href="/Team:Groningen"><img src="https://static.igem.org/mediawiki/2016/5/5d/T--Groningen--logo-200.png" alt="CryptoGE®M" /></a></div>
 <!-- https://static.igem.org/mediawiki/2016/e/e1/T--Groningen--logo-500.png -->
-		<div class="menu-title">CryptoGE®M</div>
+		<div class="menu-title"><a href="/Team:Groningen">CryptoGE®M</a></div>
-		<div class="sub-menu-wrap">
+		<!--<div class="sub-menu-wrap">
 			<div class="sub-menu">
 				<a href="/Team:Groningen">Home</a>
@@ Line 24: / Line 22: @@
 				<a href="/Team:Groningen/Achievements">Achievements</a>
 			</div>
-		</div>
+		</div>-->
 	</span>
@@ Line 35: / Line 33: @@
 				<a href="/Team:Groningen/Supervisors">Supervisors</a>
 				<a href="/Team:Groningen/Collaborations">Collaborations</a>
+				<a href="/Team:Groningen/Achievements">Achievements</a>
 				<a href="/Team:Groningen/Contact">Contact</a>
 			</div>
@@ Line 45: / Line 44: @@
 		<div class="sub-menu-wrap">
 			<div class="sub-menu">
+				<a href="/Team:Groningen/Tour"><strong>Tour</strong></a>
 				<a href="/Team:Groningen/Description">Description</a>
 				<a href="/Team:Groningen/Design">Design</a>
 				<a href="/Team:Groningen/Results">Results</a>
+				<a href="/Team:Groningen/Demonstrate">Demonstrate</a>
 				<a href="/Team:Groningen/Applications">Applications</a>
-				<a href="/Team:Groningen/FuturePerspectives">Future Perspectives</a>
+				<a href="/Team:Groningen/FuturePerspectives">Future<!-- Perspectives--></a>
+				<a href="/Team:Groningen/Notebook">Notebook</a>
 			</div>
 		</div>
@@ Line 89: / Line 91: @@
 				<a href="/Team:Groningen/HP/Gold">Gold</a>
 				<a href="/Team:Groningen/HP/Silver">Silver</a>
-				<!-- <a href="/Team:Groningen/HP/Outreach">Outreach</a>
+				<!-- <a href="/Team:Groningen/Integrated_Practices">Integrated Practices</a>
+				<a href="/Team:Groningen/Engagement">Engagement</a>
+				<a href="/Team:Groningen/HP/Outreach">Outreach</a>
 				<a href="/Team:Groningen/HP/Social">Social</a>
 				<a href="/Team:Groningen/HP/Legal">Legal</a>
@@ Line 111: / Line 115: @@
 <hr />
-<script>
+<script src="/Template:Groningen/index_js?action=raw&ctype=text/javascript"></script>
-function menuClickers(){
-	var menuItems = $("#content-header .menu-item");
-	$(".menu-item img,.menu-title").click(function(evt){
-		var item = $(this).parents('.menu-item').first();
-		if(!item.hasClass('hover')){
-			menuItems.removeClass('hover');
-		}
-		item.toggleClass('hover');
-		evt.stopPropagation();
-	});
-	$(document).click(function(){
-		menuItems.removeClass('hover');
-	});
-}
-function updateCollapseAll(){
-	var img = $('#collapse-all img').first();
-	if(collapsers.open){
-		img.attr('src', 'https://static.igem.org/mediawiki/2016/7/77/T--Groningen--minux.png');
-	}else{
-		img.attr('src', 'https://static.igem.org/mediawiki/2016/f/fa/T--Groningen--plus.png');
-	}
-}
-function hideOne(h, sec){
-	if(!sec.hasClass('hide')){
-		collapsers.open--;
-	}
-	sec.addClass('hide');
-	h.addClass('collapsed');
-	updateCollapseAll();
-}
-function showOne(h, sec, rec){
-	var id = h.attr('id');
-	if(sec.hasClass('hide')){
-		collapsers.open++;
-	}
-	sec.removeClass('hide');
-	h.removeClass('collapsed');
-	updateCollapseAll();
-	if(!rec){
-		if(id) if(id.substr(0, 'collapser-'.length) !== 'collapser-'){
-			window.location.hash = '#'+id;
-		}
-		sec.parents('.collapser-sec').each(function(){
-			var sec = $(this), h = $('#'+sec.attr('id').substr('sec-'.length));
-			showOne(h, sec, true);
-		});
-	}
-}
-function collapsers(hlvl){
-	var secs = $('.collapse'+ (hlvl ? '-' + hlvl : ''));
-	function toggleOne(h, sec){
-		if(sec.hasClass('hide')){
-			showOne(h, sec);
-		}else{
-			hideOne(h, sec);
-		}
-	}
-	secs.each(function(idx, sec){
-		sec = $(sec);
-		if(sec.hasClass('collapse-conditional')){
-			var id  = sec.attr('id');
-			if(id){
-				if(collapsers.allow.indexOf(id) === -1){
-					return;
-				}
-			}else if(!collapsers.allowConditional){
-				return;
-			}
-		}
-		var h = sec.find(hlvl || 'h3').first(),
-			hid = h.attr('id'), secid = sec.attr('id'), id;
-		if(hid){
-			if(!secid){
-				secid = 'sec-'+hid;
-				sec.attr('id', secid);
-				id = hid;
-			}
-		}else if(secid){
-			hid = secid;
-			secid = 'sec-'+hid;
-			h.attr('id', hid);
-			sec.attr('id', secid);
-			id = hid;
-		}else{
-			id = 'collapser-'+(collapsers.nextId++);
-			secid = 'sec-'+id;
-			sec.attr('id', secid);
-			hid = id;
-			h.attr('id', hid);
-		}
-		if(id !== hid){
-			console.log(id, hid, secid);
-		}
-		h.insertBefore(sec);
-		h.click(function(evt){
-			toggleOne(h, sec);
-		});
-		h.addClass('collapser');
-		sec.addClass('collapser-sec');
-		collapsers.all.push({sec: sec, h: h});
-		hideOne(h, sec);
-	});
-}
-collapsers.open = 0;
-collapsers.openedOne = false;
-collapsers.allowConditional = false;
-collapsers.allow = [];
-collapsers.all = [];
-collapsers.nextId = 0;
-function postcollapse(){
-	function toggleAll(evt){
-		evt.preventDefault();
-		var open = collapsers.open;
-		collapsers.all.forEach(function(act){
-			if(open){
-				hideOne(act.h, act.sec);
-			}else{
-				showOne(act.h, act.sec, true);
-			}
-		});
-		return false;
-	}
-	if(collapsers.all.length){
-		var wrap = $('#ayoop-wrap'),
-			btn = $('<a id="collapse-all"><img src="https://static.igem.org/mediawiki/2016/7/77/T--Groningen--minux.png" title="Collapse all" alt="Collapse all" /></a>');
-		wrap.prepend(btn);
-		btn.click(toggleAll);
-	}
-	collapsers.open = 0;
-	if(window.location.hash.length > 1){
-		var h = $(window.location.hash), sec;
-		if(!h.length){
-			return;
-		}
-		sec = $('#sec-'+h.attr('id'));
-		showOne(h, sec);
-	}
-}
-function memberate(){
-	var mems = {
-			eike: "https://static.igem.org/mediawiki/2016/0/00/T--Groningen--team-eike.png",
-			bente: "https://static.igem.org/mediawiki/2016/a/ab/T--Groningen--team-bente.png",
-			daniel: "https://static.igem.org/mediawiki/2016/e/e1/T--Groningen--team-daniel.jpg",
-			sambit: "https://static.igem.org/mediawiki/2016/f/f0/T--Groningen--team-sambit.jpg",
-			luis: "https://static.igem.org/mediawiki/2016/0/0b/T--Groningen--team-luis.jpg",
-			matthia: "https://static.igem.org/mediawiki/2016/e/e2/T--Groningen--team-matthia.jpg",
-			mareike: "https://static.igem.org/mediawiki/2016/9/9a/T--Groningen--team-mareike.jpg",
-			bara: "https://static.igem.org/mediawiki/2016/7/7f/T--Groningen--team-barbora.jpg",
-			kathinka: "https://static.igem.org/mediawiki/2016/d/d6/T--Groningen--team-kathinka.jpg",
-			ilona: "https://static.igem.org/mediawiki/2016/0/05/T--Groningen--team-ilona.jpg",
-			carlos: "https://static.igem.org/mediawiki/2016/f/f0/T--Groningen--team-carlos.jpg",
-			pj: "https://static.igem.org/mediawiki/2016/a/a7/T--Groningen--team-pj.jpg",
-			marco: "https://static.igem.org/mediawiki/2016/a/a3/T--Groningen--team-agar-marco.jpg"
-		}, mem = window.location.hash, elm = $('#memberate');
-	if(!mem || mem.length < 2){
-		return;
-	}
-	mem = mem.substr(1);
-	if(!mems.hasOwnProperty(mem)){
-		return;
-	}
-	console.log(mem);
-	if(!elm || !elm.length){
-		elm = $('<img style="max-width: 100px; max-height: 100px; position: fixed; bottom: 0; left: 0; opacity: 0.1; z-index: 2" onmouseover="this.style.opacity=0.9;" onmouseout="this.style.opacity=0.1;" id="memberate" />');
-		elm.appendTo('#content_wrapper');
-	}
-	elm.attr('src', mems[mem]);
-	$('a').each(function(a){
-		var us = '/Team:Groningen';
-		if(this.pathname.substr(0, us.length) === us)if(this.hash === '#' || this.hash === ''){
-			this.hash = '#' + mem;
-		}
-	});
-}
-// Source: http://www.simonbattersby.com/blog/simple-jquery-image-crossfade/
-function cyclers(){
-	var cycs = $('.cycler');
-	function cycleImages(idx, cyc){
-		cyc = $(cyc);
-		var imgs = cyc.find('img:not(.base)'),
-			active = imgs.siblings('.active'),
-			next = active.next();
-		if(!next.length){
-			next = imgs.first();
-		}
-		next.css('z-index',3); //move the next image up the pile
-		active.fadeOut(1500, function(){ //fade out the top image
-			active.removeClass('active').css('z-index', 2).show(); //reset the z-index and unhide the image
-			next.css('z-index', 4).addClass('active'); //make the next image the top one
-		});
-	}
-	function cycleAll(){
-		cycs.each(cycleImages);
-	}
-	cycs.each(function(idx, cyc){
-		cyc = $(cyc);
-		cyc.find('img.base').removeClass('active').clone().prependTo(cyc).css('visibility', 'hidden');
-		cyc.find('img.base').last().removeClass('base').addClass('active');
-		cyc.find('img').click(function(){
-			cycleImages(0, cyc);
-		});
-		/*var maxHt = cyc.height();
-		cyc.find('img').each(function(idx, img){
-			var ht = $(img).height();
-			maxHt = ht > maxHt ? ht : maxHt;
-		});
-		cyc.height(maxHt);*/
-	});
-	if(cycs)if(cycs.length){
-		setInterval(cycleAll, 4000);
-	}
-}
-function ayOop(){
-	var oop = $('#ayoop'),
-		head = $('#content-header'),
-		headOff = head.offset().top + head.height();
-	function toggle(){
-		if($(window).scrollTop() >= headOff){
-			oop.show();
-		}else{
-			oop.hide();
-		}
-		if(window.location.hash === '#top'){
-			window.location.replace('#');
-		}
-	}
-	$(document).scroll(toggle);
-	toggle();
-}
-function fixify(){
-	var fix = $('.fix');
-	if(!fix || !fix.length){
-		return;
-	}
-	var off = fix.offset(),
-		topMenu = $('#top_menu_14').height();
-	$(document).scroll(function(){
-		if($(window).scrollTop() >= off.top){
-			fix.removeClass('static').addClass('fixed');
-			fix.width(fix.parent().width());
-			fix.css('top', topMenu);
-		}else{
-			fix.removeClass('fixed').addClass('static');
-			fix.width(fix.parent().width());
-			//guide.css
-		}
-	});
-}
-function fixTitle(){
-	var firstH2 = $('h2').first()[0],
-		suff = 'CryptoGErM - iGEM Groningen 2016';
-	document.title = (firstH2 ? firstH2.innerText + ' - ' : '') + suff
-}
-$(document).ready(function(){
-	menuClickers();
-	collapsers();
-	collapsers('h2');
-	collapsers('h3');
-	collapsers('h4');
-	postcollapse();
-	memberate();
-	cyclers();
-	ayOop();
-	fixify();
-	fixTitle();
-});
-window.onhashchange = memberate;
-</script>
 <div id="groningen-wrapper">
 </html>