{"version":3,"file":"static/chunks/3336.205c10359b7d9f9a.js","mappings":"ymCAIO,IAAMA,EAAYC,EAAAA,QAAAA,IAAAA,WAAU,C,6BAAVA,C,IAEGC,EAAQ,OAIXC,EAAAA,EAAAA,QAWIA,EAAAA,EAAAA,QAOAA,EAAAA,EAAAA,UAETC,SAAAA,G,OAAKA,EAAEC,WAAa,QAAU,QAIrBF,EAAAA,EAAAA,QAITC,SAAAA,G,OAAKA,EAAEC,WAAa,IAAM,WCmB9C,EA9CgE,WAC5D,IAAMC,GAAiBC,EAAAA,EAAAA,UACqBC,GAAAA,EAAAA,EAAAA,WAAkB,GAAvDC,EAAqCD,EAAwB,GAA7CE,EAAqBF,EAAwB,GAC3BA,GAAAA,EAAAA,EAAAA,WAAkB,GAApDG,EAAkCH,EAAwB,GAAzCI,EAAiBJ,EAAwB,GA4BjE,OA3BAK,EAAAA,EAAAA,YAAU,WAEN,GADAD,GAAcP,EAAAA,EAAAA,QACVS,EAAAA,EAAAA,OAAcR,EAAeS,QAAS,CACtC,IAAMC,EAASV,EAAeS,QAAQE,SAASC,EAAAA,IAC3CF,IAEAA,EAAOG,aAAc,EACrBH,EAAOI,OAAQ,EACfJ,EAAOK,aAAa,QAAS,IAC7BL,EAAOM,UAAW,EAClBN,EAAOO,OAAS,qCAEhBC,YAAW,WACP,IAAMC,EAAUT,EAAOU,OACnBD,EAAQE,MACRF,EACKE,OACAC,OAAM,WACHtB,EAAeS,QAAQc,MAAMC,QAAU,OACvCpB,GAAkB,QAG/BQ,EAAAA,QAGZ,IAEIT,GACD,SAACsB,EAAY,C,UAAC,SAACC,MAAG,CAACC,IAAK,yCAA0CC,IAAI,aACtE,SAACH,EAAY,CACX1B,WAAYM,EACZwB,IAAK7B,EACL8B,wBAAyB,CACrBC,OAAS,mS,kBChDzBC,EAAOC,QAAU","sources":["webpack://_N_E/./src/features/movix-new/VideoBlock/styled.ts","webpack://_N_E/./src/features/movix-new/VideoBlock/index.tsx","webpack://_N_E/./static/images/movix-new/bg-light.png"],"sourcesContent":["import styled from 'styled-components';\n\nimport { breakPoints } from '~/src/constants/breakpoints';\n\nexport const VideoWrap = styled.div<{isChromium?: boolean}>`\n    width: 100%;\n    background-image: url(${require('~/static/images/movix-new/bg-light.png')});\n    background-position: 90% 70%;\n    background-repeat: no-repeat;\n    \n    @media (max-width: ${breakPoints.desktop}) {\n        background-image: none;\n    }\n\n    video, img {\n        position: relative;\n        top: -30%;\n        width: 48%;\n        padding: 2.2% 0.7% 5.7% 8.9%;\n        left: 40%;\n        \n        @media (max-width: ${breakPoints.desktop}) {\n            left: 33%;\n            width: 63.7%;\n            top: -22%;\n            padding: 2.2% 0 6% 8.9%;\n        }\n        \n        @media (max-width: ${breakPoints.sDesktop}) {\n            width: 65%;\n            left: ${p => p.isChromium ? '53.5%' : '54%'};\n            padding: 2.2% 0 5.5% 8.9%;\n        }\n        \n        @media (max-width: ${breakPoints.tablet}) {\n            width: 100%;\n            padding: 3% 3.2% 2.3% 3.5%;\n            top: -24%;\n            left: ${p => p.isChromium ? '0' : '-13px'};\n        }\n    }\n`;\n","import React, { useEffect, useRef, useState } from 'react';\n\nimport { ZERO } from '~/src/features/movix-new/constants';\nimport { isChromium, isSafari } from '~/src/features/movix-new/utils';\n\nimport * as ST from './styled';\n\ninterface IProps {\n    readyPlayVideo: boolean,\n}\n\nconst VideoBlock: ({ readyPlayVideo }: IProps) => JSX.Element = (): JSX.Element => {\n    const videoParentRef = useRef() as React.MutableRefObject<HTMLDivElement>;\n    const [shouldUseImage, setShouldUseImage] = useState<boolean>(false);\n    const [isChromiumState, setIsChromium] = useState<boolean>(false);\n    useEffect(() => {\n        setIsChromium(isChromium());\n        if (isSafari() && videoParentRef.current) {\n            const player = videoParentRef.current.children[ZERO] as HTMLVideoElement;\n            if (player) {\n                // @ts-ignore\n                player.playsinline = true;\n                player.muted = true;\n                player.setAttribute('muted', '');\n                player.autoplay = true;\n                player.poster = '/static/images/movix-new/video.png';\n\n                setTimeout(() => {\n                    const promise = player.play();\n                    if (promise.then) {\n                        promise\n                            .then()\n                            .catch(() => {\n                                videoParentRef.current.style.display = 'none';\n                                setShouldUseImage(true);\n                            });\n                    }\n                }, ZERO);\n            }\n        }\n    }, []);\n\n    return shouldUseImage\n        ? <ST.VideoWrap><img src={'/static/images/movix-new/screen-tv.jpg'} alt='Video'/></ST.VideoWrap>\n        : <ST.VideoWrap\n            isChromium={isChromiumState}\n            ref={videoParentRef}\n            dangerouslySetInnerHTML={{\n                __html: `\n                    <video id=\"video\" loop autoPlay muted playsInline poster='/static/images/movix-new/video.png' disablePictureInPicture>\n                        <source src='/static/images/movix-new/video.mp4' type='video/mp4'/>\n                    </video>\n                `,\n            }}\n        />;\n};\n\nexport default VideoBlock;\n\n","module.exports = \"https://cdn-b2c.dom.ru/b2c-domru/2.357.4/frontend/_next/static/images/bg-light-b7554ea5fbc1bf969f220bb529c98176.png\";"],"names":["VideoWrap","styled","require","breakPoints","p","isChromium","videoParentRef","useRef","useState","shouldUseImage","setShouldUseImage","isChromiumState","setIsChromium","useEffect","isSafari","current","player","children","ZERO","playsinline","muted","setAttribute","autoplay","poster","setTimeout","promise","play","then","catch","style","display","ST","img","src","alt","ref","dangerouslySetInnerHTML","__html","module","exports"],"sourceRoot":""}