ghost 4.27.0 → 4.29.0
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.
- package/content/themes/casper/assets/built/screen.css +1 -1
- package/content/themes/casper/assets/built/screen.css.map +1 -1
- package/content/themes/casper/assets/css/screen.css +1 -17
- package/content/themes/casper/package.json +1 -1
- package/content/themes/casper/partials/post-card.hbs +1 -1
- package/core/built/assets/{ghost-dark-ae67fe157509b6e82c607ba560fc52e9.css → ghost-dark-b93e2e2dcc4c0e1efa981314f45f8cda.css} +1 -1
- package/core/built/assets/{ghost.min-b1e58e098721e467388682a85a7c187d.css → ghost.min-578a1b7e68d1f7ae0003ebe421b7c182.css} +1 -1
- package/core/built/assets/{ghost.min-2d534cce15c43c646814b26f4beefb78.js → ghost.min-ba8ef5d16b8a6f9072564a368154df72.js} +79 -79
- package/core/built/assets/icons/audio-file.svg +5 -0
- package/core/built/assets/icons/file-download.svg +1 -0
- package/core/built/assets/icons/file-upload.svg +1 -0
- package/core/built/assets/icons/film-camera.svg +4 -0
- package/core/built/assets/icons/mute.svg +3 -0
- package/core/built/assets/icons/pause.svg +4 -0
- package/core/built/assets/icons/play.svg +3 -0
- package/core/built/assets/icons/unmute.svg +3 -0
- package/core/built/assets/{vendor.min-e433aa7d5620e7837f30e170cd43f84e.js → vendor.min-c450359ad46217cd48c00b277ae54a09.js} +227 -128
- package/core/frontend/apps/amp/lib/views/amp.hbs +94 -2
- package/core/frontend/helpers/ghost_head.js +1 -1
- package/core/frontend/src/cards/css/audio.css +92 -29
- package/core/frontend/src/cards/css/before-after.css +47 -0
- package/core/frontend/src/cards/css/bookmark.css +3 -3
- package/core/frontend/src/cards/css/button.css +4 -4
- package/core/frontend/src/cards/css/file.css +73 -0
- package/core/frontend/src/cards/css/nft.css +8 -6
- package/core/frontend/src/cards/css/product.css +77 -49
- package/core/frontend/src/cards/css/video.css +281 -0
- package/core/frontend/src/cards/js/audio.js +127 -128
- package/core/frontend/src/cards/js/before-after.js +41 -0
- package/core/frontend/src/cards/js/gallery.js +10 -8
- package/core/frontend/src/cards/js/toggle.js +16 -14
- package/core/frontend/src/cards/js/video.js +164 -0
- package/core/server/services/mega/post-email-serializer.js +3 -1
- package/core/server/services/mega/template.js +15 -11
- package/core/server/web/admin/views/default-prod.html +4 -4
- package/core/server/web/admin/views/default.html +4 -4
- package/core/shared/labs.js +7 -6
- package/package.json +14 -10
- package/yarn.lock +2526 -1942
|
@@ -1,147 +1,146 @@
|
|
|
1
|
-
|
|
2
|
-
const
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
raf = requestAnimationFrame(whilePlaying);
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
const showRangeProgress = (rangeInput) => {
|
|
43
|
-
if (rangeInput === seekSlider) {
|
|
44
|
-
audioPlayerContainer.style.setProperty('--seek-before-width', rangeInput.value / rangeInput.max * 100 + '%');
|
|
1
|
+
(function() {
|
|
2
|
+
const handleAudioPlayer = function (audioElementContainer) {
|
|
3
|
+
const audioPlayerContainer = audioElementContainer.querySelector('.kg-audio-player-container');
|
|
4
|
+
const playIconContainer = audioElementContainer.querySelector('.kg-audio-play-icon');
|
|
5
|
+
const pauseIconContainer = audioElementContainer.querySelector('.kg-audio-pause-icon');
|
|
6
|
+
const seekSlider = audioElementContainer.querySelector('.kg-audio-seek-slider');
|
|
7
|
+
const playbackRateContainer = audioElementContainer.querySelector('.kg-audio-playback-rate');
|
|
8
|
+
const muteIconContainer = audioElementContainer.querySelector('.kg-audio-mute-icon');
|
|
9
|
+
const unmuteIconContainer = audioElementContainer.querySelector('.kg-audio-unmute-icon');
|
|
10
|
+
const volumeSlider = audioElementContainer.querySelector('.kg-audio-volume-slider');
|
|
11
|
+
const audio = audioElementContainer.querySelector('audio');
|
|
12
|
+
const durationContainer = audioElementContainer.querySelector('.kg-audio-duration');
|
|
13
|
+
const currentTimeContainer = audioElementContainer.querySelector('.kg-audio-current-time');
|
|
14
|
+
let playbackRates = [{
|
|
15
|
+
rate: 0.75,
|
|
16
|
+
label: '0.7×'
|
|
17
|
+
}, {
|
|
18
|
+
rate: 1.0,
|
|
19
|
+
label: '1×'
|
|
20
|
+
}, {
|
|
21
|
+
rate: 1.25,
|
|
22
|
+
label: '1.2×'
|
|
23
|
+
}, {
|
|
24
|
+
rate: 1.75,
|
|
25
|
+
label: '1.7×'
|
|
26
|
+
}, {
|
|
27
|
+
rate: 2.0,
|
|
28
|
+
label: '2×'
|
|
29
|
+
}];
|
|
30
|
+
|
|
31
|
+
let raf = null;
|
|
32
|
+
let currentPlaybackRateIdx = 1;
|
|
33
|
+
|
|
34
|
+
const whilePlaying = () => {
|
|
35
|
+
seekSlider.value = Math.floor(audio.currentTime);
|
|
36
|
+
currentTimeContainer.textContent = calculateTime(seekSlider.value);
|
|
37
|
+
audioPlayerContainer.style.setProperty('--seek-before-width', `${seekSlider.value / seekSlider.max * 100}%`);
|
|
38
|
+
raf = requestAnimationFrame(whilePlaying);
|
|
45
39
|
}
|
|
46
|
-
|
|
47
|
-
|
|
40
|
+
|
|
41
|
+
const showRangeProgress = (rangeInput) => {
|
|
42
|
+
if (rangeInput === seekSlider) {
|
|
43
|
+
audioPlayerContainer.style.setProperty('--seek-before-width', rangeInput.value / rangeInput.max * 100 + '%');
|
|
44
|
+
}
|
|
45
|
+
else {
|
|
46
|
+
audioPlayerContainer.style.setProperty('--volume-before-width', rangeInput.value / rangeInput.max * 100 + '%');
|
|
47
|
+
}
|
|
48
48
|
}
|
|
49
|
-
}
|
|
50
49
|
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
50
|
+
const calculateTime = (secs) => {
|
|
51
|
+
const minutes = Math.floor(secs / 60);
|
|
52
|
+
const seconds = Math.floor(secs % 60);
|
|
53
|
+
const returnedSeconds = seconds < 10 ? `0${seconds}` : `${seconds}`;
|
|
54
|
+
return `${minutes}:${returnedSeconds}`;
|
|
55
|
+
}
|
|
57
56
|
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
57
|
+
const displayDuration = () => {
|
|
58
|
+
durationContainer.textContent = calculateTime(audio.duration);
|
|
59
|
+
}
|
|
61
60
|
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
61
|
+
const setSliderMax = () => {
|
|
62
|
+
seekSlider.max = Math.floor(audio.duration);
|
|
63
|
+
}
|
|
65
64
|
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
65
|
+
const displayBufferedAmount = () => {
|
|
66
|
+
if (audio.buffered.length > 0) {
|
|
67
|
+
const bufferedAmount = Math.floor(audio.buffered.end(audio.buffered.length - 1));
|
|
68
|
+
audioPlayerContainer.style.setProperty('--buffered-width', `${(bufferedAmount / seekSlider.max) * 100}%`);
|
|
69
|
+
}
|
|
70
70
|
}
|
|
71
|
-
}
|
|
72
71
|
|
|
73
|
-
|
|
74
|
-
displayDuration();
|
|
75
|
-
setSliderMax();
|
|
76
|
-
displayBufferedAmount();
|
|
77
|
-
} else {
|
|
78
|
-
audio.addEventListener('loadedmetadata', () => {
|
|
72
|
+
if (audio.readyState > 0) {
|
|
79
73
|
displayDuration();
|
|
80
74
|
setSliderMax();
|
|
81
75
|
displayBufferedAmount();
|
|
76
|
+
} else {
|
|
77
|
+
audio.addEventListener('loadedmetadata', () => {
|
|
78
|
+
displayDuration();
|
|
79
|
+
setSliderMax();
|
|
80
|
+
displayBufferedAmount();
|
|
81
|
+
});
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
playIconContainer.addEventListener('click', () => {
|
|
85
|
+
playIconContainer.classList.add("kg-audio-hide");
|
|
86
|
+
pauseIconContainer.classList.remove("kg-audio-hide");
|
|
87
|
+
audio.play();
|
|
88
|
+
requestAnimationFrame(whilePlaying);
|
|
82
89
|
});
|
|
83
|
-
}
|
|
84
90
|
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
requestAnimationFrame(whilePlaying);
|
|
90
|
-
});
|
|
91
|
-
|
|
92
|
-
pauseIconContainer.addEventListener('click', () => {
|
|
93
|
-
pauseIconContainer.classList.add("kg-audio-hide");
|
|
94
|
-
playIconContainer.classList.remove("kg-audio-hide");
|
|
95
|
-
audio.pause();
|
|
96
|
-
cancelAnimationFrame(raf);
|
|
97
|
-
});
|
|
98
|
-
|
|
99
|
-
muteIconContainer.addEventListener('click', () => {
|
|
100
|
-
muteIconContainer.classList.add("kg-audio-hide");
|
|
101
|
-
unmuteIconContainer.classList.remove("kg-audio-hide");
|
|
102
|
-
audio.muted = false;
|
|
103
|
-
});
|
|
104
|
-
|
|
105
|
-
unmuteIconContainer.addEventListener('click', () => {
|
|
106
|
-
unmuteIconContainer.classList.add("kg-audio-hide");
|
|
107
|
-
muteIconContainer.classList.remove("kg-audio-hide");
|
|
108
|
-
audio.muted = true;
|
|
109
|
-
});
|
|
110
|
-
|
|
111
|
-
playbackRateContainer.addEventListener('click', () => {
|
|
112
|
-
let nextPlaybackRate = playbackRates[(currentPlaybackRateIdx + 1) % 5];
|
|
113
|
-
currentPlaybackRateIdx = currentPlaybackRateIdx + 1;
|
|
114
|
-
audio.playbackRate = nextPlaybackRate.rate;
|
|
115
|
-
playbackRateContainer.textContent = nextPlaybackRate.label;
|
|
116
|
-
});
|
|
117
|
-
|
|
118
|
-
audio.addEventListener('progress', displayBufferedAmount);
|
|
119
|
-
|
|
120
|
-
seekSlider.addEventListener('input', (e) => {
|
|
121
|
-
showRangeProgress(e.target);
|
|
122
|
-
currentTimeContainer.textContent = calculateTime(seekSlider.value);
|
|
123
|
-
if (!audio.paused) {
|
|
91
|
+
pauseIconContainer.addEventListener('click', () => {
|
|
92
|
+
pauseIconContainer.classList.add("kg-audio-hide");
|
|
93
|
+
playIconContainer.classList.remove("kg-audio-hide");
|
|
94
|
+
audio.pause();
|
|
124
95
|
cancelAnimationFrame(raf);
|
|
125
|
-
}
|
|
126
|
-
});
|
|
96
|
+
});
|
|
127
97
|
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
}
|
|
133
|
-
});
|
|
98
|
+
muteIconContainer.addEventListener('click', () => {
|
|
99
|
+
muteIconContainer.classList.add("kg-audio-hide");
|
|
100
|
+
unmuteIconContainer.classList.remove("kg-audio-hide");
|
|
101
|
+
audio.muted = false;
|
|
102
|
+
});
|
|
134
103
|
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
104
|
+
unmuteIconContainer.addEventListener('click', () => {
|
|
105
|
+
unmuteIconContainer.classList.add("kg-audio-hide");
|
|
106
|
+
muteIconContainer.classList.remove("kg-audio-hide");
|
|
107
|
+
audio.muted = true;
|
|
108
|
+
});
|
|
109
|
+
|
|
110
|
+
playbackRateContainer.addEventListener('click', () => {
|
|
111
|
+
let nextPlaybackRate = playbackRates[(currentPlaybackRateIdx + 1) % 5];
|
|
112
|
+
currentPlaybackRateIdx = currentPlaybackRateIdx + 1;
|
|
113
|
+
audio.playbackRate = nextPlaybackRate.rate;
|
|
114
|
+
playbackRateContainer.textContent = nextPlaybackRate.label;
|
|
115
|
+
});
|
|
141
116
|
|
|
142
|
-
|
|
117
|
+
audio.addEventListener('progress', displayBufferedAmount);
|
|
143
118
|
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
119
|
+
seekSlider.addEventListener('input', (e) => {
|
|
120
|
+
showRangeProgress(e.target);
|
|
121
|
+
currentTimeContainer.textContent = calculateTime(seekSlider.value);
|
|
122
|
+
if (!audio.paused) {
|
|
123
|
+
cancelAnimationFrame(raf);
|
|
124
|
+
}
|
|
125
|
+
});
|
|
147
126
|
|
|
127
|
+
seekSlider.addEventListener('change', () => {
|
|
128
|
+
audio.currentTime = seekSlider.value;
|
|
129
|
+
if (!audio.paused) {
|
|
130
|
+
requestAnimationFrame(whilePlaying);
|
|
131
|
+
}
|
|
132
|
+
});
|
|
133
|
+
|
|
134
|
+
volumeSlider.addEventListener('input', (e) => {
|
|
135
|
+
const value = e.target.value;
|
|
136
|
+
showRangeProgress(e.target);
|
|
137
|
+
audio.volume = value / 100;
|
|
138
|
+
});
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
const audioCardElements = document.querySelectorAll('.kg-audio-card');
|
|
142
|
+
|
|
143
|
+
for (let i = 0; i < audioCardElements.length; i++) {
|
|
144
|
+
handleAudioPlayer(audioCardElements[i]);
|
|
145
|
+
}
|
|
146
|
+
})();
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
(function () {
|
|
2
|
+
const beforeAfterCards = [...document.querySelectorAll('.kg-before-after-card')];
|
|
3
|
+
|
|
4
|
+
for (let card of beforeAfterCards) {
|
|
5
|
+
const isFullWidth = card.classList.contains('kg-width-full');
|
|
6
|
+
const input = card.querySelector('input');
|
|
7
|
+
const overlay = card.querySelector('.kg-before-after-card-image-before');
|
|
8
|
+
const orientation = card.querySelector('div').getAttribute('data-orientation');
|
|
9
|
+
const images = [...card.querySelectorAll('img')];
|
|
10
|
+
const smallestImageWidth = Math.min(
|
|
11
|
+
...images.map(img => parseInt(img.getAttribute('width')))
|
|
12
|
+
);
|
|
13
|
+
|
|
14
|
+
function updateSlider() {
|
|
15
|
+
if (orientation === 'vertical') {
|
|
16
|
+
overlay.setAttribute('style', `height: ${input.value}%`);
|
|
17
|
+
} else {
|
|
18
|
+
overlay.setAttribute('style', `width: ${input.value}%`);
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
function updateDimensions() {
|
|
23
|
+
const containerWidth = parseInt(getComputedStyle(card).getPropertyValue('width'));
|
|
24
|
+
const width = isFullWidth ? containerWidth : Math.min(smallestImageWidth, containerWidth);
|
|
25
|
+
for (let image of images) {
|
|
26
|
+
image.setAttribute('style', `width: ${width.toString()}px;`);
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
input.addEventListener('input', function () {
|
|
31
|
+
updateSlider();
|
|
32
|
+
});
|
|
33
|
+
|
|
34
|
+
window.addEventListener('resize', function () {
|
|
35
|
+
updateDimensions();
|
|
36
|
+
});
|
|
37
|
+
|
|
38
|
+
updateDimensions();
|
|
39
|
+
updateSlider();
|
|
40
|
+
}
|
|
41
|
+
})();
|
|
@@ -1,8 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
images.
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
(function() {
|
|
2
|
+
const images = document.querySelectorAll('.kg-gallery-image img');
|
|
3
|
+
images.forEach(function (image) {
|
|
4
|
+
const container = image.closest('.kg-gallery-image');
|
|
5
|
+
const width = image.attributes.width.value;
|
|
6
|
+
const height = image.attributes.height.value;
|
|
7
|
+
const ratio = width / height;
|
|
8
|
+
container.style.flex = ratio + ' 1 0%';
|
|
9
|
+
})
|
|
10
|
+
})();
|
|
@@ -1,16 +1,18 @@
|
|
|
1
|
-
|
|
1
|
+
(function() {
|
|
2
|
+
const toggleHeadingElements = document.getElementsByClassName("kg-toggle-heading");
|
|
2
3
|
|
|
3
|
-
const toggleFn = function(event) {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
};
|
|
4
|
+
const toggleFn = function(event) {
|
|
5
|
+
const targetElement = event.target;
|
|
6
|
+
const parentElement = targetElement.closest('.kg-toggle-card');
|
|
7
|
+
var toggleState = parentElement.getAttribute("data-kg-toggle-state");
|
|
8
|
+
if (toggleState === 'close') {
|
|
9
|
+
parentElement.setAttribute('data-kg-toggle-state', 'open');
|
|
10
|
+
} else {
|
|
11
|
+
parentElement.setAttribute('data-kg-toggle-state', 'close');
|
|
12
|
+
}
|
|
13
|
+
};
|
|
13
14
|
|
|
14
|
-
for (let i = 0; i < toggleHeadingElements.length; i++) {
|
|
15
|
-
|
|
16
|
-
}
|
|
15
|
+
for (let i = 0; i < toggleHeadingElements.length; i++) {
|
|
16
|
+
toggleHeadingElements[i].addEventListener('click', toggleFn, false);
|
|
17
|
+
}
|
|
18
|
+
})();
|
|
@@ -0,0 +1,164 @@
|
|
|
1
|
+
(function() {
|
|
2
|
+
const handleVideoPlayer = function (videoElementContainer) {
|
|
3
|
+
const videoPlayerContainer = videoElementContainer.querySelector('.kg-video-player');
|
|
4
|
+
const playIconContainer = videoElementContainer.querySelector('.kg-video-play-icon');
|
|
5
|
+
const pauseIconContainer = videoElementContainer.querySelector('.kg-video-pause-icon');
|
|
6
|
+
const seekSlider = videoElementContainer.querySelector('.kg-video-seek-slider');
|
|
7
|
+
const playbackRateContainer = videoElementContainer.querySelector('.kg-video-playback-rate');
|
|
8
|
+
const muteIconContainer = videoElementContainer.querySelector('.kg-video-mute-icon');
|
|
9
|
+
const unmuteIconContainer = videoElementContainer.querySelector('.kg-video-unmute-icon');
|
|
10
|
+
const volumeSlider = videoElementContainer.querySelector('.kg-video-volume-slider');
|
|
11
|
+
const videoEl = videoElementContainer.querySelector('video');
|
|
12
|
+
const durationContainer = videoElementContainer.querySelector('.kg-video-duration');
|
|
13
|
+
const currentTimeContainer = videoElementContainer.querySelector('.kg-video-current-time');
|
|
14
|
+
let playbackRates = [{
|
|
15
|
+
rate: 0.75,
|
|
16
|
+
label: '0.7×'
|
|
17
|
+
}, {
|
|
18
|
+
rate: 1.0,
|
|
19
|
+
label: '1×'
|
|
20
|
+
}, {
|
|
21
|
+
rate: 1.25,
|
|
22
|
+
label: '1.2×'
|
|
23
|
+
}, {
|
|
24
|
+
rate: 1.75,
|
|
25
|
+
label: '1.7×'
|
|
26
|
+
}, {
|
|
27
|
+
rate: 2.0,
|
|
28
|
+
label: '2×'
|
|
29
|
+
}];
|
|
30
|
+
|
|
31
|
+
let raf = null;
|
|
32
|
+
let currentPlaybackRateIdx = 1;
|
|
33
|
+
|
|
34
|
+
const whilePlaying = () => {
|
|
35
|
+
seekSlider.value = Math.floor(videoEl.currentTime);
|
|
36
|
+
currentTimeContainer.textContent = calculateTime(seekSlider.value);
|
|
37
|
+
videoPlayerContainer.style.setProperty('--seek-before-width', `${seekSlider.value / seekSlider.max * 100}%`);
|
|
38
|
+
raf = requestAnimationFrame(whilePlaying);
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
const showRangeProgress = (rangeInput) => {
|
|
42
|
+
if (rangeInput === seekSlider) {
|
|
43
|
+
videoPlayerContainer.style.setProperty('--seek-before-width', rangeInput.value / rangeInput.max * 100 + '%');
|
|
44
|
+
}
|
|
45
|
+
else {
|
|
46
|
+
videoPlayerContainer.style.setProperty('--volume-before-width', rangeInput.value / rangeInput.max * 100 + '%');
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
const calculateTime = (secs) => {
|
|
51
|
+
const minutes = Math.floor(secs / 60);
|
|
52
|
+
const seconds = Math.floor(secs % 60);
|
|
53
|
+
const returnedSeconds = seconds < 10 ? `0${seconds}` : `${seconds}`;
|
|
54
|
+
return `${minutes}:${returnedSeconds}`;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
const displayDuration = () => {
|
|
58
|
+
durationContainer.textContent = calculateTime(videoEl.duration);
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
const setSliderMax = () => {
|
|
62
|
+
seekSlider.max = Math.floor(videoEl.duration);
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
const displayBufferedAmount = () => {
|
|
66
|
+
if (videoEl.buffered.length > 0) {
|
|
67
|
+
const bufferedAmount = Math.floor(videoEl.buffered.end(videoEl.buffered.length - 1));
|
|
68
|
+
videoPlayerContainer.style.setProperty('--buffered-width', `${(bufferedAmount / seekSlider.max) * 100}%`);
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
if (videoEl.readyState > 0) {
|
|
73
|
+
displayDuration();
|
|
74
|
+
setSliderMax();
|
|
75
|
+
displayBufferedAmount();
|
|
76
|
+
if (videoEl.autoplay) {
|
|
77
|
+
raf = requestAnimationFrame(whilePlaying);
|
|
78
|
+
playIconContainer.classList.add("kg-video-hide");
|
|
79
|
+
pauseIconContainer.classList.remove("kg-video-hide");
|
|
80
|
+
}
|
|
81
|
+
if (videoEl.muted) {
|
|
82
|
+
unmuteIconContainer.classList.add("kg-video-hide");
|
|
83
|
+
muteIconContainer.classList.remove("kg-video-hide");
|
|
84
|
+
}
|
|
85
|
+
} else {
|
|
86
|
+
videoEl.addEventListener('loadedmetadata', () => {
|
|
87
|
+
displayDuration();
|
|
88
|
+
setSliderMax();
|
|
89
|
+
displayBufferedAmount();
|
|
90
|
+
if (videoEl.autoplay) {
|
|
91
|
+
raf = requestAnimationFrame(whilePlaying);
|
|
92
|
+
playIconContainer.classList.add("kg-video-hide");
|
|
93
|
+
pauseIconContainer.classList.remove("kg-video-hide");
|
|
94
|
+
}
|
|
95
|
+
if (videoEl.muted) {
|
|
96
|
+
unmuteIconContainer.classList.add("kg-video-hide");
|
|
97
|
+
muteIconContainer.classList.remove("kg-video-hide");
|
|
98
|
+
}
|
|
99
|
+
});
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
playIconContainer.addEventListener('click', () => {
|
|
103
|
+
playIconContainer.classList.add("kg-video-hide");
|
|
104
|
+
pauseIconContainer.classList.remove("kg-video-hide");
|
|
105
|
+
videoEl.play();
|
|
106
|
+
raf = requestAnimationFrame(whilePlaying);
|
|
107
|
+
});
|
|
108
|
+
|
|
109
|
+
pauseIconContainer.addEventListener('click', () => {
|
|
110
|
+
pauseIconContainer.classList.add("kg-video-hide");
|
|
111
|
+
playIconContainer.classList.remove("kg-video-hide");
|
|
112
|
+
videoEl.pause();
|
|
113
|
+
cancelAnimationFrame(raf);
|
|
114
|
+
});
|
|
115
|
+
|
|
116
|
+
muteIconContainer.addEventListener('click', () => {
|
|
117
|
+
muteIconContainer.classList.add("kg-video-hide");
|
|
118
|
+
unmuteIconContainer.classList.remove("kg-video-hide");
|
|
119
|
+
videoEl.muted = false;
|
|
120
|
+
});
|
|
121
|
+
|
|
122
|
+
unmuteIconContainer.addEventListener('click', () => {
|
|
123
|
+
unmuteIconContainer.classList.add("kg-video-hide");
|
|
124
|
+
muteIconContainer.classList.remove("kg-video-hide");
|
|
125
|
+
videoEl.muted = true;
|
|
126
|
+
});
|
|
127
|
+
|
|
128
|
+
playbackRateContainer.addEventListener('click', () => {
|
|
129
|
+
let nextPlaybackRate = playbackRates[(currentPlaybackRateIdx + 1) % 5];
|
|
130
|
+
currentPlaybackRateIdx = currentPlaybackRateIdx + 1;
|
|
131
|
+
videoEl.playbackRate = nextPlaybackRate.rate;
|
|
132
|
+
playbackRateContainer.textContent = nextPlaybackRate.label;
|
|
133
|
+
});
|
|
134
|
+
|
|
135
|
+
videoEl.addEventListener('progress', displayBufferedAmount);
|
|
136
|
+
|
|
137
|
+
seekSlider.addEventListener('input', (e) => {
|
|
138
|
+
showRangeProgress(e.target);
|
|
139
|
+
currentTimeContainer.textContent = calculateTime(seekSlider.value);
|
|
140
|
+
if (!videoEl.paused) {
|
|
141
|
+
cancelAnimationFrame(raf);
|
|
142
|
+
}
|
|
143
|
+
});
|
|
144
|
+
|
|
145
|
+
seekSlider.addEventListener('change', () => {
|
|
146
|
+
videoEl.currentTime = seekSlider.value;
|
|
147
|
+
if (!videoEl.paused) {
|
|
148
|
+
requestAnimationFrame(whilePlaying);
|
|
149
|
+
}
|
|
150
|
+
});
|
|
151
|
+
|
|
152
|
+
volumeSlider.addEventListener('input', (e) => {
|
|
153
|
+
const value = e.target.value;
|
|
154
|
+
showRangeProgress(e.target);
|
|
155
|
+
videoEl.volume = value / 100;
|
|
156
|
+
});
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
const videoCardElements = document.querySelectorAll('.kg-video-card');
|
|
160
|
+
|
|
161
|
+
for (let i = 0; i < videoCardElements.length; i++) {
|
|
162
|
+
handleVideoPlayer(videoCardElements[i]);
|
|
163
|
+
}
|
|
164
|
+
})();
|
|
@@ -240,7 +240,9 @@ const serialize = async (postModel, options = {isBrowserPreview: false, apiVersi
|
|
|
240
240
|
post.excerpt = post.excerpt.replace(/\s\[http(.*?)\]/g, '');
|
|
241
241
|
}
|
|
242
242
|
|
|
243
|
-
post.html = mobiledocLib.mobiledocHtmlRenderer.render(
|
|
243
|
+
post.html = mobiledocLib.mobiledocHtmlRenderer.render(
|
|
244
|
+
JSON.parse(post.mobiledoc), {target: 'email', postUrl: post.url}
|
|
245
|
+
);
|
|
244
246
|
|
|
245
247
|
// perform any email specific adjustments to the mobiledoc->HTML render output
|
|
246
248
|
// body wrapper is required so we can get proper top-level selections
|
|
@@ -74,8 +74,8 @@ table td {
|
|
|
74
74
|
max-width: 600px;
|
|
75
75
|
}
|
|
76
76
|
|
|
77
|
-
.content a {
|
|
78
|
-
overflow-wrap: anywhere;
|
|
77
|
+
.content a {
|
|
78
|
+
overflow-wrap: anywhere;
|
|
79
79
|
}
|
|
80
80
|
|
|
81
81
|
/* -------------------------------------
|
|
@@ -554,28 +554,32 @@ figure blockquote p {
|
|
|
554
554
|
}
|
|
555
555
|
|
|
556
556
|
.kg-nft-link {
|
|
557
|
-
display: block;
|
|
558
|
-
text-decoration: none !important;
|
|
559
|
-
color: #15212A !important;
|
|
557
|
+
display: block;
|
|
558
|
+
text-decoration: none !important;
|
|
559
|
+
color: #15212A !important;
|
|
560
560
|
font-family: inherit !important;
|
|
561
561
|
font-size: 14px;
|
|
562
562
|
line-height: 1.3em;
|
|
563
|
-
padding-top: 4px;
|
|
564
|
-
padding-right: 20px;
|
|
565
|
-
padding-left: 20px;
|
|
563
|
+
padding-top: 4px;
|
|
564
|
+
padding-right: 20px;
|
|
565
|
+
padding-left: 20px;
|
|
566
566
|
padding-bottom: 4px;
|
|
567
567
|
}
|
|
568
568
|
|
|
569
569
|
.kg-twitter-link {
|
|
570
|
-
display: block;
|
|
571
|
-
text-decoration: none !important;
|
|
572
|
-
color: #15212A !important;
|
|
570
|
+
display: block;
|
|
571
|
+
text-decoration: none !important;
|
|
572
|
+
color: #15212A !important;
|
|
573
573
|
font-family: inherit !important;
|
|
574
574
|
font-size: 15px;
|
|
575
575
|
padding: 8px;
|
|
576
576
|
line-height: 1.3em;
|
|
577
577
|
}
|
|
578
578
|
|
|
579
|
+
.kg-audio-thumbnail.placeholder {
|
|
580
|
+
background: ${templateSettings.accentColor || '#15212A'} !important;
|
|
581
|
+
}
|
|
582
|
+
|
|
579
583
|
.kg-callout-card {
|
|
580
584
|
display: flex;
|
|
581
585
|
margin: 0 0 1.5em 0;
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
<title>Ghost Admin</title>
|
|
9
9
|
|
|
10
10
|
|
|
11
|
-
<meta name="ghost-admin/config/environment" content="%7B%22modulePrefix%22%3A%22ghost-admin%22%2C%22environment%22%3A%22production%22%2C%22rootURL%22%3A%22%2F%22%2C%22locationType%22%3A%22trailing-hash%22%2C%22EmberENV%22%3A%7B%22FEATURES%22%3A%7B%7D%2C%22EXTEND_PROTOTYPES%22%3A%7B%22Date%22%3Afalse%2C%22Array%22%3Atrue%2C%22String%22%3Atrue%2C%22Function%22%3Afalse%7D%2C%22_APPLICATION_TEMPLATE_WRAPPER%22%3Afalse%2C%22_JQUERY_INTEGRATION%22%3Atrue%2C%22_TEMPLATE_ONLY_GLIMMER_COMPONENTS%22%3Atrue%7D%2C%22APP%22%3A%7B%22version%22%3A%224.
|
|
11
|
+
<meta name="ghost-admin/config/environment" content="%7B%22modulePrefix%22%3A%22ghost-admin%22%2C%22environment%22%3A%22production%22%2C%22rootURL%22%3A%22%2F%22%2C%22locationType%22%3A%22trailing-hash%22%2C%22EmberENV%22%3A%7B%22FEATURES%22%3A%7B%7D%2C%22EXTEND_PROTOTYPES%22%3A%7B%22Date%22%3Afalse%2C%22Array%22%3Atrue%2C%22String%22%3Atrue%2C%22Function%22%3Afalse%7D%2C%22_APPLICATION_TEMPLATE_WRAPPER%22%3Afalse%2C%22_JQUERY_INTEGRATION%22%3Atrue%2C%22_TEMPLATE_ONLY_GLIMMER_COMPONENTS%22%3Atrue%7D%2C%22APP%22%3A%7B%22version%22%3A%224.29%22%2C%22name%22%3A%22ghost-admin%22%7D%2C%22ember-simple-auth%22%3A%7B%7D%2C%22moment%22%3A%7B%22includeTimezone%22%3A%22all%22%7D%2C%22emberKeyboard%22%3A%7B%22disableInputsInitializer%22%3Atrue%7D%2C%22%40sentry%2Fember%22%3A%7B%22disablePerformance%22%3Atrue%2C%22sentry%22%3A%7B%7D%7D%2C%22ember-cli-mirage%22%3A%7B%22usingProxy%22%3Afalse%2C%22useDefaultPassthroughs%22%3Atrue%7D%2C%22exportApplicationGlobal%22%3Afalse%2C%22ember-load%22%3A%7B%22loadingIndicatorClass%22%3A%22ember-load-indicator%22%7D%7D" />
|
|
12
12
|
|
|
13
13
|
<meta name="HandheldFriendly" content="True" />
|
|
14
14
|
<meta name="MobileOptimized" content="320" />
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
|
|
42
42
|
|
|
43
43
|
<link rel="stylesheet" href="assets/vendor.min-987af30228885bce50f05c4723fe6f53.css">
|
|
44
|
-
<link rel="stylesheet" href="assets/ghost.min-
|
|
44
|
+
<link rel="stylesheet" href="assets/ghost.min-578a1b7e68d1f7ae0003ebe421b7c182.css" title="light">
|
|
45
45
|
|
|
46
46
|
|
|
47
47
|
|
|
@@ -59,8 +59,8 @@
|
|
|
59
59
|
<div id="ember-basic-dropdown-wormhole"></div>
|
|
60
60
|
|
|
61
61
|
|
|
62
|
-
<script src="assets/vendor.min-
|
|
63
|
-
<script src="assets/ghost.min-
|
|
62
|
+
<script src="assets/vendor.min-c450359ad46217cd48c00b277ae54a09.js"></script>
|
|
63
|
+
<script src="assets/ghost.min-ba8ef5d16b8a6f9072564a368154df72.js"></script>
|
|
64
64
|
|
|
65
65
|
</body>
|
|
66
66
|
</html>
|