govuk_publishing_components 28.0.0 → 28.1.0

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 52ec5aa91a7d5060c6b29671f2206a967ab5af8a3891cb800c95d6b28eb09d15
4
- data.tar.gz: 0bbf50f1bb6f0cd64af2986e72a612fe28a65df3987caf523939fcf87e3341ad
3
+ metadata.gz: 2a90a944a517c66a97121936cc0fee97cf36ba037cbefc30579881313d0f9418
4
+ data.tar.gz: 526baf44347165d08e819351c05660ebb3cb7e54267ce1ae5c220898158d2660
5
5
  SHA512:
6
- metadata.gz: a144e7583969b1767bb25e64f64772d4c4e632814ba3863f6335570a3a83936eea4aa76daeb1b006f39910b5b6086f1f9f65ea63b3068f929bc167f2f5237ea2
7
- data.tar.gz: 78e13b419fba7b1eac89947ca9891e87f4939ed27456e093c474fbeca3afb291c6c86b002fbed478630b78671bd061637a208cf5f043656631b5d12e7b5af72c
6
+ metadata.gz: a23d9dac1fbfa5880ae7e7011f53f1f636a2cfbc1cd09820644a21dff75722846165dcb2774fdedfd652f5292280059fe186be788094ed34cd218ed989644bc9
7
+ data.tar.gz: 2c4508df86a087ba7c07e041cbcda0bd6119ea9585e3db24a31a0f6de152ad753ad99bb0e418498903eef6948d220d0d2fba40981ca1b78a66d46d65b3b3865c
@@ -7,11 +7,11 @@
7
7
 
8
8
  CustomDimensions.getAndExtendDefaultTrackingOptions = function (extraOptions) {
9
9
  var trackingOptions = this.customDimensions()
10
- return this.extend(trackingOptions, extraOptions)
10
+ return GOVUK.extendObject(trackingOptions, extraOptions)
11
11
  }
12
12
 
13
13
  CustomDimensions.customDimensions = function () {
14
- var dimensions = this.extend(
14
+ var dimensions = GOVUK.extendObject(
15
15
  {},
16
16
  customDimensionsFromBrowser(),
17
17
  customDimensionsFromMetaTags(),
@@ -25,24 +25,6 @@
25
25
  return dimensions
26
26
  }
27
27
 
28
- CustomDimensions.extend = function (out) {
29
- out = out || {}
30
-
31
- for (var i = 1; i < arguments.length; i++) {
32
- if (!arguments[i]) {
33
- continue
34
- }
35
-
36
- for (var key in arguments[i]) {
37
- if (Object.prototype.hasOwnProperty.call(arguments[i], key)) {
38
- out[key] = arguments[i][key]
39
- }
40
- }
41
- }
42
-
43
- return out
44
- }
45
-
46
28
  function customDimensionsFromBrowser () {
47
29
  var customDimensions = {
48
30
  dimension15: window.httpStatusCode || 200,
@@ -1,36 +1,41 @@
1
+ //= require ../vendor/polyfills/closest.js
1
2
  ;(function (global) {
2
3
  'use strict'
3
4
 
4
- var $ = global.jQuery
5
5
  var GOVUK = global.GOVUK || {}
6
6
 
7
7
  GOVUK.analyticsPlugins = GOVUK.analyticsPlugins || {}
8
8
  GOVUK.analyticsPlugins.mailtoLinkTracker = function () {
9
- var mailtoLinkSelector = 'a[href^="mailto:"]'
9
+ document.querySelector('body').addEventListener('click', function (event) {
10
+ var element = event.target
11
+ if (element.tagName !== 'A') {
12
+ element = element.closest('a')
13
+ }
10
14
 
11
- $('body').on('click', mailtoLinkSelector, trackClickEvent)
15
+ if (!element) {
16
+ return
17
+ }
12
18
 
13
- function trackClickEvent (evt) {
14
- var $link = getLinkFromEvent(evt)
15
- var options = { transport: 'beacon' }
16
- var href = $link.attr('href')
17
- var linkText = $.trim($link.text())
19
+ var href = element.getAttribute('href')
18
20
 
19
- if (linkText) {
20
- options.label = linkText
21
+ if (!href) {
22
+ return
21
23
  }
22
24
 
23
- GOVUK.analytics.trackEvent('Mailto Link Clicked', href, options)
24
- }
25
+ if (href.substring(0, 7) === 'mailto:') {
26
+ trackClickEvent(element, href)
27
+ }
28
+ })
25
29
 
26
- function getLinkFromEvent (evt) {
27
- var $target = $(evt.target)
30
+ function trackClickEvent (element, href) {
31
+ var options = { transport: 'beacon' }
32
+ var linkText = element.textContent
28
33
 
29
- if (!$target.is('a')) {
30
- $target = $target.parents('a')
34
+ if (linkText) {
35
+ options.label = linkText.trim()
31
36
  }
32
37
 
33
- return $target
38
+ GOVUK.analytics.trackEvent('Mailto Link Clicked', href, options)
34
39
  }
35
40
  }
36
41
 
@@ -1,4 +1,4 @@
1
- /* global GOVUK, $, ga */
1
+ /* global GOVUK, ga */
2
2
 
3
3
  (function () {
4
4
  'use strict'
@@ -20,7 +20,7 @@
20
20
  ga(function (tracker) {
21
21
  this.gaClientId = tracker.get('clientId')
22
22
 
23
- $(window).trigger('gaClientSet')
23
+ GOVUK.triggerEvent(window, 'gaClientSet')
24
24
 
25
25
  // Start up ecommerce tracking
26
26
  GOVUK.Ecommerce.start()
@@ -49,7 +49,7 @@
49
49
  // Add the cookie banner status as a custom dimension
50
50
  var cookieBannerShown = !this.getCookie('seen_cookie_message')
51
51
  var cookieBannerDimension = { dimension100: cookieBannerShown ? cookieBannerShown.toString() : 'false' }
52
- $.extend(options, cookieBannerDimension)
52
+ options = GOVUK.extendObject(options, cookieBannerDimension)
53
53
 
54
54
  var trackingOptions = GOVUK.CustomDimensions.getAndExtendDefaultTrackingOptions(options)
55
55
  this.analytics.trackPageview(path, title, trackingOptions)
@@ -83,7 +83,7 @@
83
83
 
84
84
  var cookieOptions = getOptionsFromCookie()
85
85
 
86
- $.extend(cookieOptions, options)
86
+ cookieOptions = GOVUK.extendObject(cookieOptions, options)
87
87
 
88
88
  this.setCookie('analytics_next_page_call', cookieOptions)
89
89
  }
@@ -1,4 +1,5 @@
1
1
  //= require govuk_publishing_components/lib/cookie-functions
2
+ //= require govuk_publishing_components/lib/extend-object
2
3
  //= require ./analytics/pii
3
4
  //= require ./analytics/google-analytics-universal-tracker
4
5
  //= require ./analytics/analytics
@@ -13,7 +14,6 @@
13
14
  //= require ./analytics/static-analytics
14
15
  //= require ./analytics/ecommerce
15
16
  //= require ./analytics/init
16
- //= require ./analytics/scroll-tracker
17
17
  //= require ./analytics/auto-scroll-tracker
18
18
  //= require ./analytics/explicit-cross-domain-links
19
19
  //= require ./analytics/track-click
@@ -0,0 +1,27 @@
1
+ window.GOVUK = window.GOVUK || {}
2
+ window.GOVUK.Modules = window.GOVUK.Modules || {};
3
+
4
+ (function (Modules) {
5
+ function Metadata ($module) {
6
+ this.$module = $module
7
+ }
8
+
9
+ Metadata.prototype.init = function () {
10
+ var seeAllUpdates = this.$module.querySelector('.js-see-all-updates-link')
11
+
12
+ if (seeAllUpdates) {
13
+ var target = document.querySelector(seeAllUpdates.getAttribute('href'))
14
+
15
+ if (target) {
16
+ seeAllUpdates.addEventListener('click', function () {
17
+ var targetToggleTrigger = target.querySelector('[aria-expanded]')
18
+ if (targetToggleTrigger && targetToggleTrigger.getAttribute('aria-expanded') !== 'true') {
19
+ targetToggleTrigger.click()
20
+ }
21
+ })
22
+ }
23
+ }
24
+ }
25
+
26
+ Modules.Metadata = Metadata
27
+ })(window.GOVUK.Modules)
@@ -145,4 +145,10 @@
145
145
  margin-bottom: $govuk-gutter;
146
146
  border-top: 1px solid $govuk-border-colour;
147
147
  }
148
+
149
+ code {
150
+ padding: 0 5px;
151
+ color: govuk-colour("red");
152
+ background-color: govuk-colour("light-grey");
153
+ }
148
154
  }
@@ -17,7 +17,7 @@
17
17
  classes << "gem-c-metadata--inverse" if inverse
18
18
  classes << shared_helper.get_margin_bottom if local_assigns[:margin_bottom]
19
19
  %>
20
- <%= content_tag :div, class: classes, data: { module: "gem-toggle" } do %>
20
+ <%= content_tag :div, class: classes, data: { module: "gem-toggle metadata" } do %>
21
21
  <dl data-module="gem-track-click">
22
22
  <% if from.any? %>
23
23
  <dt class="gem-c-metadata__term"><%= t("components.metadata.from") %>:</dt>
@@ -44,7 +44,7 @@
44
44
  <dd class="gem-c-metadata__definition">
45
45
  <%= last_updated %>
46
46
  <% if local_assigns.include?(:see_updates_link) %>
47
- &#8212; <a href="#history" class="gem-c-metadata__definition-link govuk-!-display-none-print"
47
+ &#8212; <a href="#history" class="gem-c-metadata__definition-link govuk-!-display-none-print js-see-all-updates-link"
48
48
  data-track-category="content-history"
49
49
  data-track-action="see-all-updates-link-clicked"
50
50
  data-track-label="history">
@@ -3,33 +3,34 @@ description: The accordion component lets users show and hide sections of relate
3
3
  govuk_frontend_components:
4
4
  - accordion
5
5
  body: |
6
- This component is based on the [design system accordion component](https://design-system.service.gov.uk/components/accordion/)
7
- and is currently experimental because more research is needed to validate it. If using this component, [please feed back any research findings to the Design System team](https://design-system.service.gov.uk/components/accordion/#next-steps).
6
+ This component is based on the [GOV.UK Design System accordion component](https://design-system.service.gov.uk/components/accordion/)
7
+ and is currently experimental because more research is needed to validate it. If using this component, [please feed back any research findings to the Design System team](https://design-system.service.gov.uk/get-in-touch/).
8
8
 
9
9
  accessibility_criteria: |
10
10
  The accordion must:
11
11
 
12
12
  * accept focus
13
13
  * be usable with a keyboard
14
- * the controls must change in appearance when keyboard focus moves to it
15
- * the controls must indicate when the mouse is hovered over it
14
+ * allow the controls to change in appearance when keyboard focus moves to it
15
+ * allow the controls to indicate when users hover their cursor over it
16
16
  * be usable with touch
17
17
  * be usable with voice commands
18
18
  * have visible text
19
19
  * indicate to users that each section can be expanded and collapsed
20
- * inform the user when a step has been expanded or collapsed
20
+ * tell the user when a step has been expanded or collapsed
21
21
  * be readable when only the [text of the page is zoomed in](https://support.mozilla.org/en-US/kb/font-size-and-zoom-increase-size-of-web-pages#w_how-to-only-change-the-size-of-the-text)
22
- * zoom in up to 300% without the text spilling off the screen
23
- * pass colour contrast
24
- * the accordion header button element has aria-controls set to the ID of the element containing the accordion panel content.
25
- * section content must have aria-label / aria-labelledby with a value that refers to the button that controls display of the content.
22
+ * zoom in up to 300% [without the text spilling off the screen](https://www.w3.org/WAI/WCAG21/Understanding/reflow.html)
23
+ * pass [colour contrast](https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum.html)
24
+ * be readable should a [user change colours](https://support.mozilla.org/en-US/kb/change-fonts-and-colors-websites-use)
25
+ * associate panel content with the control that opens it using the `aria-controls` attribute
26
+ * have `aria-label` / `aria-labelledby` on section content with a value that refers to the button that controls display of the content
26
27
 
27
- Section headings must use a button element:
28
+ Section headings must use a button element so that users:
28
29
 
29
- * so that sections can be toggled with the space and enter keys
30
- * so that sections can't be opened in a new tab or window
30
+ * can toggle sections with the space and enter keys
31
+ * cannot open sections in a new tab or window
31
32
 
32
- When JavaScript is unavailable the component must:
33
+ When CSS and / or JavaScript is unavailable, the component must:
33
34
 
34
35
  * be fully expanded
35
36
  * not be marked as expandable
@@ -57,9 +58,9 @@ examples:
57
58
  html: <p class="govuk-body">This is the content for How people read.</p>
58
59
  with_supplied_identification:
59
60
  description: |
60
- An `id` is optional as it's automatically generated, but it can be supplied if a specific `id` is required.
61
+ An `id` for an individual accordion is optional as it's automatically generated, but it can be supplied if a specific `id` is required.
61
62
 
62
- The `id` must be **unique** across the domain of your service - this is because as the open / closed state of individual instances of the accordion persists across page loads using `localStorage`.
63
+ The `id` must be unique across the domain of your service. This is because the open or closed state of individual instances of the accordion uses `localStorage` to persist across page loads.
63
64
 
64
65
  Used as an `id` in the HTML for the accordion as a whole, and also as a prefix for the `id`s of the section contents and the buttons that open them, so that those `id`s can be the target of `aria-labelledby` and `aria-control` attributes.
65
66
  data:
@@ -182,11 +183,11 @@ examples:
182
183
  </ul>'
183
184
  with_data_attributes:
184
185
  description: |
185
- Adds custom data attributes to the accordion to each section. Accepts an hash, so multiple attributes can be added.
186
+ Adds custom data attributes to each section of the accordion. Accepts a hash, so multiple attributes can be added.
186
187
 
187
188
  The `data_attributes` hash is for the outermost element in the accordion.
188
189
 
189
- Each item can also have a `data_attributes` hash. This is placed on the `button` that triggers the opening and closing - useful for differentiating between each section of the accordion.
190
+ Each item can also have a `data_attributes` hash. These `data_attributes` are placed on the `button` that triggers the opening and closing - useful for differentiating between each section of the accordion.
190
191
 
191
192
  data:
192
193
  data_attributes:
@@ -240,7 +241,7 @@ examples:
240
241
  html: <p class="govuk-body">This is the content for How people read.</p>
241
242
  with_margin_bottom:
242
243
  description: |
243
- The component accepts a number for margin bottom from 0 to 9 (0px to 60px) using the [GOV.UK Frontend spacing scale](https://design-system.service.gov.uk/styles/spacing/#the-responsive-spacing-scale). It defaults to having a margin bottom of 30px.
244
+ The component accepts a number for margin bottom from `0` to `9` (`0px` to `60px`) using the [GOV.UK Frontend spacing scale](https://design-system.service.gov.uk/styles/spacing/#the-responsive-spacing-scale). It defaults to having a margin bottom of `30px`.
244
245
  data:
245
246
  margin_bottom: 0
246
247
  items:
@@ -254,7 +255,7 @@ examples:
254
255
  html: <p class="govuk-body">This is the content for Writing well for specialists.</p>
255
256
  with_section_open:
256
257
  description: |
257
- Adding `expanded: true` to the item will mean the section will default to being open, rather than closed. Once a user has opened or closed a section, the state of each section will be remembered - this can override a section's default.
258
+ Adding `expanded: true` to the item will mean the section defaults to being open, rather than closed. Once a user opens or closes a section, the state of each section is remembered.
258
259
  data:
259
260
  items:
260
261
  - heading:
@@ -276,13 +277,18 @@ examples:
276
277
  html: <p class="govuk-body">This is the content for How people read.</p>
277
278
  with_the_anchor_link_navigation:
278
279
  description: |
279
- Some apps require custom ids per accordion section heading for linking between those specific sections, sometimes across multiple pages. An example of this is on manuals pages where multiple manuals will each include large sets of accordions and will reference between specific sections for ease of access to that content. [Live example](https://www.gov.uk/guidance/how-to-publish-on-gov-uk/creating-and-updating-pages#associations).
280
+ Some apps require custom `id`s per accordion section heading. Custom `id`s allow you to link section headings, sometimes across multiple pages.
281
+
282
+ For example on [guidance pages for Content Designers, referred to as "manuals",](https://www.gov.uk/guidance/how-to-publish-on-gov-uk/creating-and-updating-pages#associations) each manual includes multiple sets of accordions and will reference between specific sections to easily access content.
280
283
 
281
- This feature automatically opens accordions when an anchor link is clicked within another accordion that links to either the id of an accordion section heading or an id within the content of an accordion. This will also automatically navigate to and open accordions on page load using the same rules.
284
+ Using the same rules, custom `id`s automatically open accordions when users click within another accordion that links to either
282
285
 
283
- This feature won't be used if the `anchor_navigation` flag isn't passed as true to mitigate performance risk from event listeners on a large number of links.
286
+ * the `id` of an accordion section heading
287
+ * an `id` within the content of an accordion (this will also automatically navigate to and open accordions on page load)
284
288
 
285
- Unlike with the accordion-wide custom id attribute, any ids passed to accordion headings as part of this feature aren't stored in `localStorage` so don't need to be unique across your domain, but **should still be unique in the context of the page**.
289
+ This feature will only be used if the `anchor_navigation` flag is passed as `true`. This mitigates performance risk from event listeners on a large number of links.
290
+
291
+ Unlike with the accordion-wide custom `id` attribute, any `id`s passed to accordion headings as part of this are not stored in `localStorage`. `id`s do not need to be unique across your domain, but should still be unique in the context of the page.
286
292
  data:
287
293
  anchor_navigation: true
288
294
  items:
@@ -305,7 +311,7 @@ examples:
305
311
  html: <p class="govuk-body">This is the content for How people read.</p>
306
312
  condensed_layout:
307
313
  description: |
308
- This is for when a smaller accordion is required. Since smaller screens trigger a single column layout, this modifier only makes the accordion smaller when viewed on large screens.
314
+ This layout is for when a smaller accordion is required. Since smaller screens trigger a single column layout, this modifier only makes the accordion smaller when viewed on large screens.
309
315
  data:
310
316
  condensed: true
311
317
  items:
@@ -397,4 +403,4 @@ examples:
397
403
  <li>
398
404
  <a class="govuk-link govuk-body-s" href="#">Retiring your service</a>
399
405
  </li>
400
- </ul>'
406
+ </ul>'
@@ -31,7 +31,7 @@ examples:
31
31
  name: "address"
32
32
  type: "email"
33
33
  numeric_input:
34
- description: If input is set to `type="number"` we set the component up as described in the [Design System guidance](https://design-system.service.gov.uk/components/text-input/#numbers) adding `inputmode` and `pattern`. These values can be overridden if necessary.
34
+ description: If input is set to `type="number"` we set the component up as described in the [GOV.UK Design System guidance](https://design-system.service.gov.uk/components/text-input/#numbers) adding `inputmode` and `pattern`. These values can be overridden if necessary.
35
35
  data:
36
36
  label:
37
37
  text: "Account number"
@@ -25,7 +25,7 @@ examples:
25
25
  message: Message to alert the user to a successful action goes here
26
26
  title_id: my-custom-success-id
27
27
  with_styled_link:
28
- description: If you need to include a link in your success alert, you need to specify the `govuk-link` and `govuk-notification-banner__link` classes on that link element. This is in line with Design System guidance that the colour of the link in success notification banners can look jarring if any links are a different colour to the principal colour used by the success banner.
28
+ description: If you need to include a link in your success alert, you need to specify the `govuk-link` and `govuk-notification-banner__link` classes on that link element. This is in line with GOV.UK Design System guidance that the colour of the link in success notification banners can look jarring if any links are a different colour to the principal colour used by the success banner.
29
29
  data:
30
30
  message: Message to alert the user to a successful action goes here
31
31
  description: <p class="govuk-body">A further description with <a href="/a-cool-page" class="govuk-link govuk-notification-banner__link">a link</a></p>
@@ -1,8 +1,8 @@
1
1
  name: "Tabs (experimental)"
2
2
  description: "The tabs component lets users toggle between related sections of content."
3
3
  body: |
4
- This component is based on the [design system tabs component](https://design-system.service.gov.uk/components/tabs/)
5
- and is currently experimental. If using this component, please feed back any research findings to the Design System team.
4
+ This component is based on the [GOV.UK Design System tabs component](https://design-system.service.gov.uk/components/tabs/)
5
+ and is currently experimental. If using this component, please feed back any research findings to the Design System team](https://design-system.service.gov.uk/get-in-touch/).
6
6
 
7
7
  The tabs component lets users navigate between related sections of content on a single page,
8
8
  displaying one section at a time. Note that they are not intended to be used to navigate
@@ -1,3 +1,3 @@
1
1
  module GovukPublishingComponents
2
- VERSION = "28.0.0".freeze
2
+ VERSION = "28.1.0".freeze
3
3
  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: 28.0.0
4
+ version: 28.1.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: 2022-01-06 00:00:00.000000000 Z
11
+ date: 2022-01-10 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: govuk_app_config
@@ -483,7 +483,6 @@ files:
483
483
  - app/assets/javascripts/govuk_publishing_components/analytics/page-content.js
484
484
  - app/assets/javascripts/govuk_publishing_components/analytics/pii.js
485
485
  - app/assets/javascripts/govuk_publishing_components/analytics/print-intent.js
486
- - app/assets/javascripts/govuk_publishing_components/analytics/scroll-tracker.js
487
486
  - app/assets/javascripts/govuk_publishing_components/analytics/static-analytics.js
488
487
  - app/assets/javascripts/govuk_publishing_components/analytics/track-click.js
489
488
  - app/assets/javascripts/govuk_publishing_components/analytics/track-select-change.js
@@ -501,6 +500,7 @@ files:
501
500
  - app/assets/javascripts/govuk_publishing_components/components/intervention.js
502
501
  - app/assets/javascripts/govuk_publishing_components/components/layout-header.js
503
502
  - app/assets/javascripts/govuk_publishing_components/components/layout-super-navigation-header.js
503
+ - app/assets/javascripts/govuk_publishing_components/components/metadata.js
504
504
  - app/assets/javascripts/govuk_publishing_components/components/modal-dialogue.js
505
505
  - app/assets/javascripts/govuk_publishing_components/components/print-link.js
506
506
  - app/assets/javascripts/govuk_publishing_components/components/radio.js
@@ -1,112 +0,0 @@
1
- /* global GOVUK, $ */
2
-
3
- (function () {
4
- 'use strict'
5
-
6
- window.GOVUK = window.GOVUK || {}
7
-
8
- var CONFIG = {}
9
-
10
- function ScrollTracker (sitewideConfig) {
11
- this.config = this.getConfigForCurrentPath(sitewideConfig)
12
- this.SCROLL_TIMEOUT_DELAY = 10
13
-
14
- if (!this.config) {
15
- this.enabled = false
16
- return
17
- }
18
- this.enabled = true
19
-
20
- this.trackedNodes = this.buildNodes(this.config)
21
-
22
- $(window).scroll($.proxy(this.onScroll, this))
23
- this.trackVisibleNodes()
24
- };
25
-
26
- ScrollTracker.prototype.getConfigForCurrentPath = function (sitewideConfig) {
27
- for (var path in sitewideConfig) {
28
- if (this.normalisePath(window.location.pathname) === this.normalisePath(path)) {
29
- return sitewideConfig[path]
30
- }
31
- }
32
- }
33
-
34
- ScrollTracker.prototype.buildNodes = function (config) {
35
- var nodes = []
36
- var NodeConstructor, nodeData
37
-
38
- for (var i = 0; i < config.length; i++) {
39
- NodeConstructor = ScrollTracker[config[i][0] + 'Node']
40
- nodeData = config[i][1]
41
- nodes.push(new NodeConstructor(nodeData))
42
- }
43
-
44
- return nodes
45
- }
46
-
47
- ScrollTracker.prototype.normalisePath = function (path) {
48
- return path.split('/').join('')
49
- }
50
-
51
- ScrollTracker.prototype.onScroll = function () {
52
- clearTimeout(this.scrollTimeout)
53
- this.scrollTimeout = setTimeout($.proxy(this.trackVisibleNodes, this), this.SCROLL_TIMEOUT_DELAY)
54
- }
55
-
56
- ScrollTracker.prototype.trackVisibleNodes = function () {
57
- for (var i = 0; i < this.trackedNodes.length; i++) {
58
- if (this.trackedNodes[i].isVisible() && !this.trackedNodes[i].alreadySeen) {
59
- this.trackedNodes[i].alreadySeen = true
60
-
61
- var action = this.trackedNodes[i].eventData.action
62
- var label = this.trackedNodes[i].eventData.label
63
-
64
- GOVUK.analytics.trackEvent('ScrollTo', action, { label: label, nonInteraction: true })
65
- }
66
- }
67
- }
68
-
69
- ScrollTracker.PercentNode = function (percentage) {
70
- this.percentage = percentage
71
- this.eventData = { action: 'Percent', label: String(percentage) }
72
- }
73
-
74
- ScrollTracker.PercentNode.prototype.isVisible = function () {
75
- return this.currentScrollPercent() >= this.percentage
76
- }
77
-
78
- ScrollTracker.PercentNode.prototype.currentScrollPercent = function () {
79
- var $document = $(document)
80
- var $window = $(window)
81
- return (($window.scrollTop() / ($document.height() - $window.height())) * 100.0)
82
- }
83
-
84
- ScrollTracker.HeadingNode = function (headingText) {
85
- this.$element = getHeadingElement(headingText)
86
- this.eventData = { action: 'Heading', label: headingText }
87
-
88
- function getHeadingElement (headingText) {
89
- var $headings = $('h1, h2, h3, h4, h5, h6')
90
- for (var i = 0; i < $headings.length; i++) {
91
- if ($.trim($headings.eq(i).text()).replace(/\s/g, ' ') === headingText) return $headings.eq(i)
92
- }
93
- }
94
- }
95
-
96
- ScrollTracker.HeadingNode.prototype.isVisible = function () {
97
- if (!this.$element) return false
98
- return this.elementIsVisible(this.$element)
99
- }
100
-
101
- ScrollTracker.HeadingNode.prototype.elementIsVisible = function ($element) {
102
- var $window = $(window)
103
- var positionTop = $element.offset().top
104
- return (positionTop > $window.scrollTop() && positionTop < ($window.scrollTop() + $window.height()))
105
- }
106
-
107
- $().ready(function () {
108
- window.GOVUK.scrollTracker = new ScrollTracker(CONFIG)
109
- })
110
-
111
- window.GOVUK.ScrollTracker = ScrollTracker
112
- }())