{"version":3,"file":"DJ_Vimeo_Player.B9TyS-dk.mjs","names":["Player"],"sources":["https:/framerusercontent.com/modules/HUAWqqsFPZD5M3wx9zpS/DFMNtD9B6fiXJxbL0HyX/DJ_Vimeo_Player.js"],"sourcesContent":["// Welcome to Code in Framer\n// Get Started: https://www.framer.com/developers/\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import Player from\"@vimeo/player\";import{useState,useEffect,useRef}from\"react\";import{addPropertyControls,ControlType}from\"framer\";import styled from\"styled-components\";//vimeo.com/954489493\n/**\n * These annotations control how your component sizes\n * Learn more: https://www.framer.com/developers/#code-components-auto-sizing\n *\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight any\n */export function VimeoPlayerWithControls(props){const playerRef=useRef(null);const[player,setPlayer]=useState(null);const[isPlaying,setIsPlaying]=useState(true);const[isMuted,setIsMuted]=useState(true);const[isLoaded,setIsLoaded]=useState(false)// New state to track player load status\n;const borderWidth=6;const defaultSize={width:376,height:621};const[showControllers,setShowControllers]=useState(true);useEffect(()=>{if(playerRef.current){const vimeoPlayer=new Player(playerRef.current,{id:props.videoId,width:376-20,height:defaultSize.height+borderWidth*2,controls:false,autoplay:props.autoPlay,quality:\"540p\",muted:isMuted,loop:false});setPlayer(vimeoPlayer);vimeoPlayer.on(\"play\",()=>setIsPlaying(true));vimeoPlayer.on(\"pause\",()=>setIsPlaying(false));vimeoPlayer.on(\"mute\",()=>{setIsMuted(true);});vimeoPlayer.getVolume().then(volume=>{setIsMuted(volume===0);});// Event listener for when the player is loaded\nvimeoPlayer.on(\"loaded\",()=>{setIsLoaded(true);setIsMuted(true);setShowControllers(true);console.log(\"Vimeo player is loaded and ready.\");});return()=>{vimeoPlayer.unload();};}},[props.videoId,props.width,props.height]);const handlePlayPause=()=>{if(isPlaying){player.pause();}else{player.play();}};const handleMuteUnmute=()=>{if(isMuted){player.setVolume(1);setIsMuted(false);}else{player.setVolume(0);setIsMuted(true);}};return /*#__PURE__*/_jsxs(Main,{style:{position:\"relative\",borderTopLeftRadius:props.borderRadius,borderTopRightRadius:props.borderRadius,border:`${borderWidth}px white solid`,width:defaultSize.width-18,height:defaultSize.height,backgroundImage:`url(${props.backgroundImage})`,backgroundSize:\"cover\",backgroundPosition:\"center\",overflow:\"hidden\"},className:\"main-container\",children:[/*#__PURE__*/_jsxs(\"div\",{className:\"overlay\",style:styles.overlay,onLoad:()=>setShowControllers(true),onMouseLeave:()=>setShowControllers(isLoaded&&isPlaying?false:true),onMouseEnter:()=>setShowControllers(isLoaded&&isPlaying?false:true),onMouseOver:()=>setShowControllers(true),children:[/*#__PURE__*/_jsx(\"div\",{className:\"iphone-notch\",style:styles.iphoneNotch}),/*#__PURE__*/_jsx(\"div\",{className:`controllerWrapper ${showControllers?\"show-controllers\":\"hide-controllers\"}`,style:styles.controllerWrapper,children:/*#__PURE__*/_jsx(Controller,{isPlaying:isPlaying,isMuted:isMuted,handlePlayPause:handlePlayPause,handleMuteUnmute:handleMuteUnmute})})]}),/*#__PURE__*/_jsx(\"div\",{ref:playerRef,style:{width:\"100%\",height:\"100%\"},className:\"video-ref\"})]});}// Add Framer property controls\naddPropertyControls(VimeoPlayerWithControls,{videoId:{type:ControlType.String,title:\"Video ID\",defaultValue:\"954489493\"},width:{type:ControlType.Number,title:\"Width\",defaultValue:376},height:{type:ControlType.Number,title:\"Height\",defaultValue:609},borderRadius:{type:ControlType.Number,title:\"Border Radius\",defaultValue:24},backgroundImage:{type:ControlType.ResponsiveImage,title:\"Background Image\"},autoPlay:{type:ControlType.Boolean,title:\"AutoPlay\",defaultValue:true}});const styles={videoRef:{width:\"100%\",height:\"100%\",position:\"absolute\",top:0,zIndex:-1},overlay:{position:\"absolute\",top:0,zIndex:0,width:\"100%\",height:\"100%\"},iphoneNotch:{background:\"white\",height:\"22px\",width:\"100px\",borderRadius:\"32px\",position:\"relative\",top:\"24px\",margin:\"0px auto\"},controllerWrapper:{position:\"absolute\",width:\"100%\",height:\"40px\",bottom:32,display:\"flex\",alignItems:\"center\",justifyContent:\"center\",transform:\"translateY(0px)\",transition:\"200ms ease-in-out\",opacity:0}};const Main=styled.div`\n    .controllerWrapper {\n    }\n\n    .controller{\n        backdrop-filter: blur(36px);\n    }\n\n    .overlay:hover, main:hover {\n        .controllerWrapper {\n            // opacity: 1 !important;\n            // transform: translateY(-20px) !important;\n        }\n    }\n\n     .controllerWrapper.hide-controllers{\n        opacity: 0 !important;\n        transform: translateY(0px) !important;\n    }\n\n     .controllerWrapper.show-controllers{\n        opacity: 1 !important;\n        transform: translateY(-20px) !important;\n    }\n `;export function Controller({handlePlayPause,handleMuteUnmute,isPlaying,isMuted}){const[playbackState,setPlaybackState]=useState({isPlaying:isPlaying,isMuted:isMuted||true});const handleClick=action=>{switch(action){case\"play\":setPlaybackState(prevState=>({...prevState,isPlaying:true}));handlePlayPause(\"play\");break;case\"pause\":setPlaybackState(prevState=>({...prevState,isPlaying:false}));handlePlayPause(\"pause\");break;case\"mute\":setPlaybackState(prevState=>({...prevState,isMuted:true}));handleMuteUnmute(\"mute\");break;case\"unmute\":setPlaybackState(prevState=>({...prevState,isMuted:false}));handleMuteUnmute(\"unmute\");break;default:break;}};useEffect(()=>{setPlaybackState({isPlaying:isPlaying,isMuted:isMuted});},[isMuted,isPlaying]);return /*#__PURE__*/_jsxs(\"div\",{className:\"controller\",style:controllerStyles.controller,children:[/*#__PURE__*/_jsx(\"button\",{onClick:()=>handleClick(playbackState.isPlaying?\"pause\":\"play\"),style:controllerStyles.button,children:/*#__PURE__*/_jsx(\"svg\",{width:\"24\",height:\"24\",viewBox:\"0 0 24 24\",fill:\"none\",xmlns:\"http://www.w3.org/2000/svg\",children:playbackState.isPlaying?/*#__PURE__*/_jsx(\"path\",{d:\"M8 19C9.1 19 10 18.1 10 17V7C10 5.9 9.1 5 8 5C6.9 5 6 5.9 6 7V17C6 18.1 6.9 19 8 19ZM14 7V17C14 18.1 14.9 19 16 19C17.1 19 18 18.1 18 17V7C18 5.9 17.1 5 16 5C14.9 5 14 5.9 14 7Z\",fill:\"#ECEEED\"}):/*#__PURE__*/_jsx(\"path\",{d:\"M6.92773 6.81976V17.1798C6.92773 17.9698 7.79773 18.4498 8.46773 18.0198L16.6077 12.8398C17.2277 12.4498 17.2277 11.5498 16.6077 11.1498L8.46773 5.97976C7.79773 5.54976 6.92773 6.02976 6.92773 6.81976Z\",fill:\"#ECEEED\"})})}),/*#__PURE__*/_jsx(\"button\",{onClick:()=>handleClick(playbackState.isMuted?\"unmute\":\"mute\"),style:{...controllerStyles.button,marginLeft:10},children:/*#__PURE__*/_jsx(\"svg\",{width:\"24\",height:\"24\",viewBox:\"0 0 24 24\",fill:\"none\",xmlns:\"http://www.w3.org/2000/svg\",children:!playbackState.isMuted?/*#__PURE__*/_jsx(\"path\",{d:\"M3 10.002V14.002C3 14.552 3.45 15.002 4 15.002H7L10.29 18.292C10.92 18.922 12 18.472 12 17.582V6.41204C12 5.52204 10.92 5.07204 10.29 5.70204L7 9.00204H4C3.45 9.00204 3 9.45204 3 10.002ZM16.5 12.002C16.5 10.232 15.48 8.71204 14 7.97204V16.022C15.48 15.292 16.5 13.772 16.5 12.002ZM14 4.45204V4.65204C14 5.03204 14.25 5.36204 14.6 5.50204C17.18 6.53204 19 9.06204 19 12.002C19 14.942 17.18 17.472 14.6 18.502C14.24 18.642 14 18.972 14 19.352V19.552C14 20.182 14.63 20.622 15.21 20.402C18.6 19.112 21 15.842 21 12.002C21 8.16204 18.6 4.89204 15.21 3.60204C14.63 3.37204 14 3.82204 14 4.45204Z\",fill:\"#ECEEED\"}):// mute\n/*#__PURE__*/_jsx(\"path\",{d:\"M3.63 3.63503C3.24 4.02503 3.24 4.65503 3.63 5.04503L7.29 8.70503L7 9.00503H4C3.45 9.00503 3 9.45503 3 10.005V14.005C3 14.555 3.45 15.005 4 15.005H7L10.29 18.295C10.92 18.925 12 18.475 12 17.585V13.415L16.18 17.595C15.69 17.965 15.16 18.275 14.58 18.505C14.22 18.655 14 19.035 14 19.425C14 20.145 14.73 20.605 15.39 20.335C16.19 20.005 16.94 19.565 17.61 19.025L18.95 20.365C19.34 20.755 19.97 20.755 20.36 20.365C20.75 19.975 20.75 19.345 20.36 18.955L5.05 3.63503C4.66 3.24503 4.03 3.24503 3.63 3.63503ZM19 12.005C19 12.825 18.85 13.615 18.59 14.345L20.12 15.875C20.68 14.705 21 13.395 21 12.005C21 8.17503 18.6 4.89503 15.22 3.60503C14.63 3.37503 14 3.83503 14 4.46503V4.65503C14 5.03503 14.25 5.36503 14.61 5.50503C17.18 6.54503 19 9.06503 19 12.005ZM10.29 5.71503L10.12 5.88503L12 7.76503V6.41503C12 5.52503 10.92 5.08503 10.29 5.71503ZM16.5 12.005C16.5 10.235 15.48 8.71503 14 7.97503V9.76503L16.48 12.245C16.49 12.165 16.5 12.085 16.5 12.005Z\",fill:\"#ECEEED\"})})})]});}const controllerStyles={controller:{borderRadius:\"12px\",border:\"0.5px solid rgba(255, 255, 255, 0.07)\",background:\"rgba(26, 29, 28, 0.80)\",backdropFilter:\"blur(36px)\",display:\"flex\",flexFlow:\"row\",gap:\"0px\",height:\"40px\",width:\"84px\",padding:\"0px 8px\",margin:\"0 auto\",boxShadow:`\n      0px 100px 80px 0px rgba(0, 0, 0, 0.07),\n      0px 41.778px 33.422px 0px rgba(0, 0, 0, 0.05),\n      0px 22.336px 17.869px 0px rgba(0, 0, 0, 0.04),\n      0px 12.522px 10.017px 0px rgba(0, 0, 0, 0.04),\n      0px 6.65px 5.32px 0px rgba(0, 0, 0, 0.03),\n      0px 2.767px 2.214px 0px rgba(0, 0, 0, 0.02)\n    `},button:{background:\"transparent\",border:\"none\",height:\"40px\",width:\"40px\",padding:\"0px\",margin:\"0px\",cursor:\"pointer\"}};\nexport const __FramerMetadata__ = {\"exports\":{\"Controller\":{\"type\":\"reactComponent\",\"name\":\"Controller\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"VimeoPlayerWithControls\":{\"type\":\"reactComponent\",\"name\":\"VimeoPlayerWithControls\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"any\",\"framerSupportedLayoutHeight\":\"any\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./DJ_Vimeo_Player.map"],"mappings":"ocASG,SAAgB,EAAwB,EAAM,CAAC,IAAM,EAAU,EAAO,KAAK,CAAM,CAAC,EAAO,EAAU,CAAC,EAAS,KAAK,CAAM,CAAC,EAAU,EAAa,CAAC,GAAS,EAAK,CAAM,CAAC,EAAQ,EAAW,CAAC,GAAS,EAAK,CAAM,CAAC,EAAS,EAAY,CAAC,GAAS,EAAM,CAChP,EAAY,EAAQ,EAAY,CAAC,MAAM,IAAI,OAAO,GAAI,EAAM,CAAC,EAAgB,EAAmB,CAAC,GAAS,EAAK,CAAC,EAAU,IAAI,CAAC,GAAG,EAAU,QAAQ,CAAC,IAAM,EAAY,IAAIA,EAAO,EAAU,QAAQ,CAAC,GAAG,EAAM,QAAQ,MAAM,IAAO,OAAO,EAAY,OAAO,EAAY,EAAE,UAAS,EAAM,SAAS,EAAM,SAAS,QAAQ,OAAO,MAAM,EAAQ,MAAK,CAAM,GACpN,MADsN,GAAU,EAAY,CAAC,EAAY,GAAG,OAAO,IAAI,GAAa,EAAK,CAAC,CAAC,EAAY,GAAG,QAAQ,IAAI,GAAa,EAAM,CAAC,CAAC,EAAY,GAAG,OAAO,IAAI,CAAC,GAAW,EAAK,AAAE,EAAC,CAAC,EAAY,WAAW,CAAC,KAAK,GAAQ,CAAC,EAAW,IAAS,EAAE,AAAE,EAAC,CACtkB,EAAY,GAAG,SAAS,IAAI,CAA6D,AAA5D,GAAY,EAAK,CAAC,GAAW,EAAK,CAAC,GAAmB,EAAK,CAAC,QAAQ,IAAI,oCAAoC,AAAE,EAAC,CAAO,IAAI,CAAC,EAAY,QAAQ,AAAE,CAAE,CAAC,EAAC,CAAC,EAAM,QAAQ,EAAM,MAAM,EAAM,MAAO,EAAC,CAAC,IAAM,EAAgB,IAAI,CAAC,AAAG,EAAW,EAAO,OAAO,CAAO,EAAO,MAAM,AAAG,EAAO,EAAiB,IAAI,CAAC,AAAG,GAAS,EAAO,UAAU,EAAE,CAAC,GAAW,EAAM,GAAO,EAAO,UAAU,EAAE,CAAC,GAAW,EAAK,CAAG,EAAC,MAAoB,GAAM,EAAK,CAAC,MAAM,CAAC,SAAS,WAAW,oBAAoB,EAAM,aAAa,qBAAqB,EAAM,aAAa,UAAU,EAAY,gBAAgB,MAAM,EAAY,MAAM,GAAG,OAAO,EAAY,OAAO,iBAAiB,MAAM,EAAM,gBAAgB,GAAG,eAAe,QAAQ,mBAAmB,SAAS,SAAS,QAAS,EAAC,UAAU,iBAAiB,SAAS,CAAc,EAAM,MAAM,CAAC,UAAU,UAAU,MAAM,EAAO,QAAQ,OAAO,IAAI,GAAmB,EAAK,CAAC,aAAa,IAAI,IAAmB,GAAU,GAAqB,CAAC,aAAa,IAAI,IAAmB,GAAU,GAAqB,CAAC,YAAY,IAAI,GAAmB,EAAK,CAAC,SAAS,CAAc,EAAK,MAAM,CAAC,UAAU,eAAe,MAAM,EAAO,WAAY,EAAC,CAAc,EAAK,MAAM,CAAC,WAAW,oBAAoB,EAAgB,mBAAmB,qBAAqB,MAAM,EAAO,kBAAkB,SAAsB,EAAK,EAAW,CAAW,YAAkB,UAAwB,kBAAiC,kBAAiB,EAAC,AAAC,EAAC,AAAC,CAAC,EAAC,CAAc,EAAK,MAAM,CAAC,IAAI,EAAU,MAAM,CAAC,MAAM,OAAO,OAAO,MAAO,EAAC,UAAU,WAAY,EAAC,AAAC,CAAC,EAAC,AAAE,CAyB5hD,SAAgB,EAAW,CAAC,kBAAgB,mBAAiB,YAAU,UAAQ,CAAC,CAAC,GAAK,CAAC,EAAc,EAAiB,CAAC,EAAS,CAAW,YAAU,QAAQ,IAAS,CAAK,EAAC,CAAO,EAAY,GAAQ,CAAC,OAAO,EAAP,CAAe,IAAI,OAAoE,AAA7D,EAAiB,IAAY,CAAC,GAAG,EAAU,WAAU,CAAK,GAAE,CAAC,EAAgB,OAAO,CAAC,MAAM,IAAI,QAAsE,AAA9D,EAAiB,IAAY,CAAC,GAAG,EAAU,WAAU,CAAM,GAAE,CAAC,EAAgB,QAAQ,CAAC,MAAM,IAAI,OAAkE,AAA3D,EAAiB,IAAY,CAAC,GAAG,EAAU,SAAQ,CAAK,GAAE,CAAC,EAAiB,OAAO,CAAC,MAAM,IAAI,SAAqE,AAA5D,EAAiB,IAAY,CAAC,GAAG,EAAU,SAAQ,CAAM,GAAE,CAAC,EAAiB,SAAS,CAAC,MAAM,QAAQ,KAAO,CAAC,EAA+F,MAA9F,GAAU,IAAI,CAAC,EAAiB,CAAW,YAAkB,SAAQ,EAAC,AAAE,EAAC,CAAC,EAAQ,CAAU,EAAC,CAAqB,EAAM,MAAM,CAAC,UAAU,aAAa,MAAM,EAAiB,WAAW,SAAS,CAAc,EAAK,SAAS,CAAC,QAAQ,IAAI,EAAY,EAAc,UAAU,QAAQ,OAAO,CAAC,MAAM,EAAiB,OAAO,SAAsB,EAAK,MAAM,CAAC,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAA6B,SAAS,EAAc,UAAuB,EAAK,OAAO,CAAC,EAAE,oLAAoL,KAAK,SAAU,EAAC,CAAc,EAAK,OAAO,CAAC,EAAE,4MAA4M,KAAK,SAAU,EAAC,AAAC,EAAC,AAAC,EAAC,CAAc,EAAK,SAAS,CAAC,QAAQ,IAAI,EAAY,EAAc,QAAQ,SAAS,OAAO,CAAC,MAAM,CAAC,GAAG,EAAiB,OAAO,WAAW,EAAG,EAAC,SAAsB,EAAK,MAAM,CAAC,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAA6B,SAAU,EAAc,QACn1D,EAAK,OAAO,CAAC,EAAE,w7BAAw7B,KAAK,SAAU,EAAC,CADi5B,EAAK,OAAO,CAAC,EAAE,ilBAAilB,KAAK,SAAU,EAAC,AAChgD,EAAC,AAAC,EAAC,AAAC,CAAC,EAAC,AAAE,oBAAM,AAnCn/B,GAAyD,IAAkC,IAA6C,IAAoD,IAAsC,CAUlO,EAAoB,EAAwB,CAAC,QAAQ,CAAC,KAAK,EAAY,OAAO,MAAM,WAAW,aAAa,WAAY,EAAC,MAAM,CAAC,KAAK,EAAY,OAAO,MAAM,QAAQ,aAAa,GAAI,EAAC,OAAO,CAAC,KAAK,EAAY,OAAO,MAAM,SAAS,aAAa,GAAI,EAAC,aAAa,CAAC,KAAK,EAAY,OAAO,MAAM,gBAAgB,aAAa,EAAG,EAAC,gBAAgB,CAAC,KAAK,EAAY,gBAAgB,MAAM,kBAAmB,EAAC,SAAS,CAAC,KAAK,EAAY,QAAQ,MAAM,WAAW,cAAa,CAAK,CAAC,EAAC,CAAO,EAAO,CAAC,SAAS,CAAC,MAAM,OAAO,OAAO,OAAO,SAAS,WAAW,IAAI,EAAE,OAAO,EAAG,EAAC,QAAQ,CAAC,SAAS,WAAW,IAAI,EAAE,OAAO,EAAE,MAAM,OAAO,OAAO,MAAO,EAAC,YAAY,CAAC,WAAW,QAAQ,OAAO,OAAO,MAAM,QAAQ,aAAa,OAAO,SAAS,WAAW,IAAI,OAAO,OAAO,UAAW,EAAC,kBAAkB,CAAC,SAAS,WAAW,MAAM,OAAO,OAAO,OAAO,OAAO,GAAG,QAAQ,OAAO,WAAW,SAAS,eAAe,SAAS,UAAU,kBAAkB,WAAW,oBAAoB,QAAQ,CAAE,CAAC,EAAO,EAAK,EAAO,IAAI;;;;;;;;;;;;;;;;;;;;;;;;GAyBkB,EAAiB,CAAC,WAAW,CAAC,aAAa,OAAO,OAAO,wCAAwC,WAAW,yBAAyB,eAAe,aAAa,QAAQ,OAAO,SAAS,MAAM,IAAI,MAAM,OAAO,OAAO,MAAM,OAAO,QAAQ,UAAU,OAAO,SAAS,UAAA;;;;;;;KAOnvC,EAAC,OAAO,CAAC,WAAW,cAAc,OAAO,OAAO,OAAO,OAAO,MAAM,OAAO,QAAQ,MAAM,OAAO,MAAM,OAAO,SAAU,CAAC"}