{"version":3,"file":"PixelFocus.gdhFfeD5.mjs","names":["useRef","p"],"sources":["https:/framerusercontent.com/modules/YshUZN1rnXeTIGN2cyz1/m6F3ZOacaBCq2rw9AtZH/PixelFocus.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useEffect,useRef}from\"react\";import{addPropertyControls,ControlType}from\"framer\";export default function PixelFocus({imageSun,imageMon,imageTue,imageWed,imageThu,imageFri,imageSat,pixelSize,focusRadius,feather,trail,trailSpeed,style}){const wrapRef=useRef(null);const sharpRef=useRef(null);const pxRef=useRef(null);const imgRef=useRef(null);const mouseRef=useRef({x:-9999,y:-9999});const trailRef=useRef([]);const rafRef=useRef(null);const animRef=useRef(null);function getTodaysImage(){const day=new Date().getDay();const urls=[imageSun,imageMon,imageTue,imageWed,imageThu,imageFri,imageSat];return urls[day]||imageSun;}useEffect(()=>{const imageUrl=getTodaysImage();if(!imageUrl)return;const img=new Image;img.crossOrigin=\"anonymous\";img.onload=()=>{imgRef.current=img;const el=wrapRef.current;const W=el.offsetWidth;const H=el.offsetHeight;sharpRef.current.width=W;sharpRef.current.height=H;pxRef.current.width=W;pxRef.current.height=H;drawAll(img,W,H);};img.src=imageUrl;},[imageSun,imageMon,imageTue,imageWed,imageThu,imageFri,imageSat,pixelSize,focusRadius,feather]);useEffect(()=>{function onMouseMove(e){if(!wrapRef.current||!imgRef.current)return;const r=wrapRef.current.getBoundingClientRect();const x=e.clientX-r.left;const y=e.clientY-r.top;mouseRef.current={x,y};if(trail){trailRef.current.push({x,y,age:0});if(trailRef.current.length>60)trailRef.current.shift();}if(rafRef.current)cancelAnimationFrame(rafRef.current);rafRef.current=requestAnimationFrame(()=>{const W=wrapRef.current.offsetWidth;const H=wrapRef.current.offsetHeight;drawAll(imgRef.current,W,H);});}function onMouseLeave(){mouseRef.current={x:-9999,y:-9999};if(imgRef.current&&wrapRef.current){const W=wrapRef.current.offsetWidth;const H=wrapRef.current.offsetHeight;drawAll(imgRef.current,W,H);}}window.addEventListener(\"mousemove\",onMouseMove);window.addEventListener(\"mouseleave\",onMouseLeave);return()=>{window.removeEventListener(\"mousemove\",onMouseMove);window.removeEventListener(\"mouseleave\",onMouseLeave);};},[pixelSize,focusRadius,feather,trail]);useEffect(()=>{if(!trail){trailRef.current=[];if(animRef.current)cancelAnimationFrame(animRef.current);return;}function tick(){if(!imgRef.current||!wrapRef.current){animRef.current=requestAnimationFrame(tick);return;}const decay=trailSpeed/100;trailRef.current=trailRef.current.map(p=>({...p,age:p.age+decay})).filter(p=>p.age<1);const W=wrapRef.current.offsetWidth;const H=wrapRef.current.offsetHeight;drawAll(imgRef.current,W,H);animRef.current=requestAnimationFrame(tick);}animRef.current=requestAnimationFrame(tick);return()=>{if(animRef.current)cancelAnimationFrame(animRef.current);};},[trail,trailSpeed,pixelSize,focusRadius,feather]);function drawAll(img,W,H){const ps=Math.max(2,pixelSize);const ctxS=sharpRef.current.getContext(\"2d\");const ratio=Math.max(W/img.naturalWidth,H/img.naturalHeight);const dw=img.naturalWidth*ratio;const dh=img.naturalHeight*ratio;const dx=(W-dw)/2;const dy=(H-dh)/2;ctxS.clearRect(0,0,W,H);ctxS.drawImage(img,dx,dy,dw,dh);const sw=Math.max(1,Math.ceil(W/ps));const sh=Math.max(1,Math.ceil(H/ps));const tmp=document.createElement(\"canvas\");tmp.width=sw;tmp.height=sh;const tc=tmp.getContext(\"2d\");tc.imageSmoothingEnabled=false;tc.drawImage(img,dx*(sw/W),dy*(sh/H),dw*(sw/W),dh*(sh/H));const ctxP=pxRef.current.getContext(\"2d\");ctxP.clearRect(0,0,W,H);ctxP.imageSmoothingEnabled=false;ctxP.drawImage(tmp,0,0,W,H);applyMask(ctxP,W,H);}function applyMask(ctxP,W,H){const mx=mouseRef.current.x;const my=mouseRef.current.y;const inner=focusRadius*(feather/100);ctxP.save();ctxP.globalCompositeOperation=\"destination-in\";// Draw trail points fading out\nif(trail&&trailRef.current.length>0){trailRef.current.forEach(p=>{const opacity=1-p.age;const radius=focusRadius*(1-p.age*.5);const innerR=radius*(feather/100);const g=ctxP.createRadialGradient(p.x,p.y,innerR,p.x,p.y,radius);g.addColorStop(0,`rgba(0,0,0,0)`);g.addColorStop(.5,`rgba(0,0,0,${(opacity*.3).toFixed(3)})`);g.addColorStop(1,`rgba(0,0,0,1)`);ctxP.fillStyle=g;ctxP.fillRect(0,0,W,H);});}// Draw main focus lens\nconst grad=ctxP.createRadialGradient(mx,my,inner,mx,my,focusRadius);grad.addColorStop(0,\"rgba(0,0,0,0)\");grad.addColorStop(1,\"rgba(0,0,0,1)\");ctxP.fillStyle=grad;ctxP.fillRect(0,0,W,H);ctxP.restore();}return /*#__PURE__*/_jsxs(\"div\",{ref:wrapRef,style:{position:\"relative\",width:\"100%\",height:\"100%\",overflow:\"hidden\",cursor:\"crosshair\",...style},children:[/*#__PURE__*/_jsx(\"canvas\",{ref:sharpRef,style:{position:\"absolute\",inset:0,width:\"100%\",height:\"100%\"}}),/*#__PURE__*/_jsx(\"canvas\",{ref:pxRef,style:{position:\"absolute\",inset:0,width:\"100%\",height:\"100%\"}})]});}addPropertyControls(PixelFocus,{imageSun:{type:ControlType.String,title:\"Sunday\",defaultValue:\"\"},imageMon:{type:ControlType.String,title:\"Monday\",defaultValue:\"\"},imageTue:{type:ControlType.String,title:\"Tuesday\",defaultValue:\"\"},imageWed:{type:ControlType.String,title:\"Wednesday\",defaultValue:\"\"},imageThu:{type:ControlType.String,title:\"Thursday\",defaultValue:\"\"},imageFri:{type:ControlType.String,title:\"Friday\",defaultValue:\"\"},imageSat:{type:ControlType.String,title:\"Saturday\",defaultValue:\"\"},pixelSize:{type:ControlType.Number,title:\"Pixel size\",defaultValue:12,min:2,max:40,step:1},focusRadius:{type:ControlType.Number,title:\"Focus radius\",defaultValue:130,min:40,max:400},feather:{type:ControlType.Number,title:\"Feather %\",defaultValue:40,min:0,max:90},trail:{type:ControlType.Boolean,title:\"Pixel trail\",defaultValue:false},trailSpeed:{type:ControlType.Number,title:\"Trail speed\",defaultValue:3,min:1,max:10,step:1,displayStepper:true,hidden(props){return!props.trail;}}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"PixelFocus\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./PixelFocus.map"],"mappings":"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"}