diff --git a/app/car/BaseListTemplate.ts b/app/car/BaseListTemplate.ts index 218d6f1..57cfdce 100644 --- a/app/car/BaseListTemplate.ts +++ b/app/car/BaseListTemplate.ts @@ -3,7 +3,7 @@ import {PlayListItem} from './types'; import TrackPlayer, {PitchAlgorithm} from 'react-native-track-player'; import {carPlayNowPlayingTemplate} from './nowPlaying/createNowPlayingTemplate'; -export type PlaylistProvider = Promise; +export type PlaylistProvider = () => Promise; export type BaseListTemplateOptions = { title: string; @@ -42,7 +42,7 @@ export class BaseListTemplate { } async build() { - const items = await this.playlistProvider; + const items = await this.playlistProvider(); if (this.template) { this.template.config.onItemSelect = undefined; @@ -63,6 +63,7 @@ export class BaseListTemplate { items?.map((item) => ({ text: item.text, detailText: item.detailText, + image: item.image, imgUrl: item.imgUrl as any, })) ?? [], }, diff --git a/app/car/CarPlay.ts b/app/car/CarPlay.ts index 7712f20..76628ff 100644 --- a/app/car/CarPlay.ts +++ b/app/car/CarPlay.ts @@ -1,4 +1,4 @@ -import {CarPlay} from 'react-native-carplay'; +import {AlertTemplate, CarPlay} from 'react-native-carplay'; import Gemius from 'react-native-gemius-plugin'; import analytics from '@react-native-firebase/analytics'; import TrackPlayer from 'react-native-track-player'; @@ -11,7 +11,16 @@ CarPlay.emitter.addListener('didConnect', async () => { Gemius.sendPageViewedEvent('carplay_connected'); analytics().logEvent('carplay_connected'); setupTrackPlayer(); - CarPlay.setRootTemplate(await RootTemplate.build()); + + CarPlay.presentTemplate( + new AlertTemplate({ + id: 'loading-alert', + titleVariants: ['PraĊĦome palaukti...'], + }), + ); + const rootTemplate = await RootTemplate.build(); + CarPlay.dismissTemplate(); + CarPlay.setRootTemplate(rootTemplate); CarPlay.enableNowPlaying(true); }); diff --git a/app/car/live/LiveTemplate.ts b/app/car/live/LiveTemplate.ts index 37b2a8e..83ca8e1 100644 --- a/app/car/live/LiveTemplate.ts +++ b/app/car/live/LiveTemplate.ts @@ -1,9 +1,7 @@ import {fetchCarLivePlaylist} from '../../api'; import {PlayListItem} from '../types'; import {BaseListTemplate} from '../BaseListTemplate'; -import {VIDEO_DEFAULT_BACKGROUND_IMAGE} from '../../constants'; import {fetchStreamData} from '../../components/videoComponent/fetchStreamData'; -import {BASE_IMG_URL} from '../../util/ImageUtil'; export const TEMPLATE_ID_LIVE = 'lrt-list-template-live'; @@ -16,36 +14,60 @@ class LiveTemplate extends BaseListTemplate { tabSystemImageName: 'play.square.fill', id: TEMPLATE_ID_LIVE, }, - fetchCarLivePlaylist() - .then((response) => - Promise.all( - response.tvprog?.items?.map((channel) => - fetchStreamData({ - url: channel.stream_url, - title: channel.channel_title, - poster: channel.cover_url.startsWith('http') - ? channel.cover_url - : BASE_IMG_URL + channel.cover_url, - }), - ) || [], - ), - ) - .then((data) => { - if (data?.length) { - const items: PlayListItem[] = data.map((stream) => ({ - id: stream.mediaId, - text: stream.channelTitle ?? stream.title, - // detailText: stream.title, - imgUrl: stream.poster || VIDEO_DEFAULT_BACKGROUND_IMAGE, - streamUrl: stream.streamUri, - })); - return items; - } - return []; - }), + () => + fetchCarLivePlaylist() + .then((response) => + Promise.all( + response.tvprog?.items?.map((channel) => + fetchStreamData({ + url: channel.stream_url, + title: channel.channel_title, + //Return channel id as poster so we can map it to the actual image later + poster: channel.channel_id.toString(), + }), + ) || [], + ), + ) + .then((data) => { + if (data?.length) { + const items: PlayListItem[] = data.map((stream) => ({ + id: stream.mediaId, + text: stream.channelTitle ?? stream.title, + // detailText: stream.title, + image: getImageByChannelId(stream.poster), + imgUrl: undefined, + streamUrl: stream.streamUri, + })); + return items; + } + return []; + }), ); } } +const getImageByChannelId = (channelId?: string) => { + switch (channelId) { + case '1': { + return require('./assets/ic_tv.png'); + } + case '2': { + return require('./assets/ic_plius.png'); + } + case '3': { + return require('./assets/ic_lituanica.png'); + } + case '5': { + return require('./assets/ic_klasika.png'); + } + case '6': { + return require('./assets/ic_opus.png'); + } + default: { + return require('./assets/ic_radijas.png'); + } + } +}; + const instance = new LiveTemplate(); export default instance; diff --git a/app/car/live/assets/ic_klasika.png b/app/car/live/assets/ic_klasika.png new file mode 100644 index 0000000..4191add Binary files /dev/null and b/app/car/live/assets/ic_klasika.png differ diff --git a/app/car/live/assets/ic_lituanica.png b/app/car/live/assets/ic_lituanica.png new file mode 100644 index 0000000..8490ae0 Binary files /dev/null and b/app/car/live/assets/ic_lituanica.png differ diff --git a/app/car/live/assets/ic_opus.png b/app/car/live/assets/ic_opus.png new file mode 100644 index 0000000..011ee39 Binary files /dev/null and b/app/car/live/assets/ic_opus.png differ diff --git a/app/car/live/assets/ic_plius.png b/app/car/live/assets/ic_plius.png new file mode 100644 index 0000000..27fddf7 Binary files /dev/null and b/app/car/live/assets/ic_plius.png differ diff --git a/app/car/live/assets/ic_radijas.png b/app/car/live/assets/ic_radijas.png new file mode 100644 index 0000000..9be193f Binary files /dev/null and b/app/car/live/assets/ic_radijas.png differ diff --git a/app/car/live/assets/ic_tv.png b/app/car/live/assets/ic_tv.png new file mode 100644 index 0000000..992a589 Binary files /dev/null and b/app/car/live/assets/ic_tv.png differ diff --git a/app/car/newest/NewestTemplate.ts b/app/car/newest/NewestTemplate.ts index 687a285..81873e5 100644 --- a/app/car/newest/NewestTemplate.ts +++ b/app/car/newest/NewestTemplate.ts @@ -13,19 +13,20 @@ class NewestTemplate extends BaseListTemplate { tabSystemImageName: 'newspaper.fill', id: TEMPLATE_ID_NEWEST, }, - fetchCarNewestPlaylist().then((data) => { - if (data?.length) { - const channels: PlayListItem[] = data.map((item) => ({ - id: item.title, - text: item.title, - detailText: item.content, - imgUrl: item.cover, - streamUrl: item.streamUrl, - })); - return channels; - } - return []; - }), + () => + fetchCarNewestPlaylist().then((data) => { + if (data?.length) { + const channels: PlayListItem[] = data.map((item) => ({ + id: item.title, + text: item.title, + detailText: item.content, + imgUrl: item.cover, + streamUrl: item.streamUrl, + })); + return channels; + } + return []; + }), ); } } diff --git a/app/car/popular/PopularTemplate.ts b/app/car/popular/PopularTemplate.ts index 58562ca..fd3ce9c 100644 --- a/app/car/popular/PopularTemplate.ts +++ b/app/car/popular/PopularTemplate.ts @@ -13,19 +13,20 @@ class PopularTemplate extends BaseListTemplate { tabSystemImageName: 'star.fill', id: TEMPLATE_ID_POPULAR, }, - fetchCarPopularPlaylist().then((data) => { - if (data?.length) { - const channels: PlayListItem[] = data.map((item) => ({ - id: item.title, - text: item.title, - detailText: item.content, - imgUrl: item.cover, - streamUrl: item.streamUrl, - })); - return channels; - } - return []; - }), + () => + fetchCarPopularPlaylist().then((data) => { + if (data?.length) { + const channels: PlayListItem[] = data.map((item) => ({ + id: item.title, + text: item.title, + detailText: item.content, + imgUrl: item.cover, + streamUrl: item.streamUrl, + })); + return channels; + } + return []; + }), ); } } diff --git a/app/car/recommended/RecommendedTemplate.ts b/app/car/recommended/RecommendedTemplate.ts index 70f9cd9..5547678 100644 --- a/app/car/recommended/RecommendedTemplate.ts +++ b/app/car/recommended/RecommendedTemplate.ts @@ -13,19 +13,20 @@ class RecommendedTemplate extends BaseListTemplate { tabSystemImageName: 'star.fill', id: TEMPLATE_ID_RECOMMENDED, }, - fetchCarRecommendedPlaylist().then((data) => { - if (data?.length) { - const channels: PlayListItem[] = data.map((item) => ({ - id: item.title, - text: item.title, - detailText: item.content, - imgUrl: item.cover, - streamUrl: item.streamUrl, - })); - return channels; - } - return []; - }), + () => + fetchCarRecommendedPlaylist().then((data) => { + if (data?.length) { + const channels: PlayListItem[] = data.map((item) => ({ + id: item.title, + text: item.title, + detailText: item.content, + imgUrl: item.cover, + streamUrl: item.streamUrl, + })); + return channels; + } + return []; + }), ); } } diff --git a/app/car/types.ts b/app/car/types.ts index 1d34691..1144fbc 100644 --- a/app/car/types.ts +++ b/app/car/types.ts @@ -1,3 +1,5 @@ +import {ImageSourcePropType} from 'react-native'; + export type CarCategory = 'live' | 'newest'; export type CategoryListItem = { @@ -11,7 +13,8 @@ export type PlayListItem = { id: string | number; text: string; detailText?: string; - imgUrl: string; + image?: ImageSourcePropType; + imgUrl?: string; streamUrl: string; isLiveStream?: boolean; };