Team:Heidelberg/js/teampage

From 2014.igem.org

Revision as of 14:00, 16 October 2014

var memberData = {

 "Max_H": { 
   "Name" : "Max Horn", 
   "Subject" : "Molecular Biotechnology, undergraduate", 
   "Age" : "7", 
   "Alias" : "the programming guy", 
   "img" : "/wiki/images/a/a7/Heidelberg_MaxH.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Charlotte": {
   "Name" : "Charlotte Bunne", 
   "Subject" : "Biosciences, undergraduate", 
   "Age" : "19", 
   "Alias" : "", 
   "img" : "/wiki/images/6/69/Heidelberg_Charlotte.jpg",
   "Description" : "Charlotte is our youngest team member and already participated in iGEM in Germany´s first High School team in 2012. Studying Biosciences in her third semester, she impresses all team members with her energy, curiosity and ambition. She is the creative head behind nearly all artworks of our project. The wiki design originates from her imaginations and the BOINC video as well as the cover picture for our theme night “Religion and Synthetic Biology” arose from her hands. In team effort with Nils, she is conducting the linker screening experiments for the lysozyme circularization. In the course of these experiments Charlotte learned huge organisational skills that directs her abilities and energy into the right channels. In this way Charlotte became an indispensable team member."
 },
 "Nils": {
   "Name": "Nils Klughammer",
   "Subject" : "Physics, undergraduate", 
   "Age" : "32", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/f/ff/Heidelberg_Nils.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Silvan": {
   "Name": "Silvan Schmitz",
   "Subject" : "Systems Biology, graduate", 
   "Age" : "32", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/c/cf/Heidelberg_Silvan.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Jan": {
   "Name": "Jan Gleixner",
   "Subject" : "Molecular Biotechnology, graduate", 
   "Age" : "32", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/d/dd/Heidelberg_Jan.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Magdalena": {
   "Name": "Magdalena Büscher",
   "Subject" : ", graduate", 
   "Age" : "32", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/c/ca/Placeholder2.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Carolin": {
   "Name": "Carolin Schmelas",
   "Subject" : "Neurobiology, graduate and psychology undergraduate", 
   "Age" : "20", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/4/49/Heidelberg_Carolin.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Elisabeth": {
   "Name": "Elisabeth Schäfer",
   "Subject" : "Molecular Biotechnology, undergraduate", 
   "Age" : "20", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/7/71/Heidelberg_Elisabeth.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Jakob": {
   "Name": "Jakob Kreft",
   "Subject" : "Medicine", 
   "Age" : "20", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/9/92/Heidelberg_Jakob.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Max_W": {
   "Name": "Max Waldhauer",
   "Subject" : "Molecular Biotechnology, undergraduate", 
   "Age" : "20", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/5/5a/Heidelberg_MaxW.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Anna": {
   "Name": "Anna Huhn",
   "Subject" : "Molecular Biotechnology, undergraduate", 
   "Age" : "20", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/c/c9/Heidelberg_Anna.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Constantin": {
   "Name": "Constantin Ahlmann",
   "Subject" : "Molecular Biotechnology, undergraduate", 
   "Age" : "20", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/5/5a/Heidelberg_Constantin.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Julia": {
   "Name": "Julia Neugebauer",
   "Subject" : "Molecular Biotechnology, undergraduate", 
   "Age" : "20", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/b/b6/Heidelberg_Julia.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Joel": {
   "Name": "Joel Beaudouin",
   "Subject" : "Molecular Biotechnology, undergraduate", 
   "Age" : "20", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/7/7f/Heidelberg_Joel.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Stefen": {
   "Name": "Stefen Krämer",
   "Subject" : "Molecular Biotechnology, undergraduate", 
   "Age" : "20", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/c/c0/Heidelberg_Stefen.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Pierre": {
   "Name": "Pierre Wehler",
   "Subject" : "Molecular Biotechnology, undergraduate", 
   "Age" : "20", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/d/d5/Heidelberg_Piere.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 },
 "Philipp": {
   "Name": "Philipp Bayer",
   "Subject" : "Molecular Biotechnology, undergraduate", 
   "Age" : "20", 
   "Alias" : "Placeholder", 
   "img" : "/wiki/images/0/09/Heidelberg_Philipp.jpg",
   "Description" : "Ludwig XIV. gilt als klassischer Vertreter des höfischen Absolutismus. Der Leitsatz des Absolutismus, L’État, c’est moi! (Der Staat bin ich!) wird ihm jedoch fälschlicherweise zugeschrieben.[1] Er festigte die Macht der Krone durch den Ausbau der Verwaltung, die Bekämpfung der Opposition in Kreisen des Adels sowie durch die Förderung der französischen Wirtschaft. Die Hofkultur wurde ganz auf die Person des Herrschers zugeschnitten. Zum Symbol für dessen herausragende Stellung wurde sein prunkvolles Auftreten. Der König förderte Künste und Wissenschaften, was eine Blütezeit der französischen Kultur zur Folge hatte. Ludwig XIV. vertrat eine expansive und kriegerische Außenpolitik, durch die Frankreich unter seiner Regentschaft eine dominierende Stellung in Europa gewann und seine Großmachtstellung in der Neuzeit etablierte."
 }

};

var teamView = true;

function updateHeights(){

 $('#memberSelector').stop(true);
 var height = 0;
 if(teamView){
   height = $('.team-overlay').outerHeight();
 }
 else {
   height = $('#memberImage').height();
 }
 $('#memberSelector').animate({height: height}, 300, "swing", function(){
   updateSlick($('#memberSelector').height());
 });

}

function updateSlick(height){

 elementHeight = $('#memberSelector .row:first').outerHeight();
 numElements = Math.floor(height/elementHeight);
 memberselector = $('#memberSelector');
 memberselector.slickSetOption("slidesToShow", numElements, false);
 memberselector.slickSetOption("slidesToScroll", numElements, true);

}

function smoothLoadImage(src){

 $('.imageBorder').height($('#memberImage').height());
 $('#memberImageOverlay').attr("src", src);
 $('#memberImageOverlay').load(function(){
   $(this).fadeIn(400, "swing", function(){
     $('#memberImage').attr("src", src);
     $('#memberImage').load(function(){
       $('#memberImageOverlay').hide();
       $('.imageBorder').css("height", "");
     });
   });

 });

}

function hideTeamOverlay(callback){

 $('.team-overlay').animate({ opacity: 0}, 200, "swing", function(){$('.team-overlay').css("display","none");});
 $('.memberview').animate({ opacity: 1}, 200, "swing", function(){
   teamView = false;
   updateHeights();
 });

}

$(document).ready(function(){

 $('#memberImage').load(function(){
   updateHeights();
 });

$('.team-overlay img').load(function(){

   updateHeights();
 });

 $('#memberSelector a').click(function(){
   if(teamView){
     hideTeamOverlay();

     $('#FilterButtons label').removeClass("active");
     if($(this).parent().parent().hasClass("Team"))
       $('#Teammembers-btn').addClass("active");
     else
       $('#Supervisors-btn').addClass("active");
   }
   $('#memberSelector a').removeClass("active");
   $(this).addClass("active");
   var memberKey = this.id.split("-")[1];
   member = memberData[memberKey];
   console.log(member);
   $("#Name").text(member.Name);
   $("#Subject").text(member.Subject);
   $("#Age").text(member.Age);
   $('#Alias').text(member.Alias);
   smoothLoadImage(member.img);
   $('#Description').text(member.Description);
 });

 $('#Teamfoto-btn').click(function(){
   if(teamView == false){
     $('.team-overlay').css("display", "block");
     $('.team-overlay').animate({ opacity: 1}, 200);
     $('.memberview').animate({ opacity: 0}, 200);
     teamView = true;
     updateHeights();
   }
 });

 memberselector = $('#memberSelector');

 $('#Teammembers-btn').click(function(){
   $('#memberSelector a').removeClass("active");
   $('#Supervisors-btn').removeClass("active");
   $(this).addClass("active");
   memberselector.slickFilter('.Team');
 });

 $('#Supervisors-btn').click(function(){
   $('#memberSelector a').removeClass("active");
   $('#Teammembers-btn').removeClass("active");
   $(this).addClass("active");
   memberselector.slickFilter('.Supervisor');
 });

 $('#memberSelector').slick({
   prevArrow: '<img src="/wiki/images/3/3f/Heidelberg_prev-arrow.png" alt="prev-arrow" class="arrow arrow-prev"/>',
   nextArrow: '<img src="/wiki/images/e/e0/Heidelberg_next-arrow.png" alt="next-arrow" class="arrow arrow-next"/>',
   vertical: true,
   infinite: false,
   slidesToShow: 5,
   slidesToScroll: 5
 });
 $('#memberSelector').slickFilter('.Team');

});

$(window).resize(function(){

 updateHeights();

});