CharisKomos (Talk | contribs) |
CharisKomos (Talk | contribs) |
||
(95 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
+ | <style> | ||
+ | body{ min-width:1200px; } | ||
+ | </style> | ||
+ | <!-- | ||
+ | var note = document.getElementById('expand'); | ||
+ | var screenPosition = note.getBoundingClientRect(); | ||
+ | screenPosition | ||
+ | --> | ||
<head> | <head> | ||
− | <!-- | + | <!-- Smooth Scroling Reference --> |
− | <script type= | + | <script type='text/javascript' src='https://2017.igem.org/Template:Greece/smooth_scrolling_reference?action=raw&ctype=text/javascript'></script> |
− | <!-- | + | <!-- MathJax Library --> |
− | <script | + | <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 --> | ||
− | <!-- Notebook Scripts --> | + | <!-- Google Fonts --> |
+ | <link href="https://fonts.googleapis.com/css?family=Poiret+One" rel="stylesheet"> | ||
+ | |||
+ | <!-- >>>>> Meta <<<<< --> | ||
+ | <meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' /> | ||
+ | |||
+ | <!-- Call Jquery --> | ||
+ | <script type="text/javascript" src="https://2017.igem.org/Template:Greece/latest_jquery?action=raw&ctype=text/javascript"></script> | ||
+ | |||
+ | <!-- Start of Notebook Scripts --> | ||
<script type="text/javascript" src="https://2017.igem.org/Template:Greece/Javascript? | <script type="text/javascript" src="https://2017.igem.org/Template:Greece/Javascript? | ||
Line 25: | Line 44: | ||
action=raw&ctype=text/javascript"></script> | action=raw&ctype=text/javascript"></script> | ||
+ | <!-- End of Notebook Scripts --> | ||
+ | <!-- Start of Notebook Stylesheets --> | ||
<link rel="stylesheet" type="text/css" href="https://2017.igem.org/Template:Greece/notebook/style?action=raw&ctype=text/css" /> | <link rel="stylesheet" type="text/css" href="https://2017.igem.org/Template:Greece/notebook/style?action=raw&ctype=text/css" /> | ||
Line 30: | Line 51: | ||
<link rel="stylesheet" type="text/css" href="https://2017.igem.org/Template:Greece/CSS/notebook2?action=raw&ctype=text/css" /> | <link rel="stylesheet" type="text/css" href="https://2017.igem.org/Template:Greece/CSS/notebook2?action=raw&ctype=text/css" /> | ||
<link rel="stylesheet" type="text/css" href="https://2017.igem.org/Template:Greece/CSS/notebook3?action=raw&ctype=text/css" /> | <link rel="stylesheet" type="text/css" href="https://2017.igem.org/Template:Greece/CSS/notebook3?action=raw&ctype=text/css" /> | ||
− | |||
− | < | + | <!-- End of Notebook Stylesheets --> |
− | <!-- >>>>> | + | <!-- >>>>> General Stylesheets <<<<< --> |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | --> | + | |
<link rel="stylesheet" type="text/css" href="https://2017.igem.org/Template:Greece/CSS?action=raw&ctype=text/css" /> | <link rel="stylesheet" type="text/css" href="https://2017.igem.org/Template:Greece/CSS?action=raw&ctype=text/css" /> | ||
Line 51: | Line 61: | ||
<link rel="stylesheet" type="text/css" href="https://2017.igem.org/Template:Greece/medium?action=raw&ctype=text/css" /> | <link rel="stylesheet" type="text/css" href="https://2017.igem.org/Template:Greece/medium?action=raw&ctype=text/css" /> | ||
− | <!-- >>>>> Scripts <<<<< --> | + | <!-- >>>>> General Scripts <<<<< --> |
<!-- On document.ready --> | <!-- On document.ready --> | ||
Line 59: | Line 69: | ||
//HIDE | //HIDE | ||
− | void(document.getElementById('loading-background').style.display = 'none'); | + | setTimeout(function(){void(document.getElementById('loading-background').style.display = 'none')}, 3000); |
//SHOW | //SHOW | ||
Line 77: | Line 87: | ||
} | } | ||
})(jQuery); | })(jQuery); | ||
− | + | sessionStorage.setItem('KEY', 'Project'); | |
− | if(link !== | + | |
− | + | if(link !== master){ if(link !== null){ | |
− | + | $('#display_box').css('display', 'block'); | |
− | + | $('.display_frame').removeClass('reveal'); | |
− | + | $('#' + link).addClass('reveal'); | |
− | + | $('#footer').addClass('reveal'); | |
+ | $('#ct1').goTo(); | ||
+ | void(document.title = link.toUpperCase()); | ||
+ | }} | ||
+ | controllingGeneralStyle(); | ||
+ | window.location.href != 'https://2017.igem.org/Team:Greece/Project' ? $('#back_to_top').css('display', 'block') : $('#back_to_top').css('display', 'none'); | ||
}); | }); | ||
</script> | </script> | ||
+ | |||
+ | <!-- Master Script --> | ||
+ | <script type="text/javascript" src="https://2017.igem.org/Template:Greece/master_script?action=raw&ctype=text/javascript"></script> | ||
<script> | <script> | ||
Line 110: | Line 128: | ||
case 'c_t3': stateMsg = 'Notebook'; | case 'c_t3': stateMsg = 'Notebook'; | ||
break; | break; | ||
− | case 'c_t4': stateMsg = ' | + | case 'c_t4': stateMsg = 'ProjectDesign'; |
break; | break; | ||
} | } | ||
Line 118: | Line 136: | ||
$('#footer').addClass('reveal'); | $('#footer').addClass('reveal'); | ||
$('#ct1').goTo(); | $('#ct1').goTo(); | ||
+ | void(document.title = stateMsg.toUpperCase()); | ||
+ | controllingGeneralStyle(); | ||
+ | $('#back_to_top').css('display', 'block'); | ||
} | } | ||
</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 'Description' : new_height = 4150; | ||
+ | break; | ||
+ | case 'Results' : new_height = 8900; | ||
+ | break; | ||
+ | case 'Design' : new_height = 10350; | ||
+ | break; | ||
+ | } | ||
+ | $('#display_box').css('height', new_height); | ||
+ | |||
+ | </script> | ||
</head> | </head> | ||
<body> | <body> | ||
− | + | <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 134: | Line 174: | ||
<nav class='menu'> | <nav class='menu'> | ||
<ul class='clearfix' id='list'> | <ul class='clearfix' id='list'> | ||
− | <li><a target='_self' href='https://2017.igem.org/Team:Greece | + | <li><a target='_self' href='https://2017.igem.org/Team:Greece'> |
<img class='logo' id='logo' src='https://static.igem.org/mediawiki/2017/8/85/Greekom_logo.png' /></a></li> | <img class='logo' id='logo' src='https://static.igem.org/mediawiki/2017/8/85/Greekom_logo.png' /></a></li> | ||
− | <!--<li class='li_indiv'><a target='_self' href='https://2017.igem.org/Team:Greece | + | <!--<li class='li_indiv'><a target='_self' href='https://2017.igem.org/Team:Greece'>HOME</a></li>--> |
<span id='just_to_align'> | <span id='just_to_align'> | ||
<li style='width:' class='li_indiv'><a target='_self' href='https://2017.igem.org/Team:Greece/Project'>PROJECT</a></li> | <li style='width:' class='li_indiv'><a target='_self' href='https://2017.igem.org/Team:Greece/Project'>PROJECT</a></li> | ||
Line 172: | Line 212: | ||
<circle class='circlez' cx="1020" cy="365" r="135" stroke='#ffffff' stroke-width="0" fill="white" id='c_t4' onclick="displayMe(this.id)" onmouseover="onHoverChanges(this.id)" /> | <circle class='circlez' cx="1020" cy="365" r="135" stroke='#ffffff' stroke-width="0" fill="white" id='c_t4' onclick="displayMe(this.id)" onmouseover="onHoverChanges(this.id)" /> | ||
<text class='animate_text' id='t4' x='0' y='335' text-anchor='middle' fill='#000000'> | <text class='animate_text' id='t4' x='0' y='335' text-anchor='middle' fill='#000000'> | ||
− | <tspan x=" | + | <tspan x="1020" dy="1.5em" onclick="displayMe('c_t4')" id='fo_circle_text'>DESIGN</tspan> |
</text></a> | </text></a> | ||
</svg> | </svg> | ||
Line 183: | Line 223: | ||
<!-- Subsection Box --> | <!-- Subsection Box --> | ||
+ | |||
<div id='display_box'> | <div id='display_box'> | ||
− | < | + | <div id='ct1'> |
+ | <div id='Description' width='100%' height='100%' class='display_frame hide'></html>{{Greece/Description}}<html></div> | ||
+ | </div> | ||
− | < | + | <div id='Results' width='100%' height='100%' class='display_frame hide' ></html>{{Greece/Results}}<html></div> |
− | < | + | <div id='Notebook' width='100%' height='100%' class='display_frame hide' ></html>{{Greece/notebook}}<html></div> |
− | < | + | <div id='ProjectDesign' width='100%' height='100%' class='display_frame hide' ></html>{{Greece/ProjectDesign}}<html></div> |
</div> | </div> | ||
+ | |||
+ | <div id='back_to_top' onmouseover="$(this).css('cursor', 'pointer')" onclick='backToTop()' ></div> | ||
+ | |||
+ | <script> | ||
+ | function backToTop(){ | ||
+ | /*$('html, body').animate({scrollTop: '-=15000px'}, 1800);*/ | ||
+ | $('#top_flag').goTo(); | ||
+ | } | ||
+ | </script> | ||
<!-- Footer Box --> | <!-- Footer Box --> | ||
<div id='footer' style='background:#ffffff; position: absolute; width:100%; height: 220px; z-index:1000;' class='hide'> | <div id='footer' style='background:#ffffff; position: absolute; width:100%; height: 220px; z-index:1000;' class='hide'> | ||
− | <img style='position:relative; width:100%; height:100%;' src='https://static.igem.org/mediawiki/2017/ | + | <img style='position:relative; width:100%; height:100%;' src='https://static.igem.org/mediawiki/2017/3/3a/Greekom_footer_new.png' /> |
</div> | </div> | ||
Line 216: | Line 268: | ||
.reveal{ display: block; } | .reveal{ display: block; } | ||
+ | |||
+ | .slide_out{ left: -800px; } | ||
+ | |||
+ | .slide_in{ left: 0px; } | ||
video{ | video{ | ||
Line 237: | Line 293: | ||
/* Media Queries in JavaScript using nested if statements */ | /* Media Queries in JavaScript using nested if statements */ | ||
function onWindowResize(){ | function onWindowResize(){ | ||
− | |||
− | |||
− | |||
− | $('# | + | console.log(innerWidth); |
+ | if(window.innerWidth > 1025){ | ||
+ | if(window.innerWidth < 1367){ | ||
+ | $('#f_circle_text').attr({ 'x': '-210' }); | ||
− | + | $('#s_circle_text').attr({ 'x': '200' }); | |
+ | |||
+ | $('#t_circle_text').attr({ 'x': '615' }); | ||
+ | |||
+ | console.log('1025 < x < 1366'); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | if(window.innerWidth >= 1367){ | ||
+ | $('#f_circle_text').attr({ 'x': '-230' }); | ||
+ | |||
+ | $('#s_circle_text').attr({ 'x': '193' }); | ||
+ | |||
+ | $('#t_circle_text').attr({ 'x': '610' }); | ||
+ | |||
+ | console.log(' 1367 <= x '); | ||
} | } | ||
} | } | ||
− | + | $(window).resize(function () { | |
− | window. | + | |
onWindowResize(); | onWindowResize(); | ||
}); | }); | ||
Line 267: | Line 337: | ||
// Same application for it's side effect (display an ugly div by default) | // Same application for it's side effect (display an ugly div by default) | ||
− | void(document.getElementById('user_item').style.display = 'none'); | + | //void(document.getElementById('user_item').style.display = 'none'); |
</script> | </script> |
Latest revision as of 01:01, 17 December 2017