|
|
Line 4: |
Line 4: |
| <SCRIPT LANGUAGE="JavaScript"> | | <SCRIPT LANGUAGE="JavaScript"> |
| | | |
− | //each of these are the main headings for the menu,
| + | {{readingscript}} |
− | //lists with one entry are basic links
| + | |
− | //links with two or more are submenus, the first entry is not a link but is displayed
| + | |
− | //each entry must have a matching entry in the list with the "ad" prefix.
| + | |
− | | + | |
− | var home = ["Home"];
| + | |
− | var team = ["Team"];
| + | |
− | var project = ["Project", "Description", "Transformations", "Fuel Cell", "Safety", "Results"];
| + | |
− | var parts = ["Parts"];
| + | |
− | var notebook = ["Lab Book", "Lab Notes", "Data"];
| + | |
− | var labwork = ["Lab Work", "Protocols", "Experiments"];
| + | |
− | var humanpractices = ["Human Practices", "Human Practices", "Public Engagement", "Collaborations"];
| + | |
− | var modeling = ["Modelling"];
| + | |
− | var entrepreneurship = ["Application"];
| + | |
− | var attributions = ["Attributions"];
| + | |
− | var pagenames = [home, team, project, parts, notebook, labwork, humanpractices, modeling, entrepreneurship, attributions];
| + | |
− | | + | |
− | var adhome = ["Reading"];
| + | |
− | var adteam = ["Reading/Team"];
| + | |
− | var adproject = ["Reading/Description", "Reading/Transformations", "Reading/FuelCell", "Reading/Safety", "Reading/Results"];
| + | |
− | var adparts = ["Reading/Parts"];
| + | |
− | var adnotebook = ["Reading/Notebook", "Reading/Data"];
| + | |
− | var adlabwork = ["Reading/Protocols", "Reading/Experiments"];
| + | |
− | var adhumanpractices= ["Reading/Practices", "Reading/PublicEngagement", "Reading/Collaborations"];
| + | |
− | var admodeling = ["Reading/Modelling"];
| + | |
− | var adentrepreneurship = ["Reading/Application"];
| + | |
− | var adattributions = ["Reading/Attributions"];
| + | |
− | var address = [adhome, adteam, adproject, adparts, adnotebook, adlabwork , adhumanpractices, admodeling, adentrepreneurship, adattributions];
| + | |
− | var menuactive = 0;
| + | |
− | var menucount = 0;
| + | |
− | | + | |
− | function changeBioContent(index){
| + | |
− | //add a </br> to break the line, also do not include " without a \ before, eg: \"
| + | |
− |
| + | |
− | var bennyBio = "<p style=\"font-size:160%\">Benny Bostock </br> Degree: Biochemistry 1<sup>st</sup> year </br>Profile: </p>";
| + | |
− | var chrisBio = "<p style=\"font-size:160%\">Chris Tucker </br> Degree: Biochemistry 1<sup>st</sup> year </br> Profile: Chris is an avid computer gamer. He also has a shisha pipe. Nuff said.</p>";
| + | |
− | var emilyBio = "<p style=\"font-size:160%\">Emily Capes </br> Degree: Biochemistry 1<sup>st</sup> year </br> Profile: Emily is very helpful and always offers people lifts in her car. </br> Do not accept this, she has no sense of direction or time. </br> Consequently, you will not make it to your destination.</p>";
| + | |
− | var izzahBio = "<p style=\"font-size:160%\">Izzah Elahi </br> Degree: Biological Sciences 1<sup>st</sup> year </br> Profile: </p>";
| + | |
− | var mattBio = "<p style=\"font-size:160%\">Matt Shepherd </br> Degree: Microbiology 1<sup>st</sup> year </br> Profile:</p>";
| + | |
− | var nasserBio = "<p style=\"font-size:160%\">Nasser Al-Farhan </br> Degree: Psychology and Neuroscience 1<sup>st</sup> year, previously Computer science </br> Profile: </p>";
| + | |
− | var peteRBio = "<p style=\"font-size:160%\">Pete Roe </br> Degree: Computer Science 1<sup>st</sup> year </br> Profile: Best coder in the universe. Most commonly found: Near/around computer or in the gym. </br> Life Aim: To be in both places at once</p>";
| + | |
− | var PeteWHBio = "<p style=\"font-size:160%\">Pete Whitehead </br> Degree: Biomedical Sciences 1<sup>st</sup> year </br> Profile: Can't hold alcohol. When drunk he will imitate an aeroplane, sounds effects included. </p>";
| + | |
− | var tomBBio = "<p style=\"font-size:160%\">Tom Biggs </br> Degree: Biological sciences 2<sup>nd</sup> year </br> Best known for: His Impeccable punctuality </br> Profile: Tom is our resident Genetics guru, and is an invaluable member of the team. </br> Unfortunately, he leads a sheltered life, and has not discovered the wonders of modern time-keeping. Consequently he is late, without fail, to nearly everything we do.</p>";
| + | |
− | var tomWLBio = "<p style=\"font-size:160%\">Tom Ward-Leggat </br> Degree: Microbiology 1<sup>st</sup> year </br> Profile: </p>";
| + | |
− | var bios = [bennyBio, chrisBio, emilyBio, izzahBio, mattBio, nasserBio, peteRBio, PeteWHBio, tomBBio, tomWLBio];
| + | |
− | document.getElementById("bioframe").innerHTML= bios[index];
| + | |
− | }
| + | |
− | | + | |
− | function buildPage(){
| + | |
− | buildMenu();
| + | |
− | buildTeamGrid();
| + | |
− | setInterval(function(){
| + | |
− | if(menuactive <= 0){
| + | |
− | menucount = menucount - 1;
| + | |
− | if(menucount <= 0){
| + | |
− | document.getElementById("SubMenu").style.visibility = "hidden";
| + | |
− | }
| + | |
− | }
| + | |
− | },10);
| + | |
− | }
| + | |
− |
| + | |
− | function buildTeamGrid(){
| + | |
− | var index = 0;
| + | |
− | var names = ["Benny Bostock", "Chris Tucker", "Emily Capes", "Izzah Elahi", "Matt Shepherd", "Nasser Al-Farhan", "Pete Roe", "Pete Whitehead", "Tom Biggs", "Thomas Ward-Leggat"];
| + | |
− | var pictureName = ["/c/c2/BennyBostock.jpg", "/e/ea/ChrisTucker.jpg", "/0/02/EmilyMichelleCapes.jpg", "/4/41/Blankprofile.png", "/4/41/Blankprofile.png", "/4/41/Blankprofile.png", "/4/41/Blankprofile.png", "/4/41/Blankprofile.png", "/4/41/Blankprofile.png", "/4/41/Blankprofile.png"];
| + | |
− | var teamHTML = '<table style="width:100%; color:#d8131d; background-color:#e3e3e3; border-spacing: 15px;">';
| + | |
− | var newline = true;
| + | |
− | while(newline){
| + | |
− | teamHTML += '<tr>';
| + | |
− | for(i2 = 0; i2 < 3; i2++){
| + | |
− | if(index < names.length){teamHTML += '<td align="center"><b>' + names[index] + '</b><div style="border-style:solid; border-color:#ffffff; border-width:5px; border-radius:50px; height: 100px; width: 150px; background-size:cover; background-image:url(https://static.igem.org/mediawiki/2015' + pictureName[index] + ');" onmouseover="changeBioContent(' + index + ')"></div></td>';
| + | |
− | index += 1;}
| + | |
− | else{
| + | |
− | newline = false;
| + | |
− | }
| + | |
− | }
| + | |
− | teamHTML += '</tr>';
| + | |
− | }
| + | |
− | teamHTML += '</table>';
| + | |
− | document.getElementById("teamtable").innerHTML= teamHTML;
| + | |
− | }
| + | |
− | | + | |
− | function buildMenu(){
| + | |
− | var menuHTML = '.';
| + | |
− | for(i1 = 0; i1 < pagenames.length; i1++){
| + | |
− | if(pagenames[i1].length <= 1){
| + | |
− | menuHTML += '<div onmouseout="dullMenu(this)"onmouseover="lightUpMenu(this, ' + i1 + ')" style = "vertical-align:text-bottom; height:100%; width:135px; float:left; text-align:center;"><a style = "color: #ffffff;text-decoration:none;" href="https://2015.igem.org/Team:' + address[i1][0] + '">' + pagenames[i1][0] + '</a></div>';
| + | |
− | }else{
| + | |
− | menuHTML += '<div onmouseout="dullMenu(this)"onmouseover="lightUpMenu(this, ' + i1 + ')" style = "vertical-align:text-bottom; height:100%; width:135px; float:left; text-align:center;">' + pagenames[i1][0] + '</div>';
| + | |
− | }
| + | |
− | }
| + | |
− | document.getElementById("Menu").innerHTML= menuHTML;
| + | |
− | document.getElementById("SubMenu").style.visibility = "hidden";
| + | |
− | }
| + | |
− | | + | |
− | function lightUpMenu(Button, index){
| + | |
− | menuactive = 1;
| + | |
− | menucount = 15;
| + | |
− | Button.style.backgroundColor = '#e35a61';
| + | |
− | Button.style.Color = '#000000';
| + | |
− | if(index == -1){
| + | |
− |
| + | |
− | }else if(pagenames[index].length > 1){
| + | |
− | editSubMenu(index);
| + | |
− | document.getElementById("SubMenu").style.visibility = "visible";
| + | |
− | }else{
| + | |
− | document.getElementById("SubMenu").style.visibility = "hidden";
| + | |
− | }
| + | |
− | }
| + | |
− | | + | |
− | function editSubMenu(index){
| + | |
− | var i1 = 0;
| + | |
− | var submenuHTML = '';
| + | |
− | for(i1 = 0; i1 < pagenames[index].length - 1; i1++){
| + | |
− | submenuHTML += '<div onmouseout="dullMenu(this)"onmouseover="lightUpMenu(this, ' + -1 + ')" style = "padding:7px; margin:0px; text-align:left;"><a style = "color: #ffffff;text-decoration:none;" href="https://2015.igem.org/Team:' + address[index][i1] + '">' + pagenames[index][i1 + 1] + '</a></div>';
| + | |
− | }
| + | |
− | var subM = document.getElementById("SubMenu");
| + | |
− | subM.innerHTML= submenuHTML;
| + | |
− | var offset = document.getElementById("main").style.marginLeft;
| + | |
− | offset = 135 * (index);
| + | |
− | subM.style.marginLeft = offset + 'px';
| + | |
− | }
| + | |
− | | + | |
− | function dullMenu(Button){
| + | |
− | Button.style.backgroundColor = '#d8131d';
| + | |
− | Button.style.Color = '#ffffff';
| + | |
− | menuactive = 0;
| + | |
− | } | + | |
− | | + | |
− | window.onload = buildPage;
| + | |
| | | |
| </SCRIPT> | | </SCRIPT> |