diff --git a/bin/copy-assets b/bin/copy-assets index bec61aec..1ddb1785 100755 --- a/bin/copy-assets +++ b/bin/copy-assets @@ -9,4 +9,4 @@ cp node_modules/jquery/dist/jquery.min.js server/public/assets/javascripts/jquer cp node_modules/jquery/dist/jquery.min.map server/public/assets/javascripts/jquery.min.map cp node_modules/ol/src/ol.css server/public/assets/stylesheets/ol.css cp node_modules/govuk_frontend_toolkit/javascripts/govuk/show-hide-content.js server/public/assets/javascripts/show-hide-content.js -cp client/js/triage.js server/public/build/javascripts/triage.js \ No newline at end of file +cp -R client/js/modules/* server/public/build/javascripts/ \ No newline at end of file diff --git a/client/js/defra-map/index.js b/client/js/defra-map/index.js index d00ee064..ee1a7dc7 100644 --- a/client/js/defra-map/index.js +++ b/client/js/defra-map/index.js @@ -577,7 +577,7 @@ getDefraMapConfig().then((defraMapConfig) => { addLabel: 'Add boundary', updateLabel: 'Update boundary', submitLabel: 'Get summary report', - helpLabel: 'How to draw a shape', + helpLabel: 'How to draw a boundary', keyLabel: 'Report area', html: '

For an approximate site boundary:


For a more detailed site boundary:

', defaultUrl: '/map/styles/polygon-default', diff --git a/client/js/modules/about-map.js b/client/js/modules/about-map.js new file mode 100644 index 00000000..0c61774c --- /dev/null +++ b/client/js/modules/about-map.js @@ -0,0 +1,10 @@ +import { setCookie } from './cookies.js' + +const element = document.getElementById('dont-show-again') +element.onchange = (element) => { + if (element.target.checked) { + setCookie('Skip-changes-to-flood-data', 'true', 30) + } else { + setCookie('Skip-changes-to-flood-data', 'true', -365) + } +} diff --git a/client/js/modules/cookies.js b/client/js/modules/cookies.js new file mode 100644 index 00000000..f6084a6b --- /dev/null +++ b/client/js/modules/cookies.js @@ -0,0 +1,6 @@ +export const setCookie = (cName, cValue, expDays) => { + const date = new Date() + date.setTime(date.getTime() + expDays * 24 * 60 * 60 * 1000) + const expires = 'expires=' + date.toUTCString() + document.cookie = cName + '=' + cValue + '; ' + expires + '; path=/' +} diff --git a/client/js/modules/triage.js b/client/js/modules/triage.js new file mode 100644 index 00000000..fa899601 --- /dev/null +++ b/client/js/modules/triage.js @@ -0,0 +1,10 @@ +const updateLocation = (src) => { + const button = document.getElementById('continue-button') + if (button) { + button.href = src.value + } +} + +Array.from(document.getElementsByName('triage-options')).forEach((element) => { + element.onclick = () => updateLocation(element) +}) diff --git a/client/js/triage.js b/client/js/triage.js deleted file mode 100644 index 63eba551..00000000 --- a/client/js/triage.js +++ /dev/null @@ -1,14 +0,0 @@ -const updateLocation = (src) => { - const button = document.getElementById('continue-button') - if (button) { - button.href = src.value - } -} - -const assignClickEvents = (document) => { - Array.from(document.getElementsByName('triage-options')).forEach((element) => { - element.onclick = () => updateLocation(element) - }) -} - -export { assignClickEvents } diff --git a/jest.config.js b/jest.config.js index b1497a5b..b7abe160 100644 --- a/jest.config.js +++ b/jest.config.js @@ -1,13 +1,13 @@ -const { setImmediate } = require('timers') - module.exports = async () => { - return { + const config = { testPathIgnorePatterns: [ - 'defra-map' + '/defra-map' ], testEnvironment: 'jsdom', globals: { setImmediate - } + }, + setupFilesAfterEnv: ['/jest.env.js'] } + return config } diff --git a/jest.env.js b/jest.env.js new file mode 100644 index 00000000..f1c7ef81 --- /dev/null +++ b/jest.env.js @@ -0,0 +1,2 @@ +const { setImmediate } = require('timers') +global.setImmediate = setImmediate diff --git a/package.json b/package.json index 0f5b0f60..24b5b9d7 100644 --- a/package.json +++ b/package.json @@ -22,6 +22,7 @@ "unit-test": "lab --verbose -l -c -r console -o stdout -r lcov -o lcov.info", "unit-test-quiet": "lab -l -s", "test": "npm run lint && npm run unit-test", + "jest": "jest", "test-bail": "lab -l --bail", "postinstall": "npm run build", "kill": "sudo kill -9 $(sudo lsof -t -i:3000)", diff --git a/server/plugins/router.js b/server/plugins/router.js index 32b6e206..7a996937 100644 --- a/server/plugins/router.js +++ b/server/plugins/router.js @@ -1,5 +1,6 @@ const routes = [].concat( require('../routes/defra-map'), + require('../routes/about-map'), require('../routes/triage'), require('../routes/defra-map/map-config'), require('../routes/defra-map/styles'), diff --git a/server/routes/about-map.js b/server/routes/about-map.js new file mode 100644 index 00000000..c3262596 --- /dev/null +++ b/server/routes/about-map.js @@ -0,0 +1,17 @@ +module.exports = [ + { + method: 'GET', + path: '/about-map', + options: { + description: 'About Map Page', + handler: async (request, h) => { + const cookies = request.state + const skipAboutMapPage = (cookies['Skip-changes-to-flood-data'] === 'true') + if (skipAboutMapPage) { + return h.redirect('/map') + } + return h.view('about-map') + } + } + } +] diff --git a/server/routes/about-map.spec.js b/server/routes/about-map.spec.js new file mode 100644 index 00000000..8871916b --- /dev/null +++ b/server/routes/about-map.spec.js @@ -0,0 +1,49 @@ +const createServer = require('../../server') + +describe('About Map Page', () => { + const values = { server: undefined } + + beforeAll(async () => { + values.server = await createServer() + await values.server.initialize() + values.response = await values.server.inject({ method: 'GET', url: '/about-map' }) + document.body.innerHTML = values.response.payload + require('../../client/js/modules/about-map') + }) + + afterAll(async () => { + await values.server.stop() + }) + + it('should respond with 200', async () => { + expect(values.response.statusCode).toBe(200) + }) + + it('should have the heading "Changes to flood data"', async () => { + const heading = document.querySelector('.govuk-heading-xl') + expect(heading.textContent).toBe('Changes to flood data') + }) + + it('should not have any cookies set', async () => { + expect(document.cookie).toBe('') + }) + + it('should toggle Skip-changes-to-flood-data cookie if dont-show-again is clicked', async () => { + const dontShowAgain = document.getElementById('dont-show-again') + dontShowAgain.click() + expect(document.cookie).toBe('Skip-changes-to-flood-data=true') + dontShowAgain.click() + expect(document.cookie).toBe('') + }) + + it('should redirect to /map if Skip-changes-to-flood-data cookie is set to true ', async () => { + const headers = { cookie: 'Skip-changes-to-flood-data=true;' } + const response = await values.server.inject({ + method: 'GET', + url: '/about-map', + headers + }) + expect(response.statusCode).toBe(302) + expect(response.headers.location).toBe('/map') + }) +}) diff --git a/server/routes/triage.spec.js b/server/routes/triage.spec.js index 88293e4a..44af9261 100644 --- a/server/routes/triage.spec.js +++ b/server/routes/triage.spec.js @@ -1,5 +1,4 @@ const createServer = require('../../server') -const { assignClickEvents } = require('../../client/js/triage') describe('Triage Page', () => { let server @@ -14,7 +13,7 @@ describe('Triage Page', () => { continue: document.getElementById('continue-button') }) // We have to assignClickEvents here as they dont get assigned by assigning innerHTML - assignClickEvents(document) + require('../../client/js/modules/triage') }) afterAll(async () => { diff --git a/server/views/about-map.html b/server/views/about-map.html new file mode 100644 index 00000000..a4e79732 --- /dev/null +++ b/server/views/about-map.html @@ -0,0 +1,188 @@ +{% extends "layout.html" %} +{% from "summary-list/macro.njk" import govukSummaryList %} + + +{% block pageTitle %} +What flood information do you need? Flood map for planning - GOV.UK +{% endblock %} + +{% block content %} +{{ super() }} + +
+
+ +

Changes to flood data

+ +

+ This service now includes data from the new national flood risk assessment (NaFRA2). +

+ +

+ We have updated flood zones 2 and 3 to include local, detailed models and a new, improved national model. +

+ +

+ + See updates to national flood and coastal erosion risk information + .  +

+
+ +
+ +
+
+

Rivers and the sea

+
+ +
+ +
+

Present day

+
+ +
+
+ +
+
Defended
+
+
    +
  • 3.3% AEP
    • +
  • 1% fluvial and 0.5% tidal AEP
    • +
  • 0.1% AEP
    • +
+
+
+ +
+
+

Undefended

+
+
+
    +
  • 1% fluvial and 0.5% tidal AEP
    • +
  • 0.1% AEP
    • +
+
+
+
+
+ +
+ +
+

Climate change

+
+
+
+ +
+
Defended
+
+
    +
  • 3.3% AEP
    • +
  • 1% fluvial and 0.5% tidal AEP
    • +
  • 0.1% AEP
    • +
+
+
+
+
+

Undefended

+
+
+
    +
  • + 1% fluvial and 0.5% tidal AEP +
    • +
  • + 0.1% AEP +
    • +
+
+
+
+
+ Allowances +
+
+
    +
  • the allowances used have been chosen from the Environment Agency’s Flood risk + assessment: climate change allowances +
    • +
  • for river flooding we have used the ‘central’ allowance – based on the 50th percentile for the + 2080s epoch
    • +
  • for sea and tidal flooding we have used the ‘upper end’ allowance – based on the 95th percentile + for 2125
    • +
+
+
+
+
+
+ +
+
+

Surface water

+
+
+
+ +
+
+ Present day +
+
+
    +
  • 3.3% AEP
    • +
  • 1% AEP
    • +
  • 0.1% AEP
    • +
+
+
+
+
+ +
+ +
+ +
+ +
+
+
+
+ + +
+
+
+
+ + + Continue + + + + + +
+
+
+
+ +{% endblock %} +{% block bodyEnd %} + {{ super() }} + +{% endblock %} diff --git a/server/views/cookies.html b/server/views/cookies.html index 23f2a6b4..d83a7c1d 100644 --- a/server/views/cookies.html +++ b/server/views/cookies.html @@ -54,6 +54,13 @@

Essential cookies

Saves your cookie consent settings 1 year + + + Skip-changes-to-flood-data + Allows users to skip the 'Changes to flood data page' + 30 days + +

Analytics cookies (optional)

diff --git a/server/views/triage.html b/server/views/triage.html index cdc51351..4e6e3ccf 100644 --- a/server/views/triage.html +++ b/server/views/triage.html @@ -1,4 +1,5 @@ {% extends "layout.html" %} +{% from "radios/macro.njk" import govukRadios %} {% block pageTitle %} What flood information do you need? Flood map for planning - GOV.UK @@ -7,7 +8,6 @@ {% block content %} {{ super() }} -{% from "radios/macro.njk" import govukRadios %}

What flood information do you need?

@@ -58,8 +58,5 @@

What flood information do you need?

{% endblock %} {% block bodyEnd %} {{ super() }} - + {% endblock %}