|
|
| Line 1: |
Line 1: |
| | + | |
| | <html> | | <html> |
| | <!-- | | <!-- |
| Line 62: |
Line 63: |
| | /* End of restyling existing mediaWiki content */ | | /* End of restyling existing mediaWiki content */ |
| | | | |
| - | .hiddenElement {
| |
| - | display: none;
| |
| - | }
| |
| - | .clearFix {
| |
| - | clear: both;
| |
| - | }
| |
| - |
| |
| - | /* Logo swapping */
| |
| - | .igemLogo {
| |
| - | display: none;
| |
| - | margin-left: 40px;
| |
| - | }
| |
| - | .waterlooLogo {
| |
| - | margin-left: 48px;
| |
| - | }
| |
| - | .logoHomepage .igemLogo {
| |
| - | display: block;
| |
| - | }
| |
| - | .logoHomepage .waterlooLogo {
| |
| - | display: none;
| |
| - | }
| |
| - |
| |
| - | .layer {
| |
| - | position: absolute;
| |
| - | width: 18000px;
| |
| - | background-color: black;
| |
| - | }
| |
| - | #layer0 {
| |
| - | z-index: 1;
| |
| - | width: 1905px;
| |
| - | left: -465px;
| |
| - | background-image: url('https://static.igem.org/mediawiki/2013/3/32/15911_1_miscellaneous_digital_art_dna.jpg');
| |
| - | background-color: black;
| |
| - | background-size: 1905px;
| |
| - | }
| |
| - | #layer1 {
| |
| - | z-index: 10;
| |
| - | }
| |
| - | #pageContainer {
| |
| - | height: 775px;
| |
| - | }
| |
| - | .pageScrolling .page img {
| |
| - | visibility: hidden;
| |
| - | }
| |
| - | .page {
| |
| - | height: 680px;
| |
| - | margin: 10px 0;
| |
| - | width: 1905px;
| |
| - | float: left;
| |
| - | overflow-x: hidden;
| |
| - | overflow-y: scroll;
| |
| - | }
| |
| - | .page::-webkit-scrollbar {
| |
| - | display: none;
| |
| - | }
| |
| - | .pageStuff {
| |
| - | color: white;
| |
| - | width: 900px;
| |
| - | margin-left: 500px;
| |
| - | padding-top: 15px;
| |
| - | }
| |
| - | .pageStuff h1 {
| |
| - | color: white;
| |
| - | font-size: 28px;
| |
| - | }
| |
| - | .pageStuff h2 {
| |
| - | color: white;
| |
| - | }
| |
| - | .pageStuff p {
| |
| - | margin-left: 20px;
| |
| - | font-size: 16px;
| |
| - | }
| |
| - | .pageStuff a, .pageStuff a:visited {
| |
| - | font-size: 16px;
| |
| - | color: #44ccff;
| |
| - | }
| |
| - | .pageStuff img {
| |
| - | max-width: 900px;
| |
| - | }
| |
| - |
| |
| - | .navBar {
| |
| - | width: 975px;
| |
| - | height: 75px;
| |
| - | margin-left: -5px;
| |
| - | color: white;
| |
| - |
| |
| - | /* http://www.colorzilla.com/gradient-editor/#5abfce+0,0ba5bc+100;Custom */
| |
| - | background: rgb(90,191,206); /* Old browsers */
| |
| - | background: -moz-linear-gradient(45deg, rgba(90,191,206,1) 0%, rgba(11,165,188,1) 100%); /* FF3.6+ */
| |
| - | background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,rgba(90,191,206,1)), color-stop(100%,rgba(11,165,188,1))); /* Chrome,Safari4+ */
| |
| - | background: -webkit-linear-gradient(45deg, rgba(90,191,206,1) 0%,rgba(11,165,188,1) 100%); /* Chrome10+,Safari5.1+ */
| |
| - | background: -o-linear-gradient(45deg, rgba(90,191,206,1) 0%,rgba(11,165,188,1) 100%); /* Opera 11.10+ */
| |
| - | background: -ms-linear-gradient(45deg, rgba(90,191,206,1) 0%,rgba(11,165,188,1) 100%); /* IE10+ */
| |
| - | background: linear-gradient(45deg, rgba(90,191,206,1) 0%,rgba(11,165,188,1) 100%); /* W3C */
| |
| - | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5abfce', endColorstr='#0ba5bc',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
| |
| - |
| |
| - | }
| |
| - | .footer {
| |
| - | width: 975px;
| |
| - | height: 0px;
| |
| - | margin-left: -5px;
| |
| - | color: white;
| |
| - |
| |
| - | /* http://www.colorzilla.com/gradient-editor/#5abfce+0,0ba5bc+100;Custom */
| |
| - | background: rgb(90,191,206); /* Old browsers */
| |
| - | background: -moz-linear-gradient(45deg, rgba(90,191,206,1) 0%, rgba(11,165,188,1) 100%); /* FF3.6+ */
| |
| - | background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,rgba(90,191,206,1)), color-stop(100%,rgba(11,165,188,1))); /* Chrome,Safari4+ */
| |
| - | background: -webkit-linear-gradient(45deg, rgba(90,191,206,1) 0%,rgba(11,165,188,1) 100%); /* Chrome10+,Safari5.1+ */
| |
| - | background: -o-linear-gradient(45deg, rgba(90,191,206,1) 0%,rgba(11,165,188,1) 100%); /* Opera 11.10+ */
| |
| - | background: -ms-linear-gradient(45deg, rgba(90,191,206,1) 0%,rgba(11,165,188,1) 100%); /* IE10+ */
| |
| - | background: linear-gradient(45deg, rgba(90,191,206,1) 0%,rgba(11,165,188,1) 100%); /* W3C */
| |
| - | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5abfce', endColorstr='#0ba5bc',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
| |
| - |
| |
| - | }
| |
| - | h1, h2 {
| |
| - | border-bottom: 0 !important;
| |
| - | }
| |
| - |
| |
| - | @font-face {
| |
| - | font-family: 'Life Savers';
| |
| - | font-style: normal;
| |
| - | font-weight: 400;
| |
| - | src: local('Life Savers'), local('LifeSavers-Regular'), url(http://themes.googleusercontent.com/static/fonts/lifesavers/v3/_yRJoxB8KMO25_gswqItc4bN6UDyHWBl620a-IRfuBk.woff) format('woff');
| |
| - | }
| |
| - |
| |
| - | .navBar h1 {
| |
| - | margin-left: auto;
| |
| - | margin-right: auto;
| |
| - | color: white;
| |
| - | font-size: 30px;
| |
| - | font-weight: bold;
| |
| - | /*font-family: 'Life Savers', Verdana, sans-serif;*/
| |
| - | font-family: Verdana, sans-serif;
| |
| - | }
| |
| - | .navBar a {
| |
| - | /*font-family: 'Life Savers', Verdana, sans-serif;*/
| |
| - | font-family: Verdana, sans-serif;
| |
| - | /*font-weight: bold;*/
| |
| - | color: white;
| |
| - | display: block;
| |
| - | margin: 10px 0 10px 0;
| |
| - | text-decoration: none;
| |
| - | }
| |
| - | .navBar p {
| |
| - | font-size: 14px;
| |
| - | }
| |
| - | .navBar ul {
| |
| - | list-style-type: none;
| |
| - | list-style-image: none;
| |
| - | }
| |
| - | .largeLogo {
| |
| - | width: 740px;
| |
| - | margin: 57px 0 0 92px;
| |
| - | }
| |
| - | .pageLinks {
| |
| - | /*margin: 30px 0 10px 0;*/
| |
| - | }
| |
| - |
| |
| - | /* Experimental CSS3 Animations */
| |
| - | @keyframes startGlow {
| |
| - | 0% {color: white;}
| |
| - | 100% {color: yellow;}
| |
| - | }
| |
| - | @-webkit-keyframes startGlow /* Safari and Chrome */ {
| |
| - | 0% {color: white;}
| |
| - | 100% {color: yellow;}
| |
| - | }
| |
| - |
| |
| - | @keyframes fadeOutAnim {
| |
| - | 0% {opacity: 1;}
| |
| - | 100% {opacity: 0.4;}
| |
| - | }
| |
| - | @-webkit-keyframes fadeOutAnim /* Safari and Chrome */ {
| |
| - | 0% {opacity: 1;}
| |
| - | 100% {opacity: 0.4;}
| |
| - | }
| |
| - |
| |
| - | @keyframes fadeInAnim {
| |
| - | 0% {opacity: 0.4;}
| |
| - | 100% {opacity: 1;}
| |
| - | }
| |
| - | @-webkit-keyframes fadeInAnim /* Safari and Chrome */ {
| |
| - | 0% {opacity: 0.4;}
| |
| - | 100% {opacity: 1;}
| |
| - | }
| |
| - |
| |
| - | .fadeIn {
| |
| - | opacity: 1;
| |
| - | animation: fadeInAnim 0.5s;
| |
| - | -webkit-animation: fadeInAnim 0.5s;
| |
| - | }
| |
| - | .fadeOut {
| |
| - | opacity: 0.4;
| |
| - | animation: fadeOutAnim 0.5s;
| |
| - | -webkit-animation: fadeOutAnim 0.5s;
| |
| - | }
| |
| - |
| |
| - | @keyframes borderGlowAnim {
| |
| - | 0% {border-color: rgba(255, 255, 255, 0);}
| |
| - | 100% {border-color: rgba(255, 255, 255, 0.6);}
| |
| - | }
| |
| - | @-webkit-keyframes borderGlowAnim /* Safari and Chrome */ {
| |
| - | 0% {border-color: rgba(255, 255, 255, 0);}
| |
| - | 100% {border-color: rgba(255, 255, 255, 0.6);}
| |
| - | }
| |
| - |
| |
| - |
| |
| - | .navBar .pageLinks a {
| |
| - | }
| |
| - | .navBar .pageLinks a:hover {
| |
| - | color: yellow;
| |
| - | animation: startGlow 0.5s;
| |
| - | -webkit-animation: startGlow 0.5s;
| |
| - | }
| |
| - |
| |
| - | .link {
| |
| - | /*font-size: 26px;*/
| |
| - | font-size: 22px;
| |
| - | line-height: 25px;
| |
| - | max-width: 150px;
| |
| - | margin: 0 17px;
| |
| - | float: left;
| |
| - | }
| |
| - | .selectedLink a {
| |
| - | color: yellow;
| |
| - | }
| |
| - | .hoverMenu {
| |
| - | padding: 5px;
| |
| - | position: absolute;
| |
| - | top: 74px;
| |
| - | z-index: 15;
| |
| - |
| |
| - | /* */
| |
| - | background: rgb(111,177,186); /* Old browsers */
| |
| - | background: -moz-linear-gradient(45deg, rgba(111,177,186,1) 0%, rgba(90,191,206,1) 100%); /* FF3.6+ */
| |
| - | background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,rgba(111,177,186,1)), color-stop(100%,rgba(90,191,206,1))); /* Chrome,Safari4+ */
| |
| - | background: -webkit-linear-gradient(45deg, rgba(111,177,186,1) 0%,rgba(90,191,206,1) 100%); /* Chrome10+,Safari5.1+ */
| |
| - | background: -o-linear-gradient(45deg, rgba(111,177,186,1) 0%,rgba(90,191,206,1) 100%); /* Opera 11.10+ */
| |
| - | background: -ms-linear-gradient(45deg, rgba(111,177,186,1) 0%,rgba(90,191,206,1) 100%); /* IE10+ */
| |
| - | background: linear-gradient(45deg, rgba(111,177,186,1) 0%,rgba(90,191,206,1) 100%); /* W3C */
| |
| - | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6fb1ba', endColorstr='#5abfce',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
| |
| - |
| |
| - | }
| |
| - | .sublink {
| |
| - | margin: 0 0 14px 0;
| |
| - | font-size: 20px;
| |
| - | line-height: 23px;
| |
| - | }
| |
| - | #socialButtons {
| |
| - | position: absolute;
| |
| - | }
| |
| - | #socialButtons a {
| |
| - | padding-right: 13px;
| |
| - | }
| |
| - | .photoSection {
| |
| - | margin-left: 20px;
| |
| - | }
| |
| - | #otp {
| |
| - | width: 100%;
| |
| - | height: 100%;
| |
| - | }
| |
| - |
| |
| - | #notebook h1 {
| |
| - | margin-bottom: 6px;
| |
| - | }
| |
| - | .headshotWrapper {
| |
| - | margin: 0 10px 10px 0;
| |
| - | overflow: hidden;
| |
| - | float: left;
| |
| - | }
| |
| - | .personHeadshot {
| |
| - | margin-left: auto;
| |
| - | margin-right: auto;
| |
| - | display: block;
| |
| - | border: 5px solid;
| |
| - | border-radius: 10px;
| |
| - | border-color: black;
| |
| - | }
| |
| - | .personHeadshotClickable:hover {
| |
| - | cursor: pointer;
| |
| - | border-color: rgba(255, 255, 255, 0.6);
| |
| - | animation: borderGlowAnim 0.5s;
| |
| - | -webkit-animation: borderGlowAnim 0.5s;
| |
| - | }
| |
| - | .headshotCaption {
| |
| - | font-size: 16px;
| |
| - | font-weight: bold;
| |
| - | text-align: center;
| |
| - | }
| |
| - | .personPopup {
| |
| - | z-index: 100;
| |
| - | padding: 20px;
| |
| - | background-color: rgb(90, 191, 206);
| |
| - | box-shadow: 0 0 0 10px rgba(90, 191, 206, 0.3);
| |
| - | border-radius: 1px;
| |
| - | width: 500px;
| |
| - | position: absolute;
| |
| - | left: 440px;
| |
| - | top: 300px;
| |
| - | }
| |
| - | .personPopupImage {
| |
| - | float: left;
| |
| - | margin: 0 10px 0 0;
| |
| - | }
| |
| - | .personPopupInfo {
| |
| - | float: left;
| |
| - | width: 280px;
| |
| - | }
| |
| - | .personPopupInfo > * {
| |
| - | color: white;
| |
| - | }
| |
| - | .personPopupInfo h2 {
| |
| - | font-size: 20px;
| |
| - | font-weight: bold;
| |
| - | }
| |
| - | .personPopupInfo > p {
| |
| - | margin-left: 0;
| |
| - | font-size: 14px;
| |
| - | }
| |
| - |
| |
| - | /*
| |
| - | .sideArt {
| |
| - | z-index: 20;
| |
| - | position: absolute;
| |
| - | top: 200px;
| |
| - | left: 1035px;
| |
| - | visibility: hidden;
| |
| - | }
| |
| - | .sideArt img {
| |
| - | width: 303px;
| |
| - | }
| |
| - | */
| |
| - |
| |
| - | table {
| |
| - | color: white;
| |
| - | background-color: black;
| |
| - | border-spacing: 20px 5px;
| |
| - | text-align: left;
| |
| - | font-size: 16px;
| |
| - | line-height: 1.2;
| |
| - | }
| |
| - |
| |
| - | .video {
| |
| - | width: 519px;
| |
| - | margin: 0 0 30px 70px;
| |
| - | }
| |
| - | .pageStuff .caption {
| |
| - | font-size: 12px;
| |
| - | margin-left: 40px;
| |
| - | }
| |
| - |
| |
| - | .fullfloatright {
| |
| - | width: 100%;
| |
| - | height: 20px;
| |
| - | }
| |
| - | .fullfloatright> * {
| |
| - | float: right;
| |
| - | }
| |
| - |
| |
| - | .showmorelink {
| |
| - | cursor: pointer;
| |
| - | }
| |
| - | .showmore {
| |
| - | display: none;
| |
| - | }
| |
| - | </style>
| |
| - |
| |
| - | <script type="text/javascript">
| |
| - |
| |
| - | (function() {
| |
| - |
| |
| - | var pages = [
| |
| - | '#/Home',
| |
| - | '#/Project',
| |
| - | '#/Lab',
| |
| - | '#/MathModelling',
| |
| - | '#/HumanPractices',
| |
| - | '#/Gallery',
| |
| - | '#/Safety',
| |
| - | '#/Sponsors',
| |
| - | '#/Team'
| |
| - | ];
| |
| - | var MONTHS = {
| |
| - | 'january': 'January',
| |
| - | 'february': 'February',
| |
| - | 'march': 'March',
| |
| - | 'april': 'April',
| |
| - | 'may': 'May',
| |
| - | 'june': 'June',
| |
| - | 'july': 'July',
| |
| - | 'august': 'August',
| |
| - | 'september': 'September',
| |
| - | 'october': 'October',
| |
| - | 'november': 'November',
| |
| - | 'december': 'December'
| |
| - | };
| |
| - | var navBar = null;
| |
| - | var page_idx_map = {};
| |
| - | var layer_factors = [0, 1, 0];
| |
| - | var LAYER_OFFSET = -465;
| |
| - | var page_idx = 0;
| |
| - | var PAGE_WIDTH = 1905;
| |
| - | var NUM_PAGES = 9;
| |
| - | var NUM_LAYERS = 2;
| |
| - | var is_scrolling = false;
| |
| - |
| |
| - | // TODO - put all asset urls in one place
| |
| - | var igem_logo_url = 'https://static.igem.org/mediawiki/igem.org/1/17/IGEM_basic_Logo_white_stylized.png';
| |
| - | var waterloo_logo_url = 'https://static.igem.org/mediawiki/2013/0/08/Igem_logo.png';
| |
| - | //var art_url = 'https://static.igem.org/mediawiki/igem.org/6/64/Waterloo_igem_main_art.jpg';
| |
| - |
| |
| - | if (!String.prototype.format) {
| |
| - | String.prototype.format = function() {
| |
| - | var args = arguments;
| |
| - | return this.replace(/{(\d+)}/g, function(match, number) {
| |
| - | return typeof args[number] != 'undefined'
| |
| - | ? args[number]
| |
| - | : match
| |
| - | ;
| |
| - | });
| |
| - | };
| |
| - | }
| |
| - |
| |
| - | function Person(name, image_url, title, team, description) {
| |
| - | this.name = name;
| |
| - | this.url = image_url;
| |
| - | //this.title = title ? title : '';
| |
| - | //this.team = team ? team : '';
| |
| - | this.description = description ? description : '';
| |
| - | }
| |
| - |
| |
| - | function Link(link, text) {
| |
| - | this.link = link;
| |
| - | this.text = text;
| |
| - | }
| |
| - |
| |
| - | function ImageLink(link, url) {
| |
| - | this.link = link;
| |
| - | this.url = url;
| |
| - | }
| |
| - |
| |
| - | function NavBar() {
| |
| - | this.links = [];
| |
| - | this.sublinks = [];
| |
| - | this.linkElements = [];
| |
| - | this.hoverMenus = [];
| |
| - | this.focus = null;
| |
| - | this.shownHoverMenu = null;
| |
| - | this.inHoverMenu = false;
| |
| - | }
| |
| - | NavBar.prototype.addLink = function(link, sublinks) {
| |
| - | if (sublinks === undefined) {
| |
| - | sublinks = [];
| |
| - | }
| |
| - | this.links.push(link);
| |
| - | this.sublinks.push(sublinks);
| |
| - | };
| |
| - | NavBar.prototype.sectionSelected = function(section_idx) {
| |
| - | if (this.focus !== null) {
| |
| - | this.linkElements[this.focus].removeClass('selectedLink');
| |
| - | }
| |
| - | if (section_idx >= 0) { // Why do they html-escape &&
| |
| - | if (section_idx < this.linkElements.length) {
| |
| - | this.focus = section_idx;
| |
| - | this.linkElements[this.focus].addClass('selectedLink');
| |
| - | } else {
| |
| - | this.focus = null;
| |
| - | }
| |
| - | } else {
| |
| - | this.focus = null;
| |
| - | }
| |
| - | };
| |
| - | NavBar.prototype.showHoverMenu = function(idx) {
| |
| - | this.hideHoverMenu();
| |
| - |
| |
| - | var hover_menu = this.hoverMenus[idx];
| |
| - | if (hover_menu == null) {
| |
| - | return;
| |
| - | }
| |
| - | var link = this.linkElements[idx];
| |
| - | var navbar_element = $('.navBar');
| |
| - | hover_menu.css('top', navbar_element.position().top + navbar_element.height() + 'px');
| |
| - | hover_menu.css('left', link.position().left);
| |
| - | hover_menu.removeClass('hiddenElement');
| |
| - | this.shownHoverMenu = idx;
| |
| - | };
| |
| - | NavBar.prototype.hideHoverMenu = function() {
| |
| - | this.inHoverMenu = false;
| |
| - | if (this.shownHoverMenu === null) {
| |
| - | return;
| |
| - | }
| |
| - | var hover_menu = this.hoverMenus[this.shownHoverMenu];
| |
| - | if (hover_menu != null) {
| |
| - | hover_menu.addClass('hiddenElement');
| |
| - | }
| |
| - | this.shownHoverMenu = null;
| |
| - | };
| |
| - | NavBar.prototype.render = function() {
| |
| - | var nav_bar_element = $('.navBar');
| |
| - | var self = this;
| |
| - | var page_links = $('<div class="pageLinks" />');
| |
| - | for (var i = 0; i < this.links.length; i++) {
| |
| - | var link_name_lines = this.links[i].text.split(' ');
| |
| - | var link_name_string = '';
| |
| - | for (var link_name_i = 0; link_name_i < link_name_lines.length; link_name_i++) {
| |
| - | link_name_string += '<div>{0}</div>'.format(link_name_lines[link_name_i]);
| |
| - | }
| |
| - | var link_string = '<div class="link"><a href="{0}">{1}</a></div>';
| |
| - | var link = $(link_string.format(this.links[i].link, link_name_string));
| |
| - | var hover_menu = $('<div class="hoverMenu hiddenElement"></div>');
| |
| - |
| |
| - | var sublinks = this.sublinks[i];
| |
| - | for (var j = 0; j < sublinks.length; j++) {
| |
| - | var sublink_string = '<div class="sublink"><a href="{0}">{1}</a></div>';
| |
| - | var sublink = $(sublink_string.format(sublinks[j].link, sublinks[j].text));
| |
| - | hover_menu.append(sublink);
| |
| - | }
| |
| - | link.click(this.sectionSelected.bind(this, i));
| |
| - | link.hover(
| |
| - | this.showHoverMenu.bind(this, i)
| |
| - | //this.hideHoverMenu.bind(this, i)
| |
| - | );
| |
| - | this.linkElements.push(link);
| |
| - |
| |
| - | if (this.sublinks[i].length > 0) {
| |
| - | hover_menu.click(this.hideHoverMenu.bind(this));
| |
| - | hover_menu.hover(function() {
| |
| - | self.inHoverMenu = true;
| |
| - | }, this.hideHoverMenu.bind(this)); // Hide on blur.
| |
| - | this.hoverMenus.push(hover_menu);
| |
| - | } else {
| |
| - | this.hoverMenus.push(null); // Don't show blank menu.
| |
| - | }
| |
| - | page_links.append(link);
| |
| - | page_links.append(hover_menu);
| |
| - | }
| |
| - |
| |
| - | nav_bar_element.hover(null, function() {
| |
| - | setTimeout(function() {
| |
| - | if (!self.inHoverMenu) {
| |
| - | self.hideHoverMenu();
| |
| - | }
| |
| - | }, 20);
| |
| - | });
| |
| - |
| |
| - | nav_bar_element.append(page_links);
| |
| - | nav_bar_element.append($('<div class="clearFix"></div>'));
| |
| - | return nav_bar_element;
| |
| - | };
| |
| - |
| |
| - |
| |
| - | function createNavBar(notebook_sublinks, show_notebook) {
| |
| - | navBar = new NavBar();
| |
| - | // navBar.addLink(new Link('#/Home', 'Home'));
| |
| - | navBar.addLink(
| |
| - | new Link('#/Project', 'Project'),
| |
| - | [
| |
| - | new Link('#/Project/Introduction', 'Introduction'),
| |
| - | new Link('#/Project/Idea', 'Idea'),
| |
| - | new Link('#/Project/SerineIntegrase', 'Serine Integrase'),
| |
| - | new Link('#/Project/M13Bacteriophage', 'M13 Bacteriophage'),
| |
| - | new Link('#/Project/Design', 'Design'),
| |
| - | new Link('#/Project/Videos', 'Videos'),
| |
| - | new Link('#/Project/Accomplishments', 'Accomplishments'),
| |
| - | new Link('#/Project/Future', 'Future Aspirations')
| |
| - | ]
| |
| - | );
| |
| - | navBar.addLink(
| |
| - | new Link('#/Lab', 'Wet Lab'),
| |
| - | [
| |
| - | new Link('#/Lab/Experiments', 'Experiments'),
| |
| - | new Link('#/Lab/ResultsConclusions', 'Results and Conclusions'),
| |
| - | new Link('#/Lab/BioBricks', 'BioBricks'),
| |
| - | new Link('#/Lab/Ottawa', 'Ottawa\'s Collaboration'),
| |
| - | new Link('#/Lab/Notebook', 'Notebook')
| |
| - | ]
| |
| - | );
| |
| - | navBar.addLink(
| |
| - | new Link('#/MathModelling', 'Mathematical Modelling'),
| |
| - | [
| |
| - | new Link('#/MathModelling/Switch', 'Switch Modelling'),
| |
| - | new Link('#/MathModelling/PopulationInfection', 'Population and Infection Modelling'),
| |
| - | new Link('#/MathModelling/PhageParticle', 'Phage Particle Production Modelling')
| |
| - | ]
| |
| - | );
| |
| - | navBar.addLink(
| |
| - | new Link('#/HumanPractices', 'Human Practices'),
| |
| - | [
| |
| - | new Link('#/HumanPractices/TIL', 'T.I.L. Syn Bio'),
| |
| - | new Link('#/HumanPractices/IntentToInvent', 'Intent to Invent'),
| |
| - | new Link('#/HumanPractices/SpecialProject', 'VeloCity Science')
| |
| - | ]
| |
| - | );
| |
| - | navBar.addLink(
| |
| - | new Link('#/Gallery', 'Gallery'),
| |
| - | [
| |
| - | new Link('#/Gallery/Laboratory', 'Laboratory'),
| |
| - | new Link('#/Gallery/IntentToInvent', 'Intent to Invent')
| |
| - | ]
| |
| - | );
| |
| - | /*
| |
| - | if (show_notebook) {
| |
| - | navBar.addLink(
| |
| - | new Link('#/Notebook', 'Notebook'),
| |
| - | notebook_sublinks
| |
| - | );
| |
| - | }
| |
| - | */
| |
| - | navBar.addLink(
| |
| - | new Link('#/Safety', 'Safety')
| |
| - | );
| |
| - | navBar.addLink(
| |
| - | new Link('#/Sponsors', 'Sponsors')
| |
| - | );
| |
| - | navBar.addLink(
| |
| - | new Link('#/Team', 'Team'),
| |
| - | [
| |
| - | new Link('#/Team/Administrators', 'Administrators'),
| |
| - | new Link('#/Team/LabDesign', 'Lab & Design'),
| |
| - | new Link('#/Team/MathModelling', 'Mathematical Modelling'),
| |
| - | new Link('#/Team/HumanPractices', 'Human Practices'),
| |
| - | new Link('#/Team/Advisors', 'Advisors'),
| |
| - | new Link('#/Team/GradStudentAdvisors', 'Graduate Student Advisors'),
| |
| - | new Link('#/Team/WebDev', 'Web Developer'),
| |
| - | new Link('#/Team/Acknowledgements', 'Acknowledgements')
| |
| - | ]
| |
| - | );
| |
| - | navBar.render();
| |
| - |
| |
| - | var social_buttons = socialButtons(
| |
| - | [
| |
| - | new ImageLink('https://www.facebook.com/WaterlooiGEM', 'https://static.igem.org/mediawiki/2013/2/25/Waterloo_facebook_button_32.jpg'),
| |
| - | new ImageLink('http://www.youtube.com/user/WaterlooiGEM?feature=watch', 'https://static.igem.org/mediawiki/2013/1/1f/Waterloo_youtube_button_32.jpg'),
| |
| - | new ImageLink('https://twitter.com/Waterloo_iGEM', 'https://static.igem.org/mediawiki/2013/7/72/Waterloo_twitter_button_32.jpg'),
| |
| - | ]
| |
| - | );
| |
| - | var search_controls = $('#search-controls');
| |
| - | if (search_controls) {
| |
| - | social_buttons.css('left', search_controls.position().left + 6);
| |
| - | social_buttons.css('top', search_controls.position().top + 67);
| |
| - | search_controls.parent().append(social_buttons);
| |
| - | }
| |
| - | }
| |
| - |
| |
| - | function socialButtons(image_links) {
| |
| - | var container = $('<div id="socialButtons"></div>');
| |
| - | for (var i = 0; i < image_links.length; i++) {
| |
| - | var l = image_links[i];
| |
| - | var s = '<a href="{0}"><img src="{1}" /></a>'.format(l.link, l.url);
| |
| - | container.append($(s));
| |
| - | }
| |
| - | return container;
| |
| - | }
| |
| - |
| |
| - | function createPersonPhotoGrid(people, cols, img_height) {
| |
| - | var root = $('<div><div/>');
| |
| - | var oncol = 0;
| |
| - | for (var i = 0; i < people.length; i++) {
| |
| - | var person = people[i];
| |
| - | if (oncol >= cols) {
| |
| - | root.append($('<div class="clearFix"></div>'));
| |
| - | oncol = 0;
| |
| - | }
| |
| - | var headshot_wrapper = $('<div class="headshotWrapper"></div>');
| |
| - | var clickable_person_element = new PersonClickableElement(person, img_height);
| |
| - | headshot_wrapper.append(clickable_person_element.render());
| |
| - | if (person.name[0] !== '_') {
| |
| - | headshot_wrapper.append($('<div class="headshotCaption">{0}</div>'.format(person.name)));
| |
| - | }
| |
| - | root.append(headshot_wrapper);
| |
| - | oncol++;
| |
| - | }
| |
| - | return root;
| |
| - | }
| |
| - |
| |
| - | function createPhotoSlideshow(names_to_urls, delay, img_width) {
| |
| - | var root = $('<div class="slideshow"></div>');
| |
| - | var first = true;
| |
| - | var total_imgs = 0;
| |
| - | var fade_time = delay / 6;
| |
| - | for (var name in names_to_urls) {
| |
| - | if (!names_to_urls.hasOwnProperty(name)) continue;
| |
| - | total_imgs++;
| |
| - | var url = names_to_urls[name];
| |
| - | var img = $('<img class="slideshowImage" style="width: {1}px;" src="{0}" />'.format(url, img_width));
| |
| - | if (first) {
| |
| - | first = false;
| |
| - | } else {
| |
| - | img.addClass('hiddenElement');
| |
| - | img.css('opacity', '0');
| |
| - | }
| |
| - | root.append(img);
| |
| - | }
| |
| - | var img_idx = 0;
| |
| - | setInterval(function() {
| |
| - | var old_img = root.children().eq(img_idx);
| |
| - | old_img.animate({ opacity: 0 }, { duration: fade_time, complete: function() {
| |
| - | old_img.addClass('hiddenElement');
| |
| - | if (++img_idx >= total_imgs) img_idx = 0;
| |
| - | var new_img = root.children().eq(img_idx);
| |
| - | new_img.removeClass('hiddenElement');
| |
| - | new_img.animate({ opacity: 1 }, { duration: fade_time });
| |
| - | }});
| |
| - | }, delay);
| |
| - | return root;
| |
| - | }
| |
| - |
| |
| - | function PersonClickableElement(person, height) {
| |
| - | this.person = person;
| |
| - | this.height = height;
| |
| - | this.popup = null;
| |
| - | this.clickable = person.description;
| |
| - | }
| |
| - | PersonClickableElement.currentPopup = null;
| |
| - | PersonClickableElement.hidePopup = function() {
| |
| - | if (PersonClickableElement.currentPopup) {
| |
| - | PersonClickableElement.currentPopup.detach();
| |
| - | PersonClickableElement.currentPopup = null;
| |
| - | }
| |
| - | };
| |
| - | PersonClickableElement.prototype.showPopup = function(event) {
| |
| - | PersonClickableElement.hidePopup();
| |
| - | event.stopPropagation();
| |
| - |
| |
| - | if (!this.popup) {
| |
| - | var root = $('<div class="personPopup fadeIn"></div>');
| |
| - | var large_img = $('<img class="personPopupImage" src="{0}" style="width: {1}px;"/>'.format(this.person.url, 200));
| |
| - | var info = $('<div class="personPopupInfo"><h2>{0}</h2><p>{1}</p></div>'.format(this.person.name, this.person.description));
| |
| - | root.append(large_img);
| |
| - | root.append(info);
| |
| - | this.popup = root;
| |
| - | this.popup.click(function (e) {
| |
| - | e.stopPropagation();
| |
| - | });
| |
| - | }
| |
| - | var content = $('#content');
| |
| - | this.popup.css('left', content.offset().left + 150);
| |
| - | $(document.body).append(this.popup);
| |
| - | PersonClickableElement.currentPopup = this.popup;
| |
| - | };
| |
| - | PersonClickableElement.prototype.render = function() {
| |
| - | var img = $('<img class="personHeadshot" src="{0}" style="height: {1}px;" title="{2}"/>'.format(this.person.url, this.height, this.person.name));
| |
| - | if (this.clickable) {
| |
| - | img.addClass('personHeadshotClickable');
| |
| - | img.click(this.showPopup.bind(this));
| |
| - | }
| |
| - | return img;
| |
| - | }
| |
| - |
| |
| - | function setupPhotos() {
| |
| - | var paul_reginato = {
| |
| - | name: 'Paul Reginato',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/b/bd/Waterloo_paul.JPG',
| |
| - | description: "My name is Paul Reginato. I lead Waterloo iGEM's mathematical modelling subteam, and I have an organizational/advisory role in the team at large. I designed this year's project, and it's been incredible to see it undertaken by the team. I am currently finishing up a BSc in biology with a joint honours in mathematics. Synthetic biology is my primary interest, along with related science/engineering fields. Outside of iGEM, my main hobbies are playing/listening to music and interior camping."
| |
| - | };
| |
| - | var alex = {
| |
| - | name: 'Alex Klen',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/1/1a/Alex_klen.jpg',
| |
| - | description: "My name is Alex and I am in 3B software engineering. I built the wiki for the Waterloo team. IGEM was my first exposure to the field of synthetic biology and it's been great pleasure learning about the art of recombinant DNA technology. Programming has been my interest for almost a decade and I am glad to contribute to the success of the team."
| |
| - | };
| |
| - |
| |
| - | var admins = [
| |
| - | {
| |
| - | name: 'Peter Hong',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/5/5b/Waterloo_Peter_Hong.jpg',
| |
| - | description: "Hello everyone, I am Chemical Engineering student going into fourth year! I have been part of and have been leading the Waterloo iGEM team as the Director for the past three years. I am enthralled by the enormous potential that Biotechnology and Synthetic Biology has in impacting our future. When I am not running around, meeting with people and trying to keep the team afloat, I like to squander my time playing Sim City 5. Or, go to the 'gym'..."
| |
| - | },
| |
| - | {
| |
| - | name: 'Linda Yang',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/d/d1/Waterloo_Linda_Yang.jpg',
| |
| - | description: "As the Assistant Director of Waterloo iGEM, I oversee the team’s operation by communicating with team members, professors, and others who contribute to our team. I lead team meetings, plan the trips to the jamborees, handle recruitment, handle finances, and ensure that deadlines are met. I also assist with tasks in the Lab and Design and Human Practices subdivisions of the team. I am a third-year student majoring in Biomedical Sciences as well as a candidate for the Psychology minor and Global Experience Certificate."
| |
| - | }
| |
| - | ];
| |
| - |
| |
| - | var team_leaders = [
| |
| - | paul_reginato,
| |
| - | {
| |
| - | name: 'Emily Li',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/b/bd/Waterloo_emily.JPG',
| |
| - | description: "My name is Emily and I'm currently in 4A Biomedical Sciences at University of Waterloo. I am one of leader for lab and design team. During my spare time, I like hanging out with friends and play my musical instruments. I love synthetic biology and it's been an absolute pleasure working with the intelligent, hardworking young scientists around me. You guys are my inspiration!"
| |
| - | },
| |
| - | {
| |
| - | name: 'Aaron Bender',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/5/59/Waterloo_aaron.JPG',
| |
| - | description: "My name is Aaron Bender and I am currently in Biomed 4B. I am part of the Lab team. iGEM gives undergraduates the opportunity to take on their own project as well as make a real contribution to the rapidly growing synthetic biology community. I enjoy Snowboarding and mountain biking."
| |
| - | },
| |
| - | {
| |
| - | name: 'Hina Bandukwala',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/0/0b/Waterloo_hina.JPG',
| |
| - | description: "Hello, My name is Hina Bandukwala and I recently graduated from the University of Waterloo for Honors Biology. I joined iGEM two years ago, because the idea of an undergraduate team taking on synthetic biology hands on was impressive. Synthetic biology is the future of genetic engineering as we know it, and to contribute to an evolving field such as this and be relevant in the world of science is more than what I could ask for. I hope to be a part of academia for a long time in the future and hopefully open up my own biotechnology company one day, iGEM was a great to start."
| |
| - | }
| |
| - | ];
| |
| - |
| |
| - | var rest_of_team = [
| |
| - | {
| |
| - | name: 'Julia Manalil',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/a/ae/Waterloo_julia.JPG',
| |
| - | description: "I am in my 4th year of an Honours Biochemistry Program with a Biotechnology Specialization. When I’m not studying, I spend most of my days slaving away in the lab as part of the Lab and Design Team of UW iGEM."
| |
| - | },
| |
| - | {
| |
| - | name: 'Peivand Sadat Mousavi',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/7/7a/Waterloo_Peivand_2.jpg',
| |
| - | description: "I'm starting 3rd year in Biomedical Sciences at the University of Waterloo. I am interested in synthetic biology and working in microbiology laboratory setting. Being part of iGEM gives me a chance to apply my theoretical knowledge to solve a real world problem and get involved in synthetic biology research environment. Taking scientific challenges has always been one of my personal academic goals and working with iGEM provides me with this privilege. I would like to work in a healthcare environment in my future career and continuing research in this field."
| |
| - | },
| |
| - | {
| |
| - | name: 'Urooj Kishor',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/0/04/Waterloo_Urooj_2.jpg',
| |
| - | description: "I am a third year Biology student who is working towards constructing BXB1 switch and integrase related constructs and testing them. Besides working in the lab I also design the team wiki in collaboration with our website developer and I like helping the Human Practices group as a videographer. I enjoy learning about synthetic biology with our enthusiastic Waterloo team. Outside of working I enjoy learning new languages and cultures."
| |
| - | },
| |
| - | {
| |
| - | name: 'Jama Hagi-Yusuf',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/a/a1/Waterloo_jama.jpg',
| |
| - | description: "Hello World, I'm Jama. I'm on the lab and design team; specifically, I work with the switches and integrases in the lab. As a biology student, working in the lab is a great experience, because it is an application of what I'm learning in my classes! On my spare time, I watch TV and movies, read books and occasionally play basketball or volleyball."
| |
| - | },
| |
| - | {
| |
| - | name: 'Chris Morcos',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/6/65/Waterloo_chris.JPG',
| |
| - | description: "Hi, my name is Chris Morcos and am finishing up with my Biology BSc. I helped build several of the constructs involved within BXB1 group. I enjoy iGEM team because it allows me to explore biological systems and their functions within a consortium. Outside of working as a lab and design team member I enjoy playing and watching soccer."
| |
| - | },
| |
| - | {
| |
| - | name: 'Steven ten Holder',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/4/4f/Waterloo_steven.JPG',
| |
| - | description: "My role in the iGEM team was to assist Hina Bandukwala, one of the project leads, assemble the Phi C31 Integrase Switch along with Rumi Akthar. My program is a specialization within biology called Molecular Biology and Biotechnology, Coop. Aside from the enthusiasm for synthetic biology I share with every member of the iGEM team, I'm also interested in skateboarding, piano, and philosophy."
| |
| - | },
| |
| - | {
| |
| - | name: 'Rummy Chowdhury',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/0/07/Waterloo_rummy.JPG',
| |
| - | description: "iGEM Lab and Design Team Project Sub-leader - Honors Biomedical Science. iGEM has been one of the most rewarding experiences I’ve had. Not only has it played a major role in defining my carrier path, but it has also given me the chance to learn and expand my knowledge and meet incredible science junkies like myself."
| |
| - | },
| |
| - | ];
| |
| - |
| |
| - | var math_team = [
| |
| - | {
| |
| - | name: 'Drew Neish',
| |
| - | url: 'https://static.igem.org/mediawiki/igem.org/2/21/Waterloo_Drew_Neish.png',
| |
| - | description: "I'm in 4B Statistics minoring in biology and this is my first season as a part of iGEM. I assist in mathematical model formulation, present ideas, and research relevant papers."
| |
| - | },
| |
| - | {
| |
| - | name: 'James Hawley',
| |
| - | url: 'https://static.igem.org/mediawiki/igem.org/1/10/Waterloo_James_Hawley.jpg',
| |
| - | description: "My role on the team is to aid in the development of a model of the packaging process of the M13 bacteriophage, and provide background on the morphogenetic genes involved with this process. My interesting fact is that I have black belt in karate."
| |
| - | },
| |
| - | {
| |
| - | name: 'Matt Smart',
| |
| - | url: 'https://static.igem.org/mediawiki/igem.org/5/54/Waterloo_Matt_Smart.jpg',
| |
| - | description: "I'm in the Viral Packaging group. We're trying to develop a mathematical model of M13 assembly inside bacteria. "
| |
| - | },
| |
| - | paul_reginato,
| |
| - | {
| |
| - | name: 'Seyed Ali Madani Tonekaboni',
| |
| - | url: 'https://static.igem.org/mediawiki/igem.org/e/eb/Waterloo_Seyed_Ali_Madani_Tonekaboni.jpg',
| |
| - | description: "My name is Seyed Ali Madani Tonekaboni. As a master student in the modelling group of UW iGEM team, I help the switch model team in modeling, numerical analysis and coding and stochastic analysis to do the work faster and object-oriented. In addition, I work on robustness analysis of the stochastic results to obtain appropriate values of the parameters of the model based on the fact that the natural systems try to be robust."
| |
| - | },
| |
| - | {
| |
| - | name: 'Vedang Vyas',
| |
| - | url: 'https://static.igem.org/mediawiki/igem.org/2/2b/Waterloo_Vedang_Vyas.jpg',
| |
| - | description: "Currently, we are trying to test various designs of genetic switches and as a starting step, we have used a model from the Endy lab as a template. I use Matlab and Maple to test and control the amount of leak resulting from possible theoretical designs. I apply my knowledge of differential equations to modelling the switch, and have learned plenty of numerical tools of analysis in the process. I have committed an unforgivable blasphemous sin as a Toronto Maple Leafs fan, as my 2nd and 3rd favourite team are the Boston Bruins and Montreal Canadiens, respectively. In short, I love hockey."
| |
| - | },
| |
| - | ];
| |
| - | var hp_team = [
| |
| - | {
| |
| - | name: 'Anjali Arya',
| |
| - | url: 'https://static.igem.org/mediawiki/igem.org/b/b6/Anjali_Arya.jpg',
| |
| - | description: "4B biomedical sciences and minor in management studies. UWaterloo iGEM Human Practices/Outreach Team Lead. As the Human Practices and Outreach Team Lead my job is to ensure that my team and I are introducing science enthusiasts, students of various age groups and educational backgrounds as well as the public to the idea of synthetic biology through various innovative ways. We are bridging together the idea of science and business, showing our viewers the potential and benefits of synthetic biology along with connecting them with industry experts."
| |
| - | },
| |
| - | {
| |
| - | name: 'Daniel Zhang',
| |
| - | url: 'https://static.igem.org/mediawiki/igem.org/a/a2/Waterloo_Daniel_Zhang.jpg',
| |
| - | description: "Daniel is one of the business hustlers of Human Practices within iGEM. He tends to tie together loose ends on various projects throughout the term, touching on aspects of professor outreach, video logistics, and the occasional social media post, but usually just adding ideas as he sees fit."
| |
| - | },
| |
| - | {
| |
| - | name: 'Lucy Hu',
| |
| - | url: 'https://static.igem.org/mediawiki/igem.org/9/9f/Waterloo_Lucy_Hu.jpeg',
| |
| - | description: "HP Team Social Media Co-Leader. As a social media co-leader on the human practices team, we are responsible for creating awareness in the university about what iGEM and synthetic biology is. This includes updating Facebook and twitter with the latest synthetic biology news and running a blog updating everyone with all the news and events ran by the Human Practices team."
| |
| - | },
| |
| - | {
| |
| - | name: 'Suzie Alexander',
| |
| - | url: 'https://static.igem.org/mediawiki/igem.org/c/c3/Waterloo_Suzie_Alexander.jpg',
| |
| - | description: "Suzie Alexander. Biomedical Science, 3rd year. I enjoy staying active and exploring new foods! I also enjoy reading about new papers and research; so when I heard about iGEM Waterloo on my campus, I knew this was a team I wanted to join! The community of passionate people within iGEM is what drew me to join the team. I work within the Human Practices and Outreach team organizing events and managing social media in order to engage more people about synthetic biology. I hope the team's work will inspire more leaders to take part and contribute to the advances in synthetic biology, regardless of their academic or professional background."
| |
| - | },
| |
| - | {
| |
| - | name: 'Mudit Kalia',
| |
| - | url: 'https://static.igem.org/mediawiki/igem.org/2/22/Waterloo_Mudit_Kalia.jpg',
| |
| - | description: "My job is to promote the iGEM team as well as showcase what synthetic biology is and how it can apply to any field of work. SynBio has come a long way from where it started and it has great potential to change the world we live in today. My interest in this field is what compelled me to join this club and I have learned much more about it throughout my time spent at iGEM. I am currently in my 4A term in Life Sciences with a major in Biology and a minor in Human Nutrition."
| |
| - | },
| |
| - | ];
| |
| - |
| |
| - | var advisors = [
| |
| - | {
| |
| - | name: 'Trevor Charles',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/7/74/Trevor_Charles.jpg',
| |
| - | description: ""
| |
| - | },
| |
| - | {
| |
| - | name: 'Brian Ingalls',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/b/be/Brian_Ingalls.jpg',
| |
| - | description: ""
| |
| - | },
| |
| - | {
| |
| - | name: 'Marc Aucoin',
| |
| - | url: 'https://static.igem.org/mediawiki/2013/b/ba/Marc_Aucoin.jpg',
| |
| - | description: ""
| |
| - | },
| |
| - | {
| |
| - | name: 'Andrew Doxey',
| |
| - | url: 'https://static.igem.org/mediawiki/igem.org/f/f5/Waterloo_Andrew_Doxey.jpg',
| |
| - | description: ""
| |
| - | },
| |
| - | {
| |
| - | name: 'Barbara Moffatt',
| |
| - | url: 'https://static.igem.org/mediawiki/igem.org/e/e3/Barbara_Moffatt.jpg',
| |
| - | description: ""
| |
| - | },
| |
| - | ];
| |
| - | var grad_students = [
| |
| - | {
| |
| - | name: 'John Heil',
| |
| - | url: 'https://static.igem.org/mediawiki/igem.org/6/62/Waterloo_John_Heil.jpg',
| |
| - | description: ""
| |
| - | },
| |
| - | {
| |
| - | name: 'Maya D\'Alessio',
| |
| - | url: 'https://static.igem.org/mediawiki/igem.org/0/0c/Waterloo_Maya_D%27Alessio.jpg',
| |
| - | description: ""
| |
| - | },
| |
| - | ];
| |
| - |
| |
| - | $('#administratorPhotos').append(createPersonPhotoGrid(admins, 4, 150));
| |
| - |
| |
| - | $('#teamLeaders').append(createPersonPhotoGrid(team_leaders, 4, 150));
| |
| - | $('#team').append(createPersonPhotoGrid(rest_of_team, 4, 150));
| |
| - |
| |
| - | $('#mathModellingTeamPhotos').append(createPersonPhotoGrid(math_team, 4, 150));
| |
| - | $('#humanPracticesTeamPhotos').append(createPersonPhotoGrid(hp_team, 5, 150));
| |
| - |
| |
| - | $('#advisorPhotos').append(createPersonPhotoGrid(advisors, 5, 150));
| |
| - | $('#gradStudentPhotos').append(createPersonPhotoGrid(grad_students, 2, 150));
| |
| - |
| |
| - | $('#webDevPhotos').append(createPersonPhotoGrid([alex], 2, 150));
| |
| - |
| |
| - | var lab_photos =
| |
| - | {
| |
| - | _0: 'https://static.igem.org/mediawiki/igem.org/4/4c/Waterloo_lab-0.jpg',
| |
| - | _1: 'https://static.igem.org/mediawiki/igem.org/9/99/Waterloo_lab-1.jpg',
| |
| - | _2: 'https://static.igem.org/mediawiki/igem.org/4/4f/Waterloo_lab-2.jpg',
| |
| - | _3: 'https://static.igem.org/mediawiki/igem.org/5/57/Waterloo_lab-3.jpg',
| |
| - | _4: 'https://static.igem.org/mediawiki/igem.org/2/23/Waterloo_lab-4.jpg',
| |
| - | _5: 'https://static.igem.org/mediawiki/igem.org/8/87/Waterloo_lab-5.jpg',
| |
| - | _6: 'https://static.igem.org/mediawiki/igem.org/4/46/Waterloo_lab-6.jpg',
| |
| - | _8: 'https://static.igem.org/mediawiki/igem.org/c/cc/Waterloo_lab-8.jpg',
| |
| - | _9: 'https://static.igem.org/mediawiki/igem.org/a/a7/Waterloo_lab-9.jpg',
| |
| - | _10: 'https://static.igem.org/mediawiki/igem.org/0/0c/Waterloo_lab-10.jpg',
| |
| - | _11: 'https://static.igem.org/mediawiki/igem.org/7/7c/Waterloo_lab-11.jpg',
| |
| - | _12: 'https://static.igem.org/mediawiki/igem.org/5/5b/Waterloo_lab-12.jpg',
| |
| - | _13: 'https://static.igem.org/mediawiki/igem.org/5/55/Waterloo_lab-13.jpg',
| |
| - | _14: 'https://static.igem.org/mediawiki/igem.org/c/ce/Waterloo_lab-14.jpg',
| |
| - | _15: 'https://static.igem.org/mediawiki/igem.org/0/0e/Waterloo_lab-15.jpg'
| |
| - | };
| |
| - | $('#labPhotos').append(createPhotoSlideshow(lab_photos, 3000, 650));
| |
| - |
| |
| - | var iti_photos =
| |
| - | {
| |
| - | _0: 'https://static.igem.org/mediawiki/igem.org/e/ec/DSC03597.JPG',
| |
| - | _1: 'https://static.igem.org/mediawiki/igem.org/9/97/DSC03604.JPG',
| |
| - | _2: 'https://static.igem.org/mediawiki/igem.org/9/9c/DSC03607.JPG',
| |
| - | _3: 'https://static.igem.org/mediawiki/igem.org/f/fb/DSC03610.jpg',
| |
| - | _4: 'https://static.igem.org/mediawiki/igem.org/5/59/DSC03617.jpg',
| |
| - | _5: 'https://static.igem.org/mediawiki/igem.org/f/f7/DSC03618.jpg',
| |
| - | _6: 'https://static.igem.org/mediawiki/igem.org/f/ff/DSC03632.jpg',
| |
| - | _7: 'https://static.igem.org/mediawiki/igem.org/b/b7/DSC03641.JPG',
| |
| - | _8: 'https://static.igem.org/mediawiki/igem.org/e/ed/DSC03644.jpg',
| |
| - | _9: 'https://static.igem.org/mediawiki/igem.org/7/70/DSC03653.JPG',
| |
| - | _10: 'https://static.igem.org/mediawiki/igem.org/d/dc/DSC03657.jpg',
| |
| - | _11: 'https://static.igem.org/mediawiki/igem.org/1/1e/DSC03668.jpg',
| |
| - | _12: 'https://static.igem.org/mediawiki/igem.org/c/c5/DSC03670.jpg',
| |
| - | _13: 'https://static.igem.org/mediawiki/igem.org/7/70/DSC03700.JPG',
| |
| - | _14: 'https://static.igem.org/mediawiki/igem.org/f/f5/DSC03711.JPG',
| |
| - | _15: 'https://static.igem.org/mediawiki/igem.org/d/db/DSC03713.JPG',
| |
| - | _16: 'https://static.igem.org/mediawiki/igem.org/1/1d/DSC_1377.JPG',
| |
| - | _17: 'https://static.igem.org/mediawiki/igem.org/1/1d/DSC_1385.jpg',
| |
| - | _18: 'https://static.igem.org/mediawiki/igem.org/2/26/DSC_1390.JPG',
| |
| - | _19: 'https://static.igem.org/mediawiki/igem.org/6/66/DSC_1394.JPG',
| |
| - | _20: 'https://static.igem.org/mediawiki/igem.org/0/0a/DSC_1399.JPG',
| |
| - | _21: 'https://static.igem.org/mediawiki/igem.org/7/70/DSC_1403.JPG',
| |
| - | _22: 'https://static.igem.org/mediawiki/igem.org/1/15/DSC_1404.jpg',
| |
| - | _23: 'https://static.igem.org/mediawiki/igem.org/c/c9/DSC_1407.JPG',
| |
| - | _24: 'https://static.igem.org/mediawiki/igem.org/1/16/DSC_1408.JPG',
| |
| - | _25: 'https://static.igem.org/mediawiki/igem.org/d/da/DSC_1410.JPG',
| |
| - | _26: 'https://static.igem.org/mediawiki/igem.org/2/2c/DSC_1412.jpg',
| |
| - | _27: 'https://static.igem.org/mediawiki/igem.org/a/ae/DSC_1413.jpg',
| |
| - | _28: 'https://static.igem.org/mediawiki/igem.org/e/e4/DSC_1414.JPG',
| |
| - | _29: 'https://static.igem.org/mediawiki/igem.org/b/ba/DSC_1415.jpg',
| |
| - | _30: 'https://static.igem.org/mediawiki/igem.org/8/81/DSC_1418.jpg',
| |
| - | _31: 'https://static.igem.org/mediawiki/igem.org/7/70/DSC_1419.JPG',
| |
| - | _32: 'https://static.igem.org/mediawiki/igem.org/c/ca/DSC_1425.JPG',
| |
| - | _33: 'https://static.igem.org/mediawiki/igem.org/4/42/DSC_1429.JPG',
| |
| - | _34: 'https://static.igem.org/mediawiki/igem.org/7/73/DSC_1436.JPG',
| |
| - | _35: 'https://static.igem.org/mediawiki/igem.org/c/cc/DSC_1437.JPG',
| |
| - | _36: 'https://static.igem.org/mediawiki/igem.org/6/65/DSC_1439.JPG',
| |
| - | _37: 'https://static.igem.org/mediawiki/igem.org/d/d4/DSC_1442.jpg',
| |
| - | _38: 'https://static.igem.org/mediawiki/igem.org/5/5f/DSC_1443.JPG',
| |
| - | _39: 'https://static.igem.org/mediawiki/igem.org/f/f4/DSC_1448.JPG',
| |
| - | _40: 'https://static.igem.org/mediawiki/igem.org/c/c7/DSC_1449.JPG',
| |
| - | _41: 'https://static.igem.org/mediawiki/igem.org/b/b4/DSC_1450.jpg',
| |
| - | _42: 'https://static.igem.org/mediawiki/igem.org/9/9a/DSC_1451.JPG',
| |
| - | _43: 'https://static.igem.org/mediawiki/igem.org/c/c3/DSC_1455.jpg',
| |
| - | _44: 'https://static.igem.org/mediawiki/igem.org/2/2d/DSC_1456.JPG',
| |
| - | _45: 'https://static.igem.org/mediawiki/igem.org/4/44/DSC_1457.JPG',
| |
| - | _46: 'https://static.igem.org/mediawiki/igem.org/9/99/DSC_1458.JPG',
| |
| - | _47: 'https://static.igem.org/mediawiki/igem.org/f/f4/DSC_1460.JPG',
| |
| - | _48: 'https://static.igem.org/mediawiki/igem.org/3/3f/DSC_1462.JPG',
| |
| - | _49: 'https://static.igem.org/mediawiki/igem.org/0/0e/DSC_1469.jpg',
| |
| - | _50: 'https://static.igem.org/mediawiki/igem.org/f/f8/DSC_1475.JPG',
| |
| - | _51: 'https://static.igem.org/mediawiki/igem.org/b/be/DSC_1479.JPG',
| |
| - | _52: 'https://static.igem.org/mediawiki/igem.org/7/7c/DSC_1481.JPG',
| |
| - | _53: 'https://static.igem.org/mediawiki/igem.org/a/a8/DSC_1482.JPG',
| |
| - | _54: 'https://static.igem.org/mediawiki/igem.org/c/cb/DSC_1486.JPG',
| |
| - | _55: 'https://static.igem.org/mediawiki/igem.org/5/55/DSC_1510.JPG',
| |
| - | _56: 'https://static.igem.org/mediawiki/igem.org/d/da/DSC_1513.JPG',
| |
| - | _57: 'https://static.igem.org/mediawiki/igem.org/b/b8/DSC_1515.JPG',
| |
| - | _58: 'https://static.igem.org/mediawiki/igem.org/2/22/DSC_1517.JPG',
| |
| - | _59: 'https://static.igem.org/mediawiki/igem.org/f/fd/DSC_1520.JPG',
| |
| - | _60: 'https://static.igem.org/mediawiki/igem.org/0/0a/DSC_1523.JPG',
| |
| - | _61: 'https://static.igem.org/mediawiki/igem.org/4/4f/DSC_1524.JPG'
| |
| - | };
| |
| - |
| |
| - | $('#intentToInventPhotos').append(createPhotoSlideshow(iti_photos, 3000, 650));
| |
| - |
| |
| - | }
| |
| - |
| |
| - | var canonicalizeNewlines = function(str) {
| |
| - | return str.replace(/(\r\n|\r|\n)/g, '\n');
| |
| - | };
| |
| - |
| |
| - | /**
| |
| - | * Renders raw notebook text into lists on the #notebook element.
| |
| - | * Returns notebook sublinks that should be rendered in the navbar.
| |
| - | */
| |
| - | function createNotebook(raw) {
| |
| - | var sublinks = [];
| |
| - | var notebook_elem = $('#notebook');
| |
| - | var current_list = null;
| |
| - | var current_month = null;
| |
| - |
| |
| - | var lines = canonicalizeNewlines(raw).split('\n');
| |
| - | for (var i = 0; i < lines.length; i++) {
| |
| - | var line = lines[i].trim();
| |
| - | if (line == '') continue;
| |
| - | var maybe_month_lower = line.substring(0, line.indexOf(' ')).toLowerCase();
| |
| - | var maybe_month = MONTHS[maybe_month_lower];
| |
| - | if (maybe_month) {
| |
| - | if (current_month != maybe_month) {
| |
| - | current_month = maybe_month;
| |
| - | sublinks.push(new Link('#/Notebook/' + current_month, current_month));
| |
| - | notebook_elem.append($('<h2 id="{0}">{1}</h2>'.format('s_Notebook_' + current_month, current_month)));
| |
| - | current_list = $('<ul></ul>');
| |
| - | notebook_elem.append(current_list);
| |
| - | }
| |
| - | if (!current_list) {
| |
| - | current_list = $('<ul></ul>');
| |
| - | notebook_elem.append(current_list);
| |
| - | }
| |
| - | current_list.append($('<li>{0}</li>'.format(line)));
| |
| - | }
| |
| - | }
| |
| - | return sublinks;
| |
| - | }
| |
| - |
| |
| - | /*
| |
| - | function setupArt(win_width, win_height) {
| |
| - | var art = $('.sideArt');
| |
| - | var content = $('#content');
| |
| - | var navbar_element = $('.navBar');
| |
| - |
| |
| - | var img_width = 303;
| |
| - | var img_height = 815;
| |
| - |
| |
| - | var required_width = content.width() + img_width * 2;
| |
| - | var required_height = img_height; // + navbar_element.offset().top;
| |
| - |
| |
| - | if (win_width >= required_width) {
| |
| - | if (win_height > required_height) {
| |
| - | art.css('visibility', 'visible');
| |
| - | art.css('left', content.width() + (win_width - content.width() - img_width * 2) / 4);
| |
| - | //art.css('top', navbar_element.height() + (win_height - navbar_element.offset().top - navbar_element.height() - img_height) / 2);
| |
| - | //art.css('top', (win_height - navbar_element.offset().top - img_height) / 2);
| |
| - | art.css('top', (win_height - img_height) / 2 - navbar_element.offset().top);
| |
| - | return;
| |
| - | }
| |
| - | }
| |
| - | art.css('visibility', 'hidden');
| |
| - | }
| |
| - | */
| |
| - |
| |
| - | //$.fx.interval = 40;
| |
| - | $.easing.easeOutCubic = function(x, t, b, c, d) {
| |
| - | return c*((t=t/d-1)*t*t + 1) + b;
| |
| - | };
| |
| - | function trans(idx, complete) {
| |
| - | var new_left = - idx * PAGE_WIDTH;
| |
| - | for (var layer = 0; layer < NUM_LAYERS; layer++) {
| |
| - | var new_left_layer = new_left * layer_factors[layer] + LAYER_OFFSET;
| |
| - |
| |
| - | /*
| |
| - | // Remove animation from team page
| |
| - | if (idx == 8 || page_idx == 8) {
| |
| - | $('#layer' + layer).css('left', new_left_layer + 'px');
| |
| - | if (complete) complete();
| |
| - | continue;
| |
| - | }
| |
| - | */
| |
| - |
| |
| - | var hide_scrolling_images = false;
| |
| - |
| |
| - | if (!is_scrolling) {
| |
| - | is_scrolling = true;
| |
| - | if (hide_scrolling_images) {
| |
| - | $('#pageContainer').addClass('pageScrolling');
| |
| - | }
| |
| - | }
| |
| - | $('#layer' + layer).stop().animate(
| |
| - | {
| |
| - | left: new_left_layer
| |
| - | },
| |
| - | {
| |
| - | 'duration': 1000,
| |
| - | 'easing': 'easeOutCubic',
| |
| - | 'queue': false,
| |
| - | 'complete': function() {
| |
| - | if (is_scrolling) {
| |
| - | is_scrolling = false;
| |
| - | if (hide_scrolling_images) {
| |
| - | $('#pageContainer').removeClass('pageScrolling');
| |
| - | }
| |
| - | }
| |
| - | complete();
| |
| - | }
| |
| - | }
| |
| - | );
| |
| - | }
| |
| - | page_idx = idx;
| |
| - | }
| |
| - | function setHash(hash) {
| |
| - | window.location.hash = hash;
| |
| - | }
| |
| - | function getHash() {
| |
| - | return window.location.hash;
| |
| - | }
| |
| - | function checkHash() {
| |
| - | var hash = getHash();
| |
| - | var hash_main = hash;
| |
| - | var hash_secondary = null
| |
| - | var hash_segments = hash.split('/');
| |
| - | if (hash_segments.length > 2) {
| |
| - | hash_main = hash_segments[0] + '/' + hash_segments[1];
| |
| - | hash_secondary = hash_segments.slice(2).join('/');
| |
| - | }
| |
| - | var idx = page_idx_map[hash_main];
| |
| - | if (idx == undefined) {
| |
| - | setHash(pages[ 0 ]); // Do not remove spaces - mediaWiki will choke on it
| |
| - | return;
| |
| - | }
| |
| - |
| |
| - | // Could do scroll here, but it seems to wait for too long - should do immediately if not transitioning between pages
| |
| - | var complete_f = function() {
| |
| - | };
| |
| - |
| |
| - | // Animate page movement
| |
| - | trans(idx, complete_f);
| |
| - | // Open correct Nav Bar section
| |
| - | if (navBar) navBar.sectionSelected(idx - 1); // TODO fix hack
| |
| - |
| |
| - | // Special logo swapping for homepage
| |
| - | var logo = $('#p-logo')
| |
| - | if (idx === 0) {
| |
| - | logo.addClass('logoHomepage');
| |
| - | } else {
| |
| - | logo.removeClass('logoHomepage');
| |
| - | }
| |
| - |
| |
| - | // Reset scrolling position
| |
| - | var page = $('#p' + idx);
| |
| - | if (page) {
| |
| - | var scroll_started = false;
| |
| - | if (hash_secondary) {
| |
| - | var scroll_to_id = '#s_' + hash_segments[1] + '_' + hash_secondary.replace('/', '_');
| |
| - | var scroll_to_element = $(scroll_to_id);
| |
| - | if (scroll_to_element.length == 1) {
| |
| - | var scroll_current = page.scrollTop();
| |
| - | var scroll_dest_minus_current = scroll_to_element.position().top;
| |
| - | var scroll_dest = scroll_dest_minus_current + scroll_current;
| |
| - |
| |
| - | //page.scrollTop(scroll_dest);
| |
| - | page.animate({scrollTop: scroll_dest},
| |
| - | {
| |
| - | 'duration': 400,
| |
| - | 'queue': false
| |
| - | }
| |
| - | );
| |
| - | scroll_started = true;
| |
| - | }
| |
| - | }
| |
| - | if (!scroll_started) {
| |
| - | page.animate({scrollTop: 0},
| |
| - | {
| |
| - | 'duration': 400,
| |
| - | 'queue': false
| |
| - | }
| |
| - | );
| |
| - | scroll_started = true;
| |
| - | }
| |
| - | }
| |
| - | }
| |
| - | function windowResize() {
| |
| - | var width = $(window).width();
| |
| - | var height = $(window).height();
| |
| - |
| |
| - | var navbar_element = $('.navBar');
| |
| - | var distance_from_bottom = 50;
| |
| - | var page_height = height - navbar_element.offset().top - navbar_element.height() - distance_from_bottom;
| |
| - | //console.log('resize to ', page_height);
| |
| - | $('.page').each(function (i, page) {
| |
| - | $(page).height(page_height);
| |
| - | });
| |
| - | $('#pageContainer').height(page_height + 100);
| |
| - |
| |
| - | //setupArt(width, height);
| |
| - | }
| |
| - |
| |
| - |
| |
| - | function setupShowMores() {
| |
| - | $('.showmorelink').each(function (i, link) {
| |
| - | var link_elem = $(link);
| |
| - | var showmore_name = link_elem.attr('showid');
| |
| - | var show_label = link_elem.text();
| |
| - | var hide_label = link_elem.attr('hidetext');
| |
| - | var showmore = $('#' + showmore_name);
| |
| - | if (!showmore) return;
| |
| - |
| |
| - | $(link).click(function(e) {
| |
| - | e.stopPropagation();
| |
| - | if (showmore.css('display') == 'none') {
| |
| - | showmore.css('display', 'block');
| |
| - | if (hide_label) {
| |
| - | link_elem.text(hide_label);
| |
| - | }
| |
| - | } else {
| |
| - | showmore.css('display', 'none');
| |
| - | link_elem.text(show_label);
| |
| - | }
| |
| - | });
| |
| - | });
| |
| - | }
| |
| - |
| |
| - |
| |
| - | $(window).bind('hashchange', function(e) {
| |
| - | checkHash();
| |
| - | });
| |
| - | $(window).resize(windowResize);
| |
| - | $(document).ready(function() {
| |
| - | windowResize();
| |
| - |
| |
| - | // Hide all white if not preview
| |
| - | if ($('#wikiPreview').length === 0) {
| |
| - | $('#content').css('background-color', 'black');
| |
| - | }
| |
| - |
| |
| - | // Setup reverse map
| |
| - | for (var i = 0; i < NUM_PAGES; i++) {
| |
| - | page_idx_map[pages[i]] = i;
| |
| - | }
| |
| - |
| |
| - | // Injecting new logo into header
| |
| - | var logo = $('#p-logo')
| |
| - | if (logo) {
| |
| - | var igem_logo_img = $('<img src="{0}"/>'.format(igem_logo_url));
| |
| - | var waterloo_logo_img = $('<img src="{0}"/>'.format(waterloo_logo_url));
| |
| - | igem_logo_img.css('height', '150px');
| |
| - | waterloo_logo_img.css('height', '150px');
| |
| - | var waterloo_logo = $('<a class="waterlooLogo" href="#/Home">');
| |
| - | var igem_logo = $('<a class="igemLogo" href="https://static.igem.org/mediawiki/2013/7/71/Waterloo_igem_logo.png">');
| |
| - | igem_logo.append(igem_logo_img);
| |
| - | waterloo_logo.append(waterloo_logo_img);
| |
| - | logo.empty()
| |
| - | logo.append(igem_logo);
| |
| - | logo.append(waterloo_logo);
| |
| - | }
| |
| - |
| |
| - | // Fetch notebook data and create section
| |
| - | var notebook_url = 'https://static.igem.org/mediawiki/2013/d/dc/Waterloo_notebook.txt';
| |
| - | $.ajax({
| |
| - | url: notebook_url,
| |
| - | type: 'GET',
| |
| - | success: function(data) {
| |
| - | var notebook_sublinks = createNotebook(data);
| |
| - | createNavBar(notebook_sublinks, true);
| |
| - | checkHash();
| |
| - | },
| |
| - | error: function() {
| |
| - | // On failure create the navbar anyway.
| |
| - | createNavBar([], false);
| |
| - | checkHash();
| |
| - | }
| |
| - | });
| |
| - |
| |
| - | setupPhotos();
| |
| - | setupShowMores();
| |
| - | });
| |
| - | $(document).keydown(function(e) {
| |
| - | switch (e.which) {
| |
| - | case 37: // Left
| |
| - | if (page_idx == 0) {
| |
| - | setHash(pages[NUM_PAGES - 1]);
| |
| - | } else {
| |
| - | setHash(pages[page_idx - 1]);
| |
| - | }
| |
| - | break;
| |
| - | case 39: // Right
| |
| - | if (page_idx == NUM_PAGES - 1) {
| |
| - | setHash(pages[ 0 ]); // Do not remove spaces - mediaWiki will choke on it
| |
| - | } else {
| |
| - | setHash(pages[page_idx + 1]);
| |
| - | }
| |
| - | break;
| |
| - | }
| |
| - | });
| |
| - | $(document).click(function(e) {
| |
| - | PersonClickableElement.hidePopup();
| |
| - | });
| |
| - | })();
| |
| - |
| |
| - | </script>
| |
| | </head> | | </head> |
| | | | |
"