{"version":3,"file":"Welcome.CJsRtrJ_.mjs","names":["useRef","useState"],"sources":["https:/framerusercontent.com/modules/QBj8fWTSNXZfYP1kJBQY/AqTkh4eAKfsrKW8PT6XU/Welcome.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{useEffect,useRef,useState}from\"react\";import{addPropertyControls,ControlType}from\"framer\";export default function ParticleText(props){const containerRef=useRef(null);const canvasRef=useRef(null);const[containerSize,setContainerSize]=useState({width:600,height:200});// Überwacht die Größe der Komponente in Framer in Echtzeit\nuseEffect(()=>{if(!containerRef.current)return;const observer=new ResizeObserver(entries=>{for(let entry of entries){const{width,height}=entry.contentRect;if(width>0&&height>0){setContainerSize({width,height});}}});observer.observe(containerRef.current);return()=>observer.disconnect();},[]);useEffect(()=>{const canvas=canvasRef.current;if(!canvas)return;const ctx=canvas.getContext(\"2d\",{willReadFrequently:true});if(!ctx)return;let animationFrameId;// Physische Canvas-Auflösung an den Container anpassen\nconst width=canvas.width=containerSize.width;const height=canvas.height=containerSize.height;// Virtuelle Design-Auflösung (Basis, auf der der Text perfekt berechnet wird)\nconst virtualWidth=600;const virtualHeight=200;// Skalierungsfaktor zwischen virtueller Welt und echter Framer-Containergröße\nconst scaleX=width/virtualWidth;const scaleY=height/virtualHeight;const scale=Math.min(scaleX,scaleY)// Bewahrt die sauberen Proportionen\n;// Offscreen-Canvas mit fester virtueller Auflösung für gestochen scharfe Partikel-Erkennung\nconst offscreen=document.createElement(\"canvas\");offscreen.width=virtualWidth;offscreen.height=virtualHeight;const oCtx=offscreen.getContext(\"2d\",{willReadFrequently:true});let particles=[];const initText=()=>{if(!oCtx)return;oCtx.clearRect(0,0,virtualWidth,virtualHeight);// Fester, perfekter Font für das virtuelle Raster\noCtx.font=\"bold 52px Inter, sans-serif\";oCtx.textAlign=\"center\";oCtx.textBaseline=\"middle\";oCtx.fillStyle=\"#ffffff\";oCtx.fillText(props.text,virtualWidth/2,virtualHeight/2);const textCoordinates=oCtx.getImageData(0,0,virtualWidth,virtualHeight);particles=[];// Sehr feine Rasterdichte für hochauflösenden Text\nconst gap=2;for(let y=0;y<textCoordinates.height;y+=gap){for(let x=0;x<textCoordinates.width;x+=gap){const index=(y*textCoordinates.width+x)*4;const alpha=textCoordinates.data[index+3];if(alpha>128){// Startpositionen zufällig außerhalb für die Appear-Animation\nconst startX=Math.random()*virtualWidth;const startY=Math.random()*virtualHeight;particles.push({x:startX,y:startY,baseX:x,baseY:y,vx:0,vy:0,size:props.particleSize});}}}};initText();// Maus-Tracking (skaliert auf die virtuelle Welt umgerechnet)\nlet mouseX=-1e3;let mouseY=-1e3;const handleMouseMove=e=>{const rect=canvas.getBoundingClientRect();const clientX=e.clientX-rect.left;const clientY=e.clientY-rect.top;// Umrechnung der Mauskoordinaten auf das virtuelle Raster\nmouseX=clientX/scale;mouseY=clientY/scale;};const handleMouseLeave=()=>{mouseX=-1e3;mouseY=-1e3;};window.addEventListener(\"mousemove\",handleMouseMove);canvas.addEventListener(\"mouseleave\",handleMouseLeave);// Animations-Loop\nconst render=()=>{ctx.clearRect(0,0,width,height);// Canvas-Matrix skalieren, damit sich alles proportional mit skaliert\nctx.save();ctx.scale(scale,scale);for(let i=0;i<particles.length;i++){const p=particles[i];// 1. Distanz zur Maus in der virtuellen Welt berechnen\nconst dx=mouseX-p.x;const dy=mouseY-p.y;const distance=Math.sqrt(dx*dx+dy*dy);const forceRadius=props.mouseRadius;if(distance<forceRadius&&mouseX!==-1e3){const angle=Math.atan2(dy,dx);const push=(forceRadius-distance)/forceRadius;p.vx-=Math.cos(angle)*push*3.5;p.vy-=Math.sin(angle)*push*3.5;}// 2. Federkraft zurück zum Ursprungsort (Home)\nconst returnDx=p.baseX-p.x;const returnDy=p.baseY-p.y;p.vx+=returnDx*.09;p.vy+=returnDy*.09;// 3. Dämpfung\np.vx*=.8;p.vy*=.8;p.x+=p.vx;p.y+=p.vy;// Partikel zeichnen\nctx.beginPath();ctx.arc(p.x,p.y,p.size,0,Math.PI*2);ctx.fillStyle=props.particleColor||\"#ffffff\";ctx.fill();}ctx.restore();animationFrameId=requestAnimationFrame(render);};render();return()=>{window.removeEventListener(\"mousemove\",handleMouseMove);canvas.removeEventListener(\"mouseleave\",handleMouseLeave);cancelAnimationFrame(animationFrameId);};},[containerSize,props.text,props.particleColor,props.particleSize,props.mouseRadius]);return /*#__PURE__*/_jsx(\"div\",{ref:containerRef,style:containerStyle,children:/*#__PURE__*/_jsx(\"canvas\",{ref:canvasRef,style:canvasStyle})});}// Standardwerte\nParticleText.defaultProps={text:\"WILKOMMEN\",particleColor:\"#ffffff\",particleSize:1.1,mouseRadius:75};// Property Controls für Framer (Rechtes Panel)\naddPropertyControls(ParticleText,{text:{type:ControlType.String,title:\"Text\",defaultValue:\"WILKOMMEN\"},particleColor:{type:ControlType.Color,title:\"Partikel Farbe\",defaultValue:\"#ffffff\"},particleSize:{type:ControlType.Number,title:\"Partikel Gr\\xf6\\xdfe\",defaultValue:1.1,min:.5,max:3,step:.1},mouseRadius:{type:ControlType.Number,title:\"Maus Wirkungsradius\",defaultValue:75,min:20,max:200,step:5}});const containerStyle={width:\"100%\",height:\"100%\",minHeight:\"100px\",display:\"flex\",alignItems:\"center\",justifyContent:\"center\",background:\"transparent\",pointerEvents:\"auto\"};const canvasStyle={width:\"100%\",height:\"100%\",display:\"block\"};\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ParticleText\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Welcome.map"],"mappings":"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"}