|
|
(32 intermediate revisions by the same user not shown) |
Line 1: |
Line 1: |
| <html> | | <html> |
| <head> | | <head> |
| + | <!-- Google fonts --> |
| + | <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300' rel='stylesheet' type='text/css'> |
| + | <link href='https://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css'> |
| + | |
| + | <!-- D3.js--> |
| + | <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script> |
| + | |
| + | <style>body{ min-width: 1200px; }</style> |
| <!-- >>>>> Meta <<<<< --> | | <!-- >>>>> Meta <<<<< --> |
| <meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' /> | | <meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' /> |
| + | |
| + | <!-- Smooth Scroling Reference --> |
| + | <script type='text/javascript' src='https://2017.igem.org/Template:Greece/smooth_scrolling_reference?action=raw&ctype=text/javascript'></script> |
| + | |
| + | <!-- MathJax Library --> |
| + | <script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script> |
| + | |
| + | <!-- Collapsable --> |
| + | <script type='text/javascript' src='https://2017.igem.org/Template:Greece/expanding_boxes_functionality?action=raw&ctype=text/javascript'></script> |
| + | <link href='https://2017.igem.org/Template:Greece/expanding_boxes_stylesheet?action=raw&ctype=text/css' rel='stylesheet'> |
| + | <!-- End of collapsable --> |
| + | |
| + | <!-- Google Fonts --> |
| + | <link href="https://fonts.googleapis.com/css?family=Poiret+One" rel="stylesheet"> |
| | | |
| <!-- Call Jquery --> | | <!-- Call Jquery --> |
| <script type="text/javascript" src="https://2017.igem.org/Template:Greece/latest_jquery?action=raw&ctype=text/javascript"></script> | | <script type="text/javascript" src="https://2017.igem.org/Template:Greece/latest_jquery?action=raw&ctype=text/javascript"></script> |
| + | |
| + | <!-- Risk Map Chart --> |
| + | <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js?action=raw&ctype=text/javascript"></script> |
| + | <script type="text/javascript" src='https://2017.igem.org/Template:Greece/RiskMap_functionality_script?action=raw&ctype=text/javascript'></script> |
| + | <!-- End of Risk Map Chart --> |
| | | |
| <!-- >>>>> General Stylesheets <<<<< --> | | <!-- >>>>> General Stylesheets <<<<< --> |
Line 49: |
Line 76: |
| $('#ct1').goTo(); | | $('#ct1').goTo(); |
| void(document.title = link.toUpperCase()); | | void(document.title = link.toUpperCase()); |
| + | if( window.location.href == 'https://2017.igem.org/Team:Greece/HP_Silver'){ history.replaceState(null, null, 'HP/Silver'); void(document.title = 'HP/SILVER'); } |
| + | if( window.location.href == 'https://2017.igem.org/Team:Greece/HP_Gold_Integrated'){ history.replaceState(null, null, 'HP/Gold_Integrated'); void(document.title = 'HP/GOLD_INTEGRATED'); } |
| }}; | | }}; |
| controllingGeneralStyle(); | | controllingGeneralStyle(); |
Line 54: |
Line 83: |
| }); | | }); |
| </script> | | </script> |
− | <!-- Reference -->
| + | |
− | <script>
| + | |
− | window.scroll({
| + | |
− | top: 2500,
| + | |
− | left: 0,
| + | |
− | behavior: 'smooth'
| + | |
− | });
| + | |
− | $("a.reference").click(function(){
| + | |
− | var status_id = $(this).attr('href');
| + | |
− | console.log(status_id);
| + | |
− | $(status_id).goTo();
| + | |
− | return false;
| + | |
− | });
| + | |
− | </script>
| + | |
| | | |
| <!-- Master Script --> | | <!-- Master Script --> |
Line 99: |
Line 115: |
| } | | } |
| var toDivId = stateMsg; | | var toDivId = stateMsg; |
− | if( window.location.href == 'https://2017.igem.org/Team:Greece/HP/Silver#' || window.location.href == 'https://2017.igem.org/Team:Greece/HP/Gold_Integrated#' ){ | + | if( window.location.href == 'https://2017.igem.org/Team:Greece/HP/Silver#' || window.location.href == 'https://2017.igem.org/Team:Greece/HP/Gold_Integrated#' || window.location.href == 'https://2017.igem.org/Team:Greece/HP/Silver' || window.location.href == 'https://2017.igem.org/Team:Greece/HP/Gold_Integrated'){ |
| if( stateMsg == 'HP_Silver' || stateMsg == 'HP_Gold_Integrated' ){ | | if( stateMsg == 'HP_Silver' || stateMsg == 'HP_Gold_Integrated' ){ |
| stateMsg = stateMsg.replace('_', '/'); | | stateMsg = stateMsg.replace('_', '/'); |
| + | console.log('It is one of the window.location.href'); |
| } | | } |
| window.history.replaceState(null, null, '../' + stateMsg); | | window.history.replaceState(null, null, '../' + stateMsg); |
− | }else{
| + | }else{ |
| if( stateMsg == 'HP_Silver' || stateMsg == 'HP_Gold_Integrated' ){ | | if( stateMsg == 'HP_Silver' || stateMsg == 'HP_Gold_Integrated' ){ |
| stateMsg = stateMsg.replace('_', '/'); | | stateMsg = stateMsg.replace('_', '/'); |
| + | console.log('It is one of the stateMsg'); |
| } | | } |
| window.history.replaceState(null, null, stateMsg); | | window.history.replaceState(null, null, stateMsg); |
Line 121: |
Line 139: |
| </script> | | </script> |
| | | |
| + | |
| + | <script> |
| + | var str = 'https://2017.igem.org/Team:Greece/'; |
| + | var referrer = document.referrer; |
| + | var check = referrer.substring(str.length, referrer.length); |
| + | console.log(check); |
| + | var new_height; |
| + | switch(check){ |
| + | /*Project*/ |
| + | case 'HP/Gold_Integrated' : new_height = 9200; |
| + | break; |
| + | } |
| + | $('#display_box').css('height', new_height); |
| + | </script> |
| </head> | | </head> |
| <body> | | <body> |
− | <span id='top_flag'></span> | + | <span id='top_flag' style='position: absolute; z-index: -100; margin: -100px 0px 0px 0px;'></span> |
| <!-- Loading Screen --> | | <!-- Loading Screen --> |
| <div id='loading-background'> | | <div id='loading-background'> |
Line 151: |
Line 183: |
| <!--min-x, min-y, width, height--> | | <!--min-x, min-y, width, height--> |
| | | |
− | <a href='#' onmouseover="onHoverChanges( $(this).children('circle:first').attr('id') )" onmouseleave="onHoverHide($(this).children('circle:first').attr('id'))"> | + | <!--<a href='#' onmouseover="onHoverChanges( $(this).children('circle:first').attr('id') )" onmouseleave="onHoverHide($(this).children('circle:first').attr('id'))"> |
| <rect class='circlez' x="240" y="60" rx="20" ry="20" width="300" height="80" style="fill:#ffffff;stroke:black;stroke-width:0;" id='c_t0' onclick="displayMe(this.id)" onmouseover="onHoverChanges(this.id)" /> | | <rect class='circlez' x="240" y="60" rx="20" ry="20" width="300" height="80" style="fill:#ffffff;stroke:black;stroke-width:0;" id='c_t0' onclick="displayMe(this.id)" onmouseover="onHoverChanges(this.id)" /> |
| <text class='animate_text' id='t0' x='0' y='80' text-anchor='middle' fill='#000000' style='font-size:35px; opacity: 0.7;letter-spacing:3px;'> | | <text class='animate_text' id='t0' x='0' y='80' text-anchor='middle' fill='#000000' style='font-size:35px; opacity: 0.7;letter-spacing:3px;'> |
| <tspan x="390" dy="1em" onclick="displayMe('c_t0')" id='f_rect_text'>OVERVIEW</tspan> | | <tspan x="390" dy="1em" onclick="displayMe('c_t0')" id='f_rect_text'>OVERVIEW</tspan> |
− | </text></a> | + | </text></a>--> |
| | | |
| <a href='#' onmouseover="onHoverChanges( $(this).children('circle:first').attr('id') )" onmouseleave="onHoverHide($(this).children('circle:first').attr('id'))"> | | <a href='#' onmouseover="onHoverChanges( $(this).children('circle:first').attr('id') )" onmouseleave="onHoverHide($(this).children('circle:first').attr('id'))"> |
| <circle class='circlez' cx="-230" cy="365" r="135" stroke='#ffffff' stroke-width="0" fill="white" id='c_t1' onclick="displayMe(this.id)" onmouseover="onHoverChanges(this.id)" /> | | <circle class='circlez' cx="-230" cy="365" r="135" stroke='#ffffff' stroke-width="0" fill="white" id='c_t1' onclick="displayMe(this.id)" onmouseover="onHoverChanges(this.id)" /> |
| <text class='animate_text' id='t1' x='0' y='335' text-anchor='middle' fill='#000000'> | | <text class='animate_text' id='t1' x='0' y='335' text-anchor='middle' fill='#000000'> |
− | <tspan x="-227" dy="1em" onclick="displayMe('c_t1')" id='f_circle_textA'>O.S.I.R.I.S.</tspan> | + | <tspan x="-227" dy="1em" onclick="displayMe('c_t1')" id='f_circle_textA'>OSIRIS</tspan> |
| <tspan x="-230" dy="1.5em" onclick="displayMe('c_t1')" id='f_circle_textB'>PROTOCOL</tspan> | | <tspan x="-230" dy="1.5em" onclick="displayMe('c_t1')" id='f_circle_textB'>PROTOCOL</tspan> |
| </text></a> | | </text></a> |
Line 189: |
Line 221: |
| | | |
| <!-- Video Background --> | | <!-- Video Background --> |
− | <video id="video" autoplay="autoplay" muted="muted" preload="auto" loop="loop"> | + | <video id="video" autoplay='autoplay' muted="muted" preload="auto" loop="loop"> |
| <source src="https://static.igem.org/mediawiki/2017/2/2f/GreeKom_Ground_Zero_mp4.mp4" type="video/mp4"> | | <source src="https://static.igem.org/mediawiki/2017/2/2f/GreeKom_Ground_Zero_mp4.mp4" type="video/mp4"> |
| <source src="https://static.igem.org/mediawiki/2017/3/36/GreeKom_Ground_Zero_webm.webm" type="video/webm"> | | <source src="https://static.igem.org/mediawiki/2017/3/36/GreeKom_Ground_Zero_webm.webm" type="video/webm"> |
Line 211: |
Line 243: |
| <script> | | <script> |
| function backToTop(){ | | function backToTop(){ |
− | $('html, body').animate({scrollTop: '-=2000px'}, 1800); | + | /*$('html, body').animate({scrollTop: '-=15000px'}, 1800);*/ |
| + | $('#top_flag').goTo(); |
| } | | } |
| </script> | | </script> |
Line 323: |
Line 356: |
| <!-- Video manzis --> | | <!-- Video manzis --> |
| <div id='manzis'> | | <div id='manzis'> |
− | <span style='position: fixed; right: 20px; top: 20px; color: #dddddd; z-index:10000;' onmouseover='$(this).css("color","#dddddd"); $(this).css("cursor","pointer");' onmouseleave='$(this).css("color", "#ffffff"); $(this).css("cursor","normal");' onclick='$("#manzis").css("display","none");'><strong>Close</strong></span> | + | <span style='position: fixed; right: 120px; top: 20px; color: #dddddd; z-index:10000;' onmouseover='$(this).css("color","#dddddd"); $(this).css("cursor","pointer");' onmouseleave='$(this).css("color", "#ffffff"); $(this).css("cursor","normal");' onclick='$("#manzis").css("display","none"); $(".myvideo").get(0).pause();'><strong>Close</strong></span> |
− | <div style='position: fixed; z-index: 1000; width: 100%; height: 100%; opacity: 0.8; background-color:#000000; margin: -100px 0px 0px 0px;'> | + | <div style='position: fixed; z-index: 1001; width: 100%; height: 100%; opacity: 0.8; background-color:#000000; margin: -100px 0px 0px 0px;'> |
| </div> | | </div> |
| <div> | | <div> |
− | <video id="video" autoplay="autoplay" muted="muted" preload="auto" loop="loop" controls style='display: block; position: fixed; z-index: 1000; width: 500px; height: 500px; left: 50%; top: 50%; margin-right: -50%; transform: translate(-50%, -50%);'> | + | <video id="video" class='myvideo' muted="muted" preload="auto" loop="loop" controls style='display: block; position: fixed; z-index: 1000; width: 100%; height: 100%; left: 50%; top: 50%; margin-right: -50%; transform: translate(-50%, -50%);'> |
− | <source src="https://static.igem.org/mediawiki/2017/e/e4/GreeKom_bacteria_video.mp4" type="video/mp4"> | + | <source src="https://static.igem.org/mediawiki/2017/4/44/Greekom_the_igem_video.mp4" type="video/mp4"> |
| <!--<source src="https://static.igem.org/mediawiki/2017/4/44/Greekom_the_igem_video.mp4" type="video/webm">--> | | <!--<source src="https://static.igem.org/mediawiki/2017/4/44/Greekom_the_igem_video.mp4" type="video/webm">--> |
| </video> | | </video> |
| </div> | | </div> |
| </div> | | </div> |
− | | + | {{Greece/radar_chart}} |
| </body> | | </body> |
| </html> | | </html> |