Team:CU-Boulder/Test2
From 2014.igem.org
(Difference between revisions)
Jimmynovik (Talk | contribs) |
Jimmynovik (Talk | contribs) |
||
Line 9: | Line 9: | ||
<!--[if lte IE 8]><script src="css/ie/html5shiv.js"></script><![endif]--> | <!--[if lte IE 8]><script src="css/ie/html5shiv.js"></script><![endif]--> | ||
<script src="http://code.jquery.com/jquery-latest.js"></script> | <script src="http://code.jquery.com/jquery-latest.js"></script> | ||
- | <script> | + | <script type="text/javascript"> |
- | + | function get_cookie(name) { | |
- | + | var nameEQ = name + "="; | |
- | + | ||
- | + | var ca = document.cookie.split(';'); | |
- | + | ||
- | + | for(var i=0;i < ca.length;i++) { | |
+ | var c = ca[i]; | ||
+ | while (c.charAt(0)==' ') c = c.substring(1,c.length); | ||
+ | if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); | ||
+ | } | ||
+ | |||
+ | return null; | ||
+ | } | ||
+ | |||
+ | function set_cookie(name, value, days) { | ||
+ | var expires = ""; | ||
+ | if (days) { | ||
+ | var date = new Date(); | ||
+ | date.setTime(date.getTime()+(days*24*60*60*1000)); | ||
+ | expires = "; expires="+date.toGMTString(); | ||
+ | } | ||
+ | |||
+ | document.cookie = name+"="+value+expires+"; path=/"; | ||
+ | } | ||
+ | |||
+ | function autodetect_language() { | ||
+ | var languages = ["de", "es", "fr", "it", "ru", "jp"]; | ||
+ | var language = get_cookie("sitelang"); | ||
+ | |||
+ | if (language != null && language != "") { | ||
+ | if ((languages.indexOf(language) > -1) && (language != $('html').attr('lang'))) { | ||
+ | window.location = "/" + language; | ||
+ | } | ||
+ | } else { | ||
+ | var browser_language = navigator.language ? navigator.language : navigator.userLanguage; | ||
+ | |||
+ | browser_language = browser_language.substr(0, 2); | ||
+ | |||
+ | if (languages.indexOf(browser_language) > -1) { | ||
+ | set_cookie("sitelang", browser_language, 90); | ||
+ | window.location = "/" + browser_language; | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | |||
+ | var isMobile = { | ||
+ | Android: function() { return navigator.userAgent.match(/Android/i); }, | ||
+ | BlackBerry: function() { return navigator.userAgent.match(/BlackBerry/i); }, | ||
+ | iOS: function() { return navigator.userAgent.match(/iPhone|iPad|iPod/i); }, | ||
+ | Opera: function() { return navigator.userAgent.match(/Opera Mini/i); }, | ||
+ | Windows: function() { return navigator.userAgent.match(/IEMobile/i); }, | ||
+ | any: function() { return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows()); } | ||
+ | }; | ||
+ | |||
+ | |||
+ | $(document).ready(function () { | ||
+ | |||
+ | // check browser language and redirect if necessary | ||
+ | autodetect_language(); | ||
+ | |||
+ | // bind events | ||
+ | $('.flag').click(function(){ | ||
+ | var this_class = $(this).attr('class').split(" "); | ||
+ | set_cookie('sitelang', this_class[1], 90); // Quick hack: second class (this_class[1]) is language | ||
+ | }); | ||
+ | |||
+ | if (!isMobile.any()) { | ||
+ | $(".playvideo a").click(function(e) { | ||
+ | e.preventDefault(); | ||
+ | |||
+ | var movie_url = $(this).attr("href").split("="); | ||
+ | var movie_id = movie_url[1]; | ||
+ | |||
+ | $("#videocontainer").fadeIn(500, function() { | ||
+ | $("#videocontainer").html('<iframe width="853" height="480" src="http://www.youtube.com/embed/' + movie_id + '?rel=0&vq=hd1080&hd=1&autoplay=1" frameborder="0" allowfullscreen></iframe>'); | ||
+ | }); | ||
+ | }); | ||
+ | } | ||
+ | |||
+ | $("#videocontainer").click(function() { | ||
+ | $("#videocontainer").fadeOut(500); | ||
+ | $("#videocontainer").html(''); | ||
+ | }); | ||
+ | |||
+ | $('.newsletter').click(function(e) { | ||
+ | e.preventDefault(); | ||
+ | window.open('http://preferences.ea.com/newsletter/signup/Mirrors-Edge-franchise?locale=en', 'newsletter', 'width=750,height=600,toolbar=0,menubar=0,location=0,status=0,scrollbars=1,resizable=1,left=0,top=0'); | ||
+ | }); | ||
+ | |||
+ | $('#latest-post a').click(function() { | ||
+ | $('#blog > .content-left > .post-header').first().click(); | ||
+ | }); | ||
+ | |||
+ | if (!isMobile.any()) { | ||
+ | var calculateBlogPostHeights = function() { | ||
+ | // calculate total height | ||
+ | var headersHeight = 0; | ||
+ | var tallestPostHeight = 0; | ||
+ | |||
+ | $('#blog > .content-left > .post-header').each(function(index) { | ||
+ | var $header = $(this); | ||
+ | headersHeight += $header.outerHeight(true); | ||
+ | |||
+ | var $post = $header.next('.post'); | ||
+ | $post.css({ 'height': 'auto' }); | ||
+ | |||
+ | var postHeight = $post.height(); | ||
+ | $post.data('height', postHeight); | ||
+ | |||
+ | var postOuterHeight = $post.outerHeight(true); | ||
+ | if (postOuterHeight > tallestPostHeight) { | ||
+ | tallestPostHeight = postOuterHeight; | ||
+ | } | ||
+ | |||
+ | if ($header.hasClass('accordion-header-active')) { | ||
+ | $post.css({ 'height': postHeight }); | ||
+ | } else { | ||
+ | $post.css({ 'height': 0 }); | ||
+ | } | ||
+ | }); | ||
+ | |||
+ | $('#blog > .content-left').css('height', headersHeight + tallestPostHeight); | ||
+ | }; | ||
+ | |||
+ | $(window).resize(function() { | ||
+ | calculateBlogPostHeights(); | ||
+ | }); | ||
+ | |||
+ | $('#blog > .content-left > .post-header') | ||
+ | .addClass('accordion-header') | ||
+ | .click(function() { | ||
+ | var $this = $(this); | ||
+ | if ($this.hasClass('accordion-header-active')) return; | ||
+ | var $post = $this.next('.post'); | ||
+ | $this.addClass('accordion-header-active'); | ||
+ | $this.siblings('.post-header').removeClass('accordion-header-active'); | ||
+ | $post.animate({ 'height': $post.data('height') }); | ||
+ | $post.siblings('.post').animate({ 'height': 0 }); | ||
+ | }); | ||
+ | |||
+ | // initialize accordion | ||
+ | $('#blog > .content-left > .post-header').addClass('accordion-header').first().addClass('accordion-header-active'); | ||
+ | calculateBlogPostHeights(); | ||
+ | } | ||
+ | |||
+ | }); | ||
+ | |||
+ | </script> | ||
<script src="http://html5up.net/uploads/demos/big-picture/js/skel.min.js"></script> | <script src="http://html5up.net/uploads/demos/big-picture/js/skel.min.js"></script> | ||
<script src="http://html5up.net/uploads/demos/big-picture/js/init.js"></script> | <script src="http://html5up.net/uploads/demos/big-picture/js/init.js"></script> | ||
<script src="http://html5up.net/uploads/demos/big-picture/js/jquery.poptrox.min.js"></script> | <script src="http://html5up.net/uploads/demos/big-picture/js/jquery.poptrox.min.js"></script> | ||
- | + | <style href="css/style2.css"></style> | |
<style> | <style> | ||
@charset 'UTF-8'; | @charset 'UTF-8'; | ||
Line 1,531: | Line 1,673: | ||
</head> | </head> | ||
<body> | <body> | ||
- | + | ||
<!-- Header --> | <!-- Header --> | ||
<header id="header"> | <header id="header"> | ||
Line 1,550: | Line 1,692: | ||
</header> | </header> | ||
- | + | ||
<!-- Intro --> | <!-- Intro --> | ||
<section id="intro" class="main style1 dark fullscreen"> | <section id="intro" class="main style1 dark fullscreen"> | ||
+ | <div id="videocontainer" style="display: none;"> | ||
+ | </div> | ||
<div class="content container small"> | <div class="content container small"> | ||
Revision as of 02:15, 28 June 2014
Big Picture
What I Do
Lorem ipsum dolor sit amet et sapien sed elementum egestas dolore condimentum. Fusce blandit ultrices sapien, in accumsan orci rhoncus eu. Sed sodales venenatis arcu, id varius justo euismod in. Curabitur egestas consectetur magna urna.
Who I Am
Lorem ipsum dolor sit amet et sapien sed elementum egestas dolore condimentum. Fusce blandit ultrices sapien, in accumsan orci rhoncus eu. Sed sodales venenatis arcu, id varius justo euismod in. Curabitur egestas consectetur magna urna.
Say Hello.
Lorem ipsum dolor sit amet et sapien sed elementum egestas dolore condimentum.