Skip to content
Snippets Groups Projects
Commit 73b7cc14 authored by khawkins98's avatar khawkins98
Browse files

Update transitionary black bar vision

parent 7ebfd5a7
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 242 additions and 112 deletions
_includes/local_masthead.html
+ 2
− 21
View file @ 73b7cc14
......@@ -5,25 +5,6 @@
</div>
<header id="masthead-black-bar" class="clearfix masthead-black-bar">
<nav class="row">
<ul id="global-nav" class="menu global-nav text-right">
<!-- set active class as appropriate -->
<li class="home-mobile"><a href="//www.ebi.ac.uk"></a></li>
<li class="home active"><a href="//www.ebi.ac.uk">EMBL</a></li>
<li class="location grenoble active"><a href="#">Grenoble</a></li>
<li class="float-right show-for-medium embl-selector">
<button class="button float-right">&nbsp;</button>
</li>
<li class="float-right search">
<a href="#" data-toggle="search-global-dropdown"><span class="show-for-small-only">Search</span></a>
<div id="search-global-dropdown" class="dropdown-pane" data-dropdown data-options="closeOnClick:true;">
<!-- The dropdown menu will be programatically added by script.js -->
</div>
</li>
<li class="about"><a href="//www.ebi.ac.uk/about">About us</a></li>
<li class="training"><a href="//www.ebi.ac.uk/training">Training</a></li>
<li class="research active"><a href="//www.ebi.ac.uk/research">Research</a></li>
<li class="services"><a href="//www.ebi.ac.uk/services">Services</a></li>
</ul>
</nav>
<!-- Will be populated by script.js -->
<!-- Active item will be set through embl:facet metatags -->
</header>
_includes/navigation_list.html
+ 2
− 2
View file @ 73b7cc14
{% for node in navigation_list %}
{% if group == null or group == node.group %}
{% if page.url == node.url %}
<li class="active"><a href="{{ site.domain }}{{ site.baseurl }}{{node.url}}" class="active">{{node.title}}</a></li>
<li class="active"><a href="{{ site.baseurl }}{{node.url}}" class="active">{{node.title}}</a></li>
{% else %}
<li><a href="{{ site.domain }}{{ site.baseurl }}{{node.url}}">{{node.title}}</a></li>
<li><a href="{{ site.baseurl }}{{node.url}}">{{node.title}}</a></li>
{% endif %}
{% endif %}
{% endfor %}
......
_layouts/default.html
+ 2
− 2
View file @ 73b7cc14
......@@ -9,7 +9,7 @@
<div class="masthead-inner row">
<!-- local-title -->
<div class="columns medium-7" id="local-title">
<h1><a href="{{ site.domain }}{{ site.baseurl }}" title="Back to {{ site.name }} homepage">{{ site.name }}</a></h1>
<h1><a href="{{ site.domain }}{{ site.baseurl }}" title="Back to {{ site.name }} homepage">{{ page.active_facet }}</a></h1>
</div>
<!-- /local-title -->
<!-- local-nav -->
......@@ -47,7 +47,7 @@
</nav>
-->
<div class="medium-9 columns padding-top-large">
{{ content }}
{{ content | markdownify}}
</div>
<div class="medium-3 columns sidebar" data-sticky-container>
</div>
......
css/ebi-css-build/_ebi_masthead_styles.scss
+ 48
− 20
View file @ 73b7cc14
......@@ -6,6 +6,11 @@
#local-title a { border-bottom: none; }
.masthead {
// h1 {
// font-weight: 400;
// letter-spacing: -2px; // fira kerning on light fonts and default sizes sucks :(
// }
// underline links in the textual area of the local masthead
#local-title .columns {
a { border-bottom: 1px dotted rgb(255,255,255); }
......@@ -21,21 +26,21 @@
body.no-global-search .masthead-black-bar ul#global-nav.menu li.search { display: none; }
// Mobile logo
@media screen and (max-width: 40em) {
nav ul#global-nav.menu li.home { display: none; }
nav ul#global-nav.menu li.home-mobile a {
display: block;
height: 50px;
width: 67px;
background-image: url("../images/logos/EMBL-EBI/EMBL_EBI_Logo_white.svg");
background-size: 64px 47px;
background-repeat: no-repeat;
margin-left: 6px;
}
}
@media screen and (min-width: 40em) {
nav ul#global-nav.menu li.home-mobile { display: none; }
}
// @media screen and (max-width: 40em) {
// nav ul#global-nav.menu li.home { display: none; }
// nav ul#global-nav.menu li.home-mobile a {
// display: block;
// height: 50px;
// width: 67px;
// background-image: url("../images/logos/EMBL-EBI/EMBL_EBI_Logo_white.svg");
// background-size: 64px 47px;
// background-repeat: no-repeat;
// margin-left: 6px;
// }
// }
// @media screen and (min-width: 40em) {
// nav ul#global-nav.menu li.home-mobile { display: none; }
// }
.masthead-black-bar {
background-color: $ebi-colour-dark;
......@@ -61,9 +66,15 @@
li a:focus,
li.active a,
li.active-trail a {
color: white;
color: #fff;
border-bottom: none;
background: rgb(0,0,0);
background-color: #000;
// margin-left: 3px;
// position: relative;
// top: -3px;
}
li.active a {
font-weight: 700;
}
li {
......@@ -84,20 +95,38 @@
li.research,
li.training,
li.about,
li.grenoble,
li.embl,
li.ebi,
li.grenoble,
li.hamburg,
li.heidelberg,
li.hinxton,
li.rome,
li.barcelona {
float: right;
&.hover {
float: none;
}
&.active {
float: left;
}
}
li.location {
li.embl,
li.ebi,
li.grenoble,
li.hamburg,
li.heidelberg,
li.hinxton,
li.rome,
li.barcelona {
&.hover a:before {
content: "" !important;
}
}
li.where {
a:before {
content: '[';
}
......@@ -202,7 +231,6 @@
text-align: right;
li { float: none; display: inline-block; }
li.home-mobile { float: left; }
// make icon bar smaller for mobile
> li > a > img,
......
css/ebi-css-build/_embl_selector.scss
+ 5
− 2
View file @ 73b7cc14
......@@ -8,15 +8,18 @@
@mixin embl-selector {
li.embl-selector {
margin-left: 0.5rem;
border-left: .5px solid rgba(255,255,255,.5);
padding-left: 1.5rem;
}
.embl-bar {
height: 0; overflow: hidden;
display: none;
background-color: #000;
background-color: #eee;
color: #222;
// color: #fff;
a {
// color: #fff;
color: #222;
// border-bottom: 1px dashed #fff;
}
a:hover { border-bottom: 1px solid #fff; }
......
index.html
+ 1
− 0
View file @ 73b7cc14
---
layout: default
title: Project home
active_facet: Research
group: "in_local_navigation"
order: 1
---
......
js/documenation.md
+ 80
− 38
View file @ 73b7cc14
......@@ -4,6 +4,8 @@
- [ebiGetParameterByName](#ebigetparameterbyname)
- [ebiGetParameterByName](#ebigetparameterbyname-1)
- [ebiFrameworkExternalLinks](#ebiframeworkexternallinks)
- [ebiFrameworkExternalLinks](#ebiframeworkexternallinks-1)
- [ebiFrameworkManageGlobalSearch](#ebiframeworkmanageglobalsearch)
- [ebiFrameworkManageGlobalSearch](#ebiframeworkmanageglobalsearch-1)
- [ebiFrameworkSearchNullError](#ebiframeworksearchnullerror)
......@@ -14,6 +16,10 @@
- [ebiFrameworkHideGlobalNav](#ebiframeworkhideglobalnav-1)
- [ebiFrameworkAssignImageByMetaTags](#ebiframeworkassignimagebymetatags)
- [ebiFrameworkAssignImageByMetaTags](#ebiframeworkassignimagebymetatags-1)
- [ebiFrameworkPopulateBlackBar](#ebiframeworkpopulateblackbar)
- [ebiFrameworkPopulateBlackBar](#ebiframeworkpopulateblackbar-1)
- [ebiFrameworkActivateBlackBar](#ebiframeworkactivateblackbar)
- [ebiFrameworkActivateBlackBar](#ebiframeworkactivateblackbar-1)
- [ebiFrameworkInsertEMBLdropdown](#ebiframeworkinsertembldropdown)
- [ebiFrameworkInsertEMBLdropdown](#ebiframeworkinsertembldropdown-1)
- [ebiFrameworkUpdateFoot](#ebiframeworkupdatefoot)
......@@ -47,7 +53,7 @@
## ebiGetParameterByName
[js/ebi-global-includes/script/1_about.js:16-24](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/ebi-global-includes/script/1_about.js#L16-L24 "Source code on GitHub")
[js/ebi-global-includes/script/1_about.js:16-24](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/ebi-global-includes/script/1_about.js#L16-L24 "Source code on GitHub")
Utility function to get params from the URL.
......@@ -65,7 +71,7 @@ var foo = getParameterByName('foo'); // "lorem"
## ebiGetParameterByName
[js/script.js:16-24](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/script.js#L16-L24 "Source code on GitHub")
[js/script.js:16-24](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/script.js#L16-L24 "Source code on GitHub")
Utility function to get params from the URL.
......@@ -81,37 +87,49 @@ query string: ?foo=lorem&bar=&baz
var foo = getParameterByName('foo'); // "lorem"
```
## ebiFrameworkExternalLinks
[js/ebi-global-includes/script/2_ebiFrameworkExternalLinks.js:4-35](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/ebi-global-includes/script/2_ebiFrameworkExternalLinks.js#L4-L35 "Source code on GitHub")
Mark pdf/doc/txt links with link-pdf/link-doc/link-txt classes.
## ebiFrameworkExternalLinks
[js/script.js:29-60](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/script.js#L29-L60 "Source code on GitHub")
Mark pdf/doc/txt links with link-pdf/link-doc/link-txt classes.
## ebiFrameworkManageGlobalSearch
[js/ebi-global-includes/script/3_ebiFrameworkForms.js:5-34](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/ebi-global-includes/script/3_ebiFrameworkForms.js#L5-L34 "Source code on GitHub")
[js/ebi-global-includes/script/3_ebiFrameworkForms.js:5-34](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/ebi-global-includes/script/3_ebiFrameworkForms.js#L5-L34 "Source code on GitHub")
Disable the global search if a page defines a local search.<br/>
Can also be disabled by adding class 'no-global-search' to the body element.
## ebiFrameworkManageGlobalSearch
[js/script.js:65-94](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/script.js#L65-L94 "Source code on GitHub")
[js/script.js:66-95](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/script.js#L66-L95 "Source code on GitHub")
Disable the global search if a page defines a local search.<br/>
Can also be disabled by adding class 'no-global-search' to the body element.
## ebiFrameworkSearchNullError
[js/ebi-global-includes/script/3_ebiFrameworkForms.js:40-84](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/ebi-global-includes/script/3_ebiFrameworkForms.js#L40-L84 "Source code on GitHub")
[js/ebi-global-includes/script/3_ebiFrameworkForms.js:40-84](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/ebi-global-includes/script/3_ebiFrameworkForms.js#L40-L84 "Source code on GitHub")
Add error alerts for 'no input' on search boxes.<br/>
Todo: this, perhaps, shoule be moved to a value-add script file
## ebiFrameworkSearchNullError
[js/script.js:100-144](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/script.js#L100-L144 "Source code on GitHub")
[js/script.js:101-145](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/script.js#L101-L145 "Source code on GitHub")
Add error alerts for 'no input' on search boxes.<br/>
Todo: this, perhaps, shoule be moved to a value-add script file
## ebiToggleClass
[js/ebi-global-includes/script/4_ebiFrameworkContent.js:4-13](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/ebi-global-includes/script/4_ebiFrameworkContent.js#L4-L13 "Source code on GitHub")
[js/ebi-global-includes/script/4_ebiFrameworkContent.js:4-13](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/ebi-global-includes/script/4_ebiFrameworkContent.js#L4-L13 "Source code on GitHub")
Utility function to toggle classes. Chiefly to show the #embl-bar.
......@@ -122,7 +140,7 @@ Utility function to toggle classes. Chiefly to show the #embl-bar.
## ebiToggleClass
[js/script.js:149-158](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/script.js#L149-L158 "Source code on GitHub")
[js/script.js:150-159](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/script.js#L150-L159 "Source code on GitHub")
Utility function to toggle classes. Chiefly to show the #embl-bar.
......@@ -133,79 +151,103 @@ Utility function to toggle classes. Chiefly to show the #embl-bar.
## ebiFrameworkHideGlobalNav
[js/ebi-global-includes/script/4_ebiFrameworkContent.js:18-34](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/ebi-global-includes/script/4_ebiFrameworkContent.js#L18-L34 "Source code on GitHub")
[js/ebi-global-includes/script/4_ebiFrameworkContent.js:18-34](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/ebi-global-includes/script/4_ebiFrameworkContent.js#L18-L34 "Source code on GitHub")
Remove global-nav/global-nav-expanded from header/footer if body.no-global-nav is set
## ebiFrameworkHideGlobalNav
[js/script.js:163-179](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/script.js#L163-L179 "Source code on GitHub")
[js/script.js:164-180](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/script.js#L164-L180 "Source code on GitHub")
Remove global-nav/global-nav-expanded from header/footer if body.no-global-nav is set
## ebiFrameworkAssignImageByMetaTags
[js/ebi-global-includes/script/4_ebiFrameworkContent.js:39-53](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/ebi-global-includes/script/4_ebiFrameworkContent.js#L39-L53 "Source code on GitHub")
[js/ebi-global-includes/script/4_ebiFrameworkContent.js:39-53](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/ebi-global-includes/script/4_ebiFrameworkContent.js#L39-L53 "Source code on GitHub")
Assign global nav background images through meta tags
## ebiFrameworkAssignImageByMetaTags
[js/script.js:184-198](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/script.js#L184-L198 "Source code on GitHub")
[js/script.js:185-199](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/script.js#L185-L199 "Source code on GitHub")
Assign global nav background images through meta tags
## ebiFrameworkPopulateBlackBar
[js/ebi-global-includes/script/4_ebiFrameworkContent.js:58-94](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/ebi-global-includes/script/4_ebiFrameworkContent.js#L58-L94 "Source code on GitHub")
Populate `#masthead-black-bar`
## ebiFrameworkPopulateBlackBar
[js/script.js:204-240](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/script.js#L204-L240 "Source code on GitHub")
Populate `#masthead-black-bar`
## ebiFrameworkActivateBlackBar
[js/ebi-global-includes/script/4_ebiFrameworkContent.js:99-136](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/ebi-global-includes/script/4_ebiFrameworkContent.js#L99-L136 "Source code on GitHub")
Active tabs in `#masthead-black-bar` accoriding to metadata
## ebiFrameworkActivateBlackBar
[js/script.js:245-282](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/script.js#L245-L282 "Source code on GitHub")
Active tabs in `#masthead-black-bar` accoriding to metadata
## ebiFrameworkInsertEMBLdropdown
[js/ebi-global-includes/script/4_ebiFrameworkContent.js:58-121](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/ebi-global-includes/script/4_ebiFrameworkContent.js#L58-L121 "Source code on GitHub")
[js/ebi-global-includes/script/4_ebiFrameworkContent.js:141-235](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/ebi-global-includes/script/4_ebiFrameworkContent.js#L141-L235 "Source code on GitHub")
Insert EMBL dropdown menu into `#masthead-black-bar`
## ebiFrameworkInsertEMBLdropdown
[js/script.js:203-266](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/script.js#L203-L266 "Source code on GitHub")
[js/script.js:287-381](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/script.js#L287-L381 "Source code on GitHub")
Insert EMBL dropdown menu into `#masthead-black-bar`
## ebiFrameworkUpdateFoot
[js/ebi-global-includes/script/4_ebiFrameworkContent.js:126-156](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/ebi-global-includes/script/4_ebiFrameworkContent.js#L126-L156 "Source code on GitHub")
[js/ebi-global-includes/script/4_ebiFrameworkContent.js:240-270](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/ebi-global-includes/script/4_ebiFrameworkContent.js#L240-L270 "Source code on GitHub")
Insert EBI Footer into `#global-nav-expanded`
## ebiFrameworkUpdateFoot
[js/script.js:271-301](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/script.js#L271-L301 "Source code on GitHub")
[js/script.js:386-416](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/script.js#L386-L416 "Source code on GitHub")
Insert EBI Footer into `#global-nav-expanded`
## ebiFrameworkUpdateFooterMeta
[js/ebi-global-includes/script/4_ebiFrameworkContent.js:161-175](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/ebi-global-includes/script/4_ebiFrameworkContent.js#L161-L175 "Source code on GitHub")
[js/ebi-global-includes/script/4_ebiFrameworkContent.js:275-289](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/ebi-global-includes/script/4_ebiFrameworkContent.js#L275-L289 "Source code on GitHub")
Insert footer meta info into `#ebi-footer-meta`
## ebiFrameworkUpdateFooterMeta
[js/script.js:306-320](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/script.js#L306-L320 "Source code on GitHub")
[js/script.js:421-435](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/script.js#L421-L435 "Source code on GitHub")
Insert footer meta info into `#ebi-footer-meta`
## ebiFrameworkCookieBanner
[js/ebi-global-includes/script/5_ebiFrameworkCookieBanner.js:4-72](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/ebi-global-includes/script/5_ebiFrameworkCookieBanner.js#L4-L72 "Source code on GitHub")
[js/ebi-global-includes/script/5_ebiFrameworkCookieBanner.js:4-72](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/ebi-global-includes/script/5_ebiFrameworkCookieBanner.js#L4-L72 "Source code on GitHub")
Insert and show the cookie banner.
## ebiFrameworkCookieBanner
[js/script.js:335-403](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/script.js#L335-L403 "Source code on GitHub")
[js/script.js:450-518](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/script.js#L450-L518 "Source code on GitHub")
Insert and show the cookie banner.
## ebiFrameworkInvokeScripts
[js/ebi-global-includes/script/6_ebiFrameworkInvokeScripts.js:7-18](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/ebi-global-includes/script/6_ebiFrameworkInvokeScripts.js#L7-L18 "Source code on GitHub")
[js/ebi-global-includes/script/6_ebiFrameworkInvokeScripts.js:7-20](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/ebi-global-includes/script/6_ebiFrameworkInvokeScripts.js#L7-L20 "Source code on GitHub")
All scripts are automatically loaded, unless the page asked us not to.
......@@ -218,7 +260,7 @@ Configurable with a data attribute:
## ebiFrameworkInvokeScripts
[js/script.js:411-422](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/script.js#L411-L422 "Source code on GitHub")
[js/script.js:526-539](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/script.js#L526-L539 "Source code on GitHub")
All scripts are automatically loaded, unless the page asked us not to.
......@@ -231,7 +273,7 @@ Configurable with a data attribute:
## ebiGaIndicateLoaded
[js/foundationExtendEBI.js:12-34](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L12-L34 "Source code on GitHub")
[js/foundationExtendEBI.js:12-34](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L12-L34 "Source code on GitHub")
We poll the document until we find GA has loaded, or we've tried a few times.
......@@ -242,13 +284,13 @@ We poll the document until we find GA has loaded, or we've tried a few times.
## setTimeout
[js/foundationExtendEBI.js:19-26](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L19-L26 "Source code on GitHub")
[js/foundationExtendEBI.js:19-26](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L19-L26 "Source code on GitHub")
If successful we append `.google-analytics-loaded` to the `body` tag.
## last
[js/foundationExtendEBI.js:42-46](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L42-L46 "Source code on GitHub")
[js/foundationExtendEBI.js:42-46](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L42-L46 "Source code on GitHub")
Utility method to get the last in an array
......@@ -262,7 +304,7 @@ Returns **var** the last item in the array
## lastGaEventTime
[js/foundationExtendEBI.js:52-52](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L52-L52 "Source code on GitHub")
[js/foundationExtendEBI.js:52-52](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L52-L52 "Source code on GitHub")
Track the last time an event was sent (don't double send)
......@@ -272,7 +314,7 @@ Track the last time an event was sent (don't double send)
## analyticsTrackInteraction
[js/foundationExtendEBI.js:71-102](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L71-L102 "Source code on GitHub")
[js/foundationExtendEBI.js:71-102](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L71-L102 "Source code on GitHub")
## Analytics tracking
......@@ -299,7 +341,7 @@ jQuery("body.google-analytics-loaded .analytics-content-footer").on('mousedown',
## ebiGaInit
[js/foundationExtendEBI.js:111-194](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L111-L194 "Source code on GitHub")
[js/foundationExtendEBI.js:111-194](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L111-L194 "Source code on GitHub")
If GA is found, we initialise the tracking of various default areas
......@@ -310,7 +352,7 @@ but we're running against the page's unload -- so speed over elegance.
## addBlankTargetToExternalLinkEBI
[js/foundationExtendEBI.js:200-207](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L200-L207 "Source code on GitHub")
[js/foundationExtendEBI.js:200-207](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L200-L207 "Source code on GitHub")
Programatically open external links in new tabs
......@@ -320,7 +362,7 @@ Programatically open external links in new tabs
## addExternalToBlankWindowLinksEBI
[js/foundationExtendEBI.js:213-218](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L213-L218 "Source code on GitHub")
[js/foundationExtendEBI.js:213-218](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L213-L218 "Source code on GitHub")
Programatically add '.external' to external links
......@@ -330,7 +372,7 @@ Programatically add '.external' to external links
## activateEMBLdropdown
[js/foundationExtendEBI.js:231-260](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L231-L260 "Source code on GitHub")
[js/foundationExtendEBI.js:231-260](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L231-L260 "Source code on GitHub")
## Activate EMBL dropdown menu
......@@ -343,25 +385,25 @@ If you pass options as 'reInit', it will destory any existing menu and add a new
## smoothScrollAnchorLinksEBI
[js/foundationExtendEBI.js:265-288](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L265-L288 "Source code on GitHub")
[js/foundationExtendEBI.js:265-288](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L265-L288 "Source code on GitHub")
Smooth scroll anchor links for jQuery users
## invokeResponsiveMenuEBI
[js/foundationExtendEBI.js:293-401](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L293-L401 "Source code on GitHub")
[js/foundationExtendEBI.js:293-401](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L293-L401 "Source code on GitHub")
Make the local nav menu responsive to the browser window width
## jQuery
[js/foundationExtendEBI.js:406-496](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L406-L496 "Source code on GitHub")
[js/foundationExtendEBI.js:406-496](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L406-L496 "Source code on GitHub")
Default invokation of foundationExtendEBI
## bodyData
[js/foundationExtendEBI.js:468-468](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L468-L468 "Source code on GitHub")
[js/foundationExtendEBI.js:468-468](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L468-L468 "Source code on GitHub")
## Allow invokation of Foundation and foundationExtendEBI with data attributes
......@@ -372,7 +414,7 @@ Background: <https://github.com/ebiwd/EBI-Framework/issues/77>
## foundationInvoke
[js/foundationExtendEBI.js:473-477](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L473-L477 "Source code on GitHub")
[js/foundationExtendEBI.js:473-477](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L473-L477 "Source code on GitHub")
**Examples**
......@@ -382,7 +424,7 @@ Background: <https://github.com/ebiwd/EBI-Framework/issues/77>
## foundationExtendEBI
[js/foundationExtendEBI.js:482-486](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L482-L486 "Source code on GitHub")
[js/foundationExtendEBI.js:482-486](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L482-L486 "Source code on GitHub")
**Examples**
......@@ -392,7 +434,7 @@ Background: <https://github.com/ebiwd/EBI-Framework/issues/77>
## addExternal
[js/foundationExtendEBI.js:491-494](https://github.com/ebiwd/EBI-Framework/blob/b1bab6c6eeecb62a7df065340842e4eeba6de14d/js/foundationExtendEBI.js#L491-L494 "Source code on GitHub")
[js/foundationExtendEBI.js:491-494](https://github.com/ebiwd/EBI-Framework/blob/e71db4ada9dcc94877c511f8915cb399e5c002f6/js/foundationExtendEBI.js#L491-L494 "Source code on GitHub")
**Examples**
......
js/ebi-global-includes/script/4_ebiFrameworkContent.js
+ 101
− 27
View file @ 73b7cc14
......@@ -58,38 +58,81 @@ function ebiFrameworkAssignImageByMetaTags() {
function ebiFrameworkPopulateBlackBar() {
try {
// Clear any existing black bar contents
if ((elem=document.getElementById('masthead-black-bar')) !== null) {
document.getElementById('masthead-black-bar').innerHTML = "&nbsp;";
}
// if ((elem=document.getElementById('masthead-black-bar')) !== null) {
// document.getElementById('masthead-black-bar').innerHTML = "&nbsp;";
// }
var barContents = document.createElement("div");
barContents.innerHTML = '<nav class="row">'+
'<ul id="global-nav" class="menu global-nav text-right">'+
'<li class="home-mobile"><a href="//www.ebi.ac.uk"></a></li>'+
'<li class="location embl hide"><a href="http://www.embl.org">EMBL</a></li>'+
'<li class="location ebi hide"><a href="//www.ebi.ac.uk">EBI</a></li>'+
'<li class="location barcelona hide"><a href="#">Barcelona</a></li>'+
'<li class="location hamburg hide"><a href="#">Hamburg</a></li>'+
'<li class="location grenoble hide"><a href="#">Heidelberg</a></li>'+
'<li class="location grenoble hide"><a href="#">Grenoble</a></li>'+
'<li class="location rome hide"><a href="#">Rome</a></li>'+
'<li class="float-right show-for-medium embl-selector">'+
'<button class="button float-right">&nbsp;</button>'+
'</li>'+
'<ul id="global-nav" class="menu global-nav">'+
'<li class="where embl hide"><a href="http://www.embl.org">More EMBL sites:</a></li>'+
// '<li class="where embl hide"><a href="http://www.embl.org">EMBL</a></li>'+
'<li class="where ebi hide"><a href="//www.ebi.ac.uk">EBI</a></li>'+
'<li class="where barcelona hide"><a href="#">Barcelona</a></li>'+
'<li class="where hamburg hide"><a href="#">Hamburg</a></li>'+
'<li class="where heidelberg hide"><a href="#">Heidelberg</a></li>'+
'<li class="where grenoble hide"><a href="#">Grenoble</a></li>'+
'<li class="where rome hide"><a href="#">Rome</a></li>'+
'<li class="float-right search">'+
'<a href="#" data-toggle="search-global-dropdown"><span class="show-for-small-only">Search</span></a>'+
'<div id="search-global-dropdown" class="dropdown-pane" data-dropdown data-options="closeOnClick:true;">'+
'</div>'+
'</li>'+
'<li class="about"><a href="//www.ebi.ac.uk/about">About us</a></li>'+
'<li class="training"><a href="//www.ebi.ac.uk/training">Training</a></li>'+
'<li class="research"><a href="//www.ebi.ac.uk/research">Research</a></li>'+
'<li class="services"><a href="//www.ebi.ac.uk/services">Services</a></li>'+
'<li class="what mission hide"><a href="//www.embl.org">More mission areas:</a></li>'+
'<li class="what about"><a href="//www.ebi.ac.uk/about">About us</a></li>'+
'<li class="what training"><a href="//www.ebi.ac.uk/training">Training</a></li>'+
'<li class="what research"><a href="//www.ebi.ac.uk/research">Research</a></li>'+
'<li class="what services"><a href="//www.ebi.ac.uk/services">Services</a></li>'+
'<li class="float-right embl-selector">'+
'<a class="button float-right">&nbsp;</a>'+
'</li>'+
'</ul>'+
'</nav>';
document.getElementById("masthead-black-bar").insertBefore(barContents,document.getElementById("masthead-black-bar").firstChild);
document.getElementById("masthead-black-bar").innerHTML = barContents.innerHTML;
}
catch(err) {};
}
/**
* Active tabs in `#masthead-black-bar` accoriding to metadata
*/
function ebiFrameworkActivateBlackBar() {
// Look at the embl:facet-* meta tags to set active states
// <meta name="embl:facet-who" content="primary" data-tag="Sample group" />
// <meta name="embl:facet-what" content="parent" data-tag="Research" />
// <meta name="embl:facet-where" content="parent" data-tag="EBI" />
try {
function ebiGetFacet(passedAttribute){
var tag = "#masthead-black-bar ." + passedAttribute.toLowerCase();
return document.querySelectorAll(tag)[0];
}
var metas = document.getElementsByTagName('meta');
for (var i = 0; i < metas.length; i++) {
if (metas[i].getAttribute("name") == "embl:facet-who") {
if (metas[i].getAttribute("content").toLowerCase() == "parent") {
var targetFacet = ebiGetFacet(metas[i].getAttribute("data-tag"));
// todo: insert this as a new facet, i think?
}
}
if (metas[i].getAttribute("name") == "embl:facet-what") {
if (metas[i].getAttribute("content").toLowerCase() == "parent") {
var targetFacet = ebiGetFacet(metas[i].getAttribute("data-tag"));
ebiToggleClass(targetFacet,'active');
}
}
if (metas[i].getAttribute("name") == "embl:facet-where") {
if (metas[i].getAttribute("content").toLowerCase() == "parent") {
var targetFacet = ebiGetFacet(metas[i].getAttribute("data-tag"));
ebiToggleClass(targetFacet,'active');
ebiToggleClass(targetFacet,'hide'); // as we hide these by default
}
}
}
}
catch(err) {};
}
/**
......@@ -110,14 +153,14 @@ function ebiFrameworkInsertEMBLdropdown() {
'</div>'+
'<div class="columns medium-8">'+
'<div class="large-8 medium-12">'+
'<p><h3 class="inline white-color">EMBL</h3> was founded in 1974 by its member states to promote the molecular life sciences in Europe and beyond.</p>'+
'<p><h3 class="inline">EMBL</h3> was founded in 1974 by its member states to promote the molecular life sciences in Europe and beyond.</p>'+
'</div>'+
'<div class="row large-up-5 medium-up-3 small-up-2 no-underline">'+
'<div class="column"><a class="" href="#research"><h5 class="inline white-color underline">Research</h5> the molecular basis of life</a></div>'+
'<div class="column"><a class="" href="#"><h5 class="inline white-color underline">Services</h5> and infrastructure for research</a></div>'+
'<div class="column"><a class="" href="#"><h5 class="inline white-color underline">Training</h5> and inspiring scientists</a></div>'+
'<div class="column"><a class="" href="#"><h5 class="inline white-color underline">Transfer</h5> and deverlopment of technology</a></div>'+
'<div class="column"><a class="" href="#"><h5 class="inline white-color underline">Integrating</h5> life science research in Europe</a></div>'+
'<div class="column"><a class="" href="#research"><h5 class="inline underline">Research</h5> the molecular basis of life</a></div>'+
'<div class="column"><a class="" href="#"><h5 class="inline underline">Services</h5> and infrastructure for research</a></div>'+
'<div class="column"><a class="" href="#"><h5 class="inline underline">Training</h5> and inspiring scientists</a></div>'+
'<div class="column"><a class="" href="#"><h5 class="inline underline">Transfer</h5> and deverlopment of technology</a></div>'+
'<div class="column"><a class="" href="#"><h5 class="inline underline">Integrating</h5> life science research in Europe</a></div>'+
'</div>'+
'<div class="margin-top-xlarge no-underline">'+
'<h3><a href="//embl.org" class="readmore">More about EMBL</a></h3>'+
......@@ -125,7 +168,7 @@ function ebiFrameworkInsertEMBLdropdown() {
'</div>'+
'<div class="columns medium-4">'+
'<div class="large-10 medium-12">'+
'<p><h3 class="inline white-color">Six locations</h3> represent EMBL across Europe, each has its own focus.</p>'+
'<p><h3 class="inline">Six locations</h3> represent EMBL across Europe, each has its own focus.</p>'+
'</div>'+
'<div class="row large-up-3 medium-up-2 small-up-2">'+
'<div class="column"><h5><a href="//www.embl-barcelona.es/">Barcelona</a></h5><p class="small">Tissue biology and disease modelling</p></div>'+
......@@ -156,6 +199,37 @@ function ebiFrameworkInsertEMBLdropdown() {
window.scrollTo(0, 0);
}, false);
// we do this bit with jquery to prototype, would need ro rewire as vanilla JS..
// we do this bit with jquery to prototype, would need ro rewire as vanilla JS..
$('#masthead-black-bar .where.active').on('mouseover', function() {
emblResetContext(); // clear any other states
$('#masthead-black-bar .where.hide').addClass('hover').removeClass('hide');
// $('#masthead-black-bar .where.hide').removeClass('hide').addClass('hover');
$('#masthead-black-bar .what').addClass('hide');
});
$('#masthead-black-bar .what.active').on('mouseover', function() {
emblResetContext(); // clear any other states
$('#masthead-black-bar .what.mission').removeClass('hide');
$('#masthead-black-bar .what').addClass('hover');
});
// reset when user engages with content
function emblResetContext() {
// ebiFrameworkActivateBlackBar();
$('#masthead-black-bar .where.hover').removeClass('hover').addClass('hide');
$('#masthead-black-bar .what').removeClass('hide');
$('#masthead-black-bar .what.mission').addClass('hide');
$('#masthead-black-bar .what.hover').removeClass('hover');
// reset everything on the next mouse into content
$('#content').one('mouseover', function() {
console.log('purged');
emblResetContext();
});
}
}
catch(err) {};
}
......
js/ebi-global-includes/script/6_ebiFrameworkInvokeScripts.js
+ 1
− 0
View file @ 73b7cc14
......@@ -6,6 +6,7 @@
*/
function ebiFrameworkInvokeScripts() {
ebiFrameworkPopulateBlackBar();
ebiFrameworkActivateBlackBar();
ebiFrameworkExternalLinks();
ebiFrameworkManageGlobalSearch();
ebiFrameworkSearchNullError();
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment