Template:Amplino
From 2012e.igem.org
(Difference between revisions)
(90 intermediate revisions not shown) | |||
Line 12: | Line 12: | ||
<!-- Scripting - START /--> | <!-- Scripting - START /--> | ||
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.js"></script> | <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.js"></script> | ||
- | <script type="text/javascript" src="http://github.com/cowboy/jquery-hashchange/raw/v1.3/jquery.ba-hashchange.js"></script> | + | <script type="text/javascript" src="http://github.com/cowboy/jquery-hashchange/raw/v1.3/jquery.ba-hashchange.js"> |
+ | </script> | ||
+ | <script src="http://tweet.seaofclouds.com/jquery.tweet.js"></script> | ||
+ | <link href='http://fonts.googleapis.com/css?family=Days+One' rel='stylesheet' type='text/css'> | ||
+ | |||
+ | <script> | ||
+ | //Global Vars | ||
+ | var currentPage; | ||
+ | var in_frame_test = 1; | ||
+ | var ampersandStr = String.fromCharCode(38); | ||
+ | var loading_home = false; | ||
+ | |||
+ | function dbgout(msg) { | ||
+ | var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1; | ||
+ | if(is_chrome) console.log(msg); | ||
+ | } | ||
+ | |||
+ | $(document).ready(function() { | ||
+ | |||
+ | //Move iGEM default content blocks | ||
+ | $('#search-controls').appendTo('#search-form'); | ||
+ | $('#menubar').appendTo('#user-menu'); | ||
+ | $('.right-menu').appendTo('#igem-links'); | ||
+ | $("#igem-links .right-menu").attr("id","account-links"); | ||
+ | $("#account-links").attr("class","no-class"); | ||
+ | |||
+ | // Initialize history plugin. | ||
+ | $(window).hashchange(historyCallback); | ||
+ | //rewriteLinks($("#navlist")); | ||
+ | |||
+ | historyCallback(); | ||
+ | |||
+ | }); | ||
+ | |||
+ | function isDefined(variable) | ||
+ | { | ||
+ | return typeof(window[variable]) != "undefined"; | ||
+ | } | ||
+ | |||
+ | function splitHash(hash) { | ||
+ | var kvpairs = hash.split(ampersandStr); | ||
+ | var i; | ||
+ | var kvmap = {}; | ||
+ | for(i=0;i<kvpairs.length;i++) { | ||
+ | var s = kvpairs[i].split('='); | ||
+ | kvmap[s[0]] = s[1]; | ||
+ | } | ||
+ | return kvmap; | ||
+ | } | ||
+ | |||
+ | function makeHash(page, kvmap) { | ||
+ | var str = '#page=' + page; | ||
+ | var i; | ||
+ | if (kvmap) { | ||
+ | for(i in kvmap) { | ||
+ | str += ampersandStr + i + '=' + kvmap[i]; | ||
+ | } | ||
+ | } | ||
+ | return str; | ||
+ | } | ||
+ | |||
+ | function setHash(page, kvmap) { | ||
+ | location.hash = makeHash(page,kvmap); | ||
+ | } | ||
+ | |||
+ | |||
+ | function include_js(file, cb) { | ||
+ | var html_doc = document.getElementsByTagName('head')[0]; | ||
+ | var js = document.createElement('script'); | ||
+ | js.setAttribute('type', 'text/javascript'); | ||
+ | js.setAttribute('src', file); | ||
+ | html_doc.appendChild(js); | ||
+ | |||
+ | js.onreadystatechange = function () { | ||
+ | if (js.readyState == 'complete') | ||
+ | cb(); | ||
+ | } | ||
+ | |||
+ | js.onload = cb; | ||
+ | } | ||
+ | |||
+ | function loadScript(src, callback) | ||
+ | { | ||
+ | include_js(src, callback); | ||
+ | } | ||
+ | |||
+ | function moveToAnchor(anchor) { | ||
+ | try { | ||
+ | var pos = $('#Amplino-container > a[name='+anchor+']').offset(); | ||
+ | dbgout('anchor: '+anchor+'; pos=' + pos.left + ','+pos.top ); | ||
+ | window.scroll(pos.left, pos.top); | ||
+ | } catch (err) { | ||
+ | dbgout('moveToAnchor error: ' + err); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | function updateContentEditLink() { | ||
+ | if (!wgUserName) { | ||
+ | return; | ||
+ | } | ||
+ | |||
+ | var page = currentPage ? currentPage : 'Home'; | ||
+ | var url = location.pathname + '/' + page + '?action=edit'; | ||
+ | $("#menubar ul li:nth-child(3) a").attr('href', url); | ||
+ | |||
+ | |||
+ | var url = location.pathname + '/' + page; | ||
+ | $("#menubar ul li:nth-child(1) a").attr('href', url); | ||
+ | var url = location.pathname + '/' + page + '?action=history'; | ||
+ | $("#menubar ul li:nth-child(4) a").attr('href', url); | ||
+ | var url = location.pathname + '/' + page + '?action=watch'; | ||
+ | $("#menubar ul li:nth-child(6) a").attr('href', url); | ||
+ | $("#menubar ul li:nth-child(2)").css('display','none'); | ||
+ | $("#menubar ul li:nth-child(5)").css('display','none'); | ||
+ | } | ||
+ | |||
+ | function loadPage(page, anchor) | ||
+ | { | ||
+ | var showLoadAnim = !!currentPage; | ||
+ | currentPage = page; | ||
+ | var url = wgServer + "/Team:Amplino/" + page + "?action=render"; | ||
+ | if(page.substring(0, 5) == "User:") { | ||
+ | url = wgServer + "/" + page + "?action=render"; | ||
+ | } | ||
+ | $(window).trigger('page_close'); | ||
+ | |||
+ | if(showLoadAnim) { | ||
+ | $("#Amplino-loader").show(); | ||
+ | $("#Amplino-container").fadeTo(200,0.25); | ||
+ | $('html, body').animate({scrollTop:0}, 'slow'); | ||
+ | } | ||
+ | loading_home = false; | ||
+ | |||
+ | var processPage = function(next) { | ||
+ | dbgout('processPage: ' + page); | ||
+ | $(window).trigger('page_init'); | ||
+ | rewriteLinks($("#Amplino-container")); | ||
+ | updateContentEditLink(); | ||
+ | $("#Amplino-container").fadeTo(200,1).delay(200).queue(function(n) { | ||
+ | if(anchor) moveToAnchor(anchor); n(); | ||
+ | }); | ||
+ | next(); | ||
+ | } | ||
+ | |||
+ | $.get(url, function(data) { | ||
+ | $("#Amplino-container").html(data).queue(processPage); | ||
+ | //buildBreadCrumbTrail(page); | ||
+ | //Cufon.replace('h2'); // Works without a selector engine | ||
+ | //Cufon.replace('h3'); // Works without a selector engine | ||
+ | //Cufon.replace('#sub1'); // Requires a selector engine for IE 6-7, see above | ||
+ | //$("tr:nth-child(odd)").addClass("odd"); | ||
+ | |||
+ | $("#Amplino-loader").hide(); | ||
+ | //$("#loading-overlay").hide(); | ||
+ | }); | ||
+ | } | ||
+ | |||
+ | function historyCallback() { | ||
+ | var hash = location.hash; | ||
+ | if(hash) { | ||
+ | hash = hash.substring(1); | ||
+ | if(hash.split('=').length > 1) { | ||
+ | var kvmap = splitHash(hash); | ||
+ | var changepage; | ||
+ | |||
+ | // looks a little clumsy, but js AND operator conflicts with mediawiki markup | ||
+ | if (kvmap.page) if(kvmap.page != currentPage) changepage = kvmap.page; | ||
+ | |||
+ | if (changepage) { | ||
+ | loadPage(changepage, kvmap.anchor); | ||
+ | } else { | ||
+ | if(kvmap.anchor) moveToAnchor(kvmap.anchor); | ||
+ | $(window).trigger('hashupdate'); | ||
+ | } | ||
+ | } | ||
+ | } else { | ||
+ | setHash('Home'); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | function rewriteLinks(elem) { | ||
+ | $("a",elem).each(function() { | ||
+ | var txt = $(this).text(); | ||
+ | var url = this.href; | ||
+ | |||
+ | if(this.hash) { | ||
+ | var anchor = this.hash.substring(1); | ||
+ | |||
+ | if (anchor.substring(0,5)!='page=') | ||
+ | this.href = '#page=' + currentPage + ampersandStr + 'anchor=' + anchor; | ||
+ | } else if(txt != "edit") { | ||
+ | this.href = this.href.replace("https://2012e.igem.org/wiki/index.php/Team:Amplino/", "#page="); | ||
+ | } | ||
+ | |||
+ | // dbgout('rewriting ' + url + ' to ' + this.href); | ||
+ | }); | ||
+ | } | ||
+ | |||
+ | </script> | ||
<!-- Main CSS - START /--> | <!-- Main CSS - START /--> | ||
<style type="text/css"> | <style type="text/css"> | ||
/* Wiki Hacks - START */ | /* Wiki Hacks - START */ | ||
+ | /* When copying our code, please acknowledge us on your wiki | ||
/* Team: Amplino */ | /* Team: Amplino */ | ||
+ | |||
+ | #top-section{ | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | #content { | ||
+ | border: none; | ||
+ | background: transparent; | ||
+ | } | ||
+ | |||
+ | body { | ||
+ | background: #fff; | ||
+ | } | ||
+ | |||
+ | #catlinks { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | #footer-box { | ||
+ | border: none; | ||
+ | } | ||
+ | |||
+ | /* Amplino Styles */ | ||
+ | |||
+ | h2, h3, h4 { | ||
+ | font-family: 'Days One', sans-serif; | ||
+ | } | ||
#floatingbar { | #floatingbar { | ||
- | line-height: | + | height: 55px; |
+ | line-height: 15px; | ||
text-align: center; | text-align: center; | ||
margin: 0 auto; | margin: 0 auto; | ||
Line 27: | Line 254: | ||
top:0; | top:0; | ||
left: 0; | left: 0; | ||
+ | z-index: 999; | ||
+ | width: 100%; | ||
+ | background: #8a4e00; | ||
+ | } | ||
+ | |||
+ | #add-floatingbar { | ||
+ | width: 975px; | ||
+ | margin: 0px auto 0 auto; | ||
+ | height: 15px; | ||
+ | overflow: none; | ||
+ | } | ||
+ | |||
+ | #user-menu { | ||
+ | position: relative; | ||
+ | white-space: nowrap; | ||
+ | top: auto; | ||
+ | width: 400px; | ||
+ | margin-left: 575px; | ||
+ | z-index: 5; | ||
+ | font-family: sans-serif; | ||
+ | font-size: 95%; | ||
+ | line-height: 1em; | ||
+ | } | ||
+ | |||
+ | #floatingbar-content { | ||
+ | width: 975px; | ||
+ | margin: 0 auto; | ||
+ | padding: 0; | ||
+ | text-align: left; | ||
+ | } | ||
+ | |||
+ | #floatingbar-content h1 { | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | float: left; | ||
+ | border-bottom: none; | ||
+ | width: 192px; | ||
+ | } | ||
+ | |||
+ | #floatingbar-content h1 a { | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | #menu ul { | ||
+ | list-style-type: none; | ||
+ | height: 50px; | ||
+ | width: 600px; | ||
+ | margin: auto; | ||
+ | list-style: none; | ||
+ | float: left; | ||
+ | } | ||
+ | |||
+ | #menu ul li { | ||
+ | float: left; | ||
+ | } | ||
+ | |||
+ | #menu ul a { | ||
+ | padding-right: 10px; | ||
+ | padding-left: 10px; | ||
+ | display: block; | ||
+ | line-height: 50px; | ||
+ | text-decoration: none; | ||
+ | font-size: 15px; | ||
+ | color: #FFF; | ||
+ | } | ||
+ | |||
+ | #menu ul a:hover { | ||
+ | color: #DDD; | ||
+ | } | ||
+ | |||
+ | #search-form { | ||
+ | float: left; | ||
+ | width: 183px; | ||
+ | } | ||
+ | |||
+ | #search-controls { | ||
+ | position: relative; | ||
+ | top: auto; | ||
+ | right: auto; | ||
+ | width: 183px; | ||
+ | height: 40px; | ||
+ | background-color: transparent; | ||
+ | text-align: right; | ||
+ | z-index: 3; | ||
+ | margin-top: 10px; | ||
+ | } | ||
+ | |||
+ | #searchGoButton, #mw-searchButton { | ||
+ | color: #DDD; | ||
+ | } | ||
+ | |||
+ | #Amplino-loader { | ||
+ | z-index: 100; | ||
+ | position: absolute; | ||
+ | left: 0px; | ||
+ | top: 0px; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | #Amplino-loading-panel-logo { | ||
+ | margin: 0 auto; | ||
+ | margin-top: 250px; | ||
+ | } | ||
+ | |||
+ | #Amplino-container { | ||
+ | min-height: 400px; | ||
+ | } | ||
+ | |||
+ | #igem-links { | ||
+ | position: fixed; | ||
+ | top: 0; | ||
+ | right: 5px; | ||
+ | z-index: 1000; | ||
+ | font-size: 10px; | ||
+ | } | ||
+ | |||
+ | #account-links ul { | ||
+ | list-style: none; | ||
+ | } | ||
+ | |||
+ | #account-links li { | ||
+ | display: block; | ||
+ | clear: both; | ||
+ | float: right; | ||
+ | } | ||
+ | |||
+ | #account-links li a.new, #account-links li a { | ||
+ | color: #fff; | ||
+ | } | ||
+ | |||
+ | #account-links li a.new:visited, #account-links li a:visited { | ||
+ | color: #fff; | ||
} | } | ||
</style> | </style> | ||
+ | |||
+ | <div id="igem-links"> | ||
+ | |||
+ | </div> | ||
<div id="floatingbar"> | <div id="floatingbar"> | ||
+ | <div id="floatingbar-content"> | ||
+ | <h1><a href="https://2012e.igem.org/Team:Amplino#page=Home"><img src="https://static.igem.org/mediawiki/2012e/7/7c/AMPLINO-logo-igem-small.png" alt="Amplino iGEM Entrepreneurship Team Wiki" /></a></h1> | ||
<div id="menu"> | <div id="menu"> | ||
<ul> | <ul> | ||
- | <li><a href="#"> | + | <li><a href="#page=Team">Team</a></li> |
+ | <li><a href="#page=Summary">Summary</a></li> | ||
+ | <li><a href="#page=Problem">Problem</a></li> | ||
+ | <!-- <li><a href="#page=Opportunity">Opportunity</a></li> --> | ||
+ | <li><a href="#page=Solution">Solution</a></li> | ||
+ | <li><a href="#page=Source_Data">Source Data</a></li> | ||
+ | <li><a href="#page=Attributions">Attributions</a></li> | ||
+ | <li><a href="#page=Safety">Safety</a></li> | ||
</ul> | </ul> | ||
</div> | </div> | ||
+ | <div id="search-form"> | ||
</div> | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div id="add-floatingbar"> | ||
+ | <div id="user-menu"> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div id="Amplino-loader"> | ||
+ | <div id="Amplino-loading-panel-logo"> | ||
+ | <!-- yes im using center --> | ||
+ | <center> <h2>Loading...</h2></center> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div id="Amplino-container"> | ||
+ | </div> | ||
+ | |||
</html> | </html> |
Latest revision as of 11:14, 21 October 2012