Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add a banner to most of GOV.UK for the EU Referendum #769

Merged
merged 17 commits into from
Apr 15, 2016
Merged

Conversation

boffbowsh
Copy link
Contributor

There are two parts to this:

  • The bar itself, its styles and some JS logic that counts how many times it's been seen
  • JS logic that determines whether the bar should show, it runs in the header and toggles a CSS class before any styles are run (so the whole page doesn't jump). It's minified and inline, and doesn't use any libraries.
    • We've created a test spec that runs against the minified and unminified versions
    • A fake window object is used in the test spec so that location.pathname can be mocked

Rules about the bar:

  • Shows when cookie bar shows
  • Shows when browser upgrade bar shows
  • Hidden when survey shows
  • Hidden when emergency publishing in use
  • Hidden on register to vote and done pages
  • Hidden when JS disabled
  • Stops showing after it's been seen twice
  • Cookie expires after 28 days

screen shot 2016-04-15 at 12 07 29

screen shot 2016-04-15 at 12 04 55

screen shot 2016-04-15 at 12 06 59

screen shot 2016-04-15 at 12 06 35

dsingleton and others added 17 commits April 11, 2016 15:56
Respects 'hide_banner_notification', so will not be shown on the GOV.UK
homepage, which can add it's own banner content, as it does for the
emergency publishing system
To prevent the global bar from flashing or shifting the page up and
down, we want to check whether to show the bar as soon as possible, and
set a class if we want to show it.

* Include the full source in the test
* Run the test spec against source and the minified version

Ideally we would have the full source minified on the fly and injected
into the template.
The bar will never show for users without JS
* Don’t show on any paths beginning with /register-to-vote or /done

Testing this is a little tricky. Usually you’d create an intermediate
method for grabbing the pathname so that you can mock it. This doesn’t
work for the minified approach we’ve taken. Instead pass in a fake
window object for those specific test scopes.
Multiple bars will clash.
Make it clearer that this is the JS for toggling the HTML class –
responsible for hiding and showing it, rather than any interactions
related to the bar itself.
* Move from `after_header` to just before the main content block
* Add dismissible link which sets seen count to 999
Category: “Global bar”
Track when bar is shown, manually dismissed and automatically dismissed
Improve accessibility of the “Hide message” toggle.
Some apps haven’t set `strong` to be bold, eg collections. On these
pages the bar doesn’t display correctly.
The dismiss function isn’t working, so the bar would always show on
every pageview. Use conditional tags to remove the logic to show it.
}
}

function viewCount() {
Copy link
Contributor

@tvararu tvararu Apr 15, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

retrieve/get/readViewCount are ever so slightly more descriptive names, but don't bother updating unless you also think it's worth to.

@tvararu
Copy link
Contributor

tvararu commented Apr 15, 2016

Looks good to me functionally, found a missing semicolon I didn't bother to mention because I think there isn't anything we need to do before this goes out. 👍

@dsingleton dsingleton self-assigned this Apr 15, 2016
@dsingleton dsingleton merged commit 4c883a1 into master Apr 15, 2016
@dsingleton dsingleton deleted the global-bar branch April 15, 2016 12:44
@dsingleton dsingleton changed the title [Do not merge] Add a banner to most of GOV.UK for the EU Referendum Add a banner to most of GOV.UK for the EU Referendum Apr 15, 2016
fofr added a commit that referenced this pull request May 13, 2016
* Delete inline class toggle JS and spec
* Delete global bar markup and module for dismissing/storing view count
* Remove styles

We don’t intend to use this again soon.

Reverts #769
boffbowsh pushed a commit that referenced this pull request Mar 13, 2017
@steventux steventux mentioned this pull request Dec 4, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants