{"version":3,"sources":["../ui/src/components/player-components/trailer/trailer.tsx"],"sourcesContent":["import Image from \"next/image\";\r\nimport {memo, useEffect, useMemo, useState} from \"react\";\r\nimport { useAppDispatch, useAppSelector } from \"../../../../../redux/hooks\";\r\nimport { API, getAll } from \"../../../../../services\";\r\nimport { setTrailer } from \"../../../../../redux/slices/videoDataSlice\";\r\nimport { conditions, imageFormatChecking } from \"../../../../../helpers\";\r\nimport { ConditionName } from \"../../../../../interfaces\";\r\nimport { setTrailerPopover } from \"../../../../../redux/slices/popoversSlice\";\r\nimport IMAGES from \"../../../../../images/importImages\";\r\nimport { shallowEqual } from 'react-redux';\r\nimport dynamic from \"next/dynamic\";\r\n\r\nconst TruncateMarkup = dynamic(() => import(\"react-truncate-markup\"));\r\nconst CameraIcon = dynamic(() => import(\"../../icon-components/cameraIcon\"));\r\n\r\nconst Trailer = () => {\r\n\r\n    const dispatch = useAppDispatch();\r\n    useAppSelector(({ controller: { showMiniPlayer } }) => ({ showMiniPlayer }), shallowEqual);\r\n    const { details, trailer } = useAppSelector(({ videoData: { details, trailer, params, videoElementSizeInfo } }) => ({ details, trailer, params, videoElementSizeInfo }), shallowEqual);\r\n    const [showCompleteDescription, setShowCompleteDescription] = useState<boolean>(false);\r\n\r\n    useEffect(() => {\r\n        (async()=>{\r\n            const data:any = await getAll(API().trailer.getList)\r\n            dispatch(setTrailer(data))\r\n        })()\r\n    }, [])\r\n\r\n    const imageNumber = useMemo(() => trailer.filter((item: any) => imageFormatChecking(item.file_name)).length, [trailer.length]);\r\n    const videoNumber = useMemo(() => trailer.filter((item: any) => !imageFormatChecking(item.file_name)).length, [trailer.length]);\r\n\r\n    return (\r\n        <>\r\n            {conditions(ConditionName.hasTrailer) && (\r\n                <div\r\n                    className={`pl-flex ${conditions(ConditionName.isComplexDesktop) ? \"pl-flex-row pl-gap-[24px]\" : \"pl-flex-col pl-gap-[16px]\"} pl-items-start pl-w-full`}>\r\n                    <div\r\n                        className={`pl-cursor-pointer pl-relative pl-flex pl-items-center pl-justify-center ${conditions(ConditionName.isComplexDesktop) ? \"pl-w-1/2\" : \"pl-w-full\"} pl-bg-black pl-py-4 pl-aspect-video`}>\r\n                        <div className=\"pl-w-full pl-h-full\">\r\n                            {conditions(ConditionName.hasBanner) && <Image src={imageFormatChecking(trailer[0].file_name) ? trailer[0].url : trailer[0].banner ?? \"\"} layout={\"fill\"} alt=\"trailer-banner\" />}\r\n                        </div>\r\n                        <div\r\n                            className={`${conditions(ConditionName.isTouchScreenPortrait) ? \"pl-bottom-4 pl-right-1\" : \"pl-bottom-[20px] pl-right-2\"} pl-flex pl-items-center pl-rounded-[20px] pl-absolute pl-bg-gray-highLight pl-text-black dark:pl-text-white dark:pl-bg-black pl-text-[14px] pl-font-normal`}>\r\n                            <div className=\"pl-w-8 pl-h-8 pl-rounded-full pl-bg-white pl-p-1\"><CameraIcon /></div>\r\n                            <div\r\n                                className={`pl-py-[5px] ${conditions(ConditionName.isComplexPortrait) ? \"pl-px-[8px]\" : \"pl-px-[12px]\"}`}>{`${videoNumber !== 0 ? `${videoNumber} ویدیو ${imageNumber !== 0 ? \"و \" : \"\"}` : ''} ${imageNumber !== 0 ? `${imageNumber} عکس` : \"\"}`}</div>\r\n                        </div>\r\n                        <div className=\"pl-absolute\">\r\n                            <Image\r\n                                onClick={(e) => {\r\n                                    e.stopPropagation();\r\n                                    dispatch(setTrailerPopover(true));\r\n                                }}\r\n                                src={IMAGES.bigPlay}\r\n                                width={conditions(ConditionName.isMiniPlayer) ? 48 : conditions(ConditionName.isTouchScreen) ? 56 : 72}\r\n                                height={conditions(ConditionName.isMiniPlayer) ? 48 : conditions(ConditionName.isTouchScreen) ? 56 : 72}\r\n                                className={`${conditions(ConditionName.isPlay) ? \"pl-big-play-icon\" : \"pl-big-pause-icon\"}`}\r\n                            />\r\n                        </div>\r\n                    </div>\r\n                    <div\r\n                        className={`pl-flex ${conditions(ConditionName.isComplexDesktop) ? \"pl-w-1/2\" : \"pl-w-full\"} pl-flex-col pl-gap-2`}>\r\n                        <div className=\"pl-text-[14px] pl-font-normal pl-leading-[26px] pl-text-justify\">\r\n                            {\r\n                                conditions(ConditionName.hasDescription) && (\r\n                                    conditions(ConditionName.isComplexPortrait) ? (\r\n                                        <div className=\"pl-border-b pl-border-secondary-500 pl-pb-4\">\r\n                                            {showCompleteDescription ? (\r\n                                                <div\r\n                                                    className=\"pl-max-w-screen pl-overflow-hidden pl-text-[14px] pl-font-normal dark:pl-text-dark-5 pl-bg-white pl-whitespace-pre-wrap dark:pl-bg-dark-1 pl-flex-1  no-scrollbar pl-text-justify\">\r\n                                                    {details.description}\r\n                                                    <span onClick={() => setShowCompleteDescription(false)} className=\"pl-text-primary-600\">{\"کمتر...\"}</span>\r\n                                                </div>\r\n                                            ) :\r\n                                                (\r\n                                                    <TruncateMarkup\r\n                                                        ellipsis={() => <span onClick={() => setShowCompleteDescription(true)} className=\"pl-text-primary-600\">{\" بیشتر...\"}</span>}\r\n                                                        lines={2}\r\n                                                    >\r\n                                                        <div\r\n                                                            className=\"pl-text-[14px] pl-font-normal dark:pl-text-dark-5 pl-bg-white dark:pl-bg-dark-1 pl-flex-1  no-scrollbar pl-text-justify\">{details.description}</div>\r\n                                                    </TruncateMarkup>\r\n                                                )}\r\n                                        </div>\r\n                                    ) : (\r\n                                        <div>{details.description}</div>\r\n                                    )\r\n                                )\r\n                            }\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            )}\r\n        </>\r\n    )\r\n}\r\n\r\nexport default memo(Trailer);\r\n"],"mappings":"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","names":["init_esm_shims","Image","memo","useEffect","useMemo","useState","shallowEqual","dynamic","Fragment","jsx","jsxs","TruncateMarkup","CameraIcon","Trailer","dispatch","useAppDispatch","useAppSelector","showMiniPlayer","details","trailer","params","videoElementSizeInfo","showCompleteDescription","setShowCompleteDescription","useState","useEffect","data","getAll","API","setTrailer","imageNumber","useMemo","item","imageFormatChecking","videoNumber","conditions","Image","e","setTrailerPopover","importImages_default","trailer_default","memo"]}