[{"data":1,"prerenderedAt":1980},["ShallowReactive",2],{"navigation":3,"/api/objects/reflector":490,"/api/objects/reflector-surround":1975},[4,26],{"title":5,"path":6,"stem":7,"children":8},"Getting Started","/getting-started","1.getting-started/1.index",[9,10,14,18,22],{"title":5,"path":6,"stem":7},{"title":11,"path":12,"stem":13},"Installation Guide","/getting-started/installation","1.getting-started/2.installation",{"title":15,"path":16,"stem":17},"Usage","/getting-started/usage","1.getting-started/3.usage",{"title":19,"path":20,"stem":21},"Loading Models","/getting-started/loading-models","1.getting-started/4.loading-models",{"title":23,"path":24,"stem":25},"Upgrade Guide","/getting-started/upgrade-guide","1.getting-started/5.upgrade-guide",{"title":27,"path":28,"stem":29,"children":30},"Api","/api","2.api",[31,34,88,118,160,202,300,326,360,410,456],{"title":32,"path":28,"stem":33},"All","2.api/index",{"title":35,"path":36,"stem":37,"children":38},"Abstractions","/api/abstractions","2.api/1.abstractions/index",[39,40,44,48,52,56,60,64,68,72,76,80,84],{"title":35,"path":36,"stem":37},{"title":41,"path":42,"stem":43},"Align","/api/abstractions/align","2.api/1.abstractions/align",{"title":45,"path":46,"stem":47},"Billboard","/api/abstractions/billboard","2.api/1.abstractions/billboard",{"title":49,"path":50,"stem":51},"Camera Shake","/api/abstractions/camera-shake","2.api/1.abstractions/camera-shake",{"title":53,"path":54,"stem":55},"Decal","/api/abstractions/decal","2.api/1.abstractions/decal",{"title":57,"path":58,"stem":59},"Edges","/api/abstractions/edges","2.api/1.abstractions/edges",{"title":61,"path":62,"stem":63},"Fit","/api/abstractions/fit","2.api/1.abstractions/fit",{"title":65,"path":66,"stem":67},"Levioso (Float)","/api/abstractions/levioso","2.api/1.abstractions/levioso",{"title":69,"path":70,"stem":71},"Mask","/api/abstractions/mask","2.api/1.abstractions/mask",{"title":73,"path":74,"stem":75},"Outline","/api/abstractions/outline","2.api/1.abstractions/outline",{"title":77,"path":78,"stem":79},"Sampler","/api/abstractions/sampler","2.api/1.abstractions/sampler",{"title":81,"path":82,"stem":83},"ScreenSizer","/api/abstractions/screen-sizer","2.api/1.abstractions/screen-sizer",{"title":85,"path":86,"stem":87},"ScreenSpace","/api/abstractions/screen-space","2.api/1.abstractions/screen-space",{"title":89,"path":90,"stem":91,"children":92},"Controls","/api/controls","2.api/2.controls/index",[93,94,98,102,106,110,114],{"title":89,"path":90,"stem":91},{"title":95,"path":96,"stem":97},"Camera Controls","/api/controls/camera-controls","2.api/2.controls/camera-controls",{"title":99,"path":100,"stem":101},"Keyboard Controls","/api/controls/keyboard-controls","2.api/2.controls/keyboard-controls",{"title":103,"path":104,"stem":105},"Map Controls","/api/controls/map-controls","2.api/2.controls/map-controls",{"title":107,"path":108,"stem":109},"Orbit Controls","/api/controls/orbit-controls","2.api/2.controls/orbit-controls",{"title":111,"path":112,"stem":113},"PointerLock Controls","/api/controls/pointer-lock-controls","2.api/2.controls/pointer-lock-controls",{"title":115,"path":116,"stem":117},"Transform Controls","/api/controls/transform-controls","2.api/2.controls/transform-controls",{"title":119,"path":120,"stem":121,"children":122},"Loaders","/api/loaders","2.api/3.loaders/index",[123,124,128,132,136,140,144,148,152,156],{"title":119,"path":120,"stem":121},{"title":125,"path":126,"stem":127},"useGLTF","/api/loaders/use-gltf","2.api/3.loaders/1.use-gltf",{"title":129,"path":130,"stem":131},"GLTFModel","/api/loaders/gltf-model","2.api/3.loaders/2.gltf-model",{"title":133,"path":134,"stem":135},"useFBX","/api/loaders/use-fbx","2.api/3.loaders/3.use-fbx",{"title":137,"path":138,"stem":139},"FBXModel","/api/loaders/fbx-model","2.api/3.loaders/4.fbx-model",{"title":141,"path":142,"stem":143},"useTexture","/api/loaders/use-texture","2.api/3.loaders/5.use-texture",{"title":145,"path":146,"stem":147},"useTextures","/api/loaders/use-textures","2.api/3.loaders/6.use-textures",{"title":149,"path":150,"stem":151},"useSVG","/api/loaders/use-svg","2.api/3.loaders/7.use-svg",{"title":153,"path":154,"stem":155},"useProgress","/api/loaders/use-progress","2.api/3.loaders/use-progress",{"title":157,"path":158,"stem":159},"useVideoTexture","/api/loaders/use-video-texture","2.api/3.loaders/use-video-texture",{"title":161,"path":162,"stem":163,"children":164},"Materials","/api/materials","2.api/4.materials/index",[165,166,170,174,178,182,186,190,194,198],{"title":161,"path":162,"stem":163},{"title":167,"path":168,"stem":169},"Custom Shader Material","/api/materials/custom-shader-material","2.api/4.materials/custom-shader-material",{"title":171,"path":172,"stem":173},"Mesh Glass Material","/api/materials/glass-material","2.api/4.materials/glass-material",{"title":175,"path":176,"stem":177},"Holographic Material","/api/materials/holographic-material","2.api/4.materials/holographic-material",{"title":179,"path":180,"stem":181},"Mesh Discard Material","/api/materials/mesh-discard-material","2.api/4.materials/mesh-discard-material",{"title":183,"path":184,"stem":185},"Mesh Portal Material","/api/materials/mesh-portal-material","2.api/4.materials/mesh-portal-material",{"title":187,"path":188,"stem":189},"Mesh Reflection Material","/api/materials/mesh-reflection-material","2.api/4.materials/mesh-reflection-material",{"title":191,"path":192,"stem":193},"Mesh Transmission Material","/api/materials/mesh-transmission-material","2.api/4.materials/mesh-transmission-material",{"title":195,"path":196,"stem":197},"Point Material","/api/materials/point-material","2.api/4.materials/point-material",{"title":199,"path":200,"stem":201},"Wobble Material","/api/materials/wobble-material","2.api/4.materials/wobble-material",{"title":203,"path":204,"stem":205,"children":206},"Shapes","/api/shapes","2.api/5.shapes/index",[207,208,212,216,220,224,228,232,236,240,244,248,252,256,260,264,268,272,276,280,284,288,292,296],{"title":203,"path":204,"stem":205},{"title":209,"path":210,"stem":211},"Box","/api/shapes/box","2.api/5.shapes/box",{"title":213,"path":214,"stem":215},"CatmullRomCurve3","/api/shapes/catmullromcurve3","2.api/5.shapes/catmullromcurve3",{"title":217,"path":218,"stem":219},"Circle","/api/shapes/circle","2.api/5.shapes/circle",{"title":221,"path":222,"stem":223},"Cone","/api/shapes/cone","2.api/5.shapes/cone",{"title":225,"path":226,"stem":227},"Cubic Bezier Line","/api/shapes/cubic-bezier-line","2.api/5.shapes/cubic-bezier-line",{"title":229,"path":230,"stem":231},"Cylinder","/api/shapes/cylinder","2.api/5.shapes/cylinder",{"title":233,"path":234,"stem":235},"Dodecahedron","/api/shapes/dodecahedron","2.api/5.shapes/dodecahedron",{"title":237,"path":238,"stem":239},"Grid","/api/shapes/grid","2.api/5.shapes/grid",{"title":241,"path":242,"stem":243},"Icosahedron","/api/shapes/icosahedron","2.api/5.shapes/icosahedron",{"title":245,"path":246,"stem":247},"Line2","/api/shapes/line2","2.api/5.shapes/line2",{"title":249,"path":250,"stem":251},"Octahedron","/api/shapes/octahedron","2.api/5.shapes/octahedron",{"title":253,"path":254,"stem":255},"Plane","/api/shapes/plane","2.api/5.shapes/plane",{"title":257,"path":258,"stem":259},"Quadratic Bezier Line","/api/shapes/quadratic-bezier-line","2.api/5.shapes/quadratic-bezier-line",{"title":261,"path":262,"stem":263},"Ring","/api/shapes/ring","2.api/5.shapes/ring",{"title":265,"path":266,"stem":267},"Rounded Box","/api/shapes/rounded-box","2.api/5.shapes/rounded-box",{"title":269,"path":270,"stem":271},"Rounded Plane","/api/shapes/rounded-plane","2.api/5.shapes/rounded-plane",{"title":273,"path":274,"stem":275},"Screen Quad","/api/shapes/screen-quad","2.api/5.shapes/screen-quad",{"title":277,"path":278,"stem":279},"Sphere","/api/shapes/sphere","2.api/5.shapes/sphere",{"title":281,"path":282,"stem":283},"Superformula","/api/shapes/superformula","2.api/5.shapes/superformula",{"title":285,"path":286,"stem":287},"Tetrahedron","/api/shapes/tetrahedron","2.api/5.shapes/tetrahedron",{"title":289,"path":290,"stem":291},"Torus","/api/shapes/torus","2.api/5.shapes/torus",{"title":293,"path":294,"stem":295},"Torus Knot","/api/shapes/torus-knot","2.api/5.shapes/torus-knot",{"title":297,"path":298,"stem":299},"Tube","/api/shapes/tube","2.api/5.shapes/tube",{"title":301,"path":302,"stem":303,"children":304},"Debug/Performance","/api/debug-performance","2.api/6.debug-performance/index",[305,306,310,314,318,322],{"title":301,"path":302,"stem":303},{"title":307,"path":308,"stem":309},"Helper","/api/debug-performance/helper","2.api/6.debug-performance/helper",{"title":311,"path":312,"stem":313},"LOD","/api/debug-performance/lod","2.api/6.debug-performance/lod",{"title":315,"path":316,"stem":317},"Stats","/api/debug-performance/stats","2.api/6.debug-performance/stats",{"title":319,"path":320,"stem":321},"StatsGl","/api/debug-performance/stats-gl","2.api/6.debug-performance/stats-gl",{"title":323,"path":324,"stem":325},"useBVH","/api/debug-performance/use-bvh","2.api/6.debug-performance/use-bvh",{"title":327,"path":328,"stem":329,"children":330},"Light/Shadow","/api/light-shadow","2.api/7.light-shadow/index",[331,332,336,340,344,348,352,356],{"title":327,"path":328,"stem":329},{"title":333,"path":334,"stem":335},"Accumulative Shadows","/api/light-shadow/accumulative-shadows","2.api/7.light-shadow/accumulative-shadows",{"title":337,"path":338,"stem":339},"Bake Shadows","/api/light-shadow/bake-shadows","2.api/7.light-shadow/bake-shadows",{"title":341,"path":342,"stem":343},"Circle Shadow","/api/light-shadow/circle-shadow","2.api/7.light-shadow/circle-shadow",{"title":345,"path":346,"stem":347},"Contact Shadows","/api/light-shadow/contact-shadows","2.api/7.light-shadow/contact-shadows",{"title":349,"path":350,"stem":351},"Lensflare","/api/light-shadow/lensflare","2.api/7.light-shadow/lensflare",{"title":353,"path":354,"stem":355},"Randomized Lights","/api/light-shadow/randomized-lights","2.api/7.light-shadow/randomized-lights",{"title":357,"path":358,"stem":359},"Soft Shadows","/api/light-shadow/soft-shadows","2.api/7.light-shadow/soft-shadows",{"title":361,"path":362,"stem":363,"children":364},"Staging","/api/staging","2.api/8.staging/index",[365,366,370,374,378,382,386,390,394,398,402,406],{"title":361,"path":362,"stem":363},{"title":367,"path":368,"stem":369},"Environment","/api/staging/environment","2.api/8.staging/1.environment",{"title":371,"path":372,"stem":373},"useEnvironment","/api/staging/use-environment","2.api/8.staging/2.use-environment",{"title":375,"path":376,"stem":377},"Lightformer","/api/staging/lightformer","2.api/8.staging/3.lightformer",{"title":379,"path":380,"stem":381},"Backdrop","/api/staging/backdrop","2.api/8.staging/backdrop",{"title":383,"path":384,"stem":385},"Ocean","/api/staging/ocean","2.api/8.staging/ocean",{"title":387,"path":388,"stem":389},"Precipitation","/api/staging/precipitation","2.api/8.staging/precipitation",{"title":391,"path":392,"stem":393},"Sky","/api/staging/sky","2.api/8.staging/sky",{"title":395,"path":396,"stem":397},"Smoke","/api/staging/smoke","2.api/8.staging/smoke",{"title":399,"path":400,"stem":401},"Sparkles","/api/staging/sparkles","2.api/8.staging/sparkles",{"title":403,"path":404,"stem":405},"Stage","/api/staging/stage","2.api/8.staging/stage",{"title":407,"path":408,"stem":409},"Stars","/api/staging/stars","2.api/8.staging/stars",{"title":411,"path":412,"stem":413,"children":414},"Objects","/api/objects","2.api/9.objects/index",[415,416,420,424,428,432,436,440,444,448,452],{"title":411,"path":412,"stem":413},{"title":417,"path":418,"stem":419},"AnimatedSprite","/api/objects/animated-sprite","2.api/9.objects/animated-sprite",{"title":421,"path":422,"stem":423},"CubeCamera","/api/objects/cube-camera","2.api/9.objects/cube-camera",{"title":425,"path":426,"stem":427},"Fbo","/api/objects/fbo","2.api/9.objects/fbo",{"title":429,"path":430,"stem":431},"GradientTexture","/api/objects/gradient-texture","2.api/9.objects/gradient-texture",{"title":433,"path":434,"stem":435},"HTML","/api/objects/html","2.api/9.objects/html",{"title":437,"path":438,"stem":439},"Image","/api/objects/image","2.api/9.objects/image",{"title":441,"path":442,"stem":443},"MarchingCubes","/api/objects/marching-cubes","2.api/9.objects/marching-cubes",{"title":445,"path":446,"stem":447},"Reflector","/api/objects/reflector","2.api/9.objects/reflector",{"title":449,"path":450,"stem":451},"Refractor","/api/objects/refractor","2.api/9.objects/refractor",{"title":453,"path":454,"stem":455},"Text3D","/api/objects/text-3d","2.api/9.objects/text-3d",{"title":457,"path":458,"stem":459,"children":460},"Miscellaneous","/api/miscellaneous","2.api/miscellaneous/index",[461,462,466,470,474,478,482,486],{"title":457,"path":458,"stem":459},{"title":463,"path":464,"stem":465},"Bounds","/api/miscellaneous/bounds","2.api/miscellaneous/bounds",{"title":467,"path":468,"stem":469},"GlobalAudio","/api/miscellaneous/global-audio","2.api/miscellaneous/global-audio",{"title":471,"path":472,"stem":473},"MouseParallax","/api/miscellaneous/mouse-parallax","2.api/miscellaneous/mouse-parallax",{"title":475,"path":476,"stem":477},"PositionalAudio","/api/miscellaneous/positional-audio","2.api/miscellaneous/positional-audio",{"title":479,"path":480,"stem":481},"useAnimations","/api/miscellaneous/use-animations","2.api/miscellaneous/use-animations",{"title":483,"path":484,"stem":485},"useGLTFExporter","/api/miscellaneous/use-gltf-exporter","2.api/miscellaneous/use-gltf-exporter",{"title":487,"path":488,"stem":489},"useIntersect","/api/miscellaneous/use-intersect","2.api/miscellaneous/use-intersect",{"id":491,"title":445,"body":492,"description":1969,"extension":1970,"links":1971,"meta":1972,"navigation":614,"path":446,"seo":1973,"stem":447,"__hash__":1974},"docs/2.api/9.objects/reflector.md",{"type":493,"value":494,"toc":1962},"minimark",[495,501,522,526,815,819,921,930,934,949,1637,1640,1643,1648,1958],[496,497,498],"scene-controls-wrapper",{},[499,500],"objects-reflector",{},[502,503,504,505,509,510,517,518,521],"p",{},"The ",[506,507,508],"code",{},"cientos"," package provides an abstraction of the ",[511,512,516],"a",{"href":513,"rel":514},"https://github.com/mrdoob/three.js/blob/dev/examples/jsm/objects/Reflector.js",[515],"nofollow","Reflector class",", which creates a Mesh showing a real-time reflection of your scene.  This Mesh extends from ",[506,519,520],{},"Mesh"," so all the default props can be passed as well:",[523,524,15],"h2",{"id":525},"usage",[527,528,533],"pre",{"className":529,"code":530,"language":531,"meta":532,"style":532},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { Reflector } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas shadows alpha>\n    \u003CTresPerspectiveCamera :position=\"[0, 0, 3]\" />\n    \u003COrbitControls />\n\n    \u003CSuspense>\n      \u003CReflector\n        :rotation=\"[-Math.PI * 0.5, 0, 0]\"\n        :position-y=\"-2\"\n        color=\"#fff\"\n      >\n        \u003CTresCircleGeometry :args=\"[10, 10]\" />\n      \u003C/Reflector>\n    \u003C/Suspense>\n  \u003C/TresCanvas>\n\u003C/template>\n","vue","",[506,534,535,570,599,609,616,626,643,667,677,682,692,701,717,732,747,753,776,786,796,806],{"__ignoreMap":532},[536,537,540,544,548,552,555,558,561,565,567],"span",{"class":538,"line":539},"line",1,[536,541,543],{"class":542},"sMK4o","\u003C",[536,545,547],{"class":546},"swJcz","script",[536,549,551],{"class":550},"spNyl"," setup",[536,553,554],{"class":550}," lang",[536,556,557],{"class":542},"=",[536,559,560],{"class":542},"\"",[536,562,564],{"class":563},"sfazB","ts",[536,566,560],{"class":542},[536,568,569],{"class":542},">\n",[536,571,573,577,580,584,587,590,593,596],{"class":538,"line":572},2,[536,574,576],{"class":575},"s7zQu","import",[536,578,579],{"class":542}," {",[536,581,583],{"class":582},"sTEyZ"," Reflector",[536,585,586],{"class":542}," }",[536,588,589],{"class":575}," from",[536,591,592],{"class":542}," '",[536,594,595],{"class":563},"@tresjs/cientos",[536,597,598],{"class":542},"'\n",[536,600,602,605,607],{"class":538,"line":601},3,[536,603,604],{"class":542},"\u003C/",[536,606,547],{"class":546},[536,608,569],{"class":542},[536,610,612],{"class":538,"line":611},4,[536,613,615],{"emptyLinePlaceholder":614},true,"\n",[536,617,619,621,624],{"class":538,"line":618},5,[536,620,543],{"class":542},[536,622,623],{"class":546},"template",[536,625,569],{"class":542},[536,627,629,632,635,638,641],{"class":538,"line":628},6,[536,630,631],{"class":542},"  \u003C",[536,633,634],{"class":546},"TresCanvas",[536,636,637],{"class":550}," shadows",[536,639,640],{"class":550}," alpha",[536,642,569],{"class":542},[536,644,646,649,652,655,657,659,662,664],{"class":538,"line":645},7,[536,647,648],{"class":542},"    \u003C",[536,650,651],{"class":546},"TresPerspectiveCamera",[536,653,654],{"class":550}," :position",[536,656,557],{"class":542},[536,658,560],{"class":542},[536,660,661],{"class":563},"[0, 0, 3]",[536,663,560],{"class":542},[536,665,666],{"class":542}," />\n",[536,668,670,672,675],{"class":538,"line":669},8,[536,671,648],{"class":542},[536,673,674],{"class":546},"OrbitControls",[536,676,666],{"class":542},[536,678,680],{"class":538,"line":679},9,[536,681,615],{"emptyLinePlaceholder":614},[536,683,685,687,690],{"class":538,"line":684},10,[536,686,648],{"class":542},[536,688,689],{"class":546},"Suspense",[536,691,569],{"class":542},[536,693,695,698],{"class":538,"line":694},11,[536,696,697],{"class":542},"      \u003C",[536,699,700],{"class":546},"Reflector\n",[536,702,704,707,709,711,714],{"class":538,"line":703},12,[536,705,706],{"class":550},"        :rotation",[536,708,557],{"class":542},[536,710,560],{"class":542},[536,712,713],{"class":563},"[-Math.PI * 0.5, 0, 0]",[536,715,716],{"class":542},"\"\n",[536,718,720,723,725,727,730],{"class":538,"line":719},13,[536,721,722],{"class":550},"        :position-y",[536,724,557],{"class":542},[536,726,560],{"class":542},[536,728,729],{"class":563},"-2",[536,731,716],{"class":542},[536,733,735,738,740,742,745],{"class":538,"line":734},14,[536,736,737],{"class":550},"        color",[536,739,557],{"class":542},[536,741,560],{"class":542},[536,743,744],{"class":563},"#fff",[536,746,716],{"class":542},[536,748,750],{"class":538,"line":749},15,[536,751,752],{"class":542},"      >\n",[536,754,756,759,762,765,767,769,772,774],{"class":538,"line":755},16,[536,757,758],{"class":542},"        \u003C",[536,760,761],{"class":546},"TresCircleGeometry",[536,763,764],{"class":550}," :args",[536,766,557],{"class":542},[536,768,560],{"class":542},[536,770,771],{"class":563},"[10, 10]",[536,773,560],{"class":542},[536,775,666],{"class":542},[536,777,779,782,784],{"class":538,"line":778},17,[536,780,781],{"class":542},"      \u003C/",[536,783,445],{"class":546},[536,785,569],{"class":542},[536,787,789,792,794],{"class":538,"line":788},18,[536,790,791],{"class":542},"    \u003C/",[536,793,689],{"class":546},[536,795,569],{"class":542},[536,797,799,802,804],{"class":538,"line":798},19,[536,800,801],{"class":542},"  \u003C/",[536,803,634],{"class":546},[536,805,569],{"class":542},[536,807,809,811,813],{"class":538,"line":808},20,[536,810,604],{"class":542},[536,812,623],{"class":546},[536,814,569],{"class":542},[523,816,818],{"id":817},"props","Props",[820,821,822,839],"table",{},[823,824,825],"thead",{},[826,827,828,833,836],"tr",{},[829,830,832],"th",{"align":831},"left","Prop",[829,834,835],{"align":831},"Description",[829,837,838],{},"Default",[840,841,842,857,870,882,895,908],"tbody",{},[826,843,844,851,854],{},[845,846,847],"td",{"align":831},[848,849,850],"strong",{},"color",[845,852,853],{"align":831},"The base color that's combine with the mirror effect",[845,855,856],{},"'#333'",[826,858,859,864,867],{},[845,860,861],{"align":831},[848,862,863],{},"textureWidth",[845,865,866],{"align":831},"the width of the texture to render on the mirror",[845,868,869],{},"512",[826,871,872,877,880],{},[845,873,874],{"align":831},[848,875,876],{},"textureHeight",[845,878,879],{"align":831},"the height of the texture to render on the mirror",[845,881,869],{},[826,883,884,889,892],{},[845,885,886],{"align":831},[848,887,888],{},"clipBias",[845,890,891],{"align":831},"to use the clipBias property",[845,893,894],{},"0",[826,896,897,902,905],{},[845,898,899],{"align":831},[848,900,901],{},"multisample",[845,903,904],{"align":831},"how many samplers will be render",[845,906,907],{},"4",[826,909,910,915,918],{},[845,911,912],{"align":831},[848,913,914],{},"shader",[845,916,917],{"align":831},"The texture of the smoke.",[845,919,920],{},"Reflector.ReflectorShader",[922,923,924],"prose-warning",{},[502,925,926,927,929],{},"All the props except the ",[506,928,850],{},", are not reactive",[523,931,933],{"id":932},"custom-mirror-effect","Custom mirror effect",[502,935,936,937,940,941,944,945,948],{},"You can provide your own shader by passing a full shader object with ",[506,938,939],{},"uniforms",", ",[506,942,943],{},"vertexShader",", and ",[506,946,947],{},"fragmentShader",". The example below adds animated circular ripples emanating from the center of the surface, while preserving the color tint:",[527,950,952],{"className":529,"code":951,"language":531,"meta":532,"style":532},"\u003Cscript setup lang=\"ts\">\nimport { Reflector } from '@tresjs/cientos'\nimport { useLoop } from '@tresjs/core'\nimport { shallowRef } from 'vue'\n\nconst reflectorRef = shallowRef()\n\nconst customShader = {\n  uniforms: {\n    color: { value: null },\n    tDiffuse: { value: null },\n    textureMatrix: { value: null },\n    time: { value: 0 },\n  },\n  vertexShader: /* glsl */`\n    uniform mat4 textureMatrix;\n    varying vec4 vUv;\n    varying vec2 vPos;\n    void main() {\n      vUv = textureMatrix * vec4(position, 1.0);\n      vPos = position.xy;\n      gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\n    }`,\n  fragmentShader: /* glsl */`\n    uniform vec3 color;\n    uniform sampler2D tDiffuse;\n    uniform float time;\n    varying vec4 vUv;\n    varying vec2 vPos;\n    float blendOverlay(float base, float blend) {\n      return(base \u003C 0.5 ? (2.0 * base * blend) : (1.0 - 2.0 * (1.0 - base) * (1.0 - blend)));\n    }\n    vec3 blendOverlay(vec3 base, vec3 blend) {\n      return vec3(blendOverlay(base.r, blend.r), blendOverlay(base.g, blend.g), blendOverlay(base.b, blend.b));\n    }\n    void main() {\n      float dist = length(vPos);\n      float wave = sin(dist * 6.0 - time * 4.0) * 0.02;\n      vec2 dir = dist > 0.001 ? normalize(vPos) : vec2(0.0);\n      vec4 distortedUv = vUv + vec4(dir * wave, 0.0, 0.0);\n      vec4 base = texture2DProj(tDiffuse, distortedUv);\n      gl_FragColor = vec4(blendOverlay(base.rgb, color), 1.0);\n      #include \u003Ctonemapping_fragment>\n      #include \u003Ccolorspace_fragment>\n    }`,\n}\n\nconst { onBeforeRender } = useLoop()\nonBeforeRender(({ elapsed }) => {\n  const uniforms = reflectorRef.value?.instance?.material?.uniforms\n  if (uniforms?.time) { uniforms.time.value = elapsed }\n})\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CReflector\n    ref=\"reflectorRef\"\n    :rotation=\"[-Math.PI * 0.5, 0, 0]\"\n    :position-y=\"-2\"\n    color=\"#fff\"\n    :shader=\"customShader\"\n  >\n    \u003CTresCircleGeometry :args=\"[10, 10]\" />\n  \u003C/Reflector>\n\u003C/template>\n",[506,953,954,974,992,1012,1031,1035,1051,1055,1067,1077,1097,1114,1131,1150,1155,1169,1174,1179,1184,1189,1194,1200,1206,1218,1230,1236,1242,1248,1253,1258,1264,1270,1276,1282,1288,1293,1298,1304,1310,1316,1322,1328,1334,1340,1346,1355,1361,1366,1386,1410,1446,1485,1493,1502,1507,1516,1523,1538,1552,1566,1579,1594,1600,1619,1628],{"__ignoreMap":532},[536,955,956,958,960,962,964,966,968,970,972],{"class":538,"line":539},[536,957,543],{"class":542},[536,959,547],{"class":546},[536,961,551],{"class":550},[536,963,554],{"class":550},[536,965,557],{"class":542},[536,967,560],{"class":542},[536,969,564],{"class":563},[536,971,560],{"class":542},[536,973,569],{"class":542},[536,975,976,978,980,982,984,986,988,990],{"class":538,"line":572},[536,977,576],{"class":575},[536,979,579],{"class":542},[536,981,583],{"class":582},[536,983,586],{"class":542},[536,985,589],{"class":575},[536,987,592],{"class":542},[536,989,595],{"class":563},[536,991,598],{"class":542},[536,993,994,996,998,1001,1003,1005,1007,1010],{"class":538,"line":601},[536,995,576],{"class":575},[536,997,579],{"class":542},[536,999,1000],{"class":582}," useLoop",[536,1002,586],{"class":542},[536,1004,589],{"class":575},[536,1006,592],{"class":542},[536,1008,1009],{"class":563},"@tresjs/core",[536,1011,598],{"class":542},[536,1013,1014,1016,1018,1021,1023,1025,1027,1029],{"class":538,"line":611},[536,1015,576],{"class":575},[536,1017,579],{"class":542},[536,1019,1020],{"class":582}," shallowRef",[536,1022,586],{"class":542},[536,1024,589],{"class":575},[536,1026,592],{"class":542},[536,1028,531],{"class":563},[536,1030,598],{"class":542},[536,1032,1033],{"class":538,"line":618},[536,1034,615],{"emptyLinePlaceholder":614},[536,1036,1037,1040,1043,1045,1048],{"class":538,"line":628},[536,1038,1039],{"class":550},"const",[536,1041,1042],{"class":582}," reflectorRef ",[536,1044,557],{"class":542},[536,1046,1020],{"class":1047},"s2Zo4",[536,1049,1050],{"class":582},"()\n",[536,1052,1053],{"class":538,"line":645},[536,1054,615],{"emptyLinePlaceholder":614},[536,1056,1057,1059,1062,1064],{"class":538,"line":669},[536,1058,1039],{"class":550},[536,1060,1061],{"class":582}," customShader ",[536,1063,557],{"class":542},[536,1065,1066],{"class":542}," {\n",[536,1068,1069,1072,1075],{"class":538,"line":679},[536,1070,1071],{"class":546},"  uniforms",[536,1073,1074],{"class":542},":",[536,1076,1066],{"class":542},[536,1078,1079,1082,1084,1086,1089,1091,1094],{"class":538,"line":684},[536,1080,1081],{"class":546},"    color",[536,1083,1074],{"class":542},[536,1085,579],{"class":542},[536,1087,1088],{"class":546}," value",[536,1090,1074],{"class":542},[536,1092,1093],{"class":542}," null",[536,1095,1096],{"class":542}," },\n",[536,1098,1099,1102,1104,1106,1108,1110,1112],{"class":538,"line":694},[536,1100,1101],{"class":546},"    tDiffuse",[536,1103,1074],{"class":542},[536,1105,579],{"class":542},[536,1107,1088],{"class":546},[536,1109,1074],{"class":542},[536,1111,1093],{"class":542},[536,1113,1096],{"class":542},[536,1115,1116,1119,1121,1123,1125,1127,1129],{"class":538,"line":703},[536,1117,1118],{"class":546},"    textureMatrix",[536,1120,1074],{"class":542},[536,1122,579],{"class":542},[536,1124,1088],{"class":546},[536,1126,1074],{"class":542},[536,1128,1093],{"class":542},[536,1130,1096],{"class":542},[536,1132,1133,1136,1138,1140,1142,1144,1148],{"class":538,"line":719},[536,1134,1135],{"class":546},"    time",[536,1137,1074],{"class":542},[536,1139,579],{"class":542},[536,1141,1088],{"class":546},[536,1143,1074],{"class":542},[536,1145,1147],{"class":1146},"sbssI"," 0",[536,1149,1096],{"class":542},[536,1151,1152],{"class":538,"line":734},[536,1153,1154],{"class":542},"  },\n",[536,1156,1157,1160,1162,1166],{"class":538,"line":749},[536,1158,1159],{"class":546},"  vertexShader",[536,1161,1074],{"class":542},[536,1163,1165],{"class":1164},"sHwdD"," /* glsl */",[536,1167,1168],{"class":542},"`\n",[536,1170,1171],{"class":538,"line":755},[536,1172,1173],{"class":563},"    uniform mat4 textureMatrix;\n",[536,1175,1176],{"class":538,"line":778},[536,1177,1178],{"class":563},"    varying vec4 vUv;\n",[536,1180,1181],{"class":538,"line":788},[536,1182,1183],{"class":563},"    varying vec2 vPos;\n",[536,1185,1186],{"class":538,"line":798},[536,1187,1188],{"class":563},"    void main() {\n",[536,1190,1191],{"class":538,"line":808},[536,1192,1193],{"class":563},"      vUv = textureMatrix * vec4(position, 1.0);\n",[536,1195,1197],{"class":538,"line":1196},21,[536,1198,1199],{"class":563},"      vPos = position.xy;\n",[536,1201,1203],{"class":538,"line":1202},22,[536,1204,1205],{"class":563},"      gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\n",[536,1207,1209,1212,1215],{"class":538,"line":1208},23,[536,1210,1211],{"class":563},"    }",[536,1213,1214],{"class":542},"`",[536,1216,1217],{"class":542},",\n",[536,1219,1221,1224,1226,1228],{"class":538,"line":1220},24,[536,1222,1223],{"class":546},"  fragmentShader",[536,1225,1074],{"class":542},[536,1227,1165],{"class":1164},[536,1229,1168],{"class":542},[536,1231,1233],{"class":538,"line":1232},25,[536,1234,1235],{"class":563},"    uniform vec3 color;\n",[536,1237,1239],{"class":538,"line":1238},26,[536,1240,1241],{"class":563},"    uniform sampler2D tDiffuse;\n",[536,1243,1245],{"class":538,"line":1244},27,[536,1246,1247],{"class":563},"    uniform float time;\n",[536,1249,1251],{"class":538,"line":1250},28,[536,1252,1178],{"class":563},[536,1254,1256],{"class":538,"line":1255},29,[536,1257,1183],{"class":563},[536,1259,1261],{"class":538,"line":1260},30,[536,1262,1263],{"class":563},"    float blendOverlay(float base, float blend) {\n",[536,1265,1267],{"class":538,"line":1266},31,[536,1268,1269],{"class":563},"      return(base \u003C 0.5 ? (2.0 * base * blend) : (1.0 - 2.0 * (1.0 - base) * (1.0 - blend)));\n",[536,1271,1273],{"class":538,"line":1272},32,[536,1274,1275],{"class":563},"    }\n",[536,1277,1279],{"class":538,"line":1278},33,[536,1280,1281],{"class":563},"    vec3 blendOverlay(vec3 base, vec3 blend) {\n",[536,1283,1285],{"class":538,"line":1284},34,[536,1286,1287],{"class":563},"      return vec3(blendOverlay(base.r, blend.r), blendOverlay(base.g, blend.g), blendOverlay(base.b, blend.b));\n",[536,1289,1291],{"class":538,"line":1290},35,[536,1292,1275],{"class":563},[536,1294,1296],{"class":538,"line":1295},36,[536,1297,1188],{"class":563},[536,1299,1301],{"class":538,"line":1300},37,[536,1302,1303],{"class":563},"      float dist = length(vPos);\n",[536,1305,1307],{"class":538,"line":1306},38,[536,1308,1309],{"class":563},"      float wave = sin(dist * 6.0 - time * 4.0) * 0.02;\n",[536,1311,1313],{"class":538,"line":1312},39,[536,1314,1315],{"class":563},"      vec2 dir = dist > 0.001 ? normalize(vPos) : vec2(0.0);\n",[536,1317,1319],{"class":538,"line":1318},40,[536,1320,1321],{"class":563},"      vec4 distortedUv = vUv + vec4(dir * wave, 0.0, 0.0);\n",[536,1323,1325],{"class":538,"line":1324},41,[536,1326,1327],{"class":563},"      vec4 base = texture2DProj(tDiffuse, distortedUv);\n",[536,1329,1331],{"class":538,"line":1330},42,[536,1332,1333],{"class":563},"      gl_FragColor = vec4(blendOverlay(base.rgb, color), 1.0);\n",[536,1335,1337],{"class":538,"line":1336},43,[536,1338,1339],{"class":563},"      #include \u003Ctonemapping_fragment>\n",[536,1341,1343],{"class":538,"line":1342},44,[536,1344,1345],{"class":563},"      #include \u003Ccolorspace_fragment>\n",[536,1347,1349,1351,1353],{"class":538,"line":1348},45,[536,1350,1211],{"class":563},[536,1352,1214],{"class":542},[536,1354,1217],{"class":542},[536,1356,1358],{"class":538,"line":1357},46,[536,1359,1360],{"class":542},"}\n",[536,1362,1364],{"class":538,"line":1363},47,[536,1365,615],{"emptyLinePlaceholder":614},[536,1367,1369,1371,1373,1376,1379,1382,1384],{"class":538,"line":1368},48,[536,1370,1039],{"class":550},[536,1372,579],{"class":542},[536,1374,1375],{"class":582}," onBeforeRender ",[536,1377,1378],{"class":542},"}",[536,1380,1381],{"class":542}," =",[536,1383,1000],{"class":1047},[536,1385,1050],{"class":582},[536,1387,1389,1392,1395,1398,1402,1405,1408],{"class":538,"line":1388},49,[536,1390,1391],{"class":1047},"onBeforeRender",[536,1393,1394],{"class":582},"(",[536,1396,1397],{"class":542},"({",[536,1399,1401],{"class":1400},"sHdIc"," elapsed",[536,1403,1404],{"class":542}," })",[536,1406,1407],{"class":550}," =>",[536,1409,1066],{"class":542},[536,1411,1413,1416,1419,1421,1424,1427,1430,1433,1436,1438,1441,1443],{"class":538,"line":1412},50,[536,1414,1415],{"class":550},"  const",[536,1417,1418],{"class":582}," uniforms",[536,1420,1381],{"class":542},[536,1422,1423],{"class":582}," reflectorRef",[536,1425,1426],{"class":542},".",[536,1428,1429],{"class":582},"value",[536,1431,1432],{"class":542},"?.",[536,1434,1435],{"class":582},"instance",[536,1437,1432],{"class":542},[536,1439,1440],{"class":582},"material",[536,1442,1432],{"class":542},[536,1444,1445],{"class":582},"uniforms\n",[536,1447,1449,1452,1455,1457,1459,1462,1465,1468,1470,1472,1474,1476,1478,1480,1482],{"class":538,"line":1448},51,[536,1450,1451],{"class":575},"  if",[536,1453,1454],{"class":546}," (",[536,1456,939],{"class":582},[536,1458,1432],{"class":542},[536,1460,1461],{"class":582},"time",[536,1463,1464],{"class":546},") ",[536,1466,1467],{"class":542},"{",[536,1469,1418],{"class":582},[536,1471,1426],{"class":542},[536,1473,1461],{"class":582},[536,1475,1426],{"class":542},[536,1477,1429],{"class":582},[536,1479,1381],{"class":542},[536,1481,1401],{"class":582},[536,1483,1484],{"class":542}," }\n",[536,1486,1488,1490],{"class":538,"line":1487},52,[536,1489,1378],{"class":542},[536,1491,1492],{"class":582},")\n",[536,1494,1496,1498,1500],{"class":538,"line":1495},53,[536,1497,604],{"class":542},[536,1499,547],{"class":546},[536,1501,569],{"class":542},[536,1503,1505],{"class":538,"line":1504},54,[536,1506,615],{"emptyLinePlaceholder":614},[536,1508,1510,1512,1514],{"class":538,"line":1509},55,[536,1511,543],{"class":542},[536,1513,623],{"class":546},[536,1515,569],{"class":542},[536,1517,1519,1521],{"class":538,"line":1518},56,[536,1520,631],{"class":542},[536,1522,700],{"class":546},[536,1524,1526,1529,1531,1533,1536],{"class":538,"line":1525},57,[536,1527,1528],{"class":550},"    ref",[536,1530,557],{"class":542},[536,1532,560],{"class":542},[536,1534,1535],{"class":563},"reflectorRef",[536,1537,716],{"class":542},[536,1539,1541,1544,1546,1548,1550],{"class":538,"line":1540},58,[536,1542,1543],{"class":550},"    :rotation",[536,1545,557],{"class":542},[536,1547,560],{"class":542},[536,1549,713],{"class":563},[536,1551,716],{"class":542},[536,1553,1555,1558,1560,1562,1564],{"class":538,"line":1554},59,[536,1556,1557],{"class":550},"    :position-y",[536,1559,557],{"class":542},[536,1561,560],{"class":542},[536,1563,729],{"class":563},[536,1565,716],{"class":542},[536,1567,1569,1571,1573,1575,1577],{"class":538,"line":1568},60,[536,1570,1081],{"class":550},[536,1572,557],{"class":542},[536,1574,560],{"class":542},[536,1576,744],{"class":563},[536,1578,716],{"class":542},[536,1580,1582,1585,1587,1589,1592],{"class":538,"line":1581},61,[536,1583,1584],{"class":550},"    :shader",[536,1586,557],{"class":542},[536,1588,560],{"class":542},[536,1590,1591],{"class":563},"customShader",[536,1593,716],{"class":542},[536,1595,1597],{"class":538,"line":1596},62,[536,1598,1599],{"class":542},"  >\n",[536,1601,1603,1605,1607,1609,1611,1613,1615,1617],{"class":538,"line":1602},63,[536,1604,648],{"class":542},[536,1606,761],{"class":546},[536,1608,764],{"class":550},[536,1610,557],{"class":542},[536,1612,560],{"class":542},[536,1614,771],{"class":563},[536,1616,560],{"class":542},[536,1618,666],{"class":542},[536,1620,1622,1624,1626],{"class":538,"line":1621},64,[536,1623,801],{"class":542},[536,1625,445],{"class":546},[536,1627,569],{"class":542},[536,1629,1631,1633,1635],{"class":538,"line":1630},65,[536,1632,604],{"class":542},[536,1634,623],{"class":546},[536,1636,569],{"class":542},[502,1638,1639],{},"The Reflector shader use the following configuration by default:",[502,1641,1642],{},"You can extend, modify or just play with them",[1644,1645,1647],"h3",{"id":1646},"default-shader","Default shader",[527,1649,1653],{"className":1650,"code":1651,"language":1652,"meta":532,"style":532},"language-js shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","const shader = {\n  name: 'ReflectorShader',\n  uniforms: {\n    color: {\n      value: null\n    },\n    tDiffuse: {\n      value: null\n    },\n    textureMatrix: {\n      value: null\n    }\n  },\n  vertexShader: /* glsl */`\n  uniform mat4 textureMatrix;\n  varying vec4 vUv;\n\n  #include \u003Ccommon>\n  #include \u003Clogdepthbuf_pars_vertex>\n\n  void main() {\n    vUv = textureMatrix * vec4( position, 1.0 );\n    gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n\n    #include \u003Clogdepthbuf_vertex>\n\n  }`,\n  fragmentShader: /* glsl */`\n  uniform vec3 color;\n  uniform sampler2D tDiffuse;\n  varying vec4 vUv;\n\n  #include \u003Clogdepthbuf_pars_fragment>\n\n  float blendOverlay( float base, float blend ) {\n    return( base \u003C 0.5 ? ( 2.0 * base * blend ) : ( 1.0 - 2.0 * ( 1.0 - base ) * ( 1.0 - blend ) ) );\n  }\n\n  vec3 blendOverlay( vec3 base, vec3 blend ) {\n    return vec3( blendOverlay( base.r, blend.r ), blendOverlay( base.g, blend.g ), blendOverlay( base.b, blend.b ) );\n  }\n\n  void main() {\n    #include \u003Clogdepthbuf_fragment>\n\n    vec4 base = texture2DProj( tDiffuse, vUv );\n    gl_FragColor = vec4( blendOverlay( base.rgb, color ), 1.0 );\n\n    #include \u003Ctonemapping_fragment>\n    #include \u003Ccolorspace_fragment>\n  }`\n\n}\n","js",[506,1654,1655,1666,1683,1691,1699,1709,1714,1722,1730,1734,1742,1750,1754,1758,1768,1773,1778,1782,1787,1792,1796,1801,1806,1811,1815,1820,1824,1833,1843,1848,1853,1857,1861,1866,1870,1875,1880,1885,1889,1894,1899,1903,1907,1911,1916,1920,1925,1930,1934,1939,1944,1950,1954],{"__ignoreMap":532},[536,1656,1657,1659,1662,1664],{"class":538,"line":539},[536,1658,1039],{"class":550},[536,1660,1661],{"class":582}," shader ",[536,1663,557],{"class":542},[536,1665,1066],{"class":542},[536,1667,1668,1671,1673,1675,1678,1681],{"class":538,"line":572},[536,1669,1670],{"class":546},"  name",[536,1672,1074],{"class":542},[536,1674,592],{"class":542},[536,1676,1677],{"class":563},"ReflectorShader",[536,1679,1680],{"class":542},"'",[536,1682,1217],{"class":542},[536,1684,1685,1687,1689],{"class":538,"line":601},[536,1686,1071],{"class":546},[536,1688,1074],{"class":542},[536,1690,1066],{"class":542},[536,1692,1693,1695,1697],{"class":538,"line":611},[536,1694,1081],{"class":546},[536,1696,1074],{"class":542},[536,1698,1066],{"class":542},[536,1700,1701,1704,1706],{"class":538,"line":618},[536,1702,1703],{"class":546},"      value",[536,1705,1074],{"class":542},[536,1707,1708],{"class":542}," null\n",[536,1710,1711],{"class":538,"line":628},[536,1712,1713],{"class":542},"    },\n",[536,1715,1716,1718,1720],{"class":538,"line":645},[536,1717,1101],{"class":546},[536,1719,1074],{"class":542},[536,1721,1066],{"class":542},[536,1723,1724,1726,1728],{"class":538,"line":669},[536,1725,1703],{"class":546},[536,1727,1074],{"class":542},[536,1729,1708],{"class":542},[536,1731,1732],{"class":538,"line":679},[536,1733,1713],{"class":542},[536,1735,1736,1738,1740],{"class":538,"line":684},[536,1737,1118],{"class":546},[536,1739,1074],{"class":542},[536,1741,1066],{"class":542},[536,1743,1744,1746,1748],{"class":538,"line":694},[536,1745,1703],{"class":546},[536,1747,1074],{"class":542},[536,1749,1708],{"class":542},[536,1751,1752],{"class":538,"line":703},[536,1753,1275],{"class":542},[536,1755,1756],{"class":538,"line":719},[536,1757,1154],{"class":542},[536,1759,1760,1762,1764,1766],{"class":538,"line":734},[536,1761,1159],{"class":546},[536,1763,1074],{"class":542},[536,1765,1165],{"class":1164},[536,1767,1168],{"class":542},[536,1769,1770],{"class":538,"line":749},[536,1771,1772],{"class":563},"  uniform mat4 textureMatrix;\n",[536,1774,1775],{"class":538,"line":755},[536,1776,1777],{"class":563},"  varying vec4 vUv;\n",[536,1779,1780],{"class":538,"line":778},[536,1781,615],{"emptyLinePlaceholder":614},[536,1783,1784],{"class":538,"line":788},[536,1785,1786],{"class":563},"  #include \u003Ccommon>\n",[536,1788,1789],{"class":538,"line":798},[536,1790,1791],{"class":563},"  #include \u003Clogdepthbuf_pars_vertex>\n",[536,1793,1794],{"class":538,"line":808},[536,1795,615],{"emptyLinePlaceholder":614},[536,1797,1798],{"class":538,"line":1196},[536,1799,1800],{"class":563},"  void main() {\n",[536,1802,1803],{"class":538,"line":1202},[536,1804,1805],{"class":563},"    vUv = textureMatrix * vec4( position, 1.0 );\n",[536,1807,1808],{"class":538,"line":1208},[536,1809,1810],{"class":563},"    gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n",[536,1812,1813],{"class":538,"line":1220},[536,1814,615],{"emptyLinePlaceholder":614},[536,1816,1817],{"class":538,"line":1232},[536,1818,1819],{"class":563},"    #include \u003Clogdepthbuf_vertex>\n",[536,1821,1822],{"class":538,"line":1238},[536,1823,615],{"emptyLinePlaceholder":614},[536,1825,1826,1829,1831],{"class":538,"line":1244},[536,1827,1828],{"class":563},"  }",[536,1830,1214],{"class":542},[536,1832,1217],{"class":542},[536,1834,1835,1837,1839,1841],{"class":538,"line":1250},[536,1836,1223],{"class":546},[536,1838,1074],{"class":542},[536,1840,1165],{"class":1164},[536,1842,1168],{"class":542},[536,1844,1845],{"class":538,"line":1255},[536,1846,1847],{"class":563},"  uniform vec3 color;\n",[536,1849,1850],{"class":538,"line":1260},[536,1851,1852],{"class":563},"  uniform sampler2D tDiffuse;\n",[536,1854,1855],{"class":538,"line":1266},[536,1856,1777],{"class":563},[536,1858,1859],{"class":538,"line":1272},[536,1860,615],{"emptyLinePlaceholder":614},[536,1862,1863],{"class":538,"line":1278},[536,1864,1865],{"class":563},"  #include \u003Clogdepthbuf_pars_fragment>\n",[536,1867,1868],{"class":538,"line":1284},[536,1869,615],{"emptyLinePlaceholder":614},[536,1871,1872],{"class":538,"line":1290},[536,1873,1874],{"class":563},"  float blendOverlay( float base, float blend ) {\n",[536,1876,1877],{"class":538,"line":1295},[536,1878,1879],{"class":563},"    return( base \u003C 0.5 ? ( 2.0 * base * blend ) : ( 1.0 - 2.0 * ( 1.0 - base ) * ( 1.0 - blend ) ) );\n",[536,1881,1882],{"class":538,"line":1300},[536,1883,1884],{"class":563},"  }\n",[536,1886,1887],{"class":538,"line":1306},[536,1888,615],{"emptyLinePlaceholder":614},[536,1890,1891],{"class":538,"line":1312},[536,1892,1893],{"class":563},"  vec3 blendOverlay( vec3 base, vec3 blend ) {\n",[536,1895,1896],{"class":538,"line":1318},[536,1897,1898],{"class":563},"    return vec3( blendOverlay( base.r, blend.r ), blendOverlay( base.g, blend.g ), blendOverlay( base.b, blend.b ) );\n",[536,1900,1901],{"class":538,"line":1324},[536,1902,1884],{"class":563},[536,1904,1905],{"class":538,"line":1330},[536,1906,615],{"emptyLinePlaceholder":614},[536,1908,1909],{"class":538,"line":1336},[536,1910,1800],{"class":563},[536,1912,1913],{"class":538,"line":1342},[536,1914,1915],{"class":563},"    #include \u003Clogdepthbuf_fragment>\n",[536,1917,1918],{"class":538,"line":1348},[536,1919,615],{"emptyLinePlaceholder":614},[536,1921,1922],{"class":538,"line":1357},[536,1923,1924],{"class":563},"    vec4 base = texture2DProj( tDiffuse, vUv );\n",[536,1926,1927],{"class":538,"line":1363},[536,1928,1929],{"class":563},"    gl_FragColor = vec4( blendOverlay( base.rgb, color ), 1.0 );\n",[536,1931,1932],{"class":538,"line":1368},[536,1933,615],{"emptyLinePlaceholder":614},[536,1935,1936],{"class":538,"line":1388},[536,1937,1938],{"class":563},"    #include \u003Ctonemapping_fragment>\n",[536,1940,1941],{"class":538,"line":1412},[536,1942,1943],{"class":563},"    #include \u003Ccolorspace_fragment>\n",[536,1945,1946,1948],{"class":538,"line":1448},[536,1947,1828],{"class":563},[536,1949,1168],{"class":542},[536,1951,1952],{"class":538,"line":1487},[536,1953,615],{"emptyLinePlaceholder":614},[536,1955,1956],{"class":538,"line":1495},[536,1957,1360],{"class":542},[1959,1960,1961],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}",{"title":532,"searchDepth":539,"depth":572,"links":1963},[1964,1965,1966],{"id":525,"depth":572,"text":15},{"id":817,"depth":572,"text":818},{"id":932,"depth":572,"text":933,"children":1967},[1968],{"id":1646,"depth":601,"text":1647},"Create real-time reflections of your scene.","md",null,{},{"title":445,"description":1969},"NJEaFmV8_JnwGN0OZhU-3XOYAdVvh14PeqjaOc-DkDE",[1976,1978],{"title":441,"path":442,"stem":443,"description":1977,"children":-1},"Create organic blob-like shapes using metaballs.",{"title":449,"path":450,"stem":451,"description":1979,"children":-1},"Create real-time refractive (glass-like) surfaces in your scene.",1785417274111]