@tivio/sdk-react 2.4.0-alpha → 2.4.2-beta2
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +151 -47
- package/dist/components/PlayerProvider.d.ts +8 -2
- package/dist/components/hooks/index.d.ts +3 -0
- package/dist/components/hooks/useOverlay.d.ts +13 -0
- package/dist/components/hooks/useSearch.d.ts +8 -0
- package/dist/components/hooks/useWatchWithoutAds.d.ts +5 -0
- package/dist/index.js +1 -1
- package/dist/services/bundleLoader.d.ts +3 -0
- package/dist/services/bundlePromise.d.ts +2 -0
- package/dist/services/localFetch/coreReactDomDist.d.ts +1 -0
- package/dist/services/localFetch/none.d.ts +1 -0
- package/dist/types/bundle.types.d.ts +17 -18
- package/dist/types/customPlayer.types.d.ts +156 -23
- package/dist/types/types.d.ts +5 -5
- package/package.json +14 -14
@@ -3,6 +3,9 @@
|
|
3
3
|
* nangu.TV, a.s PROPRIETARY/CONFIDENTIAL. Use is subject to license terms.
|
4
4
|
*/
|
5
5
|
import { InternalConfig, RemoteBundleState, TivioBundle } from 'src/types/bundle.types';
|
6
|
+
/**
|
7
|
+
* @throws if fetch fails
|
8
|
+
*/
|
6
9
|
declare const fetchBundle: (secret: string, conf: InternalConfig) => Promise<string>;
|
7
10
|
/**
|
8
11
|
* Fetch & load CommonJS remote module.
|
@@ -0,0 +1 @@
|
|
1
|
+
export declare const loadBundleFromDist: () => import("../../types/bundle.types").TivioBundle;
|
@@ -0,0 +1 @@
|
|
1
|
+
export declare const loadBundleFromDist: () => void;
|
@@ -5,7 +5,7 @@ import { FetchPackage } from '../services/packageLoader';
|
|
5
5
|
import { Disposer, Empty, Nullable } from './common';
|
6
6
|
import { Channel, Language, RemoteProviderProps, Section, TivioSources, TivioWidgetProps, UserData, WebPlayerProps, Widget } from './types';
|
7
7
|
import type { AdSource, PlayerWrapper } from './customPlayer.types';
|
8
|
-
import type { Monetization, QerkoPaymentInfo, Screen, SubscribeToItemsInRow, SubscribeToRowsInScreen, SubscribeToScreen, TvAppProps, Video, User, Purchase } from '@tivio/common';
|
8
|
+
import type { Monetization, QerkoPaymentInfo, Screen, SubscribeToItemsInRow, SubscribeToRowsInScreen, SubscribeToScreen, TvAppProps, Video, User, Purchase, UseSearch } from '@tivio/common';
|
9
9
|
import type React from 'react';
|
10
10
|
declare type Settings = {
|
11
11
|
onSetUser: (handler: (userId: string, userPayload: unknown) => void) => void;
|
@@ -15,7 +15,13 @@ declare type InternalConfig = {
|
|
15
15
|
enable?: boolean;
|
16
16
|
secret: string | null;
|
17
17
|
verbose?: boolean;
|
18
|
+
/**
|
19
|
+
* @private URL of resolver. Resolver is a script used to fetch remove code bundle
|
20
|
+
*/
|
18
21
|
resolverUrl: string;
|
22
|
+
/**
|
23
|
+
* @private URL of remote code bundle to be fetched directly (without using resolver)
|
24
|
+
*/
|
19
25
|
bundleUrlOverride?: string;
|
20
26
|
disableUnmounting?: boolean;
|
21
27
|
logger?: Logger | null;
|
@@ -98,6 +104,10 @@ declare type TivioSubscriptions = {
|
|
98
104
|
subscribeToItemsInRow: SubscribeToItemsInRow;
|
99
105
|
subscribeToRowsInScreen: SubscribeToRowsInScreen;
|
100
106
|
subscribeToTaggedVideos: SubscribeToTaggedVideos;
|
107
|
+
registerOverlayCallbacks: (callbacks: {
|
108
|
+
onShow: () => void;
|
109
|
+
onHide: () => void;
|
110
|
+
}) => void;
|
101
111
|
};
|
102
112
|
declare type TivioGetters = {
|
103
113
|
isTivioLoaded: (cb: (isLoaded: boolean) => void) => boolean;
|
@@ -136,22 +146,6 @@ declare type TivioGetters = {
|
|
136
146
|
* @returns {Promise<Widget | null>} widget or null if widget does not exists
|
137
147
|
*/
|
138
148
|
getWidgetById: (widgetId: string) => Promise<Widget | null>;
|
139
|
-
/**
|
140
|
-
* Search channels by its name.
|
141
|
-
* Returns array of channels.
|
142
|
-
* @param query - channel name query
|
143
|
-
* @param limit - max count of returned channels
|
144
|
-
* @returns {Promise<Channel[] | null>} channels array
|
145
|
-
*/
|
146
|
-
searchChannels: (query: string, limit?: number) => Promise<Channel[]>;
|
147
|
-
/**
|
148
|
-
* Search videos by its name.
|
149
|
-
* Returns array of videos. Video section will be always null
|
150
|
-
* @param query - video name query
|
151
|
-
* @param limit - max count of returned videos
|
152
|
-
* @returns {Promise<Video[] | null>} videos array
|
153
|
-
*/
|
154
|
-
searchVideos: (query: string, limit?: number) => Promise<Video[]>;
|
155
149
|
};
|
156
150
|
interface TivioAuth {
|
157
151
|
changePassword: (newPassword: string) => Promise<void>;
|
@@ -178,6 +172,7 @@ declare type TivioComponents = {
|
|
178
172
|
Markers: React.ReactNode;
|
179
173
|
PlayerDataContext: React.ReactNode;
|
180
174
|
Provider: React.ComponentType<RemoteProviderProps>;
|
175
|
+
Recommendation: React.ReactNode;
|
181
176
|
SkipButtonWeb: React.ReactNode;
|
182
177
|
VideoAdBanner: React.ReactNode;
|
183
178
|
WebPlayer: React.ComponentType<WebPlayerProps>;
|
@@ -198,6 +193,7 @@ declare type TivioComponents = {
|
|
198
193
|
declare type TivioHooks = {
|
199
194
|
useAd: () => [(AdSource | null)];
|
200
195
|
useCancelSubscription: UseCancelSubscription;
|
196
|
+
useSearch: UseSearch;
|
201
197
|
};
|
202
198
|
declare type TivioBundle = {
|
203
199
|
components: TivioComponents;
|
@@ -212,10 +208,13 @@ declare type TivioBundle = {
|
|
212
208
|
sources: TivioSources;
|
213
209
|
subscriptions: TivioSubscriptions;
|
214
210
|
};
|
211
|
+
declare type TivioBundleFile = {
|
212
|
+
Tivio: TivioBundle;
|
213
|
+
};
|
215
214
|
declare type RemoteBundleState = {
|
216
215
|
config: InternalConfig;
|
217
216
|
error: string | null;
|
218
217
|
settings: Settings;
|
219
218
|
state: 'loading' | 'error' | 'ready';
|
220
219
|
} & Nullable<TivioBundle>;
|
221
|
-
export type { RemoteBundleState, Config, Settings, InternalConfig, TivioBundle, TivioHooks, TivioComponents, TivioAuth, TivioGetters, TivioSubscriptions, Events, PubSub, };
|
220
|
+
export type { RemoteBundleState, Config, Settings, InternalConfig, TivioBundle, TivioBundleFile, TivioHooks, TivioComponents, TivioAuth, TivioGetters, TivioSubscriptions, Events, PubSub, };
|
@@ -1,38 +1,171 @@
|
|
1
1
|
import { Empty } from './common';
|
2
|
-
export
|
2
|
+
export declare type ChannelSource = {
|
3
|
+
new (uri: string, originalOptions: Record<string, any>, channelName: string, programName: string, programDescription: string, from: Date, to: Date): ChannelSource;
|
3
4
|
description: string;
|
4
5
|
name: string;
|
5
6
|
uri: string;
|
6
|
-
type: 'AD' | 'VOD' | 'CHANNEL';
|
7
|
-
}
|
8
|
-
export interface ChannelSource extends BasicSource {
|
9
7
|
from: Date;
|
10
8
|
channelName: string;
|
11
9
|
to: Date;
|
12
|
-
type: '
|
13
|
-
|
14
|
-
|
10
|
+
type: 'channel';
|
11
|
+
watchWithoutAdsRecommendation: {
|
12
|
+
purchase: () => void;
|
13
|
+
} | null;
|
14
|
+
};
|
15
|
+
export declare type AdSource = {
|
16
|
+
new (uri: string, name: string, description: string, skipDelayMs: number | null, adDurationMs: number, trackingContext?: any, // internal Tivio types
|
17
|
+
adMarker?: any, // internal Tivio types
|
18
|
+
packInfo?: any, // internal Tivio types
|
19
|
+
provider?: any): AdSource;
|
20
|
+
description: string;
|
21
|
+
name: string;
|
22
|
+
uri: string;
|
15
23
|
durationMs: number;
|
16
24
|
skipDelayMs: number | null;
|
17
|
-
type: '
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
25
|
+
type: 'ad';
|
26
|
+
/**
|
27
|
+
* true if is skippable and skip countdown has passed
|
28
|
+
*/
|
29
|
+
canSkip: boolean;
|
30
|
+
/**
|
31
|
+
* true ad if is skippable after some skipDelayMs (if it is skippable, skipDelayMs is defined)
|
32
|
+
*/
|
33
|
+
isSkippable: boolean;
|
34
|
+
/**
|
35
|
+
* Skip ad. Only works when canSkip is true
|
36
|
+
*/
|
37
|
+
skip: () => void;
|
38
|
+
/**
|
39
|
+
* Order in ad break (ad break is a group of ads played right after each other)
|
40
|
+
*/
|
41
|
+
order: number;
|
42
|
+
/**
|
43
|
+
* Total number of ads in ad break (ad break is a group of ads played right after each other)
|
44
|
+
*/
|
45
|
+
totalCount: number;
|
46
|
+
secondsToEnd: number;
|
47
|
+
secondsToSkippable: number | null;
|
31
48
|
};
|
49
|
+
export declare type VodTivioSource = {
|
50
|
+
new (uri: string, videoId: string, name: string, description: string, adMonetizationId?: string): VodTivioSource;
|
51
|
+
type: 'vod_tivio';
|
52
|
+
description: string;
|
53
|
+
name: string;
|
54
|
+
uri: string;
|
55
|
+
};
|
56
|
+
export declare type VodExternalSource = {
|
57
|
+
new (uri: string, monetizationId: string, name: string, description: string, originalOptions: Record<string, any>): VodTivioSource;
|
58
|
+
type: 'vod_external';
|
59
|
+
description: string;
|
60
|
+
name: string;
|
61
|
+
uri: string;
|
62
|
+
};
|
63
|
+
export declare type InputSource = AdSource | ChannelSource | VodTivioSource | VodExternalSource;
|
64
|
+
declare type PlayerState = 'playing' | 'paused' | 'idle';
|
65
|
+
export interface PlayerInterface {
|
66
|
+
pause: () => void;
|
67
|
+
/**
|
68
|
+
* unpause
|
69
|
+
*/
|
70
|
+
play: () => void;
|
71
|
+
/**
|
72
|
+
* @param {number} ms - milliseconds relative to start of video (relative to 0 ms)
|
73
|
+
* or in case of TV programs relative to start of the program (relative to source.from ms)
|
74
|
+
*/
|
75
|
+
seekTo: (ms: number) => void;
|
76
|
+
/**
|
77
|
+
* Source to be passed to player.
|
78
|
+
*
|
79
|
+
* Depending on autoplay settings it should either start playing
|
80
|
+
* immediately or just be loaded by player and stay paused.
|
81
|
+
*/
|
82
|
+
setSource: (source: InputSource | null) => void;
|
83
|
+
/**
|
84
|
+
* volume in [0,1]
|
85
|
+
*/
|
86
|
+
setVolume?: (volume: number) => void;
|
87
|
+
mute?: () => void;
|
88
|
+
/**
|
89
|
+
* restore volume to previous value
|
90
|
+
*/
|
91
|
+
unmute?: () => void;
|
92
|
+
}
|
32
93
|
export declare type PlayerWrapper = {
|
94
|
+
/**
|
95
|
+
* Report that playback of video has finished
|
96
|
+
*/
|
97
|
+
onPlaybackEnded: () => void;
|
98
|
+
/**
|
99
|
+
* Report video progress in milliseconds
|
100
|
+
*/
|
101
|
+
onTimeChanged: (ms: number) => void;
|
102
|
+
/**
|
103
|
+
* Report that video state changed
|
104
|
+
*/
|
105
|
+
onStateChanged: (state: PlayerState) => void;
|
106
|
+
/**
|
107
|
+
* Send source to Tivio
|
108
|
+
*/
|
109
|
+
onSourceChanged: (source: InputSource | null) => void;
|
110
|
+
/**
|
111
|
+
* Report that video failed to load (never started playing)
|
112
|
+
*/
|
113
|
+
onLoadError: (error: Error) => void;
|
114
|
+
/**
|
115
|
+
* Report that video failed during playback (successfully loaded and then failed, e.g. part of stream is invalid)
|
116
|
+
*/
|
117
|
+
onError: (error: Error) => void;
|
118
|
+
/**
|
119
|
+
* Unpause video
|
120
|
+
*/
|
121
|
+
play: () => void;
|
122
|
+
/**
|
123
|
+
* Pause video
|
124
|
+
*/
|
125
|
+
pause: () => void;
|
126
|
+
/**
|
127
|
+
* Currently playing source
|
128
|
+
*/
|
129
|
+
source: InputSource | null;
|
33
130
|
events: {
|
34
|
-
|
35
|
-
|
131
|
+
isSupported: (even: string) => boolean;
|
132
|
+
addListener: <T = any>(event: string, cb: (value: T) => Empty) => void;
|
133
|
+
removeListener: <T = any>(event: string, cb: (value: T) => Empty) => void;
|
134
|
+
removeAllListeners: () => void;
|
36
135
|
};
|
136
|
+
/**
|
137
|
+
* Register a low level player that implements player methods, like play video, change volume, etc.
|
138
|
+
*/
|
139
|
+
register: (playerInterface: PlayerInterface) => void;
|
140
|
+
/**
|
141
|
+
* duration of current source in ms (both setter and getter)
|
142
|
+
*/
|
143
|
+
durationMs: number | null;
|
144
|
+
isPlaybackStarted: boolean;
|
145
|
+
isPaused: boolean;
|
146
|
+
isPlaying: boolean;
|
147
|
+
isIdle: boolean;
|
148
|
+
error: Error | null;
|
149
|
+
/**
|
150
|
+
* Replay the video that finished playback
|
151
|
+
*/
|
152
|
+
replay: () => void;
|
153
|
+
/**
|
154
|
+
* Retry to play a video that failed to start playing (e.g. due to a network error)
|
155
|
+
*/
|
156
|
+
retry: () => void;
|
157
|
+
togglePlayPause: () => void;
|
158
|
+
seekTo: (ms: number) => void;
|
159
|
+
/**
|
160
|
+
* set volume to value between 0,1
|
161
|
+
*/
|
162
|
+
setVolume: (volume: number) => void;
|
163
|
+
/**
|
164
|
+
* change volume by value between -1,1
|
165
|
+
*/
|
166
|
+
changeVolumeBy: (volume: number) => void;
|
167
|
+
setMuted: (muted: boolean) => void;
|
168
|
+
toggleMuted: () => void;
|
37
169
|
};
|
38
170
|
export declare type UsePlayerEvent = <T = any>(eventName: string) => T | null;
|
171
|
+
export {};
|
package/dist/types/types.d.ts
CHANGED
@@ -51,7 +51,7 @@ declare type Section = {
|
|
51
51
|
channel: Channel;
|
52
52
|
videos: Video[];
|
53
53
|
};
|
54
|
-
declare type Chapter =
|
54
|
+
declare type Chapter = any;
|
55
55
|
declare type Purchase = {
|
56
56
|
isPurchased: boolean;
|
57
57
|
monetizationId: string;
|
@@ -102,7 +102,7 @@ export interface TivioWidgetRef {
|
|
102
102
|
x: number;
|
103
103
|
});
|
104
104
|
}
|
105
|
-
interface
|
105
|
+
interface VodTivioSourcePojo {
|
106
106
|
type: 'VodTivioSource';
|
107
107
|
description: string;
|
108
108
|
path: string;
|
@@ -111,7 +111,7 @@ interface VodTivioSource {
|
|
111
111
|
poster?: string;
|
112
112
|
adMonetizationId?: string;
|
113
113
|
}
|
114
|
-
interface
|
114
|
+
interface ChannelSourcePojo {
|
115
115
|
type: 'ChannelSource';
|
116
116
|
uri: string;
|
117
117
|
originalOptions: any;
|
@@ -125,7 +125,7 @@ interface ChannelSource {
|
|
125
125
|
declare type VideoPath = string;
|
126
126
|
interface WebPlayerProps {
|
127
127
|
id: string;
|
128
|
-
source?:
|
128
|
+
source?: VodTivioSourcePojo | ChannelSourcePojo | VideoPath | null;
|
129
129
|
onEnded?: () => any;
|
130
130
|
className?: string;
|
131
131
|
/**
|
@@ -173,4 +173,4 @@ declare type TivioSources = {
|
|
173
173
|
VodExternalSource: any;
|
174
174
|
VodTivioSource: any;
|
175
175
|
};
|
176
|
-
export type { RemoteProviderProps, WebPlayerProps, Marker, BetOffer, Purchase, Chapter, Language, Widget, Channel, Section, Video, TivioSources, UserData, User, Monetization,
|
176
|
+
export type { RemoteProviderProps, WebPlayerProps, Marker, BetOffer, Purchase, Chapter, Language, Widget, Channel, Section, Video, TivioSources, UserData, User, Monetization, VodTivioSourcePojo, ChannelSourcePojo, };
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@tivio/sdk-react",
|
3
|
-
"version": "2.4.
|
3
|
+
"version": "2.4.2-beta2",
|
4
4
|
"main": "dist/index.js",
|
5
5
|
"typings": "dist/index.d.ts",
|
6
6
|
"source": "src/index.ts",
|
@@ -11,52 +11,47 @@
|
|
11
11
|
"scripts": {
|
12
12
|
"build": "bash ./scripts/build_prod.sh",
|
13
13
|
"build:dev": "bash ./scripts/build_dev.sh",
|
14
|
-
"start": "
|
14
|
+
"start": "yarn ts-node ./scripts/start.ts",
|
15
15
|
"test": "jest --config=./jest.config.js --coverage",
|
16
16
|
"clean": "rm -rf dist",
|
17
17
|
"prepublishOnly": "yarn && yarn ts-node ./scripts/prepublish.ts && yarn run build",
|
18
18
|
"postpublish": "yarn ts-node ./scripts/postpublish.ts",
|
19
19
|
"publish:alpha": "npm publish --tag alpha",
|
20
|
-
"check:cycles
|
20
|
+
"check:cycles": "npx madge --circular src/**/*"
|
21
21
|
},
|
22
22
|
"peerDependencies": {
|
23
|
-
"react": "^17.0.
|
24
|
-
"react-dom": "^17.0.
|
23
|
+
"react": "^17.0.0",
|
24
|
+
"react-dom": "^17.0.0"
|
25
25
|
},
|
26
26
|
"dependencies": {
|
27
27
|
"@material-ui/core": "^4.11.2",
|
28
28
|
"@material-ui/icons": "^4.11.2",
|
29
29
|
"@sentry/browser": "^6.1.0",
|
30
|
-
"@tivio/common": "1.1.
|
30
|
+
"@tivio/common": "1.1.65",
|
31
31
|
"firebase": "^8.2.3",
|
32
32
|
"formik": "^2.2.7",
|
33
33
|
"i18next": "^19.8.4",
|
34
34
|
"mobx-react": "^7.1.0",
|
35
35
|
"mobx": "^6.0.4",
|
36
|
-
"react-dom": "^17.0.2",
|
37
36
|
"react-i18next": "^9.0.10",
|
38
37
|
"react-router-dom": "^5.2.0",
|
39
|
-
"react-scripts": "4.0.3",
|
40
38
|
"react-spring": "^9.2.4",
|
41
39
|
"react-virtualized": "^9.22.3",
|
42
|
-
"react": "^17.0.2",
|
43
40
|
"styled-components": "^5.2.1",
|
44
41
|
"yup": "^0.32.9"
|
45
42
|
},
|
46
43
|
"devDependencies": {
|
47
|
-
"web-vitals": "^1.0.1",
|
48
|
-
"madge": "^5.0.1",
|
49
|
-
"@testing-library/user-event": "^12.1.10",
|
50
44
|
"@testing-library/jest-dom": "^5.11.9",
|
51
45
|
"@testing-library/react": "^11.2.3",
|
52
46
|
"@testing-library/react-hooks": "^5.0.3",
|
47
|
+
"@testing-library/user-event": "^12.1.10",
|
53
48
|
"@types/jest": "^26.0.15",
|
54
49
|
"@types/node": "^12.0.0",
|
50
|
+
"@types/node-fetch": "^2.5.8",
|
55
51
|
"@types/react": "^17.0.0",
|
56
52
|
"@types/react-dom": "^17.0.0",
|
57
53
|
"@types/react-router-dom": "^5.1.6",
|
58
54
|
"@types/react-virtualized": "^9.21.13",
|
59
|
-
"@types/node-fetch": "^2.5.8",
|
60
55
|
"@types/styled-components": "^5.1.7",
|
61
56
|
"@typescript-eslint/eslint-plugin": "^4.14.0",
|
62
57
|
"@typescript-eslint/parser": "^4.14.2",
|
@@ -65,13 +60,18 @@
|
|
65
60
|
"jest": "^27.0.1",
|
66
61
|
"jest-cli": "^26.6.3",
|
67
62
|
"jest-fetch-mock": "^3.0.3",
|
63
|
+
"madge": "^5.0.1",
|
68
64
|
"node-fetch": "^2.6.1",
|
69
65
|
"stream-browserify": "^3.0.0",
|
70
66
|
"timers-browserify": "^2.0.12",
|
71
67
|
"ts-jest": "^26.4.4",
|
72
68
|
"typescript": "^4.1.3",
|
69
|
+
"web-vitals": "^1.0.1",
|
73
70
|
"webpack": "^5.15.0",
|
74
71
|
"webpack-cli": "^4.4.0",
|
75
|
-
"webpack-merge": "^5.7.3"
|
72
|
+
"webpack-merge": "^5.7.3",
|
73
|
+
"yargs": "17",
|
74
|
+
"react-dom": "^17.0.2",
|
75
|
+
"react": "^17.0.2"
|
76
76
|
}
|
77
77
|
}
|