| 1 |
- {"version":3,"file":"static/chunks/pages/radio-295beccaaadd3fb2.js","mappings":"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","sources":["webpack://_N_E/./public/icons/pause.svg","webpack://_N_E/./public/icons/play-arrow.svg","webpack://_N_E/?d8ed","webpack://_N_E/./src/components/NextSeoWrapper.tsx","webpack://_N_E/./src/components/dls/Card/Card.tsx","webpack://_N_E/./src/components/Radio/CuratedStationList.tsx","webpack://_N_E/./src/components/Radio/ReciterStationList.tsx","webpack://_N_E/./src/pages/radio.tsx","webpack://_N_E/./src/utils/cdn.ts","webpack://_N_E/./src/utils/string.ts","webpack://_N_E/./src/components/Radio/CuratedStationList.module.scss","webpack://_N_E/./src/components/Radio/ReciterStationList.module.scss","webpack://_N_E/./src/components/dls/Card/Card.module.scss","webpack://_N_E/./src/pages/index.module.scss","webpack://_N_E/./src/pages/radio.module.scss"],"sourcesContent":["var _path;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nvar SvgPause = function SvgPause(props) {\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: 24,\n height: 24,\n viewBox: \"0 0 24 24\",\n fill: \"none\",\n xmlns: \"http://www.w3.org/2000/svg\"\n }, props), _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n d: \"M5 20h4.571V4H5v16Zm9.143-16v16h4.571V4h-4.571Z\",\n fill: \"currentColor\"\n })));\n};\nexport default SvgPause;","var _path;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nvar SvgPlayArrow = function SvgPlayArrow(props) {\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: 24,\n height: 24,\n viewBox: \"0 0 24 24\",\n fill: \"none\",\n xmlns: \"http://www.w3.org/2000/svg\"\n }, props), _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n d: \"M4 2v20.364l16-10.182L4 2Z\",\n fill: \"currentColor\"\n })));\n};\nexport default SvgPlayArrow;","\n (window.__NEXT_P = window.__NEXT_P || []).push([\n \"/radio\",\n function () {\n return require(\"private-next-pages/radio.tsx\");\n }\n ]);\n if(module.hot) {\n module.hot.dispose(function () {\n window.__NEXT_P.push([\"/radio\"])\n });\n }\n ","import React from 'react';\n\nimport { NextSeo } from 'next-seo';\n\nimport { SEOProps } from '@/utils/seo';\nimport { truncateString } from '@/utils/string';\n\ninterface Props extends SEOProps {\n url?: string;\n image?: string;\n imageAlt?: string;\n imageWidth?: number;\n imageHeight?: number;\n}\n\nconst NextSeoWrapper: React.FC<Props> = (props) => {\n const { url, image, imageAlt, imageHeight, imageWidth, openGraph, description, ...rest } = props;\n const openGraphParams = {\n ...(openGraph && { openGraph }),\n ...(url && { url }),\n ...(image && {\n images: [{ url: image, width: imageWidth, height: imageHeight, alt: imageAlt }],\n }),\n };\n const params = {\n ...rest,\n ...(description && { description: truncateString(description, 150) }),\n };\n return <NextSeo {...params} openGraph={openGraphParams} />;\n};\n\nexport default NextSeoWrapper;\n","import { ReactNode } from 'react';\n\nimport classNames from 'classnames';\nimport Image from 'next/image';\n\nimport styles from './Card.module.scss';\n\nimport Button, { ButtonVariant } from '@/dls/Button/Button';\n\nexport enum CardSize {\n Medium = 'medium',\n Large = 'large',\n}\n\ntype CardProps = {\n size: CardSize;\n title: React.ReactNode;\n description?: React.ReactNode;\n onImgClick?: () => void;\n imgSrc?: string;\n className?: string;\n imgAlt?: string;\n actionIcon?: ReactNode;\n shouldFlipIconOnRTL?: boolean;\n onActionIconClick?: () => void;\n shouldShowFullTitle?: boolean;\n ariaLabel?: string;\n tooltip?: string;\n};\n\nconst Card = ({\n size,\n title,\n description,\n onImgClick,\n imgSrc,\n actionIcon,\n imgAlt,\n shouldFlipIconOnRTL = true,\n onActionIconClick,\n className,\n shouldShowFullTitle = false,\n ariaLabel,\n tooltip,\n}: CardProps) => {\n return (\n <div\n className={classNames(className, styles.container, {\n [styles.large]: size === CardSize.Large,\n [styles.medium]: size === CardSize.Medium,\n })}\n >\n <div\n className={classNames(styles.imageContainer)}\n role=\"button\"\n tabIndex={0}\n onKeyPress={onImgClick}\n onClick={onImgClick}\n >\n {imgSrc && <Image alt={imgAlt} className={styles.img} src={imgSrc} layout=\"fill\" />}\n\n {actionIcon && (\n <div className={styles.cardHoverEffectContainer} data-theme=\"dark\">\n {actionIcon}\n </div>\n )}\n </div>\n <div className={styles.bodyContainer}>\n <div className={styles.textsContainer}>\n <div\n className={classNames({\n [styles.title]: !shouldShowFullTitle,\n })}\n >\n {title}\n </div>\n <div className={styles.description}>{description}</div>\n </div>\n {size === CardSize.Large && actionIcon && (\n <Button\n onClick={() => {\n if (onActionIconClick) onActionIconClick();\n }}\n className={styles.playIconContainer}\n variant={ButtonVariant.Ghost}\n shouldFlipOnRTL={shouldFlipIconOnRTL}\n tooltip={tooltip}\n ariaLabel={ariaLabel}\n >\n {actionIcon}\n </Button>\n )}\n </div>\n </div>\n );\n};\n\nexport default Card;\n","import { useContext } from 'react';\n\nimport { useSelector } from '@xstate/react';\nimport useTranslation from 'next-translate/useTranslation';\n\nimport Card, { CardSize } from '../dls/Card/Card';\n\nimport styles from './CuratedStationList.module.scss';\nimport curatedStations from './curatedStations';\nimport { StationType } from './types';\n\nimport PauseIcon from '@/icons/pause.svg';\nimport PlayIcon from '@/icons/play-arrow.svg';\nimport { logEvent } from '@/utils/eventLogger';\nimport { AudioPlayerMachineContext } from 'src/xstate/AudioPlayerMachineContext';\n\n// When one of the curated station is clicked,\n// 1) Pick (randomly) one of the audioTrack listen in the station\n// the listen can be found in curatadStations.ts\n// 2) Update the current station state in the redux\n// 3) Play the audio\nconst CuratedStationList = () => {\n const { t } = useTranslation('radio');\n\n const audioService = useContext(AudioPlayerMachineContext);\n const isAudioPlaying = useSelector(audioService, (state) =>\n state.matches('VISIBLE.AUDIO_PLAYER_INITIATED.PLAYING'),\n );\n const radioActor = useSelector(audioService, (state) => state.context.radioActor);\n\n const playStation = async (id: string) => {\n logEvent('station_played', {\n stationId: id,\n type: StationType.Curated,\n });\n\n audioService.send({\n type: 'PLAY_RADIO',\n stationType: StationType.Curated,\n stationId: Number(id),\n });\n };\n\n const radioContext = radioActor?.getSnapshot()?.context || {};\n\n return (\n <div className={styles.container}>\n {Object.entries(curatedStations).map(([id, station]) => {\n const isSelectedStation =\n radioContext.type === StationType.Curated && radioContext.id === Number(id);\n\n let onClick;\n if (!isSelectedStation) onClick = () => playStation(id);\n if (isSelectedStation && isAudioPlaying) onClick = () => audioService.send('TOGGLE');\n if (isSelectedStation && !isAudioPlaying) onClick = () => audioService.send('TOGGLE');\n\n const actionIcon = isSelectedStation && isAudioPlaying ? <PauseIcon /> : <PlayIcon />;\n\n return (\n <div className={styles.item} key={id}>\n <Card\n shouldFlipIconOnRTL={false}\n actionIcon={actionIcon}\n imgSrc={station.bannerImgSrc}\n size={CardSize.Large}\n tooltip={t('common:audio.play')}\n ariaLabel={t('common:audio.play')}\n title={t(`curated-station.${station.title}`)}\n imgAlt={t(`curated-station.${station.title}`)}\n description={t(`curated-station.${station.description}`)}\n onImgClick={onClick}\n onActionIconClick={onClick}\n />\n </div>\n );\n })}\n </div>\n );\n};\n\nexport default CuratedStationList;\n","import { useContext } from 'react';\n\nimport { useSelector } from '@xstate/react';\n\nimport Card, { CardSize } from '../dls/Card/Card';\nimport Link from '../dls/Link/Link';\n\nimport styles from './ReciterStationList.module.scss';\nimport { StationType } from './types';\n\nimport PauseIcon from '@/icons/pause.svg';\nimport PlayIcon from '@/icons/play-arrow.svg';\nimport { makeCDNUrl } from '@/utils/cdn';\nimport { logEvent } from '@/utils/eventLogger';\nimport { getReciterNavigationUrl } from '@/utils/navigation';\nimport { AudioPlayerMachineContext } from 'src/xstate/AudioPlayerMachineContext';\nimport Reciter from 'types/Reciter';\n\ntype ReciterStationListProps = {\n reciters: Reciter[];\n};\nconst ReciterStationList = ({ reciters }: ReciterStationListProps) => {\n const audioService = useContext(AudioPlayerMachineContext);\n const isAudioPlaying = useSelector(audioService, (state) =>\n state.matches('VISIBLE.AUDIO_PLAYER_INITIATED.PLAYING'),\n );\n\n const radioActor = useSelector(audioService, (state) => state.context.radioActor);\n const radioContext = radioActor?.getSnapshot()?.context || {};\n\n return (\n <div className={styles.container}>\n {reciters.map((reciter) => {\n const isSelectedStation =\n radioContext.type === StationType.Reciter && Number(radioContext.id) === reciter.id;\n\n let onClick;\n if (!isSelectedStation) {\n onClick = () => {\n logEvent('station_played', {\n stationId: reciter.id,\n type: StationType.Curated,\n });\n audioService.send({\n type: 'PLAY_RADIO',\n stationType: StationType.Reciter,\n stationId: reciter.id,\n });\n };\n }\n if (isSelectedStation) {\n onClick = () => audioService.send('TOGGLE');\n }\n\n const actionIcon = isSelectedStation && isAudioPlaying ? <PauseIcon /> : <PlayIcon />;\n return (\n <Card\n actionIcon={actionIcon}\n imgSrc={makeCDNUrl(reciter.profilePicture)}\n key={reciter.id}\n onImgClick={onClick}\n title={\n <Link key={reciter.id} href={getReciterNavigationUrl(reciter.id.toString())}>\n {reciter.translatedName.name}\n </Link>\n }\n imgAlt={reciter.translatedName.name}\n description={reciter.style.name}\n size={CardSize.Medium}\n />\n );\n })}\n </div>\n );\n};\n\nexport default ReciterStationList;\n","import classNames from 'classnames';\nimport { GetStaticProps } from 'next';\nimport useTranslation from 'next-translate/useTranslation';\n\nimport pageStyle from './index.module.scss';\nimport radioStyle from './radio.module.scss';\n\nimport { getAvailableReciters } from '@/api';\nimport NextSeoWrapper from '@/components/NextSeoWrapper';\nimport CuratedStationList from '@/components/Radio/CuratedStationList';\nimport ReciterStationList from '@/components/Radio/ReciterStationList';\nimport { getAllChaptersData } from '@/utils/chapter';\nimport { getLanguageAlternates } from '@/utils/locale';\nimport { getCanonicalUrl } from '@/utils/navigation';\nimport Reciter from 'types/Reciter';\n\ntype RadioPageProps = {\n reciters: Reciter[];\n};\n\nconst NAVIGATION_URL = '/radio';\n\nconst RadioPage = ({ reciters }: RadioPageProps) => {\n const { t, lang } = useTranslation('radio');\n\n return (\n <>\n <NextSeoWrapper\n title={t('common:quran-radio')}\n canonical={getCanonicalUrl(lang, NAVIGATION_URL)}\n languageAlternates={getLanguageAlternates(NAVIGATION_URL)}\n description={t('radio-desc')}\n />\n <div className={pageStyle.pageContainer}>\n <div className={radioStyle.ribbon} />\n <div className={pageStyle.flow}>\n <div\n className={classNames(pageStyle.flowItem, radioStyle.title, radioStyle.titleOnRibbon)}\n >\n {t('curated-stations')}\n </div>\n <div className={classNames(pageStyle.flowItem, pageStyle.fullWidth)}>\n <CuratedStationList />\n </div>\n <div className={classNames(pageStyle.flowItem, radioStyle.title)}>\n {t('reciter-stations')}\n </div>\n <div className={classNames(pageStyle.flowItem, pageStyle.fullWidth)}>\n <ReciterStationList reciters={reciters} />\n </div>\n </div>\n </div>\n </>\n );\n};\n\nexport const getStaticProps: GetStaticProps = async ({ locale }) => {\n try {\n const chaptersData = await getAllChaptersData(locale);\n const { reciters } = await getAvailableReciters(locale, ['profile_picture']);\n return {\n props: {\n chaptersData,\n reciters,\n },\n };\n } catch (e) {\n return {\n notFound: true,\n };\n }\n};\n\nexport default RadioPage;\n","export const CDN_HOST = 'https://static.qurancdn.com';\nexport const CDN_ASSETS_VERSION = '1';\n\n/**\n * Generate versioned URL of static asset\n *\n * @param {string} path the path of static asset\n * @returns {string}\n */\n\nexport const makeCDNUrl = (path: string) => {\n return `${CDN_HOST}/${path}?v=${CDN_ASSETS_VERSION}`;\n};\n","/**\n * Shorten a text by setting the maximum number of characters\n * by the value of the parameter and adding \"...\" at the end.\n *\n * @param {string} rawString\n * @param {number} length\n * @param {string} suffix\n * @returns {string}\n */\nexport const truncateString = (rawString: string, length: number, suffix = '...'): string => {\n const characters = rawString.split('', length);\n let shortenedText = '';\n for (let index = 0; index < characters.length; index += 1) {\n const character = characters[index];\n if (shortenedText.length === length - 1) {\n shortenedText = `${shortenedText}${character}${suffix}`;\n break;\n }\n shortenedText = `${shortenedText}${character}`;\n }\n return shortenedText;\n};\n\n/**\n * Strip HTML tags from a string.\n *\n * @param {string} rawString\n * @returns {string}\n */\nexport const stripHTMLTags = (rawString: string): string => rawString.replace(/(<([^>]+)>)/gi, '');\n\n/**\n * Convert a slugified collection id to collection id only after\n * removing the slug.\n *\n * @param {string} slugifiedCollectionId\n * @returns {string}\n */\nexport const slugifiedCollectionIdToCollectionId = (slugifiedCollectionId: string): string => {\n if (!slugifiedCollectionId) {\n return '';\n }\n const splits = slugifiedCollectionId.split('-');\n // if there is no slug in the url (collections with a name that cannot be slugified e.g. emoticons)\n if (splits.length === 1) {\n return splits[0];\n }\n return splits[splits.length - 1];\n};\n","// extracted by mini-css-extract-plugin\nmodule.exports = {\"container\":\"CuratedStationList_container__AwJQZ\",\"item\":\"CuratedStationList_item__P7_sR\"};","// extracted by mini-css-extract-plugin\nmodule.exports = {\"container\":\"ReciterStationList_container__zUdts\"};","// extracted by mini-css-extract-plugin\nmodule.exports = {\"container\":\"Card_container__7W1p2\",\"large\":\"Card_large__7cD4G\",\"medium\":\"Card_medium__WKx2o\",\"imageContainer\":\"Card_imageContainer__QDTmv\",\"bodyContainer\":\"Card_bodyContainer__RLoL2\",\"textsContainer\":\"Card_textsContainer__Qfmez\",\"title\":\"Card_title__1EtMk\",\"description\":\"Card_description__fNtqy\",\"img\":\"Card_img__ahjCx\",\"cardHoverEffectContainer\":\"Card_cardHoverEffectContainer__N5U8L\"};","// extracted by mini-css-extract-plugin\nmodule.exports = {\"pageContainer\":\"index_pageContainer__Pxtn3\",\"loadingContainer\":\"index_loadingContainer__WEZFc\",\"flow\":\"index_flow__rCTR5\",\"flowItem\":\"index_flowItem__GnXWz\",\"additionalVerticalGap\":\"index_additionalVerticalGap__nzYz6\",\"fullWidth\":\"index_fullWidth__1n4ux\"};","// extracted by mini-css-extract-plugin\nmodule.exports = {\"title\":\"radio_title__ZPrd6\",\"titleOnRibbon\":\"radio_titleOnRibbon__DJfOZ\",\"footerContainer\":\"radio_footerContainer__Tvi1H\",\"ribbon\":\"radio_ribbon__OVBhI\"};"],"names":["_path","_extends","Object","assign","bind","n","e","arguments","length","t","r","hasOwnProperty","call","apply","props","width","height","viewBox","fill","xmlns","d","window","__NEXT_P","push","url","image","imageAlt","imageHeight","imageWidth","openGraph","description","rest","openGraphParams","images","alt","params","truncateString","NextSeo","CardSize","size","title","onImgClick","imgSrc","actionIcon","imgAlt","shouldFlipIconOnRTL","onActionIconClick","className","shouldShowFullTitle","ariaLabel","tooltip","div","classNames","styles","Large","Medium","role","tabIndex","onKeyPress","onClick","Image","src","layout","data-theme","Button","variant","ButtonVariant","shouldFlipOnRTL","useTranslation","audioService","useContext","AudioPlayerMachineContext","isAudioPlaying","useSelector","state","matches","radioActor","context","playStation","id","logEvent","stationId","type","StationType","send","stationType","Number","radioContext","getSnapshot","entries","curatedStations","map","station","isSelectedStation","PauseIcon","PlayIcon","Card","bannerImgSrc","reciters","reciter","makeCDNUrl","profilePicture","Link","href","getReciterNavigationUrl","toString","translatedName","name","style","NAVIGATION_URL","lang","NextSeoWrapper","canonical","getCanonicalUrl","languageAlternates","getLanguageAlternates","pageStyle","radioStyle","CuratedStationList","ReciterStationList","path","CDN_ASSETS_VERSION","rawString","suffix","characters","split","shortenedText","index","character","stripHTMLTags","replace","slugifiedCollectionIdToCollectionId","slugifiedCollectionId","splits","module","exports"],"sourceRoot":""}
|
