@streamscloud/embeddable 10.1.2 → 12.0.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/dist/ads/ad-card/cmp.ad-card.svelte +30 -10
- package/dist/ads/ad-card/cmp.ad-card.svelte.d.ts +7 -0
- package/dist/content-player/cmp.content-player.svelte +67 -142
- package/dist/content-player/content-player-config.svelte.d.ts +14 -10
- package/dist/content-player/content-player-config.svelte.js +5 -20
- package/dist/content-player/content-player-settings.d.ts +7 -9
- package/dist/content-player/content-player-settings.js +12 -4
- package/dist/content-player/controls-and-attachments.svelte +63 -58
- package/dist/content-player/overview-panel.svelte +32 -74
- package/dist/content-player/overview-panel.svelte.d.ts +34 -7
- package/dist/content-player/ui-manager.svelte.d.ts +2 -6
- package/dist/content-player/ui-manager.svelte.js +3 -7
- package/dist/media-center/config/internal-media-center-config.d.ts +7 -3
- package/dist/media-center/config/internal-media-center-config.js +27 -23
- package/dist/media-center/config/operations.generated.d.ts +23 -3
- package/dist/media-center/config/operations.generated.js +37 -6
- package/dist/media-center/config/operations.graphql +24 -4
- package/dist/media-center/config/types.d.ts +18 -2
- package/dist/media-center/media-center/cmp.media-center.svelte +213 -398
- package/dist/media-center/media-center/cmp.media-center.svelte.d.ts +2 -17
- package/dist/media-center/media-center/discover/data-loading.d.ts +8 -0
- package/dist/media-center/media-center/discover/data-loading.js +35 -0
- package/dist/media-center/media-center/discover/discover-header-localization.d.ts +6 -0
- package/dist/media-center/media-center/discover/discover-header-localization.js +15 -0
- package/dist/media-center/media-center/discover/discover-header.svelte +214 -0
- package/dist/media-center/media-center/discover/discover-header.svelte.d.ts +9 -0
- package/dist/media-center/media-center/discover/discover-view-handler.svelte.d.ts +28 -0
- package/dist/media-center/media-center/discover/discover-view-handler.svelte.js +101 -0
- package/dist/media-center/media-center/discover/discover-view-localization.d.ts +6 -0
- package/dist/media-center/media-center/discover/discover-view-localization.js +15 -0
- package/dist/media-center/media-center/discover/discover-view.svelte +238 -0
- package/dist/media-center/media-center/discover/discover-view.svelte.d.ts +15 -0
- package/dist/media-center/media-center/discover/index.d.ts +2 -0
- package/dist/media-center/media-center/discover/index.js +2 -0
- package/dist/media-center/media-center/discover/types.svelte.d.ts +20 -0
- package/dist/media-center/media-center/discover/types.svelte.js +20 -0
- package/dist/media-center/media-center/feed/feed-handler.svelte.d.ts +50 -0
- package/dist/media-center/media-center/feed/feed-handler.svelte.js +84 -0
- package/dist/media-center/media-center/feed/feed-providers-generator.d.ts +11 -0
- package/dist/media-center/media-center/feed/feed-providers-generator.js +79 -0
- package/dist/media-center/media-center/feed/index.d.ts +1 -0
- package/dist/media-center/media-center/feed/index.js +1 -0
- package/dist/media-center/media-center/feed/types.d.ts +12 -0
- package/dist/media-center/media-center/handlers/categories-handler.svelte.d.ts +27 -0
- package/dist/media-center/media-center/handlers/categories-handler.svelte.js +39 -0
- package/dist/media-center/media-center/handlers/index.d.ts +2 -0
- package/dist/media-center/media-center/handlers/index.js +2 -0
- package/dist/media-center/media-center/handlers/media-center-settings-handler.svelte.d.ts +19 -0
- package/dist/media-center/media-center/handlers/media-center-settings-handler.svelte.js +26 -0
- package/dist/media-center/media-center/header-footer/index.d.ts +3 -0
- package/dist/media-center/media-center/header-footer/index.js +3 -0
- package/dist/media-center/media-center/header-footer/media-center-footer.svelte +73 -0
- package/dist/media-center/media-center/header-footer/media-center-footer.svelte.d.ts +7 -0
- package/dist/media-center/media-center/header-footer/media-center-header-localization.d.ts +13 -0
- package/dist/media-center/media-center/header-footer/media-center-header-localization.js +46 -0
- package/dist/media-center/media-center/header-footer/media-center-header-mobile.svelte +80 -0
- package/dist/media-center/media-center/header-footer/media-center-header-mobile.svelte.d.ts +12 -0
- package/dist/media-center/media-center/header-footer/media-center-header.svelte +313 -0
- package/dist/media-center/media-center/header-footer/media-center-header.svelte.d.ts +12 -0
- package/dist/media-center/media-center/media-center-context.svelte.d.ts +68 -0
- package/dist/media-center/media-center/media-center-context.svelte.js +134 -0
- package/dist/media-center/media-center/{category-following-wrapper.svelte → menu/category-following-wrapper.svelte} +3 -2
- package/dist/media-center/media-center/{category-following-wrapper.svelte.d.ts → menu/category-following-wrapper.svelte.d.ts} +2 -2
- package/dist/media-center/media-center/menu/index.d.ts +2 -0
- package/dist/media-center/media-center/menu/index.js +2 -0
- package/dist/media-center/media-center/menu/menu-localization.d.ts +10 -0
- package/dist/media-center/media-center/menu/menu-localization.js +39 -0
- package/dist/media-center/media-center/menu/menu.svelte +353 -0
- package/dist/media-center/media-center/menu/menu.svelte.d.ts +14 -0
- package/dist/media-center/media-center/menu/popular-streams-panel-handler.svelte.d.ts +10 -0
- package/dist/media-center/media-center/menu/popular-streams-panel-handler.svelte.js +23 -0
- package/dist/media-center/media-center/moments/cmp.moments-circle.svelte +41 -0
- package/dist/media-center/media-center/moments/cmp.moments-circle.svelte.d.ts +7 -0
- package/dist/media-center/media-center/moments/index.d.ts +1 -0
- package/dist/media-center/media-center/moments/index.js +1 -0
- package/dist/media-center/media-center/streams-in-category/index.d.ts +2 -0
- package/dist/media-center/media-center/streams-in-category/index.js +2 -0
- package/dist/media-center/media-center/{streams-in-category-panel-handler.svelte.d.ts → streams-in-category/streams-in-category-panel-handler.svelte.d.ts} +5 -5
- package/dist/media-center/media-center/{streams-in-category-panel-handler.svelte.js → streams-in-category/streams-in-category-panel-handler.svelte.js} +5 -5
- package/dist/media-center/media-center/{streams-in-category-panel.svelte → streams-in-category/streams-in-category-panel.svelte} +1 -1
- package/dist/media-center/media-center/{streams-in-category-panel.svelte.d.ts → streams-in-category/streams-in-category-panel.svelte.d.ts} +1 -1
- package/dist/media-center/media-center/types.d.ts +44 -1
- package/dist/media-page/index.d.ts +121 -0
- package/dist/media-page/index.js +43 -0
- package/dist/posts/attachments/cmp.attachments.svelte +6 -3
- package/dist/posts/attachments/cmp.attachments.svelte.d.ts +6 -0
- package/dist/posts/controls/cmp.controls.svelte +51 -14
- package/dist/posts/controls/cmp.controls.svelte.d.ts +2 -0
- package/dist/posts/data-loaders/operations.generated.d.ts +4 -0
- package/dist/posts/data-loaders/operations.generated.js +6 -2
- package/dist/posts/model/types.d.ts +2 -0
- package/dist/posts/post-viewer/cmp.post-viewer.svelte +29 -19
- package/dist/posts/post-viewer/cmp.post-viewer.svelte.d.ts +4 -0
- package/dist/posts/post-viewer/mapper.js +2 -0
- package/dist/posts/post-viewer/operations.generated.d.ts +2 -0
- package/dist/posts/post-viewer/operations.generated.js +3 -1
- package/dist/posts/post-viewer/operations.graphql +2 -0
- package/dist/posts/post-viewer/post-texts.svelte +3 -3
- package/dist/posts/posts-player/cmp.posts-player.svelte +20 -6
- package/dist/posts/posts-player/cmp.posts-player.svelte.d.ts +18 -2
- package/dist/posts/posts-player/index.d.ts +18 -3
- package/dist/posts/posts-player/index.js +42 -89
- package/dist/posts/posts-player/posts-player-proxy.svelte +19 -0
- package/dist/posts/posts-player/posts-player-proxy.svelte.d.ts +22 -0
- package/dist/posts/posts-player/posts-player-view.svelte +20 -34
- package/dist/posts/posts-player/posts-player-view.svelte.d.ts +2 -6
- package/dist/posts/posts-player/types.d.ts +19 -6
- package/dist/products/product-card/cmp.product-card.svelte +39 -15
- package/dist/products/product-card/cmp.product-card.svelte.d.ts +6 -1
- package/dist/short-videos/short-video-card/cmp.short-video-card.svelte +160 -19
- package/dist/short-videos/short-video-card/cmp.short-video-card.svelte.d.ts +2 -1
- package/dist/short-videos/short-video-card/localization.d.ts +5 -0
- package/dist/short-videos/short-video-card/localization.js +13 -0
- package/dist/short-videos/short-video-card/types.d.ts +4 -0
- package/dist/short-videos/short-videos-player/index.js +26 -33
- package/dist/streams/data-loaders/mapper.js +0 -5
- package/dist/streams/data-loaders/operations.generated.d.ts +0 -12
- package/dist/streams/data-loaders/operations.generated.js +0 -26
- package/dist/streams/data-loaders/operations.graphql +0 -6
- package/dist/streams/layout/element-views/cmp.short-video-stream-element.svelte +2 -1
- package/dist/streams/layout/element-views/cmp.short-video-stream-element.svelte.d.ts +4 -0
- package/dist/streams/layout/element-views/cmp.stream-element.svelte +2 -2
- package/dist/streams/layout/element-views/cmp.text-ref-stream-element.svelte +7 -3
- package/dist/streams/layout/element-views/cmp.text-ref-stream-element.svelte.d.ts +2 -0
- package/dist/streams/layout/element-views/cmp.text-stream-element.svelte +7 -3
- package/dist/streams/layout/element-views/cmp.text-stream-element.svelte.d.ts +2 -0
- package/dist/streams/layout/element-views/price-element-view.svelte +2 -2
- package/dist/streams/layout/element-views/price-stream-element-localization.d.ts +1 -1
- package/dist/streams/layout/element-views/price-stream-element-localization.js +2 -2
- package/dist/streams/layout/models/mapper.js +2 -0
- package/dist/streams/stream-card/cmp.stream-card.svelte +5 -5
- package/dist/streams/streams-player/index.d.ts +21 -2
- package/dist/streams/streams-player/index.js +49 -24
- package/dist/streams/streams-player/stream-overview.svelte +6 -96
- package/dist/streams/streams-player/stream-overview.svelte.d.ts +0 -4
- package/dist/streams/streams-player/stream-player-localization.d.ts +0 -1
- package/dist/streams/streams-player/stream-player-localization.js +0 -6
- package/dist/streams/streams-player/streams-player-buffer.svelte.d.ts +1 -3
- package/dist/streams/streams-player/streams-player-buffer.svelte.js +2 -2
- package/dist/streams/streams-player/streams-player-view.svelte +25 -23
- package/dist/streams/streams-player/streams-player-view.svelte.d.ts +1 -5
- package/dist/streams/streams-player/types.d.ts +18 -8
- package/dist/ui/icon/cmp.icon.svelte +3 -2
- package/dist/ui/line-clamp/cmp.line-clamp-auto.svelte +119 -0
- package/dist/ui/line-clamp/cmp.line-clamp-auto.svelte.d.ts +10 -0
- package/dist/ui/line-clamp/cmp.line-clamp.svelte +44 -72
- package/dist/ui/line-clamp/cmp.line-clamp.svelte.d.ts +3 -4
- package/dist/ui/line-clamp/index.d.ts +1 -0
- package/dist/ui/line-clamp/index.js +1 -0
- package/dist/ui/player/button/cmp.mobile-player-buttons-group.svelte +44 -0
- package/dist/ui/player/button/cmp.mobile-player-buttons-group.svelte.d.ts +7 -0
- package/dist/ui/player/button/cmp.player-button.svelte +16 -5
- package/dist/ui/player/button/cmp.player-button.svelte.d.ts +3 -0
- package/dist/ui/player/button/cmp.player-buttons-group.svelte +27 -8
- package/dist/ui/player/button/cmp.player-buttons-group.svelte.d.ts +2 -0
- package/dist/ui/player/button/index.d.ts +1 -0
- package/dist/ui/player/button/index.js +1 -0
- package/dist/ui/player/close-orchestrator/close-orchestrator.svelte.d.ts +18 -0
- package/dist/ui/player/close-orchestrator/close-orchestrator.svelte.js +58 -0
- package/dist/ui/player/close-orchestrator/index.d.ts +2 -0
- package/dist/ui/player/close-orchestrator/index.js +1 -0
- package/dist/ui/player/close-orchestrator/types.d.ts +9 -0
- package/dist/ui/player/close-orchestrator/types.js +1 -0
- package/dist/ui/player/colors/index.d.ts +1 -0
- package/dist/ui/player/colors/index.js +1 -0
- package/dist/ui/player/colors/player-colors.d.ts +11 -0
- package/dist/ui/player/colors/player-colors.js +1 -0
- package/dist/ui/player/providers/chunks-player-buffer/player-chunks-manager.svelte.d.ts +2 -6
- package/dist/ui/player/providers/chunks-player-buffer/player-chunks-manager.svelte.js +11 -11
- package/dist/ui/player/providers/default-chunks-player-buffer.svelte.d.ts +2 -3
- package/dist/ui/player/providers/default-chunks-player-buffer.svelte.js +5 -5
- package/dist/ui/player/providers/default-feed-player-buffer.svelte.d.ts +3 -4
- package/dist/ui/player/providers/default-feed-player-buffer.svelte.js +16 -9
- package/dist/ui/player/providers/service.d.ts +2 -0
- package/dist/ui/player/providers/service.js +13 -0
- package/dist/ui/player/providers/types.d.ts +1 -0
- package/dist/ui/with-background/cmp.with-background.svelte +86 -0
- package/dist/ui/with-background/cmp.with-background.svelte.d.ts +10 -0
- package/dist/ui/with-background/index.d.ts +1 -0
- package/dist/ui/with-background/index.js +1 -0
- package/package.json +5 -1
- package/dist/content-player/content-player-localization.d.ts +0 -6
- package/dist/content-player/content-player-localization.js +0 -15
- package/dist/content-player/fade-mixins.scss +0 -12
- package/dist/content-player/header.svelte +0 -137
- package/dist/content-player/header.svelte.d.ts +0 -32
- package/dist/media-center/media-center/desktop-categories-selector.svelte +0 -132
- package/dist/media-center/media-center/desktop-categories-selector.svelte.d.ts +0 -12
- package/dist/media-center/media-center/discover-panel-handler.svelte.d.ts +0 -32
- package/dist/media-center/media-center/discover-panel-handler.svelte.js +0 -101
- package/dist/media-center/media-center/discover-panel.svelte +0 -133
- package/dist/media-center/media-center/discover-panel.svelte.d.ts +0 -15
- package/dist/media-center/media-center/media-center-handler.svelte.d.ts +0 -28
- package/dist/media-center/media-center/media-center-handler.svelte.js +0 -73
- package/dist/media-center/media-center/media-center-localization.d.ts +0 -10
- package/dist/media-center/media-center/media-center-localization.js +0 -39
- package/dist/media-center/media-center/mobile-controls-panel.svelte +0 -268
- package/dist/media-center/media-center/mobile-controls-panel.svelte.d.ts +0 -20
- package/dist/media-center/media-center/post-player-provider-generator.d.ts +0 -8
- package/dist/media-center/media-center/post-player-provider-generator.js +0 -32
- package/dist/media-center/media-center/streams-player-provider-generator.d.ts +0 -8
- package/dist/media-center/media-center/streams-player-provider-generator.js +0 -36
- package/dist/media-center/model/types.d.ts +0 -16
- /package/dist/media-center/{model → media-center/feed}/types.js +0 -0
|
@@ -1,70 +1,44 @@
|
|
|
1
1
|
<script lang="ts">import { LineClampLocalization } from './line-clamp-localization';
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
const localization = $derived(new LineClampLocalization(locale !== null && locale !== void 0 ? locale : 'en'));
|
|
6
|
-
let parent;
|
|
7
|
-
let element;
|
|
8
|
-
let clampWrapperRef;
|
|
2
|
+
import {} from 'svelte';
|
|
3
|
+
let { maxLines, locale, enableShowMore = false, children } = $props();
|
|
4
|
+
const localization = $derived(new LineClampLocalization(locale));
|
|
9
5
|
let isTruncated = $state(false);
|
|
10
6
|
let showingAllText = $state(false);
|
|
11
|
-
|
|
12
|
-
onMount(() => {
|
|
13
|
-
let parentElement = element.parentElement;
|
|
14
|
-
if (!parentElement || !('clientHeight' in parentElement)) {
|
|
15
|
-
console.error('Unsupported parent for multiline clamper');
|
|
16
|
-
}
|
|
17
|
-
else {
|
|
18
|
-
parent = parentElement;
|
|
19
|
-
clamp();
|
|
20
|
-
resizeObserver = new ResizeObserver(clamp);
|
|
21
|
-
resizeObserver.observe(parent);
|
|
22
|
-
}
|
|
23
|
-
});
|
|
24
|
-
onDestroy(() => {
|
|
25
|
-
resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.disconnect();
|
|
26
|
-
resizeObserver = null;
|
|
27
|
-
});
|
|
28
|
-
const clamp = () => {
|
|
29
|
-
isTruncated = clampWrapperRef.scrollHeight > clampWrapperRef.offsetHeight;
|
|
30
|
-
if (showingAllText) {
|
|
31
|
-
setClampValue('unset');
|
|
32
|
-
}
|
|
33
|
-
else {
|
|
34
|
-
let clampValue;
|
|
35
|
-
if (maxLines === 'auto') {
|
|
36
|
-
clampValue = LineClampUtils.calculateClampValue(parent);
|
|
37
|
-
}
|
|
38
|
-
else {
|
|
39
|
-
clampValue = maxLines;
|
|
40
|
-
}
|
|
41
|
-
setClampValue(clampValue.toString());
|
|
42
|
-
}
|
|
43
|
-
};
|
|
44
|
-
const setClampValue = (value) => {
|
|
45
|
-
clampWrapperRef.style.setProperty('-webkit-line-clamp', value);
|
|
46
|
-
};
|
|
7
|
+
const canShowMore = $derived(enableShowMore && isTruncated && !showingAllText);
|
|
47
8
|
const toggleShowMore = () => {
|
|
48
9
|
showingAllText = !showingAllText;
|
|
49
|
-
clamp();
|
|
50
10
|
};
|
|
11
|
+
const trackTruncatatedState = (node) => {
|
|
12
|
+
const resizeObserver = new ResizeObserver(() => {
|
|
13
|
+
isTruncated = node.scrollHeight > node.offsetHeight;
|
|
14
|
+
});
|
|
15
|
+
resizeObserver.observe(node);
|
|
16
|
+
return {
|
|
17
|
+
destroy() {
|
|
18
|
+
resizeObserver.disconnect();
|
|
19
|
+
}
|
|
20
|
+
};
|
|
21
|
+
};
|
|
22
|
+
const styles = $derived.by(() => {
|
|
23
|
+
const values = [];
|
|
24
|
+
if (maxLines) {
|
|
25
|
+
values.push(`--line-clamp--line-clamp: ${maxLines}`);
|
|
26
|
+
}
|
|
27
|
+
return values.join(';');
|
|
28
|
+
});
|
|
51
29
|
</script>
|
|
52
30
|
|
|
53
|
-
<div
|
|
31
|
+
<div
|
|
32
|
+
class="line-clamp"
|
|
33
|
+
class:line-clamp--clickable={canShowMore}
|
|
34
|
+
style={styles}
|
|
35
|
+
onclick={() => canShowMore && toggleShowMore()}
|
|
36
|
+
onmousedown={() => {}}
|
|
37
|
+
role="none">
|
|
54
38
|
<div class="line-clamp__wrapper-container">
|
|
55
|
-
<div class="line-clamp__wrapper"
|
|
56
|
-
{
|
|
57
|
-
{@render children()}
|
|
58
|
-
{:else if value}
|
|
59
|
-
{@html value}
|
|
60
|
-
{/if}
|
|
39
|
+
<div class="line-clamp__wrapper" class:line-clamp__wrapper--showing-all={showingAllText} use:trackTruncatatedState>
|
|
40
|
+
{@render children()}
|
|
61
41
|
</div>
|
|
62
|
-
|
|
63
|
-
{#if enableShowMore && isTruncated && !showingAllText}
|
|
64
|
-
<button type="button" class="line-clamp__show-more-button line-clamp__show-more-button--inline" onclick={toggleShowMore}>
|
|
65
|
-
{localization.showMore}
|
|
66
|
-
</button>
|
|
67
|
-
{/if}
|
|
68
42
|
</div>
|
|
69
43
|
|
|
70
44
|
{#if enableShowMore && showingAllText}
|
|
@@ -75,11 +49,17 @@ const toggleShowMore = () => {
|
|
|
75
49
|
</div>
|
|
76
50
|
|
|
77
51
|
<style>.line-clamp {
|
|
52
|
+
--_line-clamp--white-space: var(--line-clamp--white-space, pre-line);
|
|
53
|
+
--_line-clamp--line-clamp: var(--line-clamp--line-clamp, 0);
|
|
78
54
|
width: 100%;
|
|
79
55
|
height: 100%;
|
|
80
56
|
display: flex;
|
|
81
57
|
flex-direction: column;
|
|
82
58
|
}
|
|
59
|
+
.line-clamp--clickable {
|
|
60
|
+
cursor: pointer;
|
|
61
|
+
pointer-events: auto;
|
|
62
|
+
}
|
|
83
63
|
.line-clamp__wrapper-container {
|
|
84
64
|
position: relative;
|
|
85
65
|
}
|
|
@@ -87,26 +67,18 @@ const toggleShowMore = () => {
|
|
|
87
67
|
display: -webkit-box;
|
|
88
68
|
overflow: hidden;
|
|
89
69
|
word-break: break-word;
|
|
90
|
-
white-space: var(--
|
|
70
|
+
white-space: var(--_line-clamp--white-space);
|
|
91
71
|
-webkit-box-orient: vertical;
|
|
72
|
+
line-clamp: var(--_line-clamp--line-clamp);
|
|
73
|
+
-webkit-line-clamp: var(--_line-clamp--line-clamp);
|
|
74
|
+
text-overflow: ellipsis;
|
|
75
|
+
}
|
|
76
|
+
.line-clamp__wrapper--showing-all {
|
|
77
|
+
--_line-clamp--line-clamp: none;
|
|
92
78
|
}
|
|
93
79
|
.line-clamp__show-more-button {
|
|
94
80
|
font-size: 0.9em;
|
|
95
81
|
font-style: italic;
|
|
96
82
|
pointer-events: auto;
|
|
97
|
-
}
|
|
98
|
-
.line-clamp__show-more-button--inline {
|
|
99
|
-
position: absolute;
|
|
100
|
-
bottom: 0;
|
|
101
|
-
right: 0;
|
|
102
|
-
padding-left: 1em;
|
|
103
|
-
backdrop-filter: blur(2px);
|
|
104
|
-
}
|
|
105
|
-
.line-clamp__show-more-button--inline::after {
|
|
106
|
-
content: "...";
|
|
107
|
-
position: absolute;
|
|
108
|
-
left: 0;
|
|
109
|
-
}
|
|
110
|
-
.line-clamp__show-more-button:not(.line-clamp__show-more-button--inline) {
|
|
111
83
|
margin-top: 0.5em;
|
|
112
84
|
}</style>
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import type { Locale } from '../../core/locale';
|
|
2
2
|
import { type Snippet } from 'svelte';
|
|
3
3
|
type Props = {
|
|
4
|
-
|
|
5
|
-
maxLines?: number | 'auto';
|
|
4
|
+
maxLines?: number;
|
|
6
5
|
enableShowMore?: boolean;
|
|
7
|
-
locale
|
|
8
|
-
children
|
|
6
|
+
locale: Locale;
|
|
7
|
+
children: Snippet;
|
|
9
8
|
};
|
|
10
9
|
declare const Cmp: import("svelte").Component<Props, {}, "">;
|
|
11
10
|
type Cmp = ReturnType<typeof Cmp>;
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
<script lang="ts">import { Icon } from '../../icon';
|
|
2
|
+
let { actions } = $props();
|
|
3
|
+
</script>
|
|
4
|
+
|
|
5
|
+
<div class="mobile-player-buttons-group">
|
|
6
|
+
{#each actions as action (action.icon)}
|
|
7
|
+
<button type="button" class="mobile-player-buttons-group__action" onclick={action.callback}>
|
|
8
|
+
<span class="mobile-player-buttons-group__action-icon">
|
|
9
|
+
<Icon src={action.icon} color={action.iconColor} />
|
|
10
|
+
</span>
|
|
11
|
+
</button>
|
|
12
|
+
{/each}
|
|
13
|
+
</div>
|
|
14
|
+
|
|
15
|
+
<style>@keyframes fadeIn {
|
|
16
|
+
0% {
|
|
17
|
+
opacity: 1;
|
|
18
|
+
}
|
|
19
|
+
50% {
|
|
20
|
+
opacity: 0.4;
|
|
21
|
+
}
|
|
22
|
+
100% {
|
|
23
|
+
opacity: 1;
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
.mobile-player-buttons-group {
|
|
27
|
+
cursor: pointer;
|
|
28
|
+
display: flex;
|
|
29
|
+
flex-direction: column;
|
|
30
|
+
justify-content: center;
|
|
31
|
+
pointer-events: auto;
|
|
32
|
+
}
|
|
33
|
+
.mobile-player-buttons-group__action {
|
|
34
|
+
display: flex;
|
|
35
|
+
justify-content: center;
|
|
36
|
+
align-items: center;
|
|
37
|
+
padding: 1rem;
|
|
38
|
+
--icon--color: #ffffff;
|
|
39
|
+
--icon--size: 2rem;
|
|
40
|
+
--icon--filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.2));
|
|
41
|
+
}
|
|
42
|
+
.mobile-player-buttons-group__action-icon {
|
|
43
|
+
display: block;
|
|
44
|
+
}</style>
|
|
@@ -1,8 +1,18 @@
|
|
|
1
1
|
<script lang="ts">import { Icon, IconColor } from '../../icon';
|
|
2
|
-
let { icon, iconColor, scaleEffect = false, disabled = false, on } = $props();
|
|
2
|
+
let { icon, activeColor, inactiveColor, iconColor, scaleEffect = false, disabled = false, zoom = 1, on } = $props();
|
|
3
|
+
const styles = $derived.by(() => {
|
|
4
|
+
const values = [`zoom: ${zoom}`];
|
|
5
|
+
if (activeColor) {
|
|
6
|
+
values.push(`--player-button--color: ${activeColor}`);
|
|
7
|
+
}
|
|
8
|
+
if (inactiveColor) {
|
|
9
|
+
values.push(`--player-button--color--inactive: ${inactiveColor}`);
|
|
10
|
+
}
|
|
11
|
+
return values.join(';');
|
|
12
|
+
});
|
|
3
13
|
</script>
|
|
4
14
|
|
|
5
|
-
<button type="button" class="player-button" class:player-button--scale-effect={scaleEffect} disabled={disabled} onclick={on.click}>
|
|
15
|
+
<button type="button" class="player-button" style={styles} class:player-button--scale-effect={scaleEffect} disabled={disabled} onclick={on.click}>
|
|
6
16
|
<span class="player-button__icon">
|
|
7
17
|
<Icon src={icon} color={iconColor} />
|
|
8
18
|
</span>
|
|
@@ -20,22 +30,23 @@ let { icon, iconColor, scaleEffect = false, disabled = false, on } = $props();
|
|
|
20
30
|
}
|
|
21
31
|
}
|
|
22
32
|
.player-button {
|
|
33
|
+
--_player-button--color: var(--player-button--color, rgb(from #000000 r g b / 95%));
|
|
34
|
+
--_player-button--color--inactive: var(--player-button--color--inactive, rgb(from var(--_player-button--color, #000000) r g b / 60%));
|
|
23
35
|
--_player-button--icon-scale: 1;
|
|
24
36
|
pointer-events: auto;
|
|
25
37
|
padding: 0.625rem;
|
|
26
38
|
display: flex;
|
|
27
39
|
justify-content: center;
|
|
28
40
|
align-items: center;
|
|
29
|
-
background-color:
|
|
41
|
+
background-color: var(--_player-button--color--inactive);
|
|
30
42
|
transition: background-color 0.5s;
|
|
31
|
-
border: 1px solid #1c1c1c;
|
|
32
43
|
border-radius: 50%;
|
|
33
44
|
--icon--color: #ffffff;
|
|
34
45
|
--icon--size: 1.75rem;
|
|
35
46
|
/* Set 'container-type: inline-size;' to reference container*/
|
|
36
47
|
}
|
|
37
48
|
.player-button:hover:not(:disabled) {
|
|
38
|
-
background-color:
|
|
49
|
+
background-color: var(--_player-button--color);
|
|
39
50
|
}
|
|
40
51
|
.player-button:disabled {
|
|
41
52
|
opacity: 0.5;
|
|
@@ -1,9 +1,12 @@
|
|
|
1
1
|
import { IconColor } from '../../icon';
|
|
2
2
|
type Props = {
|
|
3
3
|
icon: string;
|
|
4
|
+
activeColor: string | null;
|
|
5
|
+
inactiveColor: string | null;
|
|
4
6
|
iconColor?: IconColor;
|
|
5
7
|
disabled?: boolean;
|
|
6
8
|
scaleEffect?: boolean;
|
|
9
|
+
zoom?: number;
|
|
7
10
|
on: {
|
|
8
11
|
click: () => void;
|
|
9
12
|
};
|
|
@@ -1,8 +1,18 @@
|
|
|
1
1
|
<script lang="ts">import { Icon } from '../../icon';
|
|
2
|
-
let { scaleEffect = false, actions } = $props();
|
|
2
|
+
let { scaleEffect = false, activeColor, backgroundColor, actions } = $props();
|
|
3
|
+
const styles = $derived.by(() => {
|
|
4
|
+
const values = [];
|
|
5
|
+
if (activeColor) {
|
|
6
|
+
values.push(`--player-buttons-group--active-color: ${activeColor}`);
|
|
7
|
+
}
|
|
8
|
+
if (backgroundColor) {
|
|
9
|
+
values.push(`--player-buttons-group--background-color: ${backgroundColor}`);
|
|
10
|
+
}
|
|
11
|
+
return values.join(';');
|
|
12
|
+
});
|
|
3
13
|
</script>
|
|
4
14
|
|
|
5
|
-
<div class="player-buttons-group">
|
|
15
|
+
<div class="player-buttons-group" style={styles}>
|
|
6
16
|
{#each actions as action (action.icon)}
|
|
7
17
|
<button type="button" class="player-buttons-group__action" class:player-buttons-group__action--scale-effect={scaleEffect} onclick={action.callback}>
|
|
8
18
|
<span class="player-buttons-group__action-icon">
|
|
@@ -24,15 +34,18 @@ let { scaleEffect = false, actions } = $props();
|
|
|
24
34
|
}
|
|
25
35
|
}
|
|
26
36
|
.player-buttons-group {
|
|
37
|
+
--_player-buttons-group--active-color: var(--player-buttons-group--active-color, rgb(from #000000 r g b / 95%));
|
|
38
|
+
--_player-buttons-group--background-color: var(
|
|
39
|
+
--player-buttons-group--background-color,
|
|
40
|
+
rgb(from var(--_player-buttons-group--active-color, #000000) r g b / 60%)
|
|
41
|
+
);
|
|
27
42
|
cursor: pointer;
|
|
28
43
|
display: flex;
|
|
29
44
|
flex-direction: column;
|
|
30
45
|
justify-content: center;
|
|
31
|
-
gap: 1.125rem;
|
|
32
|
-
border: 1px solid #1c1c1c;
|
|
33
46
|
border-radius: 1.25rem;
|
|
34
|
-
background:
|
|
35
|
-
padding:
|
|
47
|
+
background: var(--_player-buttons-group--background-color);
|
|
48
|
+
padding: 0.4375rem 0.0625rem;
|
|
36
49
|
pointer-events: auto;
|
|
37
50
|
/* Set 'container-type: inline-size;' to reference container*/
|
|
38
51
|
}
|
|
@@ -41,11 +54,18 @@ let { scaleEffect = false, actions } = $props();
|
|
|
41
54
|
display: flex;
|
|
42
55
|
justify-content: center;
|
|
43
56
|
align-items: center;
|
|
57
|
+
padding: 0.5625rem;
|
|
58
|
+
border-radius: 1.25rem;
|
|
44
59
|
--icon--color: #ffffff;
|
|
45
60
|
--icon--size: 1.75rem;
|
|
61
|
+
transition: background-color 0.5s;
|
|
62
|
+
}
|
|
63
|
+
.player-buttons-group__action:hover {
|
|
64
|
+
background-color: var(--_player-buttons-group--active-color);
|
|
46
65
|
}
|
|
47
66
|
.player-buttons-group__action--scale-effect:hover {
|
|
48
67
|
--_player-action--icon-scale: 1.2;
|
|
68
|
+
background-color: transparent;
|
|
49
69
|
}
|
|
50
70
|
.player-buttons-group__action-icon {
|
|
51
71
|
display: block;
|
|
@@ -54,9 +74,8 @@ let { scaleEffect = false, actions } = $props();
|
|
|
54
74
|
}
|
|
55
75
|
@container (width < 576px) {
|
|
56
76
|
.player-buttons-group {
|
|
57
|
-
gap: 1.125rem;
|
|
58
77
|
border-radius: 0.9375rem;
|
|
59
|
-
padding: 0.
|
|
78
|
+
padding: 0.25rem 0.0625rem;
|
|
60
79
|
}
|
|
61
80
|
.player-buttons-group__action {
|
|
62
81
|
--icon--size: 1.5rem;
|
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
export { default as PlayerButton } from './cmp.player-button.svelte';
|
|
2
2
|
export { default as PlayerButtonsGroup } from './cmp.player-buttons-group.svelte';
|
|
3
|
+
export { default as MobilePlayerButtonsGroup } from './cmp.mobile-player-buttons-group.svelte';
|
|
3
4
|
export type { PlayerButtonsGroupAction } from './types';
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import type { ICloseOrchestrator } from './types';
|
|
2
|
+
export declare class CloseOrchestrator implements ICloseOrchestrator {
|
|
3
|
+
closingInProgress: boolean;
|
|
4
|
+
closed: boolean;
|
|
5
|
+
closeTriggerAttached: boolean;
|
|
6
|
+
private _canClose;
|
|
7
|
+
private _closeFn;
|
|
8
|
+
private _callbacks;
|
|
9
|
+
constructor(init: {
|
|
10
|
+
closeFn: () => void;
|
|
11
|
+
canClose: boolean;
|
|
12
|
+
});
|
|
13
|
+
get closeTriggerVisible(): boolean;
|
|
14
|
+
subscribe: (callback: () => void) => void;
|
|
15
|
+
unsubscribe: (callback: () => void) => void;
|
|
16
|
+
setCloseTriggerAttached: (attached: boolean) => void;
|
|
17
|
+
requestClose: () => Promise<void>;
|
|
18
|
+
}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
export class CloseOrchestrator {
|
|
2
|
+
closingInProgress = $state(false);
|
|
3
|
+
closed = $state(false);
|
|
4
|
+
// Indicates whether the close trigger (button) is already attached to the DOM, to avoid duplicates
|
|
5
|
+
closeTriggerAttached = $state(false);
|
|
6
|
+
_canClose;
|
|
7
|
+
_closeFn;
|
|
8
|
+
_callbacks = new Set();
|
|
9
|
+
constructor(init) {
|
|
10
|
+
this._closeFn = init.closeFn;
|
|
11
|
+
this._canClose = init.canClose;
|
|
12
|
+
}
|
|
13
|
+
get closeTriggerVisible() {
|
|
14
|
+
return this._canClose;
|
|
15
|
+
}
|
|
16
|
+
subscribe = (callback) => {
|
|
17
|
+
this._callbacks.add(callback);
|
|
18
|
+
};
|
|
19
|
+
unsubscribe = (callback) => {
|
|
20
|
+
this._callbacks.delete(callback);
|
|
21
|
+
};
|
|
22
|
+
setCloseTriggerAttached = (attached) => {
|
|
23
|
+
this.closeTriggerAttached = attached;
|
|
24
|
+
};
|
|
25
|
+
requestClose = async () => {
|
|
26
|
+
// Check if closing is allowed
|
|
27
|
+
if (!this._canClose) {
|
|
28
|
+
return;
|
|
29
|
+
}
|
|
30
|
+
// Prevent multiple simultaneous close attempts
|
|
31
|
+
if (this.closingInProgress || this.closed) {
|
|
32
|
+
return;
|
|
33
|
+
}
|
|
34
|
+
this.closingInProgress = true;
|
|
35
|
+
try {
|
|
36
|
+
// Wait for all callbacks to complete
|
|
37
|
+
await Promise.all(Array.from(this._callbacks).map((cb) => cb()));
|
|
38
|
+
// Execute the close function
|
|
39
|
+
this._closeFn();
|
|
40
|
+
// Mark as successfully closed
|
|
41
|
+
this.closed = true;
|
|
42
|
+
}
|
|
43
|
+
catch (error) {
|
|
44
|
+
// Log error for debugging
|
|
45
|
+
console.error('Error during close operation:', error);
|
|
46
|
+
// Reset the flag to allow retry
|
|
47
|
+
this.closingInProgress = false;
|
|
48
|
+
// Re-throw error for upper-level handling
|
|
49
|
+
throw error;
|
|
50
|
+
}
|
|
51
|
+
finally {
|
|
52
|
+
// Clean up the closing flag on success
|
|
53
|
+
if (this.closed) {
|
|
54
|
+
this.closingInProgress = false;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
};
|
|
58
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { CloseOrchestrator } from './close-orchestrator.svelte';
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export type ICloseOrchestrator = {
|
|
2
|
+
readonly closingInProgress: boolean;
|
|
3
|
+
readonly closeTriggerVisible: boolean;
|
|
4
|
+
readonly closeTriggerAttached: boolean;
|
|
5
|
+
setCloseTriggerAttached: (attached: boolean) => void;
|
|
6
|
+
subscribe: (callback: () => void) => void;
|
|
7
|
+
unsubscribe: (callback: () => void) => void;
|
|
8
|
+
requestClose: () => void;
|
|
9
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type { PlayerColors } from './player-colors';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export type PlayerColors = {
|
|
2
|
+
brand: string | null;
|
|
3
|
+
button: string | null;
|
|
4
|
+
buttonInactive: string | null;
|
|
5
|
+
cardButton: string | null;
|
|
6
|
+
cardBackground: string | null;
|
|
7
|
+
playerBackground: string | null;
|
|
8
|
+
price: string | null;
|
|
9
|
+
salePrice: string | null;
|
|
10
|
+
sidebarBackground: string | null;
|
|
11
|
+
} | null;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -2,14 +2,10 @@ import { PlayerChunk } from './player-chunk.svelte';
|
|
|
2
2
|
import type { IChunksPlayerDataProvider, WithId } from '../types';
|
|
3
3
|
export declare class PlayerChunksManager<TItem extends WithId, TChunk extends WithId> {
|
|
4
4
|
private provider;
|
|
5
|
-
private callbacks;
|
|
6
5
|
private _activeChunkIndex;
|
|
7
6
|
private _loadedChunks;
|
|
8
|
-
private
|
|
9
|
-
constructor(provider: IChunksPlayerDataProvider<TItem, TChunk
|
|
10
|
-
onInitializationFinished: () => void;
|
|
11
|
-
onEndReached: () => void;
|
|
12
|
-
});
|
|
7
|
+
private _fetchDeferred;
|
|
8
|
+
constructor(provider: IChunksPlayerDataProvider<TItem, TChunk>);
|
|
13
9
|
get activeChunk(): PlayerChunk<TItem, TChunk>;
|
|
14
10
|
get loadedChunks(): PlayerChunk<TItem, TChunk>[];
|
|
15
11
|
get flattenedChunkItems(): TItem[];
|
|
@@ -1,15 +1,14 @@
|
|
|
1
|
+
import { Deferred } from '../../../../core/deferred';
|
|
1
2
|
import { PlayerChunk } from './player-chunk.svelte';
|
|
2
3
|
const CHUNKS_BUFFER_SIZE = 5;
|
|
3
4
|
const FIXED_START_INDEX = 0;
|
|
4
5
|
export class PlayerChunksManager {
|
|
5
6
|
provider;
|
|
6
|
-
callbacks;
|
|
7
7
|
_activeChunkIndex = $state(-1);
|
|
8
8
|
_loadedChunks = $state.raw([]);
|
|
9
|
-
|
|
10
|
-
constructor(provider
|
|
9
|
+
_fetchDeferred = $state.raw(null);
|
|
10
|
+
constructor(provider) {
|
|
11
11
|
this.provider = provider;
|
|
12
|
-
this.callbacks = callbacks;
|
|
13
12
|
}
|
|
14
13
|
get activeChunk() {
|
|
15
14
|
return this._loadedChunks[this._activeChunkIndex] ?? null;
|
|
@@ -34,12 +33,10 @@ export class PlayerChunksManager {
|
|
|
34
33
|
return itemsBeforeActiveChunk + this.activeChunk.activeChunkItem.indexWithinChunk;
|
|
35
34
|
}
|
|
36
35
|
initialize = async () => {
|
|
37
|
-
const { onInitializationFinished, onEndReached } = this.callbacks;
|
|
38
36
|
const handleInitialized = async () => {
|
|
39
37
|
const startIndex = Math.min(FIXED_START_INDEX, this._loadedChunks.length - 1);
|
|
40
38
|
const populateChunkResult = await this.populateChunkAtIndex(startIndex, (currentIndex) => currentIndex + 1);
|
|
41
39
|
if (!populateChunkResult) {
|
|
42
|
-
onEndReached();
|
|
43
40
|
return;
|
|
44
41
|
}
|
|
45
42
|
this.setActiveChunkIndex(populateChunkResult.closestReadyChunkIndex);
|
|
@@ -48,7 +45,6 @@ export class PlayerChunksManager {
|
|
|
48
45
|
this.provider.initialData.startItemIndex > 0) {
|
|
49
46
|
this.activeChunk.setActiveItemIndex(this.provider.initialData.startItemIndex);
|
|
50
47
|
}
|
|
51
|
-
onInitializationFinished();
|
|
52
48
|
};
|
|
53
49
|
this._loadedChunks = this.provider.initialData.prefetchedChunks.map((chunk, chunkIndex) => new PlayerChunk({ chunk, chunkIndex, provider: { loadChunkItems: this.provider.loadChunkItems } }));
|
|
54
50
|
const considerInitialized = this._loadedChunks.length !== 0;
|
|
@@ -84,10 +80,13 @@ export class PlayerChunksManager {
|
|
|
84
80
|
};
|
|
85
81
|
warmUp = async () => {
|
|
86
82
|
// Early return if manager is sufficient or already loading
|
|
87
|
-
if (this.
|
|
83
|
+
if (this._fetchDeferred) {
|
|
84
|
+
return this._fetchDeferred.promise;
|
|
85
|
+
}
|
|
86
|
+
if (this._loadedChunks.length >= this._activeChunkIndex + CHUNKS_BUFFER_SIZE) {
|
|
88
87
|
return;
|
|
89
88
|
}
|
|
90
|
-
this.
|
|
89
|
+
this._fetchDeferred = new Deferred();
|
|
91
90
|
try {
|
|
92
91
|
const result = await this.provider.loadMoreChunks();
|
|
93
92
|
this._loadedChunks = [
|
|
@@ -100,13 +99,14 @@ export class PlayerChunksManager {
|
|
|
100
99
|
];
|
|
101
100
|
}
|
|
102
101
|
finally {
|
|
103
|
-
this.
|
|
102
|
+
this._fetchDeferred.resolve();
|
|
103
|
+
this._fetchDeferred = null;
|
|
104
104
|
}
|
|
105
105
|
};
|
|
106
106
|
reset = () => {
|
|
107
107
|
this._activeChunkIndex = -1;
|
|
108
108
|
this._loadedChunks = [];
|
|
109
|
-
this.
|
|
109
|
+
this._fetchDeferred = null;
|
|
110
110
|
this.warmUp();
|
|
111
111
|
};
|
|
112
112
|
populateChunkAtIndex = async (index, nextIndexFn) => {
|
|
@@ -9,12 +9,11 @@ export declare class DefaultChunksPlayerBuffer<TItem extends WithId, TChunk exte
|
|
|
9
9
|
readonly navigationDisabled: boolean;
|
|
10
10
|
readonly animationDuration = 500;
|
|
11
11
|
private _playerChunksManager;
|
|
12
|
-
constructor(provider: IChunksPlayerDataProvider<TItem, TChunk
|
|
13
|
-
preloaded?: (self: DefaultChunksPlayerBuffer<TItem, TChunk>) => void;
|
|
14
|
-
});
|
|
12
|
+
constructor(provider: IChunksPlayerDataProvider<TItem, TChunk>);
|
|
15
13
|
get activeChunk(): import("./chunks-player-buffer").PlayerChunk<TItem, TChunk>;
|
|
16
14
|
setActiveChunkItemIndex: (index: number) => void;
|
|
17
15
|
loadNext: () => Promise<void>;
|
|
18
16
|
loadPrevious: () => Promise<void>;
|
|
19
17
|
reset: () => void;
|
|
18
|
+
ensureWarmedUp: () => Promise<void>;
|
|
20
19
|
}
|
|
@@ -10,14 +10,11 @@ export class DefaultChunksPlayerBuffer {
|
|
|
10
10
|
navigationDisabled = $derived(!this.canLoadNext && !this.canLoadPrevious);
|
|
11
11
|
animationDuration = 500;
|
|
12
12
|
_playerChunksManager;
|
|
13
|
-
constructor(provider
|
|
13
|
+
constructor(provider) {
|
|
14
14
|
// Throttle navigation methods
|
|
15
15
|
this.loadNext = Utils.throttle(this.loadNext, this.animationDuration);
|
|
16
16
|
this.loadPrevious = Utils.throttle(this.loadPrevious, this.animationDuration);
|
|
17
|
-
this._playerChunksManager = new PlayerChunksManager(provider
|
|
18
|
-
onInitializationFinished: () => on?.preloaded?.(this),
|
|
19
|
-
onEndReached: () => console.warn('end reached')
|
|
20
|
-
});
|
|
17
|
+
this._playerChunksManager = new PlayerChunksManager(provider);
|
|
21
18
|
this._playerChunksManager.initialize();
|
|
22
19
|
}
|
|
23
20
|
get activeChunk() {
|
|
@@ -44,4 +41,7 @@ export class DefaultChunksPlayerBuffer {
|
|
|
44
41
|
reset = () => {
|
|
45
42
|
this._playerChunksManager.reset();
|
|
46
43
|
};
|
|
44
|
+
ensureWarmedUp = async () => {
|
|
45
|
+
await this._playerChunksManager.warmUp();
|
|
46
|
+
};
|
|
47
47
|
}
|
|
@@ -15,13 +15,12 @@ export declare class DefaultFeedPlayerBuffer<T extends WithId> implements IFeedP
|
|
|
15
15
|
private _currentIndex;
|
|
16
16
|
private _loaded;
|
|
17
17
|
private _loadMoreFn;
|
|
18
|
-
private
|
|
19
|
-
constructor(provider: IFeedPlayerDataProvider<T
|
|
20
|
-
preloaded?: (self: DefaultFeedPlayerBuffer<T>) => void;
|
|
21
|
-
});
|
|
18
|
+
private _fetchDeferred;
|
|
19
|
+
constructor(provider: IFeedPlayerDataProvider<T>);
|
|
22
20
|
loadNext: () => Promise<void>;
|
|
23
21
|
loadPrevious: () => Promise<void>;
|
|
24
22
|
reset: () => void;
|
|
23
|
+
ensureWarmedUp: () => Promise<void>;
|
|
25
24
|
private initializeBuffer;
|
|
26
25
|
private warmUpBuffer;
|
|
27
26
|
}
|