govuk_publishing_components 9.13.0 → 9.14.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/assets/javascripts/govuk_publishing_components/components/step-by-step-nav.js +8 -18
- data/app/views/govuk_publishing_components/components/docs/step_by_step_nav.yml +14 -18
- data/config/routes.rb +1 -1
- data/lib/govuk_publishing_components/presenters/machine_readable/article_schema.rb +24 -1
- data/lib/govuk_publishing_components/version.rb +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: '0728a64f2f0fc18019ddf15ee6eae25ce7e1372783163cc99fa82e70653f1dca'
|
4
|
+
data.tar.gz: 5f335f94637469efe80af8c17cd63fba0e5de6a04c919fa63bea08c8cf9e40f0
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: a1a5ce40351d6682df52aaa4b38edc225bb29ce13cad65b04f9a085303c8892cba201c27e786505e63e8c53c7a3bdf2abf925f83bbe8d54154d7c9e1ed773ead
|
7
|
+
data.tar.gz: 8c0b59628431aeea2f132a47b68cfb8e782250620fb3c8d3ab9ab40d7c8d0e568fc1b91dc0d161dd5cbc4d6e8bbe1845117f8cc602f8bdc893c47879de9a00fc
|
@@ -232,32 +232,22 @@
|
|
232
232
|
return;
|
233
233
|
}
|
234
234
|
|
235
|
-
var lastClicked = loadFromSessionStorage(sessionStoreLink);
|
235
|
+
var lastClicked = loadFromSessionStorage(sessionStoreLink) || $element.find('.' + activeLinkClass).first().attr('data-position');
|
236
236
|
|
237
|
-
|
238
|
-
|
239
|
-
|
240
|
-
|
241
|
-
lastClicked = $element.find('.' + activeLinkClass).first().find('.js-link').attr('data-position');
|
242
|
-
}
|
243
|
-
removeActiveStateFromAllButCurrent($activeLinks, lastClicked);
|
244
|
-
setActiveStepClass();
|
245
|
-
} else {
|
246
|
-
var activeLinkInActiveStep = $element.find('.' + activeStepClass).find('.' + activeLinkClass).first();
|
247
|
-
|
248
|
-
if (activeLinkInActiveStep.length) {
|
249
|
-
$activeLinks.removeClass(activeLinkClass);
|
250
|
-
activeLinkInActiveStep.addClass(activeLinkClass);
|
251
|
-
} else {
|
252
|
-
$activeLinks.slice(1).removeClass(activeLinkClass);
|
253
|
-
}
|
237
|
+
// it's possible for the saved link position value to not match any of the currently duplicate highlighted links
|
238
|
+
// so check this otherwise it'll take the highlighting off all of them
|
239
|
+
if (!$element.find('.js-link[data-position="' + lastClicked + '"]').parent().hasClass(activeLinkClass)) {
|
240
|
+
lastClicked = $element.find('.' + activeLinkClass).first().find('.js-link').attr('data-position');
|
254
241
|
}
|
242
|
+
removeActiveStateFromAllButCurrent($activeLinks, lastClicked);
|
243
|
+
setActiveStepClass();
|
255
244
|
}
|
256
245
|
|
257
246
|
function removeActiveStateFromAllButCurrent($activeLinks, current) {
|
258
247
|
$activeLinks.each(function() {
|
259
248
|
if ($(this).find('.js-link').attr('data-position').toString() !== current.toString()) {
|
260
249
|
$(this).removeClass(activeLinkClass);
|
250
|
+
$(this).find('.visuallyhidden').remove();
|
261
251
|
}
|
262
252
|
});
|
263
253
|
}
|
@@ -215,19 +215,16 @@ examples:
|
|
215
215
|
contents: [
|
216
216
|
{
|
217
217
|
href: '/component-guide/step_by_step_navigation/with_links/preview',
|
218
|
-
text: 'Obtain a driving licence prior to driving a car'
|
219
|
-
active: true
|
218
|
+
text: 'Obtain a driving licence prior to driving a car'
|
220
219
|
},
|
221
220
|
{
|
222
221
|
href: '/component-guide/step_by_step_navigation/with_links/preview',
|
223
222
|
text: 'Acquire food before attempting to cook',
|
224
|
-
context: '1p to £20'
|
225
|
-
active: true
|
223
|
+
context: '1p to £20'
|
226
224
|
},
|
227
225
|
{
|
228
226
|
href: '/component-guide/step_by_step_navigation/with_links/preview',
|
229
|
-
text: 'Maintain contact with the ground at all times'
|
230
|
-
active: true
|
227
|
+
text: 'Maintain contact with the ground at all times'
|
231
228
|
}
|
232
229
|
]
|
233
230
|
},
|
@@ -241,14 +238,12 @@ examples:
|
|
241
238
|
contents: [
|
242
239
|
{
|
243
240
|
href: '/component-guide/step_by_step_navigation/',
|
244
|
-
text: 'Leave school at sixteen'
|
245
|
-
active: true
|
241
|
+
text: 'Leave school at sixteen'
|
246
242
|
},
|
247
243
|
{
|
248
244
|
href: '/component-guide/step_by_step_navigation/',
|
249
245
|
text: 'Continue into higher education',
|
250
|
-
context: '£9,500'
|
251
|
-
active: true
|
246
|
+
context: '£9,500'
|
252
247
|
}
|
253
248
|
]
|
254
249
|
}
|
@@ -272,8 +267,7 @@ examples:
|
|
272
267
|
},
|
273
268
|
{
|
274
269
|
href: '/component-guide/step_by_step_navigation/with_links/preview',
|
275
|
-
text: 'Do the things'
|
276
|
-
active: true
|
270
|
+
text: 'Do the things'
|
277
271
|
}
|
278
272
|
]
|
279
273
|
},
|
@@ -340,22 +334,24 @@ examples:
|
|
340
334
|
]
|
341
335
|
solve_the_double_dot_problem:
|
342
336
|
description: |
|
343
|
-
|
337
|
+
As shown, options can be passed to the component to highlight one step, expand one step by default, and highlight multiple links. These options should only be used when the component is in the sidebar. The step that is highlighted and expanded will be referred to as the active step (even though they are separate options, it is assumed that they will normally be applied to the same step).
|
344
338
|
|
345
|
-
|
339
|
+
If a link is in a step by step navigation more than once and the user is on that page, the backend doesn't know which link to highlight, so it highlights both of them.
|
346
340
|
|
347
|
-
|
341
|
+
JavaScript is included in the component to solve this. It uses sessionStorage to capture the data-position attribute of non-external links when clicked, and then uses this value to decide which link to highlight after the new page loads. It uses the value of the tracking_id option to uniquely identify the current step nav in the session (if this is not passed to the component this may result in other step navs having the wrong link highlighted).
|
348
342
|
|
349
|
-
|
343
|
+
If a user has not clicked a link (i.e. has visited the page without first clicking on a step by step navigation) only the first duplicate link will be highlighted. If that link is not in the active step, the JS makes the highlighted link's parent the active step. If there is no active step, the first active link will be highlighted (but there should always be an active step).
|
350
344
|
|
351
345
|
The example below will show all non-external links highlighted if JS is disabled. In the real world no more than two or three links are likely to be highlighted at once.
|
346
|
+
|
347
|
+
Changes to the active step and highlighted link are also applied on click, if the user clicks one of the other links that is to the same page (they are amended by the component to be jump links to the top of the page). Open this example using the 'preview' link and try clicking on the 'internal' links to see how it behaves.
|
352
348
|
data:
|
353
349
|
highlight_step: 2
|
354
350
|
show_step: 2
|
355
351
|
tracking_id: "example-id"
|
356
352
|
steps: [
|
357
353
|
{
|
358
|
-
title: "
|
354
|
+
title: "The active step",
|
359
355
|
contents: [
|
360
356
|
{
|
361
357
|
type: 'list',
|
@@ -383,7 +379,7 @@ examples:
|
|
383
379
|
]
|
384
380
|
},
|
385
381
|
{
|
386
|
-
title: "
|
382
|
+
title: "Not the active step",
|
387
383
|
contents: [
|
388
384
|
{
|
389
385
|
type: 'list',
|
data/config/routes.rb
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
GovukPublishingComponents::Engine.routes.draw do
|
2
|
-
root :
|
2
|
+
root to: 'component_guide#index', as: :component_guide
|
3
3
|
get ':component/preview' => 'component_guide#preview', as: :component_preview_all
|
4
4
|
get ':component/:example/preview' => 'component_guide#preview', as: :component_preview
|
5
5
|
get ':component' => 'component_guide#show', as: :component_doc
|
@@ -29,7 +29,7 @@ module GovukPublishingComponents
|
|
29
29
|
"url" => page.logo_url,
|
30
30
|
}
|
31
31
|
}
|
32
|
-
}.merge(image_schema).merge(author_schema).merge(body).merge(is_part_of)
|
32
|
+
}.merge(image_schema).merge(author_schema).merge(body).merge(is_part_of).merge(about)
|
33
33
|
end
|
34
34
|
|
35
35
|
private
|
@@ -98,6 +98,29 @@ module GovukPublishingComponents
|
|
98
98
|
image_placeholders: page.image_placeholders
|
99
99
|
)
|
100
100
|
end
|
101
|
+
|
102
|
+
def about
|
103
|
+
return {} unless live_taxons.any?
|
104
|
+
{
|
105
|
+
"about" => linked_taxons
|
106
|
+
}
|
107
|
+
end
|
108
|
+
|
109
|
+
def live_taxons
|
110
|
+
taxons = page.content_item.dig("links", "taxons")
|
111
|
+
return [] unless taxons
|
112
|
+
taxons.select { |taxon| taxon["phase"] == "live" }
|
113
|
+
end
|
114
|
+
|
115
|
+
def linked_taxons
|
116
|
+
live_taxons.map do |taxon|
|
117
|
+
{
|
118
|
+
"@context" => "http://schema.org",
|
119
|
+
"@type" => "CreativeWork",
|
120
|
+
"sameAs" => taxon["web_url"]
|
121
|
+
}
|
122
|
+
end
|
123
|
+
end
|
101
124
|
end
|
102
125
|
end
|
103
126
|
end
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: govuk_publishing_components
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 9.
|
4
|
+
version: 9.14.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- GOV.UK Dev
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2018-08-
|
11
|
+
date: 2018-08-15 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: govuk_app_config
|