@internetstiftelsen/styleguide 2.23.1 → 2.23.2-beta.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/assets/js/youtube.js +9 -38
  2. package/dist/molecules/glider/glider-hero.js +1 -0
  3. package/package.json +1 -1
  4. package/src/assets/js/youtube.js +9 -34
  5. package/src/molecules/glider/glider-hero.js +1 -0
  6. package/src/structures/_article.scss +1 -2
package/dist/assets/js/youtube.js CHANGED
@@ -1,9 +1,5 @@
1
1
  'use strict';
2
2
 
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.setupPlayers = setupPlayers;
7
3
  function loadYoutubeAPI() {
8
4
  var tag = document.createElement('script');
9
5
  var firstScript = document.getElementsByTagName('script')[0];
@@ -13,8 +9,10 @@ function loadYoutubeAPI() {
13
9
  firstScript.parentNode.insertBefore(tag, firstScript);
14
10
  }
15
11
 
16
- function onPlayerReady(el) {
17
- el.setAttribute('data-youtube-ready', 'true');
12
+ function onPlayerReady(el, e) {
13
+ el.addEventListener('click', function () {
14
+ e.target.playVideo();
15
+ });
18
16
  }
19
17
 
20
18
  function onPlayerStateChange(el, e) {
@@ -34,28 +32,16 @@ function createCover(el, id) {
34
32
  }
35
33
 
36
34
  function setupYoutubePlayer(el) {
37
- var playerEl = void 0;
35
+ var playerEl = document.createElement('div');
38
36
  var id = el.getAttribute('data-youtube');
39
37
 
40
- if (el.youtube) {
41
- playerEl = el.querySelector('[data-youtube-container]');
42
-
43
- playerEl.parentNode.removeChild(playerEl);
44
- el.youtube.destroy();
45
- el.youtube = null;
46
- el.removeAttribute('data-youtube-ready');
47
- }
48
-
49
- playerEl = document.createElement('div');
50
-
51
38
  if (!el.getElementsByTagName('img').length) {
52
39
  createCover(el, id);
53
40
  }
54
41
 
55
- playerEl.setAttribute('data-youtube-container', true);
56
42
  el.appendChild(playerEl);
57
43
 
58
- el.youtube = new YT.Player(playerEl, {
44
+ var player = new YT.Player(playerEl, {
59
45
  height: '100%',
60
46
  width: '100%',
61
47
  videoId: id,
@@ -73,33 +59,18 @@ function setupYoutubePlayer(el) {
73
59
  }
74
60
  }
75
61
  });
76
- }
77
62
 
78
- function delegateClick(e) {
79
- var el = e.target.closest('[data-youtube]');
80
-
81
- if (!el || !el.youtube) {
82
- return;
83
- }
84
-
85
- el.youtube.playVideo();
63
+ el.youtube = player;
86
64
  }
87
65
 
88
- // eslint-disable-next-line import/prefer-default-export
89
- function setupPlayers(container) {
90
- var players = container.querySelectorAll('[data-youtube]');
66
+ window.onYouTubeIframeAPIReady = function () {
67
+ var players = document.querySelectorAll('[data-youtube]');
91
68
 
92
69
  if (!players.length) {
93
70
  return;
94
71
  }
95
72
 
96
73
  [].forEach.call(players, setupYoutubePlayer);
97
- }
98
-
99
- window.onYouTubeIframeAPIReady = function () {
100
- setupPlayers(document);
101
-
102
- document.body.addEventListener('click', delegateClick);
103
74
  };
104
75
 
105
76
  loadYoutubeAPI();
package/dist/molecules/glider/glider-hero.js CHANGED
@@ -13,6 +13,7 @@ if (gliderElementHero) {
13
13
  scrollLock: true,
14
14
  slidesToShow: 1,
15
15
  slidesToScroll: 1,
16
+ rewind: true,
16
17
  arrows: {
17
18
  prev: '.js-glider-prev',
18
19
  next: '.js-glider-next'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@internetstiftelsen/styleguide",
3
- "version": "2.23.1",
3
+ "version": "2.23.2-beta.0.1",
4
4
  "main": "dist/components.js",
5
5
  "ports": {
6
6
  "fractal": "3000"
package/src/assets/js/youtube.js CHANGED
@@ -7,8 +7,10 @@ function loadYoutubeAPI() {
7
7
  firstScript.parentNode.insertBefore(tag, firstScript);
8
8
  }
9
9
 
10
- function onPlayerReady(el) {
11
- el.setAttribute('data-youtube-ready', 'true');
10
+ function onPlayerReady(el, e) {
11
+ el.addEventListener('click', () => {
12
+ e.target.playVideo();
13
+ });
12
14
  }
13
15
 
14
16
  function onPlayerStateChange(el, e) {
@@ -28,28 +30,16 @@ function createCover(el, id) {
28
30
  }
29
31
 
30
32
  function setupYoutubePlayer(el) {
31
- let playerEl;
33
+ const playerEl = document.createElement('div');
32
34
  const id = el.getAttribute('data-youtube');
33
35
 
34
- if (el.youtube) {
35
- playerEl = el.querySelector('[data-youtube-container]');
36
-
37
- playerEl.parentNode.removeChild(playerEl);
38
- el.youtube.destroy();
39
- el.youtube = null;
40
- el.removeAttribute('data-youtube-ready');
41
- }
42
-
43
- playerEl = document.createElement('div');
44
-
45
36
  if (!el.getElementsByTagName('img').length) {
46
37
  createCover(el, id);
47
38
  }
48
39
 
49
- playerEl.setAttribute('data-youtube-container', true);
50
40
  el.appendChild(playerEl);
51
41
 
52
- el.youtube = new YT.Player(playerEl, {
42
+ const player = new YT.Player(playerEl, {
53
43
  height: '100%',
54
44
  width: '100%',
55
45
  videoId: id,
@@ -63,33 +53,18 @@ function setupYoutubePlayer(el) {
63
53
  onStateChange: (e) => onPlayerStateChange(el, e),
64
54
  },
65
55
  });
66
- }
67
56
 
68
- function delegateClick(e) {
69
- const el = e.target.closest('[data-youtube]');
70
-
71
- if (!el || !el.youtube) {
72
- return;
73
- }
74
-
75
- el.youtube.playVideo();
57
+ el.youtube = player;
76
58
  }
77
59
 
78
- // eslint-disable-next-line import/prefer-default-export
79
- export function setupPlayers(container) {
80
- const players = container.querySelectorAll('[data-youtube]');
60
+ window.onYouTubeIframeAPIReady = () => {
61
+ const players = document.querySelectorAll('[data-youtube]');
81
62
 
82
63
  if (!players.length) {
83
64
  return;
84
65
  }
85
66
 
86
67
  [].forEach.call(players, setupYoutubePlayer);
87
- }
88
-
89
- window.onYouTubeIframeAPIReady = () => {
90
- setupPlayers(document);
91
-
92
- document.body.addEventListener('click', delegateClick);
93
68
  };
94
69
 
95
70
  loadYoutubeAPI();
package/src/molecules/glider/glider-hero.js CHANGED
@@ -7,6 +7,7 @@ if (gliderElementHero) {
7
7
  scrollLock: true,
8
8
  slidesToShow: 1,
9
9
  slidesToScroll: 1,
10
+ rewind: true,
10
11
  arrows: {
11
12
  prev: '.js-glider-prev',
12
13
  next: '.js-glider-next',
package/src/structures/_article.scss CHANGED
@@ -37,8 +37,7 @@
37
37
  > h6,
38
38
  > ul,
39
39
  > ol,
40
- > div:not(.wp-block-iis-info):not(.wp-block-image):not(.wp-block-iis-hero):not(.wp-block-iis-grid):not([class*='accordion']),
41
- > figure:not(.wp-block-iis-info):not(.wp-block-image):not(.wp-block-iis-hero):not(.wp-block-iis-grid):not([class*='accordion']),
40
+ > :not(.wp-block-iis-info):not(.wp-block-image):not(.wp-block-iis-hero):not(.wp-block-iis-grid):not([class*='accordion']),
42
41
  > .wp-block-iis-card,
43
42
  > .wp-block-image > figure,
44
43
  > blockquote {