├── .editorconfig ├── .eslintignore ├── .eslintrc ├── .gitignore ├── README.md ├── demos ├── 2D-Gradient-Noise-Derivatives │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── 2D-Value-Noise-Derivatives │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── 3D-Noise-Analytical-Normals │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ ├── vertexShader.glsl │ │ └── visulFbmd.glsl ├── 3D-Value-Noise-Derivatives │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Animate-Circle-Swing │ ├── README.md │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Animate-My-Logo │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Animate-Square-Swing │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── BigWing-Road-Light │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Circle-Bubble-Up │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Clock-Line-Circle │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Draw-Path-Line │ ├── images │ │ └── wechat.jpg │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Draw-Simple-Line │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Glow-Line-Volumetric │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Glow-Line-With-Music │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Just-Draw-Simple-Line │ ├── README.md │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Line-Path-Style │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── MonteCarlo-Method-Heart │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Perlin-Noise-Fire-Ball │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Perlin-Noise-Function │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Pseudo-Random-Generate │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── RayMarching-FBM-Glowing-Circle │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── RayMarching-Volumetric-FBM │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── Space-Sky-PassEffect │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── fbm-volumetric-clouds │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── iq-compositing │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── iq-eye │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── iq-heart │ ├── README.md │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── iq-palette │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── noise-sphere-moon │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── noise-value-2d │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader copy.glsl │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl ├── polygon-ray-tracing │ ├── index.html │ ├── js │ │ ├── index.js │ │ └── shader.js │ └── studio │ │ ├── .eslintrc │ │ ├── fragmentShader.glsl │ │ ├── shader.js │ │ └── vertexShader.glsl └── simple-value │ ├── index.html │ ├── js │ ├── index.js │ └── shader.js │ └── studio │ ├── .eslintrc │ ├── fragmentShader.glsl │ ├── shader.js │ └── vertexShader.glsl ├── doc ├── TASKLINE.md └── WORDS.md ├── lib ├── dat.gui │ ├── .babelrc │ ├── API.md │ ├── CHANGELOG.md │ ├── LICENSE │ ├── README.md │ ├── bower.json │ ├── build │ │ ├── dat.gui.css │ │ ├── dat.gui.js │ │ ├── dat.gui.js.map │ │ ├── dat.gui.min.js │ │ ├── dat.gui.module.js │ │ └── dat.gui.module.js.map │ ├── example.html │ ├── licenseBanner.txt │ ├── package.json │ ├── rollup.config.js │ ├── rollup.config.min.js │ ├── src │ │ └── dat │ │ │ ├── color │ │ │ ├── Color.js │ │ │ ├── interpret.js │ │ │ ├── math.js │ │ │ └── toString.js │ │ │ ├── controllers │ │ │ ├── BooleanController.js │ │ │ ├── ColorController.js │ │ │ ├── Controller.js │ │ │ ├── ControllerFactory.js │ │ │ ├── FunctionController.js │ │ │ ├── NumberController.js │ │ │ ├── NumberControllerBox.js │ │ │ ├── NumberControllerSlider.js │ │ │ ├── OptionController.js │ │ │ └── StringController.js │ │ │ ├── dom │ │ │ ├── CenteredDiv.js │ │ │ └── dom.js │ │ │ ├── gui │ │ │ ├── GUI.js │ │ │ ├── _structure.scss │ │ │ ├── saveDialogue.html.js │ │ │ └── style.scss │ │ │ ├── index.js │ │ │ └── utils │ │ │ ├── common.js │ │ │ ├── css.js │ │ │ └── requestAnimationFrame.js │ ├── tests │ │ ├── index.html │ │ ├── jquery.js │ │ ├── qunit.css │ │ └── qunit.js │ └── tmp │ │ ├── bundle.js │ │ ├── common.js │ │ ├── es6.js │ │ ├── index.html │ │ ├── package.json │ │ ├── rollup.config.js │ │ └── webpack.config.js ├── stats.js │ ├── LICENSE │ ├── build │ │ └── stats.min.js │ ├── package.json │ └── src │ │ └── Stats.js ├── three │ ├── LICENSE │ ├── README.md │ ├── bower.json │ ├── build │ │ ├── three.js │ │ ├── three.min.js │ │ └── three.module.js │ ├── examples │ │ ├── fonts │ │ │ ├── LICENSE │ │ │ ├── README │ │ │ ├── droid │ │ │ │ ├── NOTICE │ │ │ │ ├── README.txt │ │ │ │ ├── droid_sans_bold.typeface.json │ │ │ │ ├── droid_sans_mono_regular.typeface.json │ │ │ │ ├── droid_sans_regular.typeface.json │ │ │ │ ├── droid_serif_bold.typeface.json │ │ │ │ └── droid_serif_regular.typeface.json │ │ │ ├── gentilis_bold.typeface.json │ │ │ ├── gentilis_regular.typeface.json │ │ │ ├── helvetiker_bold.typeface.json │ │ │ ├── helvetiker_regular.typeface.json │ │ │ ├── optimer_bold.typeface.json │ │ │ ├── optimer_regular.typeface.json │ │ │ └── ttf │ │ │ │ └── kenpixel.ttf │ │ └── js │ │ │ ├── AnimationClipCreator.js │ │ │ ├── BufferGeometryUtils.js │ │ │ ├── Car.js │ │ │ ├── Cloth.js │ │ │ ├── ConvexObjectBreaker.js │ │ │ ├── CurveExtras.js │ │ │ ├── Detector.js │ │ │ ├── GPUComputationRenderer.js │ │ │ ├── GPUParticleSystem.js │ │ │ ├── Gyroscope.js │ │ │ ├── ImprovedNoise.js │ │ │ ├── MD2Character.js │ │ │ ├── MD2CharacterComplex.js │ │ │ ├── MarchingCubes.js │ │ │ ├── MorphAnimMesh.js │ │ │ ├── MorphBlendMesh.js │ │ │ ├── Ocean.js │ │ │ ├── Octree.js │ │ │ ├── PRNG.js │ │ │ ├── ParametricGeometries.js │ │ │ ├── QuickHull.js │ │ │ ├── RollerCoaster.js │ │ │ ├── ShaderGodRays.js │ │ │ ├── ShaderSkin.js │ │ │ ├── ShaderTerrain.js │ │ │ ├── ShaderToon.js │ │ │ ├── SimplexNoise.js │ │ │ ├── TimelinerController.js │ │ │ ├── TypedArrayUtils.js │ │ │ ├── UCSCharacter.js │ │ │ ├── Volume.js │ │ │ ├── VolumeSlice.js │ │ │ ├── animation │ │ │ ├── CCDIKSolver.js │ │ │ └── MMDPhysics.js │ │ │ ├── cameras │ │ │ └── CinematicCamera.js │ │ │ ├── controls │ │ │ ├── DeviceOrientationControls.js │ │ │ ├── DragControls.js │ │ │ ├── EditorControls.js │ │ │ ├── FirstPersonControls.js │ │ │ ├── FlyControls.js │ │ │ ├── OrbitControls.js │ │ │ ├── OrthographicTrackballControls.js │ │ │ ├── PointerLockControls.js │ │ │ ├── TrackballControls.js │ │ │ ├── TransformControls.js │ │ │ └── VRControls.js │ │ │ ├── crossfade │ │ │ ├── gui.js │ │ │ ├── scenes.js │ │ │ └── transition.js │ │ │ ├── curves │ │ │ ├── NURBSCurve.js │ │ │ ├── NURBSSurface.js │ │ │ └── NURBSUtils.js │ │ │ ├── effects │ │ │ ├── AnaglyphEffect.js │ │ │ ├── AsciiEffect.js │ │ │ ├── OutlineEffect.js │ │ │ ├── ParallaxBarrierEffect.js │ │ │ ├── PeppersGhostEffect.js │ │ │ ├── StereoEffect.js │ │ │ └── VREffect.js │ │ │ ├── exporters │ │ │ ├── GLTFExporter.js │ │ │ ├── MMDExporter.js │ │ │ ├── OBJExporter.js │ │ │ ├── STLBinaryExporter.js │ │ │ ├── STLExporter.js │ │ │ └── TypedGeometryExporter.js │ │ │ ├── geometries │ │ │ ├── ConvexGeometry.js │ │ │ ├── DecalGeometry.js │ │ │ ├── TeapotBufferGeometry.js │ │ │ ├── hilbert2D.js │ │ │ └── hilbert3D.js │ │ │ ├── libs │ │ │ ├── ammo.js │ │ │ ├── dat.gui.min.js │ │ │ ├── gunzip.min.js │ │ │ ├── inflate.min.js │ │ │ ├── jszip.min.js │ │ │ ├── mmdparser.min.js │ │ │ ├── msgpack-js.js │ │ │ ├── o3dgc.js │ │ │ ├── opentype.min.js │ │ │ ├── stats.min.js │ │ │ ├── system.min.js │ │ │ ├── timeliner_gui.min.js │ │ │ └── tween.min.js │ │ │ ├── lights │ │ │ └── RectAreaLightUniformsLib.js │ │ │ ├── loaders │ │ │ ├── 3MFLoader.js │ │ │ ├── AMFLoader.js │ │ │ ├── AWDLoader.js │ │ │ ├── AssimpJSONLoader.js │ │ │ ├── AssimpLoader.js │ │ │ ├── BVHLoader.js │ │ │ ├── BabylonLoader.js │ │ │ ├── BinaryLoader.js │ │ │ ├── ColladaLoader.js │ │ │ ├── DDSLoader.js │ │ │ ├── EXRLoader.js │ │ │ ├── FBXLoader.js │ │ │ ├── GCodeLoader.js │ │ │ ├── GLTFLoader.js │ │ │ ├── HDRCubeTextureLoader.js │ │ │ ├── KMZLoader.js │ │ │ ├── LoaderSupport.js │ │ │ ├── MD2Loader.js │ │ │ ├── MMDLoader.js │ │ │ ├── MTLLoader.js │ │ │ ├── NRRDLoader.js │ │ │ ├── OBJLoader.js │ │ │ ├── OBJLoader2.js │ │ │ ├── PCDLoader.js │ │ │ ├── PDBLoader.js │ │ │ ├── PLYLoader.js │ │ │ ├── PRWMLoader.js │ │ │ ├── PVRLoader.js │ │ │ ├── PlayCanvasLoader.js │ │ │ ├── RGBELoader.js │ │ │ ├── STLLoader.js │ │ │ ├── SVGLoader.js │ │ │ ├── TDSLoader.js │ │ │ ├── TGALoader.js │ │ │ ├── TTFLoader.js │ │ │ ├── UTF8Loader.js │ │ │ ├── VRMLLoader.js │ │ │ ├── VTKLoader.js │ │ │ ├── XLoader.js │ │ │ ├── ctm │ │ │ │ ├── CTMLoader.js │ │ │ │ ├── CTMWorker.js │ │ │ │ ├── ctm.js │ │ │ │ ├── license │ │ │ │ │ ├── OpenCTM.txt │ │ │ │ │ ├── js-lzma.txt │ │ │ │ │ └── js-openctm.txt │ │ │ │ └── lzma.js │ │ │ ├── deprecated │ │ │ │ └── LegacyGLTFLoader.js │ │ │ ├── draco │ │ │ │ ├── DRACOLoader.js │ │ │ │ ├── draco_decoder.js │ │ │ │ ├── draco_decoder.wasm │ │ │ │ └── draco_wasm_wrapper.js │ │ │ └── sea3d │ │ │ │ ├── SEA3D.js │ │ │ │ ├── SEA3DDeflate.js │ │ │ │ ├── SEA3DLZMA.js │ │ │ │ ├── SEA3DLegacy.js │ │ │ │ ├── SEA3DLoader.js │ │ │ │ ├── o3dgc │ │ │ │ └── SEA3DGC.js │ │ │ │ └── physics │ │ │ │ ├── SEA3DAmmo.js │ │ │ │ ├── SEA3DAmmoLoader.js │ │ │ │ └── SEA3DRigidBody.js │ │ │ ├── math │ │ │ ├── ColorConverter.js │ │ │ └── Lut.js │ │ │ ├── modifiers │ │ │ ├── BufferSubdivisionModifier.js │ │ │ ├── ExplodeModifier.js │ │ │ ├── SimplifyModifier.js │ │ │ ├── SubdivisionModifier.js │ │ │ └── TessellateModifier.js │ │ │ ├── nodes │ │ │ ├── AttributeNode.js │ │ │ ├── ConstNode.js │ │ │ ├── FunctionCallNode.js │ │ │ ├── FunctionNode.js │ │ │ ├── GLNode.js │ │ │ ├── InputNode.js │ │ │ ├── NodeBuilder.js │ │ │ ├── NodeLib.js │ │ │ ├── NodeMaterial.js │ │ │ ├── RawNode.js │ │ │ ├── TempNode.js │ │ │ ├── VarNode.js │ │ │ ├── accessors │ │ │ │ ├── CameraNode.js │ │ │ │ ├── ColorsNode.js │ │ │ │ ├── LightNode.js │ │ │ │ ├── NormalNode.js │ │ │ │ ├── PositionNode.js │ │ │ │ ├── ReflectNode.js │ │ │ │ ├── ScreenUVNode.js │ │ │ │ └── UVNode.js │ │ │ ├── inputs │ │ │ │ ├── ColorNode.js │ │ │ │ ├── CubeTextureNode.js │ │ │ │ ├── FloatNode.js │ │ │ │ ├── IntNode.js │ │ │ │ ├── Matrix4Node.js │ │ │ │ ├── ReflectorNode.js │ │ │ │ ├── ScreenNode.js │ │ │ │ ├── TextureNode.js │ │ │ │ ├── Vector2Node.js │ │ │ │ ├── Vector3Node.js │ │ │ │ └── Vector4Node.js │ │ │ ├── materials │ │ │ │ ├── PhongNode.js │ │ │ │ ├── PhongNodeMaterial.js │ │ │ │ ├── SpriteNode.js │ │ │ │ ├── SpriteNodeMaterial.js │ │ │ │ ├── StandardNode.js │ │ │ │ └── StandardNodeMaterial.js │ │ │ ├── math │ │ │ │ ├── Math1Node.js │ │ │ │ ├── Math2Node.js │ │ │ │ ├── Math3Node.js │ │ │ │ └── OperatorNode.js │ │ │ ├── postprocessing │ │ │ │ └── NodePass.js │ │ │ └── utils │ │ │ │ ├── BlurNode.js │ │ │ │ ├── BumpNode.js │ │ │ │ ├── ColorAdjustmentNode.js │ │ │ │ ├── JoinNode.js │ │ │ │ ├── LuminanceNode.js │ │ │ │ ├── NoiseNode.js │ │ │ │ ├── NormalMapNode.js │ │ │ │ ├── ResolutionNode.js │ │ │ │ ├── RoughnessToBlinnExponentNode.js │ │ │ │ ├── SwitchNode.js │ │ │ │ ├── TimerNode.js │ │ │ │ ├── UVTransformNode.js │ │ │ │ └── VelocityNode.js │ │ │ ├── objects │ │ │ ├── Reflector.js │ │ │ ├── ReflectorRTT.js │ │ │ ├── Refractor.js │ │ │ ├── ShadowMesh.js │ │ │ ├── Sky.js │ │ │ ├── Water.js │ │ │ └── Water2.js │ │ │ ├── pmrem │ │ │ ├── PMREMCubeUVPacker.js │ │ │ └── PMREMGenerator.js │ │ │ ├── postprocessing │ │ │ ├── AdaptiveToneMappingPass.js │ │ │ ├── BloomPass.js │ │ │ ├── BokehPass.js │ │ │ ├── ClearPass.js │ │ │ ├── CubeTexturePass.js │ │ │ ├── DotScreenPass.js │ │ │ ├── EffectComposer.js │ │ │ ├── FilmPass.js │ │ │ ├── GlitchPass.js │ │ │ ├── MaskPass.js │ │ │ ├── OutlinePass.js │ │ │ ├── RenderPass.js │ │ │ ├── SAOPass.js │ │ │ ├── SMAAPass.js │ │ │ ├── SSAARenderPass.js │ │ │ ├── SSAOPass.js │ │ │ ├── SavePass.js │ │ │ ├── ShaderPass.js │ │ │ ├── TAARenderPass.js │ │ │ ├── TexturePass.js │ │ │ └── UnrealBloomPass.js │ │ │ ├── renderers │ │ │ ├── CSS2DRenderer.js │ │ │ ├── CSS3DRenderer.js │ │ │ ├── CanvasRenderer.js │ │ │ ├── Projector.js │ │ │ ├── RaytracingRenderer.js │ │ │ ├── RaytracingWorker.js │ │ │ ├── SVGRenderer.js │ │ │ ├── SoftwareRenderer.js │ │ │ └── WebGLDeferredRenderer.js │ │ │ ├── shaders │ │ │ ├── BasicShader.js │ │ │ ├── BleachBypassShader.js │ │ │ ├── BlendShader.js │ │ │ ├── BokehShader.js │ │ │ ├── BokehShader2.js │ │ │ ├── BrightnessContrastShader.js │ │ │ ├── ColorCorrectionShader.js │ │ │ ├── ColorifyShader.js │ │ │ ├── ConvolutionShader.js │ │ │ ├── CopyShader.js │ │ │ ├── DOFMipMapShader.js │ │ │ ├── DepthLimitedBlurShader.js │ │ │ ├── DigitalGlitch.js │ │ │ ├── DotScreenShader.js │ │ │ ├── FXAAShader.js │ │ │ ├── FilmShader.js │ │ │ ├── FocusShader.js │ │ │ ├── FreiChenShader.js │ │ │ ├── FresnelShader.js │ │ │ ├── GammaCorrectionShader.js │ │ │ ├── HorizontalBlurShader.js │ │ │ ├── HorizontalTiltShiftShader.js │ │ │ ├── HueSaturationShader.js │ │ │ ├── KaleidoShader.js │ │ │ ├── LuminosityHighPassShader.js │ │ │ ├── LuminosityShader.js │ │ │ ├── MirrorShader.js │ │ │ ├── NormalMapShader.js │ │ │ ├── OceanShaders.js │ │ │ ├── ParallaxShader.js │ │ │ ├── RGBShiftShader.js │ │ │ ├── SAOShader.js │ │ │ ├── SMAAShader.js │ │ │ ├── SSAOShader.js │ │ │ ├── SepiaShader.js │ │ │ ├── SobelOperatorShader.js │ │ │ ├── TechnicolorShader.js │ │ │ ├── ToneMapShader.js │ │ │ ├── TriangleBlurShader.js │ │ │ ├── UnpackDepthRGBAShader.js │ │ │ ├── VerticalBlurShader.js │ │ │ ├── VerticalTiltShiftShader.js │ │ │ ├── VignetteShader.js │ │ │ └── WaterRefractionShader.js │ │ │ ├── utils │ │ │ ├── GeometryUtils.js │ │ │ ├── ShadowMapViewer.js │ │ │ └── UVsDebug.js │ │ │ └── vr │ │ │ ├── DaydreamController.js │ │ │ ├── GearVRController.js │ │ │ ├── PaintViveController.js │ │ │ ├── ViveController.js │ │ │ └── WebVR.js │ ├── package.json │ └── src │ │ ├── Three.Legacy.js │ │ ├── Three.js │ │ ├── animation │ │ ├── AnimationAction.js │ │ ├── AnimationClip.js │ │ ├── AnimationMixer.js │ │ ├── AnimationObjectGroup.js │ │ ├── AnimationUtils.js │ │ ├── KeyframeTrack.js │ │ ├── PropertyBinding.js │ │ ├── PropertyMixer.js │ │ └── tracks │ │ │ ├── BooleanKeyframeTrack.js │ │ │ ├── ColorKeyframeTrack.js │ │ │ ├── NumberKeyframeTrack.js │ │ │ ├── QuaternionKeyframeTrack.js │ │ │ ├── StringKeyframeTrack.js │ │ │ └── VectorKeyframeTrack.js │ │ ├── audio │ │ ├── Audio.js │ │ ├── AudioAnalyser.js │ │ ├── AudioContext.js │ │ ├── AudioListener.js │ │ └── PositionalAudio.js │ │ ├── cameras │ │ ├── ArrayCamera.js │ │ ├── Camera.js │ │ ├── CubeCamera.js │ │ ├── OrthographicCamera.js │ │ ├── PerspectiveCamera.js │ │ └── StereoCamera.js │ │ ├── constants.js │ │ ├── core │ │ ├── BufferAttribute.js │ │ ├── BufferGeometry.js │ │ ├── Clock.js │ │ ├── DirectGeometry.js │ │ ├── EventDispatcher.js │ │ ├── Face3.js │ │ ├── Geometry.js │ │ ├── InstancedBufferAttribute.js │ │ ├── InstancedBufferGeometry.js │ │ ├── InstancedInterleavedBuffer.js │ │ ├── InterleavedBuffer.js │ │ ├── InterleavedBufferAttribute.js │ │ ├── Layers.js │ │ ├── Object3D.js │ │ ├── Raycaster.js │ │ └── Uniform.js │ │ ├── extras │ │ ├── Earcut.js │ │ ├── SceneUtils.js │ │ ├── ShapeUtils.js │ │ ├── core │ │ │ ├── Curve.js │ │ │ ├── CurvePath.js │ │ │ ├── Font.js │ │ │ ├── Interpolations.js │ │ │ ├── Path.js │ │ │ ├── Shape.js │ │ │ └── ShapePath.js │ │ ├── curves │ │ │ ├── ArcCurve.js │ │ │ ├── CatmullRomCurve3.js │ │ │ ├── CubicBezierCurve.js │ │ │ ├── CubicBezierCurve3.js │ │ │ ├── Curves.js │ │ │ ├── EllipseCurve.js │ │ │ ├── LineCurve.js │ │ │ ├── LineCurve3.js │ │ │ ├── QuadraticBezierCurve.js │ │ │ ├── QuadraticBezierCurve3.js │ │ │ └── SplineCurve.js │ │ └── objects │ │ │ └── ImmediateRenderObject.js │ │ ├── geometries │ │ ├── BoxGeometry.js │ │ ├── CircleGeometry.js │ │ ├── ConeGeometry.js │ │ ├── CylinderGeometry.js │ │ ├── DodecahedronGeometry.js │ │ ├── EdgesGeometry.js │ │ ├── ExtrudeGeometry.js │ │ ├── Geometries.js │ │ ├── IcosahedronGeometry.js │ │ ├── LatheGeometry.js │ │ ├── OctahedronGeometry.js │ │ ├── ParametricGeometry.js │ │ ├── PlaneGeometry.js │ │ ├── PolyhedronGeometry.js │ │ ├── RingGeometry.js │ │ ├── ShapeGeometry.js │ │ ├── SphereGeometry.js │ │ ├── TetrahedronGeometry.js │ │ ├── TextGeometry.js │ │ ├── TorusGeometry.js │ │ ├── TorusKnotGeometry.js │ │ ├── TubeGeometry.js │ │ └── WireframeGeometry.js │ │ ├── helpers │ │ ├── ArrowHelper.js │ │ ├── AxesHelper.js │ │ ├── Box3Helper.js │ │ ├── BoxHelper.js │ │ ├── CameraHelper.js │ │ ├── DirectionalLightHelper.js │ │ ├── FaceNormalsHelper.js │ │ ├── GridHelper.js │ │ ├── HemisphereLightHelper.js │ │ ├── PlaneHelper.js │ │ ├── PointLightHelper.js │ │ ├── PolarGridHelper.js │ │ ├── RectAreaLightHelper.js │ │ ├── SkeletonHelper.js │ │ ├── SpotLightHelper.js │ │ └── VertexNormalsHelper.js │ │ ├── lights │ │ ├── AmbientLight.js │ │ ├── DirectionalLight.js │ │ ├── DirectionalLightShadow.js │ │ ├── HemisphereLight.js │ │ ├── Light.js │ │ ├── LightShadow.js │ │ ├── PointLight.js │ │ ├── RectAreaLight.js │ │ ├── SpotLight.js │ │ └── SpotLightShadow.js │ │ ├── loaders │ │ ├── AnimationLoader.js │ │ ├── AudioLoader.js │ │ ├── BufferGeometryLoader.js │ │ ├── Cache.js │ │ ├── CompressedTextureLoader.js │ │ ├── CubeTextureLoader.js │ │ ├── DataTextureLoader.js │ │ ├── FileLoader.js │ │ ├── FontLoader.js │ │ ├── ImageBitmapLoader.js │ │ ├── ImageLoader.js │ │ ├── JSONLoader.js │ │ ├── Loader.js │ │ ├── LoaderUtils.js │ │ ├── LoadingManager.js │ │ ├── MaterialLoader.js │ │ ├── ObjectLoader.js │ │ └── TextureLoader.js │ │ ├── materials │ │ ├── LineBasicMaterial.js │ │ ├── LineDashedMaterial.js │ │ ├── Material.js │ │ ├── Materials.js │ │ ├── MeshBasicMaterial.js │ │ ├── MeshDepthMaterial.js │ │ ├── MeshDistanceMaterial.js │ │ ├── MeshLambertMaterial.js │ │ ├── MeshNormalMaterial.js │ │ ├── MeshPhongMaterial.js │ │ ├── MeshPhysicalMaterial.js │ │ ├── MeshStandardMaterial.js │ │ ├── MeshToonMaterial.js │ │ ├── PointsMaterial.js │ │ ├── RawShaderMaterial.js │ │ ├── ShaderMaterial.js │ │ ├── ShadowMaterial.js │ │ └── SpriteMaterial.js │ │ ├── math │ │ ├── Box2.js │ │ ├── Box3.js │ │ ├── Color.js │ │ ├── Cylindrical.js │ │ ├── Euler.js │ │ ├── Frustum.js │ │ ├── Interpolant.js │ │ ├── Line3.js │ │ ├── Math.js │ │ ├── Matrix3.js │ │ ├── Matrix4.js │ │ ├── Plane.js │ │ ├── Quaternion.js │ │ ├── Ray.js │ │ ├── Sphere.js │ │ ├── Spherical.js │ │ ├── Triangle.js │ │ ├── Vector2.js │ │ ├── Vector3.js │ │ ├── Vector4.js │ │ └── interpolants │ │ │ ├── CubicInterpolant.js │ │ │ ├── DiscreteInterpolant.js │ │ │ ├── LinearInterpolant.js │ │ │ └── QuaternionLinearInterpolant.js │ │ ├── objects │ │ ├── Bone.js │ │ ├── Group.js │ │ ├── LOD.js │ │ ├── LensFlare.js │ │ ├── Line.js │ │ ├── LineLoop.js │ │ ├── LineSegments.js │ │ ├── Mesh.js │ │ ├── Points.js │ │ ├── Skeleton.js │ │ ├── SkinnedMesh.js │ │ └── Sprite.js │ │ ├── polyfills.js │ │ ├── renderers │ │ ├── WebGL2Renderer.js │ │ ├── WebGLRenderTarget.js │ │ ├── WebGLRenderTargetCube.js │ │ ├── WebGLRenderer.js │ │ ├── shaders │ │ │ ├── ShaderChunk.js │ │ │ ├── ShaderChunk │ │ │ │ ├── alphamap_fragment.glsl │ │ │ │ ├── alphamap_pars_fragment.glsl │ │ │ │ ├── alphatest_fragment.glsl │ │ │ │ ├── aomap_fragment.glsl │ │ │ │ ├── aomap_pars_fragment.glsl │ │ │ │ ├── begin_vertex.glsl │ │ │ │ ├── beginnormal_vertex.glsl │ │ │ │ ├── bsdfs.glsl │ │ │ │ ├── bumpmap_pars_fragment.glsl │ │ │ │ ├── clipping_planes_fragment.glsl │ │ │ │ ├── clipping_planes_pars_fragment.glsl │ │ │ │ ├── clipping_planes_pars_vertex.glsl │ │ │ │ ├── clipping_planes_vertex.glsl │ │ │ │ ├── color_fragment.glsl │ │ │ │ ├── color_pars_fragment.glsl │ │ │ │ ├── color_pars_vertex.glsl │ │ │ │ ├── color_vertex.glsl │ │ │ │ ├── common.glsl │ │ │ │ ├── cube_uv_reflection_fragment.glsl │ │ │ │ ├── defaultnormal_vertex.glsl │ │ │ │ ├── displacementmap_pars_vertex.glsl │ │ │ │ ├── displacementmap_vertex.glsl │ │ │ │ ├── dithering_fragment.glsl │ │ │ │ ├── dithering_pars_fragment.glsl │ │ │ │ ├── emissivemap_fragment.glsl │ │ │ │ ├── emissivemap_pars_fragment.glsl │ │ │ │ ├── encodings_fragment.glsl │ │ │ │ ├── encodings_pars_fragment.glsl │ │ │ │ ├── envmap_fragment.glsl │ │ │ │ ├── envmap_pars_fragment.glsl │ │ │ │ ├── envmap_pars_vertex.glsl │ │ │ │ ├── envmap_vertex.glsl │ │ │ │ ├── fog_fragment.glsl │ │ │ │ ├── fog_pars_fragment.glsl │ │ │ │ ├── fog_pars_vertex.glsl │ │ │ │ ├── fog_vertex.glsl │ │ │ │ ├── gradientmap_pars_fragment.glsl │ │ │ │ ├── lightmap_fragment.glsl │ │ │ │ ├── lightmap_pars_fragment.glsl │ │ │ │ ├── lights_lambert_vertex.glsl │ │ │ │ ├── lights_pars.glsl │ │ │ │ ├── lights_phong_fragment.glsl │ │ │ │ ├── lights_phong_pars_fragment.glsl │ │ │ │ ├── lights_physical_fragment.glsl │ │ │ │ ├── lights_physical_pars_fragment.glsl │ │ │ │ ├── lights_template.glsl │ │ │ │ ├── logdepthbuf_fragment.glsl │ │ │ │ ├── logdepthbuf_pars_fragment.glsl │ │ │ │ ├── logdepthbuf_pars_vertex.glsl │ │ │ │ ├── logdepthbuf_vertex.glsl │ │ │ │ ├── map_fragment.glsl │ │ │ │ ├── map_pars_fragment.glsl │ │ │ │ ├── map_particle_fragment.glsl │ │ │ │ ├── map_particle_pars_fragment.glsl │ │ │ │ ├── metalnessmap_fragment.glsl │ │ │ │ ├── metalnessmap_pars_fragment.glsl │ │ │ │ ├── morphnormal_vertex.glsl │ │ │ │ ├── morphtarget_pars_vertex.glsl │ │ │ │ ├── morphtarget_vertex.glsl │ │ │ │ ├── normal_fragment.glsl │ │ │ │ ├── normalmap_pars_fragment.glsl │ │ │ │ ├── packing.glsl │ │ │ │ ├── premultiplied_alpha_fragment.glsl │ │ │ │ ├── project_vertex.glsl │ │ │ │ ├── roughnessmap_fragment.glsl │ │ │ │ ├── roughnessmap_pars_fragment.glsl │ │ │ │ ├── shadowmap_pars_fragment.glsl │ │ │ │ ├── shadowmap_pars_vertex.glsl │ │ │ │ ├── shadowmap_vertex.glsl │ │ │ │ ├── shadowmask_pars_fragment.glsl │ │ │ │ ├── skinbase_vertex.glsl │ │ │ │ ├── skinning_pars_vertex.glsl │ │ │ │ ├── skinning_vertex.glsl │ │ │ │ ├── skinnormal_vertex.glsl │ │ │ │ ├── specularmap_fragment.glsl │ │ │ │ ├── specularmap_pars_fragment.glsl │ │ │ │ ├── tonemapping_fragment.glsl │ │ │ │ ├── tonemapping_pars_fragment.glsl │ │ │ │ ├── uv2_pars_fragment.glsl │ │ │ │ ├── uv2_pars_vertex.glsl │ │ │ │ ├── uv2_vertex.glsl │ │ │ │ ├── uv_pars_fragment.glsl │ │ │ │ ├── uv_pars_vertex.glsl │ │ │ │ ├── uv_vertex.glsl │ │ │ │ └── worldpos_vertex.glsl │ │ │ ├── ShaderLib.js │ │ │ ├── ShaderLib │ │ │ │ ├── cube_frag.glsl │ │ │ │ ├── cube_vert.glsl │ │ │ │ ├── depth_frag.glsl │ │ │ │ ├── depth_vert.glsl │ │ │ │ ├── distanceRGBA_frag.glsl │ │ │ │ ├── distanceRGBA_vert.glsl │ │ │ │ ├── equirect_frag.glsl │ │ │ │ ├── equirect_vert.glsl │ │ │ │ ├── linedashed_frag.glsl │ │ │ │ ├── linedashed_vert.glsl │ │ │ │ ├── meshbasic_frag.glsl │ │ │ │ ├── meshbasic_vert.glsl │ │ │ │ ├── meshlambert_frag.glsl │ │ │ │ ├── meshlambert_vert.glsl │ │ │ │ ├── meshphong_frag.glsl │ │ │ │ ├── meshphong_vert.glsl │ │ │ │ ├── meshphysical_frag.glsl │ │ │ │ ├── meshphysical_vert.glsl │ │ │ │ ├── normal_frag.glsl │ │ │ │ ├── normal_vert.glsl │ │ │ │ ├── points_frag.glsl │ │ │ │ ├── points_vert.glsl │ │ │ │ ├── shadow_frag.glsl │ │ │ │ └── shadow_vert.glsl │ │ │ ├── UniformsLib.js │ │ │ └── UniformsUtils.js │ │ ├── webgl │ │ │ ├── WebGLAttributes.js │ │ │ ├── WebGLBackground.js │ │ │ ├── WebGLBufferRenderer.js │ │ │ ├── WebGLCapabilities.js │ │ │ ├── WebGLClipping.js │ │ │ ├── WebGLExtensions.js │ │ │ ├── WebGLFlareRenderer.js │ │ │ ├── WebGLGeometries.js │ │ │ ├── WebGLIndexedBufferRenderer.js │ │ │ ├── WebGLLights.js │ │ │ ├── WebGLMorphtargets.js │ │ │ ├── WebGLObjects.js │ │ │ ├── WebGLProgram.js │ │ │ ├── WebGLPrograms.js │ │ │ ├── WebGLProperties.js │ │ │ ├── WebGLRenderLists.js │ │ │ ├── WebGLShader.js │ │ │ ├── WebGLShadowMap.js │ │ │ ├── WebGLSpriteRenderer.js │ │ │ ├── WebGLState.js │ │ │ ├── WebGLTextures.js │ │ │ ├── WebGLUniforms.js │ │ │ └── WebGLUtils.js │ │ └── webvr │ │ │ └── WebVRManager.js │ │ ├── scenes │ │ ├── Fog.js │ │ ├── FogExp2.js │ │ └── Scene.js │ │ ├── textures │ │ ├── CanvasTexture.js │ │ ├── CompressedTexture.js │ │ ├── CubeTexture.js │ │ ├── DataTexture.js │ │ ├── DepthTexture.js │ │ ├── Texture.js │ │ └── VideoTexture.js │ │ └── utils.js ├── tofu.js │ ├── CHANGELOG.md │ ├── LICENSE │ ├── README.md │ ├── build │ │ ├── tofu.js │ │ └── tofu.js.map │ ├── esm │ │ ├── index.js │ │ └── index.js.map │ ├── package.json │ └── src │ │ ├── animation │ │ ├── Animate.js │ │ ├── AnimateRunner.js │ │ ├── PathMotion.js │ │ ├── TimelineAnimations.js │ │ └── Transition.js │ │ ├── core │ │ ├── ARGlue.js │ │ ├── EffectComposer.js │ │ ├── EffectPack.js │ │ ├── LayerCompositor.js │ │ ├── ViewConfig.js │ │ ├── Viewer.js │ │ ├── layer │ │ │ ├── ARLayer.js │ │ │ ├── Layer.js │ │ │ ├── PrimerLayer.js │ │ │ └── XRLayer.js │ │ ├── primers │ │ │ ├── CameraPrimer.js │ │ │ ├── Primer.js │ │ │ └── TexturePrimer.js │ │ └── viewer │ │ │ ├── ARViewer.js │ │ │ ├── EffectComposer.js │ │ │ ├── GraphicsLayer.js │ │ │ ├── Layer.js │ │ │ ├── PrimerLayer.js │ │ │ └── XRViewer.js │ │ ├── extras │ │ ├── GltfMagic.js │ │ └── panorama │ │ │ ├── AnchorBase.js │ │ │ ├── AnchorRippling.js │ │ │ ├── CylinderWorld.js │ │ │ └── SphereWorld.js │ │ ├── index.js │ │ ├── math │ │ └── BezierEasing.js │ │ ├── patch │ │ └── Object3D.js │ │ ├── postprocessing │ │ ├── BloomPass.js │ │ ├── ClearMaskPass.js │ │ ├── FilmPass.js │ │ ├── GlitchPass.js │ │ ├── MaskPass.js │ │ ├── MattingPass.js │ │ ├── Pass.js │ │ ├── RenderPass.js │ │ └── ShaderPass.js │ │ ├── shader │ │ ├── ConvolutionShader.js │ │ ├── CopyShader.js │ │ ├── DigitalGlitch.js │ │ ├── EdgeBlur.js │ │ ├── FilmShader.js │ │ ├── FocusShader.js │ │ ├── MattingShader.js │ │ ├── YCbCrShader.js │ │ └── YUVShader.js │ │ └── utils │ │ ├── GLTFLoader.js │ │ ├── Orienter.js │ │ ├── Raf.js │ │ ├── Smooth.js │ │ ├── Tween.js │ │ └── Utils.js └── tofu.shaderprimer │ ├── CHANGELOG.md │ ├── LICENSE │ ├── README.md │ ├── build │ ├── index.js │ ├── index.js.map │ ├── index.module.js │ └── index.module.js.map │ ├── package.json │ └── src │ └── index.js ├── package-lock.json ├── package.json └── shaders ├── basic-polygon.glsl ├── basic-polygon2.glsl ├── basic-polygon3.glsl ├── bigwing-bit-coin.glsl ├── bigwing-line-link.glsl ├── bigwing-moon-night.glsl ├── dimian.glsl ├── domainwarp.glsl ├── domainwarp2.glsl ├── fade.glsl ├── gradientnoise.glsl ├── iqcloud.glsl ├── line-stroke.glsl ├── pbr-frag.glsl ├── pbr-vert.glsl ├── proteancloud.glsl ├── raymaching.glsl ├── raymaching2.glsl ├── raymaching3.glsl ├── raymarching-fbm.glsl ├── shadertoy1.js ├── shadertoy2.js ├── sin.glsl ├── svg-fill.glsl ├── svg-stroke.glsl └── warpdomain.glsl /.editorconfig: -------------------------------------------------------------------------------- 1 | # This file is for unifying the coding style for different editors and IDEs. 2 | # More information at http://EditorConfig.org 3 | root = true 4 | 5 | [*] 6 | charset = utf-8 7 | indent_size = 2 8 | end_of_line = lf 9 | indent_style = space 10 | insert_final_newline = true 11 | trim_trailing_whitespace = true 12 | 13 | [*.md] 14 | trim_trailing_whitespace = false 15 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | node_modules/** 2 | -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "globals": { 7 | "RAF": true, 8 | "CAF": true 9 | }, 10 | "rules": { 11 | "no-bitwise": 0 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | my shader palyground 2 | ============= 3 | 4 | Play with my shader program, use glsl in webgl. 5 | 6 | ## Introduction 7 | 8 | Take this opportunity to learn and consolidate glsl, hope i can become a shader painter 😝😝😝. 9 | 10 | ## Examples 11 | 12 | you can visit here [shader-studio]() 13 | 14 | or clone this repository and install dependencies. 15 | 16 | ```sh 17 | npm i 18 | ``` 19 | 20 | after it all, run http-server and go to `./demos` path. 21 | 22 | ```sh 23 | npm run http 24 | ``` 25 | -------------------------------------------------------------------------------- /demos/2D-Gradient-Noise-Derivatives/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/2D-Gradient-Noise-Derivatives/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/2D-Gradient-Noise-Derivatives/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/2D-Gradient-Noise-Derivatives/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/2D-Value-Noise-Derivatives/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/2D-Value-Noise-Derivatives/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/2D-Value-Noise-Derivatives/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/2D-Value-Noise-Derivatives/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/3D-Noise-Analytical-Normals/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/3D-Noise-Analytical-Normals/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/3D-Noise-Analytical-Normals/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/3D-Noise-Analytical-Normals/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/3D-Value-Noise-Derivatives/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/3D-Value-Noise-Derivatives/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/3D-Value-Noise-Derivatives/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/3D-Value-Noise-Derivatives/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Animate-Circle-Swing/README.md: -------------------------------------------------------------------------------- 1 | # jc-circle 2 | 3 | i was fascinated with pixel shader technology, after i read iq master's article, i decision start my pixel shader trip. 4 | 5 | let's getting start with bit snippet base knowledge. 6 | 7 | draw a very simple circle 8 | 9 | 10 | -------------------------------------------------------------------------------- /demos/Animate-Circle-Swing/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Animate-Circle-Swing 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/Animate-Circle-Swing/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/Animate-Circle-Swing/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Animate-Circle-Swing/studio/fragmentShader.glsl: -------------------------------------------------------------------------------- 1 | uniform vec2 iResolution; 2 | uniform float iTime; 3 | uniform float iTimeDelta; 4 | #define cycle 1.5 5 | #define PI 3.1415926 6 | 7 | void main() { 8 | // Normalized pixel coordinates (from 0 to 1) 9 | vec2 p = (2.0 * gl_FragCoord.xy - iResolution.xy) / min(iResolution.y, iResolution.x); 10 | 11 | // background color 12 | vec3 bcol = vec3(0.29412, 0.70196, 0.63921) * (1.0 - 0.3 * length(p)); 13 | 14 | // animate 15 | float tt = mod(iTime, cycle) / cycle; 16 | float ss = 1.0 + 0.5 * sin(tt * PI * 6.0 + p.y * 0.5) * exp(-tt * 4.0); 17 | p *= vec2(0.7, 1.5) + ss * vec2(0.3, -0.5); 18 | 19 | // draw a circle area 20 | float r = length(p); 21 | float d = 0.5; 22 | 23 | // set color 24 | vec3 ccol = vec3(1.0, 1.0, 1.0); 25 | 26 | // merge background color and circle color, with a mix effect when d-r in [-0.1, 0.1] 27 | vec3 col = mix(bcol, ccol, smoothstep(-0.002, 0.002, d-r)); 28 | 29 | // Output to screen 30 | gl_FragColor = vec4(col, 1.0); 31 | } 32 | -------------------------------------------------------------------------------- /demos/Animate-Circle-Swing/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/Animate-Circle-Swing/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Animate-My-Logo/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Animate-My-Logo 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/Animate-My-Logo/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/Animate-My-Logo/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Animate-My-Logo/studio/fragmentShader.glsl: -------------------------------------------------------------------------------- 1 | uniform vec2 iResolution; 2 | uniform float iTime; 3 | uniform float iTimeDelta; 4 | 5 | #define cycle 1.5 6 | #define scale .5 7 | #define bg vec3(0, 0.6627451, 0.6196078) 8 | #define PI 3.1415926 9 | #define PI2 6.2831853 10 | 11 | mat2 rotate(float deg) { 12 | return mat2(cos(deg), sin(deg), -sin(deg), cos(deg)); 13 | } 14 | 15 | float sector(vec2 p, vec2 a, vec2 b, float width, float blur) { 16 | vec2 pa = p - a; 17 | vec2 ba = b - a; 18 | vec2 dir = normalize(ba); 19 | float t = clamp(dot(pa, dir), 0., length(ba)); 20 | float dist = length(pa - dir * t); 21 | return smoothstep(width - blur, width, dist); 22 | } 23 | 24 | void main() { 25 | // Normalized pixel coordinates (from 0 to 1) 26 | vec2 uv = (2.0 * gl_FragCoord.xy - iResolution.xy) / min(iResolution.y, iResolution.x); 27 | uv /= scale; 28 | 29 | // Time varying pixel color 30 | vec3 col = 0.5 + 0.5 * cos(iTime + uv.xyx + vec3(0, 2, 4)); 31 | 32 | // Output to screen 33 | gl_FragColor = vec4(col, 1.0); 34 | } 35 | -------------------------------------------------------------------------------- /demos/Animate-My-Logo/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/Animate-My-Logo/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Animate-Square-Swing/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Animate-Square-Swing 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/Animate-Square-Swing/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/Animate-Square-Swing/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Animate-Square-Swing/studio/fragmentShader.glsl: -------------------------------------------------------------------------------- 1 | uniform vec2 iResolution; 2 | uniform float iTime; 3 | uniform float iTimeDelta; 4 | #define cycle 1.5 5 | #define PI 3.1415926 6 | 7 | void main() { 8 | // Normalized pixel coordinates (from 0 to 1) 9 | vec2 p = (2.0 * gl_FragCoord.xy - iResolution.xy) / min(iResolution.y, iResolution.x); 10 | 11 | // background color 12 | vec3 bcol = vec3(0.29412, 0.70196, 0.63921) * (1.0 - 0.3 * length(p)); 13 | 14 | // animate 15 | float tt = mod(iTime, cycle) / cycle; 16 | float ss = 1.0 + 0.5 * sin(tt * PI * 6.0 + p.y * 0.5) * exp(-tt * 4.0); 17 | p *= vec2(0.7, 1.5) + ss * vec2(0.3, -0.5); 18 | 19 | // draw a square area 20 | vec2 ap = abs(p); 21 | float r = max(ap.x, ap.y); 22 | float d = 0.5; 23 | 24 | // set color 25 | vec3 ccol = vec3(1.0, 1.0, 1.0); 26 | 27 | // merge background color and square color, with a mix effect when d-r in [-0.1, 0.1] 28 | vec3 col = mix(bcol, ccol, smoothstep(-0.002, 0.002, d-r)); 29 | 30 | // Output to screen 31 | gl_FragColor = vec4(col, 1.0); 32 | } 33 | -------------------------------------------------------------------------------- /demos/Animate-Square-Swing/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/Animate-Square-Swing/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/BigWing-Road-Light/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | BigWing-Road-Light 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/BigWing-Road-Light/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/BigWing-Road-Light/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/BigWing-Road-Light/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iMouse: { 12 | value: new Vector2(0, 0) 13 | }, 14 | iTime: { 15 | value: 0.0 16 | }, 17 | iTimeDelta: { 18 | value: 0.0 19 | }, 20 | }, 21 | 22 | vertexShader: vertexShader, 23 | 24 | fragmentShader: fragmentShader 25 | 26 | }; 27 | -------------------------------------------------------------------------------- /demos/BigWing-Road-Light/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Circle-Bubble-Up/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Circle-Bubble-Up 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/Circle-Bubble-Up/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/Circle-Bubble-Up/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Circle-Bubble-Up/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/Circle-Bubble-Up/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Clock-Line-Circle/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Clock-Line-Circle 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/Clock-Line-Circle/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Clock-Line-Circle/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | iHour: { 18 | value: 0.0 19 | }, 20 | iMinute: { 21 | value: 0.0 22 | }, 23 | iSecond: { 24 | value: 0.0 25 | }, 26 | }, 27 | 28 | vertexShader: vertexShader, 29 | 30 | fragmentShader: fragmentShader 31 | 32 | }; 33 | -------------------------------------------------------------------------------- /demos/Clock-Line-Circle/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Draw-Path-Line/images/wechat.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jasonChen1982/shader-studio/47c8cc134944358c92b0e3182c12cd0161870f07/demos/Draw-Path-Line/images/wechat.jpg -------------------------------------------------------------------------------- /demos/Draw-Path-Line/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Draw-Path-Line/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/Draw-Path-Line/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Draw-Simple-Line/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Clock-Line-Circle 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/Draw-Simple-Line/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Draw-Simple-Line/studio/fragmentShader.glsl: -------------------------------------------------------------------------------- 1 | uniform vec2 iResolution; 2 | uniform float iTime; 3 | uniform float iTimeDelta; 4 | 5 | #define bg vec3(0, 0.6627451, 0.6196078) 6 | 7 | float line(vec2 p, vec2 a, vec2 b, float width, float blur) { 8 | vec2 pa = p - a; 9 | vec2 ba = b - a; 10 | vec2 dir = normalize(ba); 11 | float t = clamp(dot(pa, dir), 0., length(ba)); 12 | vec2 pd = pa - dir * t; 13 | float d = dot(pd, pd); 14 | return smoothstep(width - blur, width, sqrt(d)); 15 | } 16 | 17 | void main() { 18 | // 像素坐标系，屏幕中间为(0, 0) 19 | vec2 coord = gl_FragCoord.xy - iResolution.xy / 2.0; 20 | 21 | // 颜色混合 22 | vec3 color = bg; 23 | float d = line(coord, vec2(-50., 0.), vec2(50., -500.), 10., 1.); 24 | color = mix(vec3(1.0), color, d); 25 | 26 | // 输出到屏幕 27 | gl_FragColor = vec4(color, 1.0); 28 | } 29 | -------------------------------------------------------------------------------- /demos/Draw-Simple-Line/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/Draw-Simple-Line/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Glow-Line-Volumetric/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/Glow-Line-Volumetric/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Glow-Line-Volumetric/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/Glow-Line-Volumetric/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Glow-Line-With-Music/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/Glow-Line-With-Music/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Glow-Line-With-Music/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/Glow-Line-With-Music/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Just-Draw-Simple-Line/README.md: -------------------------------------------------------------------------------- 1 | # draw a line 2 | 3 | 4 | -------------------------------------------------------------------------------- /demos/Just-Draw-Simple-Line/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/Just-Draw-Simple-Line/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Just-Draw-Simple-Line/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/Just-Draw-Simple-Line/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Line-Path-Style/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Clock-Line-Circle 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/Line-Path-Style/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Line-Path-Style/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/Line-Path-Style/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/MonteCarlo-Method-Heart/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/MonteCarlo-Method-Heart/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/MonteCarlo-Method-Heart/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/MonteCarlo-Method-Heart/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Perlin-Noise-Fire-Ball/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/Perlin-Noise-Fire-Ball/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Perlin-Noise-Fire-Ball/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/Perlin-Noise-Fire-Ball/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Perlin-Noise-Function/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | xrViewer.renderer.setPixelRatio(window.devicePixelRatio); 10 | 11 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 12 | 13 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 14 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 15 | xrViewer.on('posttimeline', function(info) { 16 | var iTimeDelta = info.snippet / 1000; 17 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 18 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 19 | }); 20 | 21 | primerLayer.add(shaderPrimer); 22 | 23 | xrViewer.start(); 24 | 25 | -------------------------------------------------------------------------------- /demos/Perlin-Noise-Function/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Perlin-Noise-Function/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/Perlin-Noise-Function/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Pseudo-Random-Generate/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | xrViewer.renderer.setPixelRatio(window.devicePixelRatio); 10 | 11 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 12 | 13 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 14 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 15 | xrViewer.on('posttimeline', function(info) { 16 | var iTimeDelta = info.snippet / 1000; 17 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 18 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 19 | }); 20 | 21 | primerLayer.add(shaderPrimer); 22 | 23 | xrViewer.start(); 24 | 25 | -------------------------------------------------------------------------------- /demos/Pseudo-Random-Generate/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Pseudo-Random-Generate/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/Pseudo-Random-Generate/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/RayMarching-FBM-Glowing-Circle/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/RayMarching-FBM-Glowing-Circle/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/RayMarching-FBM-Glowing-Circle/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/RayMarching-FBM-Glowing-Circle/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/RayMarching-Volumetric-FBM/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/RayMarching-Volumetric-FBM/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/RayMarching-Volumetric-FBM/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/RayMarching-Volumetric-FBM/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/Space-Sky-PassEffect/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/Space-Sky-PassEffect/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/Space-Sky-PassEffect/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iSpeed: { 15 | value: 1.0 16 | }, 17 | iTimeDelta: { 18 | value: 0.0 19 | }, 20 | }, 21 | 22 | vertexShader: vertexShader, 23 | 24 | fragmentShader: fragmentShader 25 | 26 | }; 27 | -------------------------------------------------------------------------------- /demos/Space-Sky-PassEffect/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | varying vec2 vUv; 4 | 5 | void main() { 6 | vUv = uv; 7 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 8 | gl_Position = vPosition; 9 | } 10 | -------------------------------------------------------------------------------- /demos/fbm-volumetric-clouds/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/fbm-volumetric-clouds/js/shader.js: -------------------------------------------------------------------------------- 1 | var vertexShader = "#define GLSLIFY 1\nvarying vec4 vPosition;\n\nvoid main() {\n vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n gl_Position = vPosition;\n}\n"; // eslint-disable-line 2 | 3 | var fragmentShader = "#define GLSLIFY 1\nuniform vec2 iResolution;\nuniform float iTime;\nuniform float iTimeDelta;\n\nvoid main() {\n // Normalized pixel coordinates (from 0 to 1)\n vec2 uv = gl_FragCoord.xy / iResolution.xy;\n\n // Time varying pixel color\n vec3 col = 0.5 + 0.5 * cos(iTime + uv.xyx + vec3(0, 2, 4));\n\n // Output to screen\n gl_FragColor = vec4(col, 1.0);\n}\n"; // eslint-disable-line 4 | 5 | var Vector2 = THREE.Vector2; 6 | 7 | var shader = { 8 | 9 | uniforms: { 10 | iResolution: { 11 | value: new Vector2(300, 150) 12 | }, 13 | iTime: { 14 | value: 0.0 15 | }, 16 | iTimeDelta: { 17 | value: 0.0 18 | }, 19 | }, 20 | 21 | vertexShader: vertexShader, 22 | 23 | fragmentShader: fragmentShader 24 | 25 | }; 26 | -------------------------------------------------------------------------------- /demos/fbm-volumetric-clouds/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/fbm-volumetric-clouds/studio/fragmentShader.glsl: -------------------------------------------------------------------------------- 1 | uniform vec2 iResolution; 2 | uniform float iTime; 3 | uniform float iTimeDelta; 4 | 5 | void main() { 6 | // Normalized pixel coordinates (from 0 to 1) 7 | vec2 uv = gl_FragCoord.xy / iResolution.xy; 8 | 9 | // Time varying pixel color 10 | vec3 col = 0.5 + 0.5 * cos(iTime + uv.xyx + vec3(0, 2, 4)); 11 | 12 | // Output to screen 13 | gl_FragColor = vec4(col, 1.0); 14 | } 15 | -------------------------------------------------------------------------------- /demos/fbm-volumetric-clouds/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/fbm-volumetric-clouds/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/iq-compositing/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | iq-compositing 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/iq-compositing/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/iq-compositing/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/iq-compositing/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/iq-compositing/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/iq-eye/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | iq-eye 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/iq-eye/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/iq-eye/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/iq-eye/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/iq-eye/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/iq-heart/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jasonChen1982/shader-studio/47c8cc134944358c92b0e3182c12cd0161870f07/demos/iq-heart/README.md -------------------------------------------------------------------------------- /demos/iq-heart/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | iq-heart 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/iq-heart/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/iq-heart/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/iq-heart/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/iq-heart/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/iq-palette/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | iq-palette 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/iq-palette/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/iq-palette/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/iq-palette/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/iq-palette/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/noise-sphere-moon/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | noise-sphere-moon 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/noise-sphere-moon/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/noise-sphere-moon/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/noise-sphere-moon/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/noise-sphere-moon/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/noise-value-2d/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | noise-value-2d 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/noise-value-2d/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | precision: 'highp', 9 | alpha: false, 10 | premultipliedAlpha: false, 11 | preserveDrawingBuffer: false 12 | }); 13 | 14 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 15 | 16 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 17 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 18 | xrViewer.on('posttimeline', function(info) { 19 | var iTimeDelta = info.snippet / 1000; 20 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 21 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 22 | }); 23 | 24 | primerLayer.add(shaderPrimer); 25 | 26 | xrViewer.start(); 27 | 28 | -------------------------------------------------------------------------------- /demos/noise-value-2d/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/noise-value-2d/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/noise-value-2d/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/polygon-ray-tracing/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/polygon-ray-tracing/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/polygon-ray-tracing/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/polygon-ray-tracing/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /demos/simple-value/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | simple-value 8 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/simple-value/js/index.js: -------------------------------------------------------------------------------- 1 | var width = window.innerWidth; 2 | var height = window.innerHeight; 3 | 4 | var xrViewer = new Tofu.Viewer({ 5 | canvas: '#shader-studio', 6 | width: width, 7 | height: height, 8 | }); 9 | 10 | var primerLayer = xrViewer.createLayer(Tofu.PrimerLayer); 11 | 12 | var shaderPrimer = new Tofu.ShaderPrimer(shader); 13 | shaderPrimer.material.uniforms.iResolution.value = new THREE.Vector2(width, height); 14 | xrViewer.on('posttimeline', function(info) { 15 | var iTimeDelta = info.snippet / 1000; 16 | shaderPrimer.material.uniforms.iTime.value += iTimeDelta; 17 | shaderPrimer.material.uniforms.iTimeDelta.value = iTimeDelta; 18 | }); 19 | 20 | primerLayer.add(shaderPrimer); 21 | 22 | xrViewer.start(); 23 | 24 | -------------------------------------------------------------------------------- /demos/simple-value/studio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true 5 | }, 6 | "rules": { 7 | "no-bitwise": 0 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 6, 11 | "sourceType": "module" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /demos/simple-value/studio/fragmentShader.glsl: -------------------------------------------------------------------------------- 1 | uniform vec2 iResolution; 2 | uniform float iTime; 3 | uniform float iTimeDelta; 4 | 5 | #define PI 3.1415926 6 | #define PI2 6.2831853 7 | 8 | mat2 rotate(float deg) { 9 | return mat2(cos(deg), sin(deg), -sin(deg), cos(deg)); 10 | } 11 | 12 | void main() { 13 | // Normalized pixel coordinates (from 0 to 1) 14 | vec2 uv = gl_FragCoord.xy / iResolution.xy; 15 | 16 | uv = rotate( iTime/40.0*PI2 ) * uv; 17 | 18 | // Time varying pixel color 19 | vec3 col = 0.5 + 0.5 * cos(iTime + uv.xyx + vec3(0, 2, 4)); 20 | 21 | // Output to screen 22 | gl_FragColor = vec4(col, 1.0); 23 | } 24 | -------------------------------------------------------------------------------- /demos/simple-value/studio/shader.js: -------------------------------------------------------------------------------- 1 | import vertexShader from './vertexShader.glsl'; 2 | import fragmentShader from './fragmentShader.glsl'; 3 | var Vector2 = THREE.Vector2; 4 | 5 | var shader = { 6 | 7 | uniforms: { 8 | iResolution: { 9 | value: new Vector2(300, 150) 10 | }, 11 | iTime: { 12 | value: 0.0 13 | }, 14 | iTimeDelta: { 15 | value: 0.0 16 | }, 17 | }, 18 | 19 | vertexShader: vertexShader, 20 | 21 | fragmentShader: fragmentShader 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /demos/simple-value/studio/vertexShader.glsl: -------------------------------------------------------------------------------- 1 | 2 | varying vec4 vPosition; 3 | 4 | void main() { 5 | vPosition = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 6 | gl_Position = vPosition; 7 | } 8 | -------------------------------------------------------------------------------- /doc/TASKLINE.md: -------------------------------------------------------------------------------- 1 | # Spring Festival Schedule 2 | 3 | maybe this schedule is impossible to finish on time. 4 | 5 | - [ ] glow shader @02-14 6 | - [ ] music visualization component @02-15 7 | - [ ] siri wave @02-16 8 | - [ ] tofu.js main page @02-18 9 | - [ ] tofu.js main page @02-19 10 | - [ ] tofu.js pass gui component @02-20 11 | - [ ] shadertoy to find demo @02-21 12 | - [ ] zhihu draw light with c++ @02-22 13 | - [ ] learning c++ and develop a app @02-22 14 | 15 | # 函数图形 16 | - 心形图形 17 | - Montecarlo method 18 | - raymarching 19 | - fbm 20 | 21 | # 噪声与分形布朗运动 22 | - 噪声的前世今生 23 | - 噪声的种类 24 | - 噪声的运用 25 | - 分形布朗运动 26 | - 运用 27 | 28 | # ray tracing 29 | - camera lookat 30 | - cast-ray 31 | - 示例 32 | -------------------------------------------------------------------------------- /doc/WORDS.md: -------------------------------------------------------------------------------- 1 | - bilinear interpolation ： 双线性差值 2 | - lattice：格子 3 | - variations： 差异、差距 4 | - density：密度、浓度 5 | - compact：紧凑、小巧轻量 6 | - pseudo-random：伪随机 7 | - deterministic：确定的 8 | - intuitively：直观的 9 | - seamless：无缝的 10 | -------------------------------------------------------------------------------- /lib/dat.gui/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["env", { 4 | "modules": false 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lib/dat.gui/bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "dat.gui", 3 | "version": "0.6.5", 4 | "homepage": "https://github.com/dataarts/dat.gui.git", 5 | "authors": [ 6 | "Google Data Arts Team " 7 | ], 8 | "description": "dat.gui is a lightweight controller library for JavaScript.", 9 | "main": "build/dat.gui.js", 10 | "keywords": [ 11 | "controller", 12 | "javascript", 13 | "gui", 14 | "slider" 15 | ], 16 | "license": "Apache License, Version 2.0", 17 | "ignore": [ 18 | "**/.*", 19 | "node_modules", 20 | "bower_components", 21 | "app/bower_components", 22 | "test", 23 | "tests" 24 | ] 25 | } 26 | -------------------------------------------------------------------------------- /lib/dat.gui/licenseBanner.txt: -------------------------------------------------------------------------------- 1 | /** 2 | * dat-gui JavaScript Controller Library 3 | * http://code.google.com/p/dat-gui 4 | * 5 | * Copyright 2011 Data Arts Team, Google Creative Lab 6 | * 7 | * Licensed under the Apache License, Version 2.0 (the "License"); 8 | * you may not use this file except in compliance with the License. 9 | * You may obtain a copy of the License at 10 | * 11 | * http://www.apache.org/licenses/LICENSE-2.0 12 | */ 13 | -------------------------------------------------------------------------------- /lib/dat.gui/src/dat/gui/saveDialogue.html.js: -------------------------------------------------------------------------------- 1 | const saveDialogContents = `
2 | 3 | Here's the new load parameter for your GUI's constructor: 4 | 5 | 6 | 7 |
8 | 9 | Automatically save 10 | values to localStorage on exit. 11 | 12 |
The values saved to localStorage will 13 | override those passed to dat.GUI's constructor. This makes it 14 | easier to work incrementally, but localStorage is fragile, 15 | and your friends may not see the same values you do. 16 | 17 |
18 | 19 |
20 | 21 |
`; 22 | 23 | export default saveDialogContents; 24 | -------------------------------------------------------------------------------- /lib/dat.gui/src/dat/utils/requestAnimationFrame.js: -------------------------------------------------------------------------------- 1 | /** 2 | * dat-gui JavaScript Controller Library 3 | * http://code.google.com/p/dat-gui 4 | * 5 | * Copyright 2011 Data Arts Team, Google Creative Lab 6 | * 7 | * Licensed under the Apache License, Version 2.0 (the "License"); 8 | * you may not use this file except in compliance with the License. 9 | * You may obtain a copy of the License at 10 | * 11 | * http://www.apache.org/licenses/LICENSE-2.0 12 | */ 13 | 14 | function requestAnimationFrame(callback) { 15 | setTimeout(callback, 1000 / 60); 16 | } 17 | 18 | export default window.requestAnimationFrame || 19 | window.webkitRequestAnimationFrame || 20 | window.mozRequestAnimationFrame || 21 | window.oRequestAnimationFrame || 22 | window.msRequestAnimationFrame || 23 | requestAnimationFrame; 24 | -------------------------------------------------------------------------------- /lib/dat.gui/tmp/common.js: -------------------------------------------------------------------------------- 1 | const dat = require('dat.gui'); 2 | 3 | const gui = new dat.GUI(); 4 | gui.add({message: 'hello world'}, 'message'); 5 | -------------------------------------------------------------------------------- /lib/dat.gui/tmp/es6.js: -------------------------------------------------------------------------------- 1 | import dat from 'dat.gui'; 2 | 3 | const gui = new dat.GUI(); 4 | gui.add({message: 'hello world'}, 'message'); 5 | -------------------------------------------------------------------------------- /lib/dat.gui/tmp/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /lib/dat.gui/tmp/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "tmp", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "bundle.js", 6 | "dependencies": { 7 | "dat.gui": "^0.7.0-0" 8 | }, 9 | "devDependencies": { 10 | "rollup-plugin-node-resolve": "^3.0.0" 11 | }, 12 | "scripts": { 13 | "test": "echo \"Error: no test specified\" && exit 1" 14 | }, 15 | "author": "Don McCurdy (https://www.donmccurdy.com)", 16 | "license": "MIT" 17 | } 18 | -------------------------------------------------------------------------------- /lib/dat.gui/tmp/rollup.config.js: -------------------------------------------------------------------------------- 1 | import resolve from 'rollup-plugin-node-resolve'; 2 | 3 | export default { 4 | input: 'es6.js', 5 | output: { 6 | file: 'bundle.js', 7 | format: 'iife', 8 | name: 'myApp' 9 | }, 10 | plugins: [ 11 | resolve({module: true}), 12 | ] 13 | }; 14 | -------------------------------------------------------------------------------- /lib/dat.gui/tmp/webpack.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | entry: './es6.js', 3 | output: { 4 | filename: 'bundle.js' 5 | } 6 | }; 7 | -------------------------------------------------------------------------------- /lib/three/bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "three.js", 3 | "homepage": "http://threejs.org/", 4 | "description": "JavaScript 3D library", 5 | "main": "build/three.js", 6 | "keywords": [ 7 | "three", 8 | "threejs", 9 | "three.js", 10 | "3D", 11 | "webgl" 12 | ], 13 | "license": "MIT", 14 | "ignore": [ 15 | "**/.*", 16 | "*.md", 17 | "/docs", 18 | "/editor", 19 | "/examples/*", 20 | "!/examples/js", 21 | "/src", 22 | "/test", 23 | "/utils", 24 | "/LICENSE" 25 | ] 26 | } 27 | -------------------------------------------------------------------------------- /lib/three/examples/fonts/LICENSE: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jasonChen1982/shader-studio/47c8cc134944358c92b0e3182c12cd0161870f07/lib/three/examples/fonts/LICENSE -------------------------------------------------------------------------------- /lib/three/examples/fonts/README: -------------------------------------------------------------------------------- 1 | Use Facetype.js to generate typeface.json fonts. 2 | http://gero3.github.io/facetype.js/ 3 | -------------------------------------------------------------------------------- /lib/three/examples/fonts/droid/README.txt: -------------------------------------------------------------------------------- 1 | Copyright (C) 2008 The Android Open Source Project 2 | 3 | Licensed under the Apache License, Version 2.0 (the "License"); 4 | you may not use this file except in compliance with the License. 5 | You may obtain a copy of the License at 6 | 7 | http://www.apache.org/licenses/LICENSE-2.0 8 | 9 | Unless required by applicable law or agreed to in writing, software 10 | distributed under the License is distributed on an "AS IS" BASIS, 11 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 | See the License for the specific language governing permissions and 13 | limitations under the License. 14 | 15 | ########## 16 | 17 | This directory contains the fonts for the platform. They are licensed 18 | under the Apache 2 license. 19 | -------------------------------------------------------------------------------- /lib/three/examples/fonts/ttf/kenpixel.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jasonChen1982/shader-studio/47c8cc134944358c92b0e3182c12cd0161870f07/lib/three/examples/fonts/ttf/kenpixel.ttf -------------------------------------------------------------------------------- /lib/three/examples/js/PRNG.js: -------------------------------------------------------------------------------- 1 | // Park-Miller-Carta Pseudo-Random Number Generator 2 | // https://github.com/pnitsch/BitmapData.js/blob/master/js/BitmapData.js 3 | 4 | var PRNG = function () { 5 | 6 | this.seed = 1; 7 | this.next = function() { 8 | 9 | return ( this.gen() / 2147483647 ); 10 | 11 | }; 12 | this.nextRange = function( min, max ) { 13 | 14 | return min + ( ( max - min ) * this.next() ) 15 | 16 | }; 17 | this.gen = function() { 18 | 19 | return this.seed = ( this.seed * 16807 ) % 2147483647; 20 | 21 | }; 22 | 23 | }; 24 | -------------------------------------------------------------------------------- /lib/three/examples/js/loaders/SVGLoader.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author mrdoob / http://mrdoob.com/ 3 | * @author zz85 / http://joshuakoo.com/ 4 | */ 5 | 6 | THREE.SVGLoader = function ( manager ) { 7 | 8 | this.manager = ( manager !== undefined ) ? manager : THREE.DefaultLoadingManager; 9 | 10 | }; 11 | 12 | THREE.SVGLoader.prototype = { 13 | 14 | constructor: THREE.SVGLoader, 15 | 16 | load: function ( url, onLoad, onProgress, onError ) { 17 | 18 | var scope = this; 19 | 20 | var parser = new DOMParser(); 21 | 22 | var loader = new THREE.FileLoader( scope.manager ); 23 | loader.load( url, function ( svgString ) { 24 | 25 | var doc = parser.parseFromString( svgString, 'image/svg+xml' ); // application/xml 26 | 27 | onLoad( doc.documentElement ); 28 | 29 | }, onProgress, onError ); 30 | 31 | } 32 | 33 | }; 34 | -------------------------------------------------------------------------------- /lib/three/examples/js/loaders/ctm/CTMWorker.js: -------------------------------------------------------------------------------- 1 | importScripts( "lzma.js", "ctm.js" ); 2 | 3 | self.onmessage = function ( event ) { 4 | 5 | var files = []; 6 | 7 | for ( var i = 0; i < event.data.offsets.length; i ++ ) { 8 | 9 | var stream = new CTM.Stream( event.data.data ); 10 | stream.offset = event.data.offsets[ i ]; 11 | 12 | files[ i ] = new CTM.File( stream, [ event.data.data.buffer ] ); 13 | 14 | } 15 | 16 | self.postMessage( files ); 17 | self.close(); 18 | 19 | }; 20 | -------------------------------------------------------------------------------- /lib/three/examples/js/loaders/ctm/license/OpenCTM.txt: -------------------------------------------------------------------------------- 1 | Copyright (c) 2009-2010 Marcus Geelnard 2 | 3 | This software is provided 'as-is', without any express or implied 4 | warranty. In no event will the authors be held liable for any damages 5 | arising from the use of this software. 6 | 7 | Permission is granted to anyone to use this software for any purpose, 8 | including commercial applications, and to alter it and redistribute it 9 | freely, subject to the following restrictions: 10 | 11 | 1. The origin of this software must not be misrepresented; you must not 12 | claim that you wrote the original software. If you use this software 13 | in a product, an acknowledgment in the product documentation would be 14 | appreciated but is not required. 15 | 16 | 2. Altered source versions must be plainly marked as such, and must not 17 | be misrepresented as being the original software. 18 | 19 | 3. This notice may not be removed or altered from any source 20 | distribution. 21 | -------------------------------------------------------------------------------- /lib/three/examples/js/loaders/draco/draco_decoder.wasm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jasonChen1982/shader-studio/47c8cc134944358c92b0e3182c12cd0161870f07/lib/three/examples/js/loaders/draco/draco_decoder.wasm -------------------------------------------------------------------------------- /lib/three/examples/js/modifiers/ExplodeModifier.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Make all faces use unique vertices 3 | * so that each face can be separated from others 4 | * 5 | * @author alteredq / http://alteredqualia.com/ 6 | */ 7 | 8 | THREE.ExplodeModifier = function () { 9 | 10 | }; 11 | 12 | THREE.ExplodeModifier.prototype.modify = function ( geometry ) { 13 | 14 | var vertices = []; 15 | 16 | for ( var i = 0, il = geometry.faces.length; i < il; i ++ ) { 17 | 18 | var n = vertices.length; 19 | 20 | var face = geometry.faces[ i ]; 21 | 22 | var a = face.a; 23 | var b = face.b; 24 | var c = face.c; 25 | 26 | var va = geometry.vertices[ a ]; 27 | var vb = geometry.vertices[ b ]; 28 | var vc = geometry.vertices[ c ]; 29 | 30 | vertices.push( va.clone() ); 31 | vertices.push( vb.clone() ); 32 | vertices.push( vc.clone() ); 33 | 34 | face.a = n; 35 | face.b = n + 1; 36 | face.c = n + 2; 37 | 38 | } 39 | 40 | geometry.vertices = vertices; 41 | 42 | }; 43 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/RawNode.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.RawNode = function( value ) { 6 | 7 | THREE.GLNode.call( this, 'v4' ); 8 | 9 | this.value = value; 10 | 11 | }; 12 | 13 | THREE.RawNode.prototype = Object.create( THREE.GLNode.prototype ); 14 | THREE.RawNode.prototype.constructor = THREE.RawNode; 15 | 16 | THREE.GLNode.prototype.generate = function( builder ) { 17 | 18 | var material = builder.material; 19 | 20 | var data = this.value.parseAndBuildCode( builder, this.type ); 21 | 22 | var code = data.code + '\n'; 23 | 24 | if ( builder.shader == 'vertex' ) { 25 | 26 | code += 'gl_Position = ' + data.result + ';'; 27 | 28 | } else { 29 | 30 | code += 'gl_FragColor = ' + data.result + ';'; 31 | 32 | } 33 | 34 | return code; 35 | 36 | }; 37 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/VarNode.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.VarNode = function( type ) { 6 | 7 | THREE.GLNode.call( this, type ); 8 | 9 | }; 10 | 11 | THREE.VarNode.prototype = Object.create( THREE.GLNode.prototype ); 12 | THREE.VarNode.prototype.constructor = THREE.VarNode; 13 | 14 | THREE.VarNode.prototype.getType = function( builder ) { 15 | 16 | return builder.getTypeByFormat( this.type ); 17 | 18 | }; 19 | 20 | THREE.VarNode.prototype.generate = function( builder, output ) { 21 | 22 | var varying = builder.material.getVar( this.uuid, this.type ); 23 | 24 | return builder.format( varying.name, this.getType( builder ), output ); 25 | 26 | }; 27 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/accessors/ColorsNode.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.ColorsNode = function( index ) { 6 | 7 | THREE.TempNode.call( this, 'v4', { shared: false } ); 8 | 9 | this.index = index || 0; 10 | 11 | }; 12 | 13 | THREE.ColorsNode.vertexDict = [ 'color', 'color2' ]; 14 | THREE.ColorsNode.fragmentDict = [ 'vColor', 'vColor2' ]; 15 | 16 | THREE.ColorsNode.prototype = Object.create( THREE.TempNode.prototype ); 17 | THREE.ColorsNode.prototype.constructor = THREE.ColorsNode; 18 | 19 | THREE.ColorsNode.prototype.generate = function( builder, output ) { 20 | 21 | var material = builder.material; 22 | var result; 23 | 24 | material.requestAttribs.color[ this.index ] = true; 25 | 26 | if ( builder.isShader( 'vertex' ) ) result = THREE.ColorsNode.vertexDict[ this.index ]; 27 | else result = THREE.ColorsNode.fragmentDict[ this.index ]; 28 | 29 | return builder.format( result, this.getType( builder ), output ); 30 | 31 | }; 32 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/accessors/LightNode.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.LightNode = function() { 6 | 7 | THREE.TempNode.call( this, 'v3', { shared: false } ); 8 | 9 | }; 10 | 11 | THREE.LightNode.prototype = Object.create( THREE.TempNode.prototype ); 12 | THREE.LightNode.prototype.constructor = THREE.LightNode; 13 | 14 | THREE.LightNode.prototype.generate = function( builder, output ) { 15 | 16 | if ( builder.isCache( 'light' ) ) { 17 | 18 | return builder.format( 'reflectedLight.directDiffuse', this.getType( builder ), output ) 19 | 20 | } else { 21 | 22 | console.warn( "THREE.LightNode is only compatible in \"light\" channel." ); 23 | 24 | return builder.format( 'vec3( 0.0 )', this.getType( builder ), output ); 25 | 26 | } 27 | 28 | }; 29 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/accessors/ScreenUVNode.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.ScreenUVNode = function( resolution ) { 6 | 7 | THREE.TempNode.call( this, 'v2' ); 8 | 9 | this.resolution = resolution; 10 | 11 | }; 12 | 13 | THREE.ScreenUVNode.prototype = Object.create( THREE.TempNode.prototype ); 14 | THREE.ScreenUVNode.prototype.constructor = THREE.ScreenUVNode; 15 | 16 | THREE.ScreenUVNode.prototype.generate = function( builder, output ) { 17 | 18 | var material = builder.material; 19 | var result; 20 | 21 | if ( builder.isShader( 'fragment' ) ) { 22 | 23 | result = '(gl_FragCoord.xy/' + this.resolution.build( builder, 'v2' ) + ')'; 24 | 25 | } else { 26 | 27 | console.warn( "THREE.ScreenUVNode is not compatible with " + builder.shader + " shader." ); 28 | 29 | result = 'vec2( 0.0 )'; 30 | 31 | } 32 | 33 | return builder.format( result, this.getType( builder ), output ); 34 | 35 | }; 36 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/accessors/UVNode.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.UVNode = function( index ) { 6 | 7 | THREE.TempNode.call( this, 'v2', { shared: false } ); 8 | 9 | this.index = index || 0; 10 | 11 | }; 12 | 13 | THREE.UVNode.vertexDict = [ 'uv', 'uv2' ]; 14 | THREE.UVNode.fragmentDict = [ 'vUv', 'vUv2' ]; 15 | 16 | THREE.UVNode.prototype = Object.create( THREE.TempNode.prototype ); 17 | THREE.UVNode.prototype.constructor = THREE.UVNode; 18 | 19 | THREE.UVNode.prototype.generate = function( builder, output ) { 20 | 21 | var material = builder.material; 22 | var result; 23 | 24 | material.requestAttribs.uv[ this.index ] = true; 25 | 26 | if ( builder.isShader( 'vertex' ) ) result = THREE.UVNode.vertexDict[ this.index ]; 27 | else result = THREE.UVNode.fragmentDict[ this.index ]; 28 | 29 | return builder.format( result, this.getType( builder ), output ); 30 | 31 | }; 32 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/inputs/ColorNode.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.ColorNode = function( color ) { 6 | 7 | THREE.InputNode.call( this, 'c' ); 8 | 9 | this.value = new THREE.Color( color || 0 ); 10 | 11 | }; 12 | 13 | THREE.ColorNode.prototype = Object.create( THREE.InputNode.prototype ); 14 | THREE.ColorNode.prototype.constructor = THREE.ColorNode; 15 | 16 | THREE.NodeMaterial.addShortcuts( THREE.ColorNode.prototype, 'value', [ 'r', 'g', 'b' ] ); 17 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/inputs/FloatNode.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.FloatNode = function( value ) { 6 | 7 | THREE.InputNode.call( this, 'fv1' ); 8 | 9 | this.value = [ value || 0 ]; 10 | 11 | }; 12 | 13 | THREE.FloatNode.prototype = Object.create( THREE.InputNode.prototype ); 14 | THREE.FloatNode.prototype.constructor = THREE.FloatNode; 15 | 16 | Object.defineProperties( THREE.FloatNode.prototype, { 17 | number: { 18 | get: function() { 19 | 20 | return this.value[ 0 ]; 21 | 22 | }, 23 | set: function( val ) { 24 | 25 | this.value[ 0 ] = val; 26 | 27 | } 28 | } 29 | } ); 30 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/inputs/IntNode.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.IntNode = function( value ) { 6 | 7 | THREE.InputNode.call( this, 'iv1' ); 8 | 9 | this.value = [ Math.floor( value || 0 ) ]; 10 | 11 | }; 12 | 13 | THREE.IntNode.prototype = Object.create( THREE.InputNode.prototype ); 14 | THREE.IntNode.prototype.constructor = THREE.IntNode; 15 | 16 | Object.defineProperties( THREE.IntNode.prototype, { 17 | number: { 18 | get: function() { 19 | 20 | return this.value[ 0 ]; 21 | 22 | }, 23 | set: function( val ) { 24 | 25 | this.value[ 0 ] = Math.floor( val ); 26 | 27 | } 28 | } 29 | } ); 30 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/inputs/Matrix4Node.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.Matrix4Node = function( matrix ) { 6 | 7 | THREE.InputNode.call( this, 'm4' ); 8 | 9 | this.value = matrix || new THREE.Matrix4(); 10 | 11 | }; 12 | 13 | THREE.Matrix4Node.prototype = Object.create( THREE.InputNode.prototype ); 14 | THREE.Matrix4Node.prototype.constructor = THREE.Matrix4Node; 15 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/inputs/ScreenNode.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.ScreenNode = function( coord ) { 6 | 7 | THREE.TextureNode.call( this, undefined, coord ); 8 | 9 | }; 10 | 11 | THREE.ScreenNode.prototype = Object.create( THREE.TextureNode.prototype ); 12 | THREE.ScreenNode.prototype.constructor = THREE.ScreenNode; 13 | 14 | THREE.ScreenNode.prototype.isUnique = function() { 15 | 16 | return true; 17 | 18 | }; 19 | 20 | THREE.ScreenNode.prototype.getTexture = function( builder, output ) { 21 | 22 | return THREE.InputNode.prototype.generate.call( this, builder, output, this.getUuid(), 't', 'renderTexture' ); 23 | 24 | }; 25 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/inputs/Vector2Node.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.Vector2Node = function( x, y ) { 6 | 7 | THREE.InputNode.call( this, 'v2' ); 8 | 9 | this.value = new THREE.Vector2( x, y ); 10 | 11 | }; 12 | 13 | THREE.Vector2Node.prototype = Object.create( THREE.InputNode.prototype ); 14 | THREE.Vector2Node.prototype.constructor = THREE.Vector2Node; 15 | 16 | THREE.NodeMaterial.addShortcuts( THREE.Vector2Node.prototype, 'value', [ 'x', 'y' ] ); 17 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/inputs/Vector3Node.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.Vector3Node = function( x, y, z ) { 6 | 7 | THREE.InputNode.call( this, 'v3' ); 8 | 9 | this.type = 'v3'; 10 | this.value = new THREE.Vector3( x, y, z ); 11 | 12 | }; 13 | 14 | THREE.Vector3Node.prototype = Object.create( THREE.InputNode.prototype ); 15 | THREE.Vector3Node.prototype.constructor = THREE.Vector3Node; 16 | 17 | THREE.NodeMaterial.addShortcuts( THREE.Vector3Node.prototype, 'value', [ 'x', 'y', 'z' ] ); 18 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/inputs/Vector4Node.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.Vector4Node = function( x, y, z, w ) { 6 | 7 | THREE.InputNode.call( this, 'v4' ); 8 | 9 | this.value = new THREE.Vector4( x, y, z, w ); 10 | 11 | }; 12 | 13 | THREE.Vector4Node.prototype = Object.create( THREE.InputNode.prototype ); 14 | THREE.Vector4Node.prototype.constructor = THREE.Vector4Node; 15 | 16 | THREE.NodeMaterial.addShortcuts( THREE.Vector4Node.prototype, 'value', [ 'x', 'y', 'z', 'w' ] ); 17 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/materials/PhongNodeMaterial.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.PhongNodeMaterial = function() { 6 | 7 | this.node = new THREE.PhongNode(); 8 | 9 | THREE.NodeMaterial.call( this, this.node, this.node ); 10 | 11 | }; 12 | 13 | THREE.PhongNodeMaterial.prototype = Object.create( THREE.NodeMaterial.prototype ); 14 | THREE.PhongNodeMaterial.prototype.constructor = THREE.PhongNodeMaterial; 15 | 16 | THREE.NodeMaterial.addShortcuts( THREE.PhongNodeMaterial.prototype, 'node', 17 | [ 'color', 'alpha', 'specular', 'shininess', 'normal', 'normalScale', 'emissive', 'ambient', 'light', 'shadow', 'ao', 'environment', 'environmentAlpha', 'transform' ] ); 18 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/materials/SpriteNodeMaterial.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.SpriteNodeMaterial = function () { 6 | 7 | this.node = new THREE.SpriteNode(); 8 | 9 | THREE.NodeMaterial.call( this, this.node, this.node ); 10 | 11 | }; 12 | 13 | THREE.SpriteNodeMaterial.prototype = Object.create( THREE.NodeMaterial.prototype ); 14 | THREE.SpriteNodeMaterial.prototype.constructor = THREE.SpriteNodeMaterial; 15 | 16 | THREE.NodeMaterial.addShortcuts( THREE.SpriteNodeMaterial.prototype, 'node', 17 | [ 'color', 'alpha', 'transform', 'spherical' ] ); 18 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/materials/StandardNodeMaterial.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.StandardNodeMaterial = function() { 6 | 7 | this.node = new THREE.StandardNode(); 8 | 9 | THREE.NodeMaterial.call( this, this.node, this.node ); 10 | 11 | }; 12 | 13 | THREE.StandardNodeMaterial.prototype = Object.create( THREE.NodeMaterial.prototype ); 14 | THREE.StandardNodeMaterial.prototype.constructor = THREE.StandardNodeMaterial; 15 | 16 | THREE.NodeMaterial.addShortcuts( THREE.StandardNodeMaterial.prototype, 'node', 17 | [ 'color', 'alpha', 'roughness', 'metalness', 'reflectivity', 'clearCoat', 'clearCoatRoughness', 'normal', 'normalScale', 'emissive', 'ambient', 'light', 'shadow', 'ao', 'environment', 'transform' ] ); 18 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/postprocessing/NodePass.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.NodePass = function() { 6 | 7 | THREE.ShaderPass.call( this ); 8 | 9 | this.textureID = 'renderTexture'; 10 | 11 | this.fragment = new THREE.RawNode( new THREE.ScreenNode() ); 12 | 13 | this.node = new THREE.NodeMaterial(); 14 | this.node.fragment = this.fragment; 15 | 16 | this.build(); 17 | 18 | }; 19 | 20 | THREE.NodePass.prototype = Object.create( THREE.ShaderPass.prototype ); 21 | THREE.NodePass.prototype.constructor = THREE.NodePass; 22 | 23 | THREE.NodeMaterial.addShortcuts( THREE.NodePass.prototype, 'fragment', [ 'value' ] ); 24 | 25 | THREE.NodePass.prototype.build = function() { 26 | 27 | this.node.build(); 28 | 29 | this.uniforms = this.node.uniforms; 30 | this.material = this.node; 31 | 32 | }; 33 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/utils/LuminanceNode.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.LuminanceNode = function( rgb ) { 6 | 7 | THREE.TempNode.call( this, 'fv1' ); 8 | 9 | this.rgb = rgb; 10 | 11 | }; 12 | 13 | THREE.LuminanceNode.prototype = Object.create( THREE.TempNode.prototype ); 14 | THREE.LuminanceNode.prototype.constructor = THREE.LuminanceNode; 15 | 16 | THREE.LuminanceNode.prototype.generate = function( builder, output ) { 17 | 18 | builder.include( 'luminance_rgb' ); 19 | 20 | return builder.format( 'luminance_rgb(' + this.rgb.build( builder, 'v3' ) + ')', this.getType( builder ), output ); 21 | 22 | }; 23 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/utils/NoiseNode.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.NoiseNode = function( coord ) { 6 | 7 | THREE.TempNode.call( this, 'fv1' ); 8 | 9 | this.coord = coord; 10 | 11 | }; 12 | 13 | THREE.NoiseNode.prototype = Object.create( THREE.TempNode.prototype ); 14 | THREE.NoiseNode.prototype.constructor = THREE.NoiseNode; 15 | 16 | THREE.NoiseNode.prototype.generate = function( builder, output ) { 17 | 18 | builder.include( 'snoise' ); 19 | 20 | return builder.format( 'snoise(' + this.coord.build( builder, 'v2' ) + ')', this.getType( builder ), output ); 21 | 22 | }; 23 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/utils/ResolutionNode.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.ResolutionNode = function( renderer ) { 6 | 7 | THREE.Vector2Node.call( this ); 8 | 9 | this.requestUpdate = true; 10 | 11 | this.renderer = renderer; 12 | 13 | }; 14 | 15 | THREE.ResolutionNode.prototype = Object.create( THREE.Vector2Node.prototype ); 16 | THREE.ResolutionNode.prototype.constructor = THREE.ResolutionNode; 17 | 18 | THREE.ResolutionNode.prototype.updateFrame = function( delta ) { 19 | 20 | var size = this.renderer.getSize(), 21 | pixelRatio = this.renderer.getPixelRatio(); 22 | 23 | this.x = size.width * pixelRatio; 24 | this.y = size.height * pixelRatio; 25 | 26 | }; 27 | -------------------------------------------------------------------------------- /lib/three/examples/js/nodes/utils/TimerNode.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author sunag / http://www.sunag.com.br/ 3 | */ 4 | 5 | THREE.TimerNode = function( value, scale ) { 6 | 7 | THREE.FloatNode.call( this, value ); 8 | 9 | this.requestUpdate = true; 10 | 11 | this.scale = scale !== undefined ? scale : 1; 12 | 13 | }; 14 | 15 | THREE.TimerNode.prototype = Object.create( THREE.FloatNode.prototype ); 16 | THREE.TimerNode.prototype.constructor = THREE.TimerNode; 17 | 18 | THREE.TimerNode.prototype.updateFrame = function( delta ) { 19 | 20 | this.number += delta * this.scale; 21 | 22 | }; 23 | -------------------------------------------------------------------------------- /lib/three/examples/js/objects/ReflectorRTT.js: -------------------------------------------------------------------------------- 1 | THREE.ReflectorRTT = function ( geometry, options ) { 2 | 3 | THREE.Reflector.call( this, geometry, options ); 4 | 5 | this.geometry.setDrawRange( 0, 0 ); // avoid rendering geometry 6 | 7 | }; 8 | 9 | THREE.ReflectorRTT.prototype = Object.create( THREE.Reflector.prototype ); 10 | -------------------------------------------------------------------------------- /lib/three/examples/js/shaders/BasicShader.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author mrdoob / http://www.mrdoob.com 3 | * 4 | * Simple test shader 5 | */ 6 | 7 | THREE.BasicShader = { 8 | 9 | uniforms: {}, 10 | 11 | vertexShader: [ 12 | 13 | "void main() {", 14 | 15 | "gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );", 16 | 17 | "}" 18 | 19 | ].join( "\n" ), 20 | 21 | fragmentShader: [ 22 | 23 | "void main() {", 24 | 25 | "gl_FragColor = vec4( 1.0, 0.0, 0.0, 0.5 );", 26 | 27 | "}" 28 | 29 | ].join( "\n" ) 30 | 31 | }; 32 | -------------------------------------------------------------------------------- /lib/three/examples/js/shaders/BlendShader.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author alteredq / http://alteredqualia.com/ 3 | * 4 | * Blend two textures 5 | */ 6 | 7 | THREE.BlendShader = { 8 | 9 | uniforms: { 10 | 11 | "tDiffuse1": { value: null }, 12 | "tDiffuse2": { value: null }, 13 | "mixRatio": { value: 0.5 }, 14 | "opacity": { value: 1.0 } 15 | 16 | }, 17 | 18 | vertexShader: [ 19 | 20 | "varying vec2 vUv;", 21 | 22 | "void main() {", 23 | 24 | "vUv = uv;", 25 | "gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );", 26 | 27 | "}" 28 | 29 | ].join( "\n" ), 30 | 31 | fragmentShader: [ 32 | 33 | "uniform float opacity;", 34 | "uniform float mixRatio;", 35 | 36 | "uniform sampler2D tDiffuse1;", 37 | "uniform sampler2D tDiffuse2;", 38 | 39 | "varying vec2 vUv;", 40 | 41 | "void main() {", 42 | 43 | "vec4 texel1 = texture2D( tDiffuse1, vUv );", 44 | "vec4 texel2 = texture2D( tDiffuse2, vUv );", 45 | "gl_FragColor = opacity * mix( texel1, texel2, mixRatio );", 46 | 47 | "}" 48 | 49 | ].join( "\n" ) 50 | 51 | }; 52 | -------------------------------------------------------------------------------- /lib/three/examples/js/shaders/ColorifyShader.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author alteredq / http://alteredqualia.com/ 3 | * 4 | * Colorify shader 5 | */ 6 | 7 | THREE.ColorifyShader = { 8 | 9 | uniforms: { 10 | 11 | "tDiffuse": { value: null }, 12 | "color": { value: new THREE.Color( 0xffffff ) } 13 | 14 | }, 15 | 16 | vertexShader: [ 17 | 18 | "varying vec2 vUv;", 19 | 20 | "void main() {", 21 | 22 | "vUv = uv;", 23 | "gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );", 24 | 25 | "}" 26 | 27 | ].join( "\n" ), 28 | 29 | fragmentShader: [ 30 | 31 | "uniform vec3 color;", 32 | "uniform sampler2D tDiffuse;", 33 | 34 | "varying vec2 vUv;", 35 | 36 | "void main() {", 37 | 38 | "vec4 texel = texture2D( tDiffuse, vUv );", 39 | 40 | "vec3 luma = vec3( 0.299, 0.587, 0.114 );", 41 | "float v = dot( texel.xyz, luma );", 42 | 43 | "gl_FragColor = vec4( v * color, texel.w );", 44 | 45 | "}" 46 | 47 | ].join( "\n" ) 48 | 49 | }; 50 | -------------------------------------------------------------------------------- /lib/three/examples/js/shaders/CopyShader.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author alteredq / http://alteredqualia.com/ 3 | * 4 | * Full-screen textured quad shader 5 | */ 6 | 7 | THREE.CopyShader = { 8 | 9 | uniforms: { 10 | 11 | "tDiffuse": { value: null }, 12 | "opacity": { value: 1.0 } 13 | 14 | }, 15 | 16 | vertexShader: [ 17 | 18 | "varying vec2 vUv;", 19 | 20 | "void main() {", 21 | 22 | "vUv = uv;", 23 | "gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );", 24 | 25 | "}" 26 | 27 | ].join( "\n" ), 28 | 29 | fragmentShader: [ 30 | 31 | "uniform float opacity;", 32 | 33 | "uniform sampler2D tDiffuse;", 34 | 35 | "varying vec2 vUv;", 36 | 37 | "void main() {", 38 | 39 | "vec4 texel = texture2D( tDiffuse, vUv );", 40 | "gl_FragColor = opacity * texel;", 41 | 42 | "}" 43 | 44 | ].join( "\n" ) 45 | 46 | }; 47 | -------------------------------------------------------------------------------- /lib/three/examples/js/shaders/GammaCorrectionShader.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author WestLangley / http://github.com/WestLangley 3 | * 4 | * Gamma Correction Shader 5 | * http://en.wikipedia.org/wiki/gamma_correction 6 | */ 7 | 8 | THREE.GammaCorrectionShader = { 9 | 10 | uniforms: { 11 | 12 | "tDiffuse": { value: null } 13 | 14 | }, 15 | 16 | vertexShader: [ 17 | 18 | "varying vec2 vUv;", 19 | 20 | "void main() {", 21 | 22 | "vUv = uv;", 23 | "gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );", 24 | 25 | "}" 26 | 27 | ].join( "\n" ), 28 | 29 | fragmentShader: [ 30 | 31 | "uniform sampler2D tDiffuse;", 32 | 33 | "varying vec2 vUv;", 34 | 35 | "void main() {", 36 | 37 | "vec4 tex = texture2D( tDiffuse, vec2( vUv.x, vUv.y ) );", 38 | 39 | "gl_FragColor = LinearToGamma( tex, float( GAMMA_FACTOR ) );", 40 | 41 | "}" 42 | 43 | ].join( "\n" ) 44 | 45 | }; 46 | -------------------------------------------------------------------------------- /lib/three/examples/js/shaders/LuminosityShader.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author alteredq / http://alteredqualia.com/ 3 | * 4 | * Luminosity 5 | * http://en.wikipedia.org/wiki/Luminosity 6 | */ 7 | 8 | THREE.LuminosityShader = { 9 | 10 | uniforms: { 11 | 12 | "tDiffuse": { value: null } 13 | 14 | }, 15 | 16 | vertexShader: [ 17 | 18 | "varying vec2 vUv;", 19 | 20 | "void main() {", 21 | 22 | "vUv = uv;", 23 | 24 | "gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );", 25 | 26 | "}" 27 | 28 | ].join( "\n" ), 29 | 30 | fragmentShader: [ 31 | 32 | "#include ", 33 | 34 | "uniform sampler2D tDiffuse;", 35 | 36 | "varying vec2 vUv;", 37 | 38 | "void main() {", 39 | 40 | "vec4 texel = texture2D( tDiffuse, vUv );", 41 | 42 | "float l = linearToRelativeLuminance( texel.rgb );", 43 | 44 | "gl_FragColor = vec4( l, l, l, texel.w );", 45 | 46 | "}" 47 | 48 | ].join( "\n" ) 49 | 50 | }; 51 | -------------------------------------------------------------------------------- /lib/three/examples/js/shaders/UnpackDepthRGBAShader.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author alteredq / http://alteredqualia.com/ 3 | * 4 | * Unpack RGBA depth shader 5 | * - show RGBA encoded depth as monochrome color 6 | */ 7 | 8 | THREE.UnpackDepthRGBAShader = { 9 | 10 | uniforms: { 11 | 12 | "tDiffuse": { value: null }, 13 | "opacity": { value: 1.0 } 14 | 15 | }, 16 | 17 | vertexShader: [ 18 | 19 | "varying vec2 vUv;", 20 | 21 | "void main() {", 22 | 23 | "vUv = uv;", 24 | "gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );", 25 | 26 | "}" 27 | 28 | ].join( "\n" ), 29 | 30 | fragmentShader: [ 31 | 32 | "uniform float opacity;", 33 | 34 | "uniform sampler2D tDiffuse;", 35 | 36 | "varying vec2 vUv;", 37 | 38 | "#include ", 39 | 40 | "void main() {", 41 | 42 | "float depth = 1.0 - unpackRGBAToDepth( texture2D( tDiffuse, vUv ) );", 43 | "gl_FragColor = opacity * vec4( vec3( depth ), 1.0 );", 44 | 45 | "}" 46 | 47 | ].join( "\n" ) 48 | 49 | }; 50 | -------------------------------------------------------------------------------- /lib/three/src/animation/tracks/ColorKeyframeTrack.js: -------------------------------------------------------------------------------- 1 | import { KeyframeTrack } from '../KeyframeTrack.js'; 2 | 3 | /** 4 | * 5 | * A Track of keyframe values that represent color. 6 | * 7 | * 8 | * @author Ben Houston / http://clara.io/ 9 | * @author David Sarno / http://lighthaus.us/ 10 | * @author tschw 11 | */ 12 | 13 | function ColorKeyframeTrack( name, times, values, interpolation ) { 14 | 15 | KeyframeTrack.call( this, name, times, values, interpolation ); 16 | 17 | } 18 | 19 | ColorKeyframeTrack.prototype = Object.assign( Object.create( KeyframeTrack.prototype ), { 20 | 21 | constructor: ColorKeyframeTrack, 22 | 23 | ValueTypeName: 'color' 24 | 25 | // ValueBufferType is inherited 26 | 27 | // DefaultInterpolation is inherited 28 | 29 | // Note: Very basic implementation and nothing special yet. 30 | // However, this is the place for color space parameterization. 31 | 32 | } ); 33 | 34 | export { ColorKeyframeTrack }; 35 | -------------------------------------------------------------------------------- /lib/three/src/animation/tracks/NumberKeyframeTrack.js: -------------------------------------------------------------------------------- 1 | import { KeyframeTrack } from '../KeyframeTrack.js'; 2 | 3 | /** 4 | * 5 | * A Track of numeric keyframe values. 6 | * 7 | * @author Ben Houston / http://clara.io/ 8 | * @author David Sarno / http://lighthaus.us/ 9 | * @author tschw 10 | */ 11 | 12 | function NumberKeyframeTrack( name, times, values, interpolation ) { 13 | 14 | KeyframeTrack.call( this, name, times, values, interpolation ); 15 | 16 | } 17 | 18 | NumberKeyframeTrack.prototype = Object.assign( Object.create( KeyframeTrack.prototype ), { 19 | 20 | constructor: NumberKeyframeTrack, 21 | 22 | ValueTypeName: 'number' 23 | 24 | // ValueBufferType is inherited 25 | 26 | // DefaultInterpolation is inherited 27 | 28 | } ); 29 | 30 | export { NumberKeyframeTrack }; 31 | -------------------------------------------------------------------------------- /lib/three/src/animation/tracks/StringKeyframeTrack.js: -------------------------------------------------------------------------------- 1 | import { InterpolateDiscrete } from '../../constants.js'; 2 | import { KeyframeTrack } from '../KeyframeTrack.js'; 3 | 4 | /** 5 | * 6 | * A Track that interpolates Strings 7 | * 8 | * 9 | * @author Ben Houston / http://clara.io/ 10 | * @author David Sarno / http://lighthaus.us/ 11 | * @author tschw 12 | */ 13 | 14 | function StringKeyframeTrack( name, times, values, interpolation ) { 15 | 16 | KeyframeTrack.call( this, name, times, values, interpolation ); 17 | 18 | } 19 | 20 | StringKeyframeTrack.prototype = Object.assign( Object.create( KeyframeTrack.prototype ), { 21 | 22 | constructor: StringKeyframeTrack, 23 | 24 | ValueTypeName: 'string', 25 | ValueBufferType: Array, 26 | 27 | DefaultInterpolation: InterpolateDiscrete, 28 | 29 | InterpolantFactoryMethodLinear: undefined, 30 | 31 | InterpolantFactoryMethodSmooth: undefined 32 | 33 | } ); 34 | 35 | export { StringKeyframeTrack }; 36 | -------------------------------------------------------------------------------- /lib/three/src/animation/tracks/VectorKeyframeTrack.js: -------------------------------------------------------------------------------- 1 | import { KeyframeTrack } from '../KeyframeTrack.js'; 2 | 3 | /** 4 | * 5 | * A Track of vectored keyframe values. 6 | * 7 | * 8 | * @author Ben Houston / http://clara.io/ 9 | * @author David Sarno / http://lighthaus.us/ 10 | * @author tschw 11 | */ 12 | 13 | function VectorKeyframeTrack( name, times, values, interpolation ) { 14 | 15 | KeyframeTrack.call( this, name, times, values, interpolation ); 16 | 17 | } 18 | 19 | VectorKeyframeTrack.prototype = Object.assign( Object.create( KeyframeTrack.prototype ), { 20 | 21 | constructor: VectorKeyframeTrack, 22 | 23 | ValueTypeName: 'vector' 24 | 25 | // ValueBufferType is inherited 26 | 27 | // DefaultInterpolation is inherited 28 | 29 | } ); 30 | 31 | export { VectorKeyframeTrack }; 32 | -------------------------------------------------------------------------------- /lib/three/src/audio/AudioAnalyser.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author mrdoob / http://mrdoob.com/ 3 | */ 4 | 5 | function AudioAnalyser( audio, fftSize ) { 6 | 7 | this.analyser = audio.context.createAnalyser(); 8 | this.analyser.fftSize = fftSize !== undefined ? fftSize : 2048; 9 | 10 | this.data = new Uint8Array( this.analyser.frequencyBinCount ); 11 | 12 | audio.getOutput().connect( this.analyser ); 13 | 14 | } 15 | 16 | Object.assign( AudioAnalyser.prototype, { 17 | 18 | getFrequencyData: function () { 19 | 20 | this.analyser.getByteFrequencyData( this.data ); 21 | 22 | return this.data; 23 | 24 | }, 25 | 26 | getAverageFrequency: function () { 27 | 28 | var value = 0, data = this.getFrequencyData(); 29 | 30 | for ( var i = 0; i < data.length; i ++ ) { 31 | 32 | value += data[ i ]; 33 | 34 | } 35 | 36 | return value / data.length; 37 | 38 | } 39 | 40 | } ); 41 | 42 | export { AudioAnalyser }; 43 | -------------------------------------------------------------------------------- /lib/three/src/audio/AudioContext.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author mrdoob / http://mrdoob.com/ 3 | */ 4 | 5 | var context; 6 | 7 | var AudioContext = { 8 | 9 | getContext: function () { 10 | 11 | if ( context === undefined ) { 12 | 13 | context = new ( window.AudioContext || window.webkitAudioContext )(); 14 | 15 | } 16 | 17 | return context; 18 | 19 | }, 20 | 21 | setContext: function ( value ) { 22 | 23 | context = value; 24 | 25 | } 26 | 27 | }; 28 | 29 | export { AudioContext }; 30 | -------------------------------------------------------------------------------- /lib/three/src/cameras/ArrayCamera.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author mrdoob / http://mrdoob.com/ 3 | */ 4 | 5 | import { PerspectiveCamera } from './PerspectiveCamera.js'; 6 | 7 | function ArrayCamera( array ) { 8 | 9 | PerspectiveCamera.call( this ); 10 | 11 | this.cameras = array || []; 12 | 13 | } 14 | 15 | ArrayCamera.prototype = Object.assign( Object.create( PerspectiveCamera.prototype ), { 16 | 17 | constructor: ArrayCamera, 18 | 19 | isArrayCamera: true 20 | 21 | } ); 22 | 23 | 24 | export { ArrayCamera }; 25 | -------------------------------------------------------------------------------- /lib/three/src/core/InstancedBufferAttribute.js: -------------------------------------------------------------------------------- 1 | import { BufferAttribute } from './BufferAttribute.js'; 2 | 3 | /** 4 | * @author benaadams / https://twitter.com/ben_a_adams 5 | */ 6 | 7 | function InstancedBufferAttribute( array, itemSize, meshPerAttribute ) { 8 | 9 | BufferAttribute.call( this, array, itemSize ); 10 | 11 | this.meshPerAttribute = meshPerAttribute || 1; 12 | 13 | } 14 | 15 | InstancedBufferAttribute.prototype = Object.assign( Object.create( BufferAttribute.prototype ), { 16 | 17 | constructor: InstancedBufferAttribute, 18 | 19 | isInstancedBufferAttribute: true, 20 | 21 | copy: function ( source ) { 22 | 23 | BufferAttribute.prototype.copy.call( this, source ); 24 | 25 | this.meshPerAttribute = source.meshPerAttribute; 26 | 27 | return this; 28 | 29 | } 30 | 31 | } ); 32 | 33 | 34 | 35 | export { InstancedBufferAttribute }; 36 | -------------------------------------------------------------------------------- /lib/three/src/core/InstancedBufferGeometry.js: -------------------------------------------------------------------------------- 1 | import { BufferGeometry } from './BufferGeometry.js'; 2 | 3 | /** 4 | * @author benaadams / https://twitter.com/ben_a_adams 5 | */ 6 | 7 | function InstancedBufferGeometry() { 8 | 9 | BufferGeometry.call( this ); 10 | 11 | this.type = 'InstancedBufferGeometry'; 12 | this.maxInstancedCount = undefined; 13 | 14 | } 15 | 16 | InstancedBufferGeometry.prototype = Object.assign( Object.create( BufferGeometry.prototype ), { 17 | 18 | constructor: InstancedBufferGeometry, 19 | 20 | isInstancedBufferGeometry: true, 21 | 22 | copy: function ( source ) { 23 | 24 | BufferGeometry.prototype.copy.call( this, source ); 25 | 26 | this.maxInstancedCount = source.maxInstancedCount; 27 | 28 | return this; 29 | 30 | }, 31 | 32 | clone: function () { 33 | 34 | return new this.constructor().copy( this ); 35 | 36 | } 37 | 38 | } ); 39 | 40 | export { InstancedBufferGeometry }; 41 | -------------------------------------------------------------------------------- /lib/three/src/core/InstancedInterleavedBuffer.js: -------------------------------------------------------------------------------- 1 | import { InterleavedBuffer } from './InterleavedBuffer.js'; 2 | 3 | /** 4 | * @author benaadams / https://twitter.com/ben_a_adams 5 | */ 6 | 7 | function InstancedInterleavedBuffer( array, stride, meshPerAttribute ) { 8 | 9 | InterleavedBuffer.call( this, array, stride ); 10 | 11 | this.meshPerAttribute = meshPerAttribute || 1; 12 | 13 | } 14 | 15 | InstancedInterleavedBuffer.prototype = Object.assign( Object.create( InterleavedBuffer.prototype ), { 16 | 17 | constructor: InstancedInterleavedBuffer, 18 | 19 | isInstancedInterleavedBuffer: true, 20 | 21 | copy: function ( source ) { 22 | 23 | InterleavedBuffer.prototype.copy.call( this, source ); 24 | 25 | this.meshPerAttribute = source.meshPerAttribute; 26 | 27 | return this; 28 | 29 | } 30 | 31 | } ); 32 | 33 | export { InstancedInterleavedBuffer }; 34 | -------------------------------------------------------------------------------- /lib/three/src/core/Layers.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author mrdoob / http://mrdoob.com/ 3 | */ 4 | 5 | function Layers() { 6 | 7 | this.mask = 1 | 0; 8 | 9 | } 10 | 11 | Object.assign( Layers.prototype, { 12 | 13 | set: function ( channel ) { 14 | 15 | this.mask = 1 << channel | 0; 16 | 17 | }, 18 | 19 | enable: function ( channel ) { 20 | 21 | this.mask |= 1 << channel | 0; 22 | 23 | }, 24 | 25 | toggle: function ( channel ) { 26 | 27 | this.mask ^= 1 << channel | 0; 28 | 29 | }, 30 | 31 | disable: function ( channel ) { 32 | 33 | this.mask &= ~ ( 1 << channel | 0 ); 34 | 35 | }, 36 | 37 | test: function ( layers ) { 38 | 39 | return ( this.mask & layers.mask ) !== 0; 40 | 41 | } 42 | 43 | } ); 44 | 45 | 46 | export { Layers }; 47 | -------------------------------------------------------------------------------- /lib/three/src/core/Uniform.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author mrdoob / http://mrdoob.com/ 3 | */ 4 | 5 | function Uniform( value ) { 6 | 7 | if ( typeof value === 'string' ) { 8 | 9 | console.warn( 'THREE.Uniform: Type parameter is no longer needed.' ); 10 | value = arguments[ 1 ]; 11 | 12 | } 13 | 14 | this.value = value; 15 | 16 | } 17 | 18 | Uniform.prototype.clone = function () { 19 | 20 | return new Uniform( this.value.clone === undefined ? this.value : this.value.clone() ); 21 | 22 | }; 23 | 24 | export { Uniform }; 25 | -------------------------------------------------------------------------------- /lib/three/src/extras/SceneUtils.js: -------------------------------------------------------------------------------- 1 | import { Matrix4 } from '../math/Matrix4.js'; 2 | import { Mesh } from '../objects/Mesh.js'; 3 | import { Group } from '../objects/Group.js'; 4 | 5 | /** 6 | * @author alteredq / http://alteredqualia.com/ 7 | */ 8 | 9 | var SceneUtils = { 10 | 11 | createMultiMaterialObject: function ( geometry, materials ) { 12 | 13 | var group = new Group(); 14 | 15 | for ( var i = 0, l = materials.length; i < l; i ++ ) { 16 | 17 | group.add( new Mesh( geometry, materials[ i ] ) ); 18 | 19 | } 20 | 21 | return group; 22 | 23 | }, 24 | 25 | detach: function ( child, parent, scene ) { 26 | 27 | child.applyMatrix( parent.matrixWorld ); 28 | parent.remove( child ); 29 | scene.add( child ); 30 | 31 | }, 32 | 33 | attach: function ( child, scene, parent ) { 34 | 35 | child.applyMatrix( new Matrix4().getInverse( parent.matrixWorld ) ); 36 | 37 | scene.remove( child ); 38 | parent.add( child ); 39 | 40 | } 41 | 42 | }; 43 | 44 | 45 | export { SceneUtils }; 46 | -------------------------------------------------------------------------------- /lib/three/src/extras/curves/ArcCurve.js: -------------------------------------------------------------------------------- 1 | import { EllipseCurve } from './EllipseCurve.js'; 2 | 3 | 4 | function ArcCurve( aX, aY, aRadius, aStartAngle, aEndAngle, aClockwise ) { 5 | 6 | EllipseCurve.call( this, aX, aY, aRadius, aRadius, aStartAngle, aEndAngle, aClockwise ); 7 | 8 | this.type = 'ArcCurve'; 9 | 10 | } 11 | 12 | ArcCurve.prototype = Object.create( EllipseCurve.prototype ); 13 | ArcCurve.prototype.constructor = ArcCurve; 14 | 15 | ArcCurve.prototype.isArcCurve = true; 16 | 17 | 18 | export { ArcCurve }; 19 | -------------------------------------------------------------------------------- /lib/three/src/extras/curves/Curves.js: -------------------------------------------------------------------------------- 1 | export { ArcCurve } from './ArcCurve.js'; 2 | export { CatmullRomCurve3 } from './CatmullRomCurve3.js'; 3 | export { CubicBezierCurve } from './CubicBezierCurve.js'; 4 | export { CubicBezierCurve3 } from './CubicBezierCurve3.js'; 5 | export { EllipseCurve } from './EllipseCurve.js'; 6 | export { LineCurve } from './LineCurve.js'; 7 | export { LineCurve3 } from './LineCurve3.js'; 8 | export { QuadraticBezierCurve } from './QuadraticBezierCurve.js'; 9 | export { QuadraticBezierCurve3 } from './QuadraticBezierCurve3.js'; 10 | export { SplineCurve } from './SplineCurve.js'; 11 | -------------------------------------------------------------------------------- /lib/three/src/extras/objects/ImmediateRenderObject.js: -------------------------------------------------------------------------------- 1 | import { Object3D } from '../../core/Object3D.js'; 2 | 3 | /** 4 | * @author alteredq / http://alteredqualia.com/ 5 | */ 6 | 7 | function ImmediateRenderObject( material ) { 8 | 9 | Object3D.call( this ); 10 | 11 | this.material = material; 12 | this.render = function ( /* renderCallback */ ) {}; 13 | 14 | } 15 | 16 | ImmediateRenderObject.prototype = Object.create( Object3D.prototype ); 17 | ImmediateRenderObject.prototype.constructor = ImmediateRenderObject; 18 | 19 | ImmediateRenderObject.prototype.isImmediateRenderObject = true; 20 | 21 | 22 | export { ImmediateRenderObject }; 23 | -------------------------------------------------------------------------------- /lib/three/src/lights/AmbientLight.js: -------------------------------------------------------------------------------- 1 | import { Light } from './Light.js'; 2 | 3 | /** 4 | * @author mrdoob / http://mrdoob.com/ 5 | */ 6 | 7 | function AmbientLight( color, intensity ) { 8 | 9 | Light.call( this, color, intensity ); 10 | 11 | this.type = 'AmbientLight'; 12 | 13 | this.castShadow = undefined; 14 | 15 | } 16 | 17 | AmbientLight.prototype = Object.assign( Object.create( Light.prototype ), { 18 | 19 | constructor: AmbientLight, 20 | 21 | isAmbientLight: true 22 | 23 | } ); 24 | 25 | 26 | export { AmbientLight }; 27 | -------------------------------------------------------------------------------- /lib/three/src/lights/DirectionalLightShadow.js: -------------------------------------------------------------------------------- 1 | import { LightShadow } from './LightShadow.js'; 2 | import { OrthographicCamera } from '../cameras/OrthographicCamera.js'; 3 | 4 | /** 5 | * @author mrdoob / http://mrdoob.com/ 6 | */ 7 | 8 | function DirectionalLightShadow( ) { 9 | 10 | LightShadow.call( this, new OrthographicCamera( - 5, 5, 5, - 5, 0.5, 500 ) ); 11 | 12 | } 13 | 14 | DirectionalLightShadow.prototype = Object.assign( Object.create( LightShadow.prototype ), { 15 | 16 | constructor: DirectionalLightShadow 17 | 18 | } ); 19 | 20 | 21 | export { DirectionalLightShadow }; 22 | -------------------------------------------------------------------------------- /lib/three/src/lights/HemisphereLight.js: -------------------------------------------------------------------------------- 1 | import { Light } from './Light.js'; 2 | import { Color } from '../math/Color.js'; 3 | import { Object3D } from '../core/Object3D.js'; 4 | 5 | /** 6 | * @author alteredq / http://alteredqualia.com/ 7 | */ 8 | 9 | function HemisphereLight( skyColor, groundColor, intensity ) { 10 | 11 | Light.call( this, skyColor, intensity ); 12 | 13 | this.type = 'HemisphereLight'; 14 | 15 | this.castShadow = undefined; 16 | 17 | this.position.copy( Object3D.DefaultUp ); 18 | this.updateMatrix(); 19 | 20 | this.groundColor = new Color( groundColor ); 21 | 22 | } 23 | 24 | HemisphereLight.prototype = Object.assign( Object.create( Light.prototype ), { 25 | 26 | constructor: HemisphereLight, 27 | 28 | isHemisphereLight: true, 29 | 30 | copy: function ( source ) { 31 | 32 | Light.prototype.copy.call( this, source ); 33 | 34 | this.groundColor.copy( source.groundColor ); 35 | 36 | return this; 37 | 38 | } 39 | 40 | } ); 41 | 42 | 43 | export { HemisphereLight }; 44 | -------------------------------------------------------------------------------- /lib/three/src/loaders/AudioLoader.js: -------------------------------------------------------------------------------- 1 | import { AudioContext } from '../audio/AudioContext.js'; 2 | import { FileLoader } from './FileLoader.js'; 3 | import { DefaultLoadingManager } from './LoadingManager.js'; 4 | 5 | /** 6 | * @author Reece Aaron Lecrivain / http://reecenotes.com/ 7 | */ 8 | 9 | function AudioLoader( manager ) { 10 | 11 | this.manager = ( manager !== undefined ) ? manager : DefaultLoadingManager; 12 | 13 | } 14 | 15 | Object.assign( AudioLoader.prototype, { 16 | 17 | load: function ( url, onLoad, onProgress, onError ) { 18 | 19 | var loader = new FileLoader( this.manager ); 20 | loader.setResponseType( 'arraybuffer' ); 21 | loader.load( url, function ( buffer ) { 22 | 23 | var context = AudioContext.getContext(); 24 | 25 | context.decodeAudioData( buffer, function ( audioBuffer ) { 26 | 27 | onLoad( audioBuffer ); 28 | 29 | } ); 30 | 31 | }, onProgress, onError ); 32 | 33 | } 34 | 35 | } ); 36 | 37 | 38 | export { AudioLoader }; 39 | -------------------------------------------------------------------------------- /lib/three/src/loaders/Cache.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author mrdoob / http://mrdoob.com/ 3 | */ 4 | 5 | var Cache = { 6 | 7 | enabled: false, 8 | 9 | files: {}, 10 | 11 | add: function ( key, file ) { 12 | 13 | if ( this.enabled === false ) return; 14 | 15 | // console.log( 'THREE.Cache', 'Adding key:', key ); 16 | 17 | this.files[ key ] = file; 18 | 19 | }, 20 | 21 | get: function ( key ) { 22 | 23 | if ( this.enabled === false ) return; 24 | 25 | // console.log( 'THREE.Cache', 'Checking key:', key ); 26 | 27 | return this.files[ key ]; 28 | 29 | }, 30 | 31 | remove: function ( key ) { 32 | 33 | delete this.files[ key ]; 34 | 35 | }, 36 | 37 | clear: function () { 38 | 39 | this.files = {}; 40 | 41 | } 42 | 43 | }; 44 | 45 | 46 | export { Cache }; 47 | -------------------------------------------------------------------------------- /lib/three/src/loaders/LoaderUtils.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author Don McCurdy / https://www.donmccurdy.com 3 | */ 4 | 5 | var LoaderUtils = { 6 | 7 | decodeText: function ( array ) { 8 | 9 | if ( typeof TextDecoder !== 'undefined' ) { 10 | 11 | return new TextDecoder().decode( array ); 12 | 13 | } 14 | 15 | // Avoid the String.fromCharCode.apply(null, array) shortcut, which 16 | // throws a "maximum call stack size exceeded" error for large arrays. 17 | 18 | var s = ''; 19 | 20 | for ( var i = 0, il = array.length; i < il; i ++ ) { 21 | 22 | // Implicitly assumes little-endian. 23 | s += String.fromCharCode( array[ i ] ); 24 | 25 | } 26 | 27 | return s; 28 | 29 | }, 30 | 31 | extractUrlBase: function ( url ) { 32 | 33 | var parts = url.split( '/' ); 34 | 35 | if ( parts.length === 1 ) return './'; 36 | 37 | parts.pop(); 38 | 39 | return parts.join( '/' ) + '/'; 40 | 41 | } 42 | 43 | }; 44 | 45 | export { LoaderUtils }; 46 | -------------------------------------------------------------------------------- /lib/three/src/materials/Materials.js: -------------------------------------------------------------------------------- 1 | export { ShadowMaterial } from './ShadowMaterial.js'; 2 | export { SpriteMaterial } from './SpriteMaterial.js'; 3 | export { RawShaderMaterial } from './RawShaderMaterial.js'; 4 | export { ShaderMaterial } from './ShaderMaterial.js'; 5 | export { PointsMaterial } from './PointsMaterial.js'; 6 | export { MeshPhysicalMaterial } from './MeshPhysicalMaterial.js'; 7 | export { MeshStandardMaterial } from './MeshStandardMaterial.js'; 8 | export { MeshPhongMaterial } from './MeshPhongMaterial.js'; 9 | export { MeshToonMaterial } from './MeshToonMaterial.js'; 10 | export { MeshNormalMaterial } from './MeshNormalMaterial.js'; 11 | export { MeshLambertMaterial } from './MeshLambertMaterial.js'; 12 | export { MeshDepthMaterial } from './MeshDepthMaterial.js'; 13 | export { MeshDistanceMaterial } from './MeshDistanceMaterial.js'; 14 | export { MeshBasicMaterial } from './MeshBasicMaterial.js'; 15 | export { LineDashedMaterial } from './LineDashedMaterial.js'; 16 | export { LineBasicMaterial } from './LineBasicMaterial.js'; 17 | export { Material } from './Material.js'; 18 | -------------------------------------------------------------------------------- /lib/three/src/materials/MeshToonMaterial.js: -------------------------------------------------------------------------------- 1 | import { MeshPhongMaterial } from './MeshPhongMaterial.js'; 2 | 3 | /** 4 | * @author takahirox / http://github.com/takahirox 5 | * 6 | * parameters = { 7 | * gradientMap: new THREE.Texture( ) 8 | * } 9 | */ 10 | 11 | function MeshToonMaterial( parameters ) { 12 | 13 | MeshPhongMaterial.call( this ); 14 | 15 | this.defines = { 'TOON': '' }; 16 | 17 | this.type = 'MeshToonMaterial'; 18 | 19 | this.gradientMap = null; 20 | 21 | this.setValues( parameters ); 22 | 23 | } 24 | 25 | MeshToonMaterial.prototype = Object.create( MeshPhongMaterial.prototype ); 26 | MeshToonMaterial.prototype.constructor = MeshToonMaterial; 27 | 28 | MeshToonMaterial.prototype.isMeshToonMaterial = true; 29 | 30 | MeshToonMaterial.prototype.copy = function ( source ) { 31 | 32 | MeshPhongMaterial.prototype.copy.call( this, source ); 33 | 34 | this.gradientMap = source.gradientMap; 35 | 36 | return this; 37 | 38 | }; 39 | 40 | 41 | export { MeshToonMaterial }; 42 | -------------------------------------------------------------------------------- /lib/three/src/materials/RawShaderMaterial.js: -------------------------------------------------------------------------------- 1 | import { ShaderMaterial } from './ShaderMaterial.js'; 2 | 3 | /** 4 | * @author mrdoob / http://mrdoob.com/ 5 | */ 6 | 7 | function RawShaderMaterial( parameters ) { 8 | 9 | ShaderMaterial.call( this, parameters ); 10 | 11 | this.type = 'RawShaderMaterial'; 12 | 13 | } 14 | 15 | RawShaderMaterial.prototype = Object.create( ShaderMaterial.prototype ); 16 | RawShaderMaterial.prototype.constructor = RawShaderMaterial; 17 | 18 | RawShaderMaterial.prototype.isRawShaderMaterial = true; 19 | 20 | 21 | export { RawShaderMaterial }; 22 | -------------------------------------------------------------------------------- /lib/three/src/materials/ShadowMaterial.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author mrdoob / http://mrdoob.com/ 3 | * 4 | * parameters = { 5 | * color: , 6 | * opacity: 7 | * } 8 | */ 9 | 10 | import { Material } from './Material.js'; 11 | import { Color } from '../math/Color.js'; 12 | 13 | function ShadowMaterial( parameters ) { 14 | 15 | Material.call( this ); 16 | 17 | this.type = 'ShadowMaterial'; 18 | 19 | this.color = new Color( 0x000000 ); 20 | this.opacity = 1.0; 21 | 22 | this.lights = true; 23 | this.transparent = true; 24 | 25 | this.setValues( parameters ); 26 | 27 | } 28 | 29 | ShadowMaterial.prototype = Object.create( Material.prototype ); 30 | ShadowMaterial.prototype.constructor = ShadowMaterial; 31 | 32 | ShadowMaterial.prototype.isShadowMaterial = true; 33 | 34 | 35 | export { ShadowMaterial }; 36 | -------------------------------------------------------------------------------- /lib/three/src/math/interpolants/DiscreteInterpolant.js: -------------------------------------------------------------------------------- 1 | import { Interpolant } from '../Interpolant.js'; 2 | 3 | /** 4 | * 5 | * Interpolant that evaluates to the sample value at the position preceeding 6 | * the parameter. 7 | * 8 | * @author tschw 9 | */ 10 | 11 | function DiscreteInterpolant( parameterPositions, sampleValues, sampleSize, resultBuffer ) { 12 | 13 | Interpolant.call( this, parameterPositions, sampleValues, sampleSize, resultBuffer ); 14 | 15 | } 16 | 17 | DiscreteInterpolant.prototype = Object.assign( Object.create( Interpolant.prototype ), { 18 | 19 | constructor: DiscreteInterpolant, 20 | 21 | interpolate_: function ( i1 /*, t0, t, t1 */ ) { 22 | 23 | return this.copySampleValue_( i1 - 1 ); 24 | 25 | } 26 | 27 | } ); 28 | 29 | 30 | export { DiscreteInterpolant }; 31 | -------------------------------------------------------------------------------- /lib/three/src/math/interpolants/LinearInterpolant.js: -------------------------------------------------------------------------------- 1 | import { Interpolant } from '../Interpolant.js'; 2 | 3 | /** 4 | * @author tschw 5 | */ 6 | 7 | function LinearInterpolant( parameterPositions, sampleValues, sampleSize, resultBuffer ) { 8 | 9 | Interpolant.call( this, parameterPositions, sampleValues, sampleSize, resultBuffer ); 10 | 11 | } 12 | 13 | LinearInterpolant.prototype = Object.assign( Object.create( Interpolant.prototype ), { 14 | 15 | constructor: LinearInterpolant, 16 | 17 | interpolate_: function ( i1, t0, t, t1 ) { 18 | 19 | var result = this.resultBuffer, 20 | values = this.sampleValues, 21 | stride = this.valueSize, 22 | 23 | offset1 = i1 * stride, 24 | offset0 = offset1 - stride, 25 | 26 | weight1 = ( t - t0 ) / ( t1 - t0 ), 27 | weight0 = 1 - weight1; 28 | 29 | for ( var i = 0; i !== stride; ++ i ) { 30 | 31 | result[ i ] = 32 | values[ offset0 + i ] * weight0 + 33 | values[ offset1 + i ] * weight1; 34 | 35 | } 36 | 37 | return result; 38 | 39 | } 40 | 41 | } ); 42 | 43 | 44 | export { LinearInterpolant }; 45 | -------------------------------------------------------------------------------- /lib/three/src/objects/Bone.js: -------------------------------------------------------------------------------- 1 | import { Object3D } from '../core/Object3D.js'; 2 | 3 | /** 4 | * @author mikael emtinger / http://gomo.se/ 5 | * @author alteredq / http://alteredqualia.com/ 6 | * @author ikerr / http://verold.com 7 | */ 8 | 9 | function Bone() { 10 | 11 | Object3D.call( this ); 12 | 13 | this.type = 'Bone'; 14 | 15 | } 16 | 17 | Bone.prototype = Object.assign( Object.create( Object3D.prototype ), { 18 | 19 | constructor: Bone, 20 | 21 | isBone: true 22 | 23 | } ); 24 | 25 | 26 | export { Bone }; 27 | -------------------------------------------------------------------------------- /lib/three/src/objects/Group.js: -------------------------------------------------------------------------------- 1 | import { Object3D } from '../core/Object3D.js'; 2 | 3 | /** 4 | * @author mrdoob / http://mrdoob.com/ 5 | */ 6 | 7 | function Group() { 8 | 9 | Object3D.call( this ); 10 | 11 | this.type = 'Group'; 12 | 13 | } 14 | 15 | Group.prototype = Object.assign( Object.create( Object3D.prototype ), { 16 | 17 | constructor: Group, 18 | 19 | isGroup: true 20 | 21 | } ); 22 | 23 | 24 | export { Group }; 25 | -------------------------------------------------------------------------------- /lib/three/src/objects/LineLoop.js: -------------------------------------------------------------------------------- 1 | import { Line } from './Line.js'; 2 | 3 | /** 4 | * @author mgreter / http://github.com/mgreter 5 | */ 6 | 7 | function LineLoop( geometry, material ) { 8 | 9 | Line.call( this, geometry, material ); 10 | 11 | this.type = 'LineLoop'; 12 | 13 | } 14 | 15 | LineLoop.prototype = Object.assign( Object.create( Line.prototype ), { 16 | 17 | constructor: LineLoop, 18 | 19 | isLineLoop: true, 20 | 21 | } ); 22 | 23 | 24 | export { LineLoop }; 25 | -------------------------------------------------------------------------------- /lib/three/src/objects/LineSegments.js: -------------------------------------------------------------------------------- 1 | import { Line } from './Line.js'; 2 | 3 | /** 4 | * @author mrdoob / http://mrdoob.com/ 5 | */ 6 | 7 | function LineSegments( geometry, material ) { 8 | 9 | Line.call( this, geometry, material ); 10 | 11 | this.type = 'LineSegments'; 12 | 13 | } 14 | 15 | LineSegments.prototype = Object.assign( Object.create( Line.prototype ), { 16 | 17 | constructor: LineSegments, 18 | 19 | isLineSegments: true 20 | 21 | } ); 22 | 23 | 24 | export { LineSegments }; 25 | -------------------------------------------------------------------------------- /lib/three/src/renderers/WebGLRenderTargetCube.js: -------------------------------------------------------------------------------- 1 | import { WebGLRenderTarget } from './WebGLRenderTarget.js'; 2 | 3 | /** 4 | * @author alteredq / http://alteredqualia.com 5 | */ 6 | 7 | function WebGLRenderTargetCube( width, height, options ) { 8 | 9 | WebGLRenderTarget.call( this, width, height, options ); 10 | 11 | this.activeCubeFace = 0; // PX 0, NX 1, PY 2, NY 3, PZ 4, NZ 5 12 | this.activeMipMapLevel = 0; 13 | 14 | } 15 | 16 | WebGLRenderTargetCube.prototype = Object.create( WebGLRenderTarget.prototype ); 17 | WebGLRenderTargetCube.prototype.constructor = WebGLRenderTargetCube; 18 | 19 | WebGLRenderTargetCube.prototype.isWebGLRenderTargetCube = true; 20 | 21 | 22 | export { WebGLRenderTargetCube }; 23 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/alphamap_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_ALPHAMAP 2 | 3 | diffuseColor.a *= texture2D( alphaMap, vUv ).g; 4 | 5 | #endif 6 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/alphamap_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_ALPHAMAP 2 | 3 | uniform sampler2D alphaMap; 4 | 5 | #endif 6 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/alphatest_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef ALPHATEST 2 | 3 | if ( diffuseColor.a < ALPHATEST ) discard; 4 | 5 | #endif 6 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/aomap_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_AOMAP 2 | 3 | // reads channel R, compatible with a combined OcclusionRoughnessMetallic (RGB) texture 4 | float ambientOcclusion = ( texture2D( aoMap, vUv2 ).r - 1.0 ) * aoMapIntensity + 1.0; 5 | 6 | reflectedLight.indirectDiffuse *= ambientOcclusion; 7 | 8 | #if defined( USE_ENVMAP ) && defined( PHYSICAL ) 9 | 10 | float dotNV = saturate( dot( geometry.normal, geometry.viewDir ) ); 11 | 12 | reflectedLight.indirectSpecular *= computeSpecularOcclusion( dotNV, ambientOcclusion, material.specularRoughness ); 13 | 14 | #endif 15 | 16 | #endif 17 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/aomap_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_AOMAP 2 | 3 | uniform sampler2D aoMap; 4 | uniform float aoMapIntensity; 5 | 6 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/begin_vertex.glsl: -------------------------------------------------------------------------------- 1 | 2 | vec3 transformed = vec3( position ); 3 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/beginnormal_vertex.glsl: -------------------------------------------------------------------------------- 1 | 2 | vec3 objectNormal = vec3( normal ); 3 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/clipping_planes_fragment.glsl: -------------------------------------------------------------------------------- 1 | #if NUM_CLIPPING_PLANES > 0 2 | 3 | for ( int i = 0; i < UNION_CLIPPING_PLANES; ++ i ) { 4 | 5 | vec4 plane = clippingPlanes[ i ]; 6 | if ( dot( vViewPosition, plane.xyz ) > plane.w ) discard; 7 | 8 | } 9 | 10 | #if UNION_CLIPPING_PLANES < NUM_CLIPPING_PLANES 11 | 12 | bool clipped = true; 13 | for ( int i = UNION_CLIPPING_PLANES; i < NUM_CLIPPING_PLANES; ++ i ) { 14 | vec4 plane = clippingPlanes[ i ]; 15 | clipped = ( dot( vViewPosition, plane.xyz ) > plane.w ) && clipped; 16 | } 17 | 18 | if ( clipped ) discard; 19 | 20 | #endif 21 | 22 | #endif 23 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/clipping_planes_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #if NUM_CLIPPING_PLANES > 0 2 | 3 | #if ! defined( PHYSICAL ) && ! defined( PHONG ) 4 | varying vec3 vViewPosition; 5 | #endif 6 | 7 | uniform vec4 clippingPlanes[ NUM_CLIPPING_PLANES ]; 8 | 9 | #endif 10 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/clipping_planes_pars_vertex.glsl: -------------------------------------------------------------------------------- 1 | #if NUM_CLIPPING_PLANES > 0 && ! defined( PHYSICAL ) && ! defined( PHONG ) 2 | varying vec3 vViewPosition; 3 | #endif 4 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/clipping_planes_vertex.glsl: -------------------------------------------------------------------------------- 1 | #if NUM_CLIPPING_PLANES > 0 && ! defined( PHYSICAL ) && ! defined( PHONG ) 2 | vViewPosition = - mvPosition.xyz; 3 | #endif 4 | 5 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/color_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_COLOR 2 | 3 | diffuseColor.rgb *= vColor; 4 | 5 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/color_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_COLOR 2 | 3 | varying vec3 vColor; 4 | 5 | #endif 6 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/color_pars_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_COLOR 2 | 3 | varying vec3 vColor; 4 | 5 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/color_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_COLOR 2 | 3 | vColor.xyz = color.xyz; 4 | 5 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/defaultnormal_vertex.glsl: -------------------------------------------------------------------------------- 1 | vec3 transformedNormal = normalMatrix * objectNormal; 2 | 3 | #ifdef FLIP_SIDED 4 | 5 | transformedNormal = - transformedNormal; 6 | 7 | #endif 8 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/displacementmap_pars_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_DISPLACEMENTMAP 2 | 3 | uniform sampler2D displacementMap; 4 | uniform float displacementScale; 5 | uniform float displacementBias; 6 | 7 | #endif 8 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/displacementmap_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_DISPLACEMENTMAP 2 | 3 | transformed += normalize( objectNormal ) * ( texture2D( displacementMap, uv ).x * displacementScale + displacementBias ); 4 | 5 | #endif 6 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/dithering_fragment.glsl: -------------------------------------------------------------------------------- 1 | #if defined( DITHERING ) 2 | 3 | gl_FragColor.rgb = dithering( gl_FragColor.rgb ); 4 | 5 | #endif 6 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/dithering_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #if defined( DITHERING ) 2 | 3 | // based on https://www.shadertoy.com/view/MslGR8 4 | vec3 dithering( vec3 color ) { 5 | //Calculate grid position 6 | float grid_position = rand( gl_FragCoord.xy ); 7 | 8 | //Shift the individual colors differently, thus making it even harder to see the dithering pattern 9 | vec3 dither_shift_RGB = vec3( 0.25 / 255.0, -0.25 / 255.0, 0.25 / 255.0 ); 10 | 11 | //modify shift acording to grid position. 12 | dither_shift_RGB = mix( 2.0 * dither_shift_RGB, -2.0 * dither_shift_RGB, grid_position ); 13 | 14 | //shift the color by dither_shift 15 | return color + dither_shift_RGB; 16 | } 17 | 18 | #endif 19 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/emissivemap_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_EMISSIVEMAP 2 | 3 | vec4 emissiveColor = texture2D( emissiveMap, vUv ); 4 | 5 | emissiveColor.rgb = emissiveMapTexelToLinear( emissiveColor ).rgb; 6 | 7 | totalEmissiveRadiance *= emissiveColor.rgb; 8 | 9 | #endif 10 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/emissivemap_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_EMISSIVEMAP 2 | 3 | uniform sampler2D emissiveMap; 4 | 5 | #endif 6 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/encodings_fragment.glsl: -------------------------------------------------------------------------------- 1 | gl_FragColor = linearToOutputTexel( gl_FragColor ); 2 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/envmap_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #if defined( USE_ENVMAP ) || defined( PHYSICAL ) 2 | uniform float reflectivity; 3 | uniform float envMapIntensity; 4 | #endif 5 | 6 | #ifdef USE_ENVMAP 7 | 8 | #if ! defined( PHYSICAL ) && ( defined( USE_BUMPMAP ) || defined( USE_NORMALMAP ) || defined( PHONG ) ) 9 | varying vec3 vWorldPosition; 10 | #endif 11 | 12 | #ifdef ENVMAP_TYPE_CUBE 13 | uniform samplerCube envMap; 14 | #else 15 | uniform sampler2D envMap; 16 | #endif 17 | uniform float flipEnvMap; 18 | 19 | #if defined( USE_BUMPMAP ) || defined( USE_NORMALMAP ) || defined( PHONG ) || defined( PHYSICAL ) 20 | uniform float refractionRatio; 21 | #else 22 | varying vec3 vReflect; 23 | #endif 24 | 25 | #endif 26 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/envmap_pars_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_ENVMAP 2 | 3 | #if defined( USE_BUMPMAP ) || defined( USE_NORMALMAP ) || defined( PHONG ) 4 | varying vec3 vWorldPosition; 5 | 6 | #else 7 | 8 | varying vec3 vReflect; 9 | uniform float refractionRatio; 10 | 11 | #endif 12 | 13 | #endif 14 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/envmap_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_ENVMAP 2 | 3 | #if defined( USE_BUMPMAP ) || defined( USE_NORMALMAP ) || defined( PHONG ) 4 | 5 | vWorldPosition = worldPosition.xyz; 6 | 7 | #else 8 | 9 | vec3 cameraToVertex = normalize( worldPosition.xyz - cameraPosition ); 10 | 11 | vec3 worldNormal = inverseTransformDirection( transformedNormal, viewMatrix ); 12 | 13 | #ifdef ENVMAP_MODE_REFLECTION 14 | 15 | vReflect = reflect( cameraToVertex, worldNormal ); 16 | 17 | #else 18 | 19 | vReflect = refract( cameraToVertex, worldNormal, refractionRatio ); 20 | 21 | #endif 22 | 23 | #endif 24 | 25 | #endif 26 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/fog_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_FOG 2 | 3 | #ifdef FOG_EXP2 4 | 5 | float fogFactor = whiteCompliment( exp2( - fogDensity * fogDensity * fogDepth * fogDepth * LOG2 ) ); 6 | 7 | #else 8 | 9 | float fogFactor = smoothstep( fogNear, fogFar, fogDepth ); 10 | 11 | #endif 12 | 13 | gl_FragColor.rgb = mix( gl_FragColor.rgb, fogColor, fogFactor ); 14 | 15 | #endif 16 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/fog_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_FOG 2 | 3 | uniform vec3 fogColor; 4 | varying float fogDepth; 5 | 6 | #ifdef FOG_EXP2 7 | 8 | uniform float fogDensity; 9 | 10 | #else 11 | 12 | uniform float fogNear; 13 | uniform float fogFar; 14 | 15 | #endif 16 | 17 | #endif 18 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/fog_pars_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_FOG 2 | 3 | varying float fogDepth; 4 | 5 | #endif 6 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/fog_vertex.glsl: -------------------------------------------------------------------------------- 1 | 2 | #ifdef USE_FOG 3 | fogDepth = -mvPosition.z; 4 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/gradientmap_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef TOON 2 | 3 | uniform sampler2D gradientMap; 4 | 5 | vec3 getGradientIrradiance( vec3 normal, vec3 lightDirection ) { 6 | 7 | // dotNL will be from -1.0 to 1.0 8 | float dotNL = dot( normal, lightDirection ); 9 | vec2 coord = vec2( dotNL * 0.5 + 0.5, 0.0 ); 10 | 11 | #ifdef USE_GRADIENTMAP 12 | 13 | return texture2D( gradientMap, coord ).rgb; 14 | 15 | #else 16 | 17 | return ( coord.x < 0.7 ) ? vec3( 0.7 ) : vec3( 1.0 ); 18 | 19 | #endif 20 | 21 | 22 | } 23 | 24 | #endif 25 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/lightmap_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_LIGHTMAP 2 | 3 | reflectedLight.indirectDiffuse += PI * texture2D( lightMap, vUv2 ).xyz * lightMapIntensity; // factor of PI should not be present; included here to prevent breakage 4 | 5 | #endif 6 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/lightmap_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_LIGHTMAP 2 | 3 | uniform sampler2D lightMap; 4 | uniform float lightMapIntensity; 5 | 6 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/lights_phong_fragment.glsl: -------------------------------------------------------------------------------- 1 | BlinnPhongMaterial material; 2 | material.diffuseColor = diffuseColor.rgb; 3 | material.specularColor = specular; 4 | material.specularShininess = shininess; 5 | material.specularStrength = specularStrength; 6 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/lights_physical_fragment.glsl: -------------------------------------------------------------------------------- 1 | PhysicalMaterial material; 2 | material.diffuseColor = diffuseColor.rgb * ( 1.0 - metalnessFactor ); 3 | material.specularRoughness = clamp( roughnessFactor, 0.04, 1.0 ); 4 | #ifdef STANDARD 5 | material.specularColor = mix( vec3( DEFAULT_SPECULAR_COEFFICIENT ), diffuseColor.rgb, metalnessFactor ); 6 | #else 7 | material.specularColor = mix( vec3( MAXIMUM_SPECULAR_COEFFICIENT * pow2( reflectivity ) ), diffuseColor.rgb, metalnessFactor ); 8 | material.clearCoat = saturate( clearCoat ); // Burley clearcoat model 9 | material.clearCoatRoughness = clamp( clearCoatRoughness, 0.04, 1.0 ); 10 | #endif 11 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/logdepthbuf_fragment.glsl: -------------------------------------------------------------------------------- 1 | #if defined( USE_LOGDEPTHBUF ) && defined( USE_LOGDEPTHBUF_EXT ) 2 | 3 | gl_FragDepthEXT = log2( vFragDepth ) * logDepthBufFC * 0.5; 4 | 5 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/logdepthbuf_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_LOGDEPTHBUF 2 | 3 | uniform float logDepthBufFC; 4 | 5 | #ifdef USE_LOGDEPTHBUF_EXT 6 | 7 | varying float vFragDepth; 8 | 9 | #endif 10 | 11 | #endif 12 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/logdepthbuf_pars_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_LOGDEPTHBUF 2 | 3 | #ifdef USE_LOGDEPTHBUF_EXT 4 | 5 | varying float vFragDepth; 6 | 7 | #endif 8 | 9 | uniform float logDepthBufFC; 10 | 11 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/logdepthbuf_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_LOGDEPTHBUF 2 | 3 | #ifdef USE_LOGDEPTHBUF_EXT 4 | 5 | vFragDepth = 1.0 + gl_Position.w; 6 | 7 | #else 8 | 9 | gl_Position.z = log2( max( EPSILON, gl_Position.w + 1.0 ) ) * logDepthBufFC - 1.0; 10 | 11 | gl_Position.z *= gl_Position.w; 12 | 13 | #endif 14 | 15 | #endif 16 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/map_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_MAP 2 | 3 | vec4 texelColor = texture2D( map, vUv ); 4 | 5 | texelColor = mapTexelToLinear( texelColor ); 6 | diffuseColor *= texelColor; 7 | 8 | #endif 9 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/map_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_MAP 2 | 3 | uniform sampler2D map; 4 | 5 | #endif 6 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/map_particle_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_MAP 2 | 3 | vec2 uv = ( uvTransform * vec3( gl_PointCoord.x, 1.0 - gl_PointCoord.y, 1 ) ).xy; 4 | vec4 mapTexel = texture2D( map, uv ); 5 | diffuseColor *= mapTexelToLinear( mapTexel ); 6 | 7 | #endif 8 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/map_particle_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_MAP 2 | 3 | uniform mat3 uvTransform; 4 | uniform sampler2D map; 5 | 6 | #endif 7 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/metalnessmap_fragment.glsl: -------------------------------------------------------------------------------- 1 | float metalnessFactor = metalness; 2 | 3 | #ifdef USE_METALNESSMAP 4 | 5 | vec4 texelMetalness = texture2D( metalnessMap, vUv ); 6 | 7 | // reads channel B, compatible with a combined OcclusionRoughnessMetallic (RGB) texture 8 | metalnessFactor *= texelMetalness.b; 9 | 10 | #endif 11 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/metalnessmap_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_METALNESSMAP 2 | 3 | uniform sampler2D metalnessMap; 4 | 5 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/morphnormal_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_MORPHNORMALS 2 | 3 | objectNormal += ( morphNormal0 - normal ) * morphTargetInfluences[ 0 ]; 4 | objectNormal += ( morphNormal1 - normal ) * morphTargetInfluences[ 1 ]; 5 | objectNormal += ( morphNormal2 - normal ) * morphTargetInfluences[ 2 ]; 6 | objectNormal += ( morphNormal3 - normal ) * morphTargetInfluences[ 3 ]; 7 | 8 | #endif 9 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/morphtarget_pars_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_MORPHTARGETS 2 | 3 | #ifndef USE_MORPHNORMALS 4 | 5 | uniform float morphTargetInfluences[ 8 ]; 6 | 7 | #else 8 | 9 | uniform float morphTargetInfluences[ 4 ]; 10 | 11 | #endif 12 | 13 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/morphtarget_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_MORPHTARGETS 2 | 3 | transformed += ( morphTarget0 - position ) * morphTargetInfluences[ 0 ]; 4 | transformed += ( morphTarget1 - position ) * morphTargetInfluences[ 1 ]; 5 | transformed += ( morphTarget2 - position ) * morphTargetInfluences[ 2 ]; 6 | transformed += ( morphTarget3 - position ) * morphTargetInfluences[ 3 ]; 7 | 8 | #ifndef USE_MORPHNORMALS 9 | 10 | transformed += ( morphTarget4 - position ) * morphTargetInfluences[ 4 ]; 11 | transformed += ( morphTarget5 - position ) * morphTargetInfluences[ 5 ]; 12 | transformed += ( morphTarget6 - position ) * morphTargetInfluences[ 6 ]; 13 | transformed += ( morphTarget7 - position ) * morphTargetInfluences[ 7 ]; 14 | 15 | #endif 16 | 17 | #endif 18 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/normal_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef FLAT_SHADED 2 | 3 | // Workaround for Adreno/Nexus5 not able able to do dFdx( vViewPosition ) ... 4 | 5 | vec3 fdx = vec3( dFdx( vViewPosition.x ), dFdx( vViewPosition.y ), dFdx( vViewPosition.z ) ); 6 | vec3 fdy = vec3( dFdy( vViewPosition.x ), dFdy( vViewPosition.y ), dFdy( vViewPosition.z ) ); 7 | vec3 normal = normalize( cross( fdx, fdy ) ); 8 | 9 | #else 10 | 11 | vec3 normal = normalize( vNormal ); 12 | 13 | #ifdef DOUBLE_SIDED 14 | 15 | normal = normal * ( float( gl_FrontFacing ) * 2.0 - 1.0 ); 16 | 17 | #endif 18 | 19 | #endif 20 | 21 | #ifdef USE_NORMALMAP 22 | 23 | normal = perturbNormal2Arb( -vViewPosition, normal ); 24 | 25 | #elif defined( USE_BUMPMAP ) 26 | 27 | normal = perturbNormalArb( -vViewPosition, normal, dHdxy_fwd() ); 28 | 29 | #endif 30 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/normalmap_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_NORMALMAP 2 | 3 | uniform sampler2D normalMap; 4 | uniform vec2 normalScale; 5 | 6 | // Per-Pixel Tangent Space Normal Mapping 7 | // http://hacksoflife.blogspot.ch/2009/11/per-pixel-tangent-space-normal-mapping.html 8 | 9 | vec3 perturbNormal2Arb( vec3 eye_pos, vec3 surf_norm ) { 10 | 11 | // Workaround for Adreno 3XX dFd*( vec3 ) bug. See #9988 12 | 13 | vec3 q0 = vec3( dFdx( eye_pos.x ), dFdx( eye_pos.y ), dFdx( eye_pos.z ) ); 14 | vec3 q1 = vec3( dFdy( eye_pos.x ), dFdy( eye_pos.y ), dFdy( eye_pos.z ) ); 15 | vec2 st0 = dFdx( vUv.st ); 16 | vec2 st1 = dFdy( vUv.st ); 17 | 18 | vec3 S = normalize( q0 * st1.t - q1 * st0.t ); 19 | vec3 T = normalize( -q0 * st1.s + q1 * st0.s ); 20 | vec3 N = normalize( surf_norm ); 21 | 22 | vec3 mapN = texture2D( normalMap, vUv ).xyz * 2.0 - 1.0; 23 | mapN.xy = normalScale * mapN.xy; 24 | mat3 tsn = mat3( S, T, N ); 25 | return normalize( tsn * mapN ); 26 | 27 | } 28 | 29 | #endif 30 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/premultiplied_alpha_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef PREMULTIPLIED_ALPHA 2 | 3 | // Get get normal blending with premultipled, use with CustomBlending, OneFactor, OneMinusSrcAlphaFactor, AddEquation. 4 | gl_FragColor.rgb *= gl_FragColor.a; 5 | 6 | #endif 7 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/project_vertex.glsl: -------------------------------------------------------------------------------- 1 | vec4 mvPosition = modelViewMatrix * vec4( transformed, 1.0 ); 2 | 3 | gl_Position = projectionMatrix * mvPosition; 4 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/roughnessmap_fragment.glsl: -------------------------------------------------------------------------------- 1 | float roughnessFactor = roughness; 2 | 3 | #ifdef USE_ROUGHNESSMAP 4 | 5 | vec4 texelRoughness = texture2D( roughnessMap, vUv ); 6 | 7 | // reads channel G, compatible with a combined OcclusionRoughnessMetallic (RGB) texture 8 | roughnessFactor *= texelRoughness.g; 9 | 10 | #endif 11 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/roughnessmap_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_ROUGHNESSMAP 2 | 3 | uniform sampler2D roughnessMap; 4 | 5 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/shadowmap_pars_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_SHADOWMAP 2 | 3 | #if NUM_DIR_LIGHTS > 0 4 | 5 | uniform mat4 directionalShadowMatrix[ NUM_DIR_LIGHTS ]; 6 | varying vec4 vDirectionalShadowCoord[ NUM_DIR_LIGHTS ]; 7 | 8 | #endif 9 | 10 | #if NUM_SPOT_LIGHTS > 0 11 | 12 | uniform mat4 spotShadowMatrix[ NUM_SPOT_LIGHTS ]; 13 | varying vec4 vSpotShadowCoord[ NUM_SPOT_LIGHTS ]; 14 | 15 | #endif 16 | 17 | #if NUM_POINT_LIGHTS > 0 18 | 19 | uniform mat4 pointShadowMatrix[ NUM_POINT_LIGHTS ]; 20 | varying vec4 vPointShadowCoord[ NUM_POINT_LIGHTS ]; 21 | 22 | #endif 23 | 24 | /* 25 | #if NUM_RECT_AREA_LIGHTS > 0 26 | 27 | // TODO (abelnation): uniforms for area light shadows 28 | 29 | #endif 30 | */ 31 | 32 | #endif 33 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/shadowmap_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_SHADOWMAP 2 | 3 | #if NUM_DIR_LIGHTS > 0 4 | 5 | for ( int i = 0; i < NUM_DIR_LIGHTS; i ++ ) { 6 | 7 | vDirectionalShadowCoord[ i ] = directionalShadowMatrix[ i ] * worldPosition; 8 | 9 | } 10 | 11 | #endif 12 | 13 | #if NUM_SPOT_LIGHTS > 0 14 | 15 | for ( int i = 0; i < NUM_SPOT_LIGHTS; i ++ ) { 16 | 17 | vSpotShadowCoord[ i ] = spotShadowMatrix[ i ] * worldPosition; 18 | 19 | } 20 | 21 | #endif 22 | 23 | #if NUM_POINT_LIGHTS > 0 24 | 25 | for ( int i = 0; i < NUM_POINT_LIGHTS; i ++ ) { 26 | 27 | vPointShadowCoord[ i ] = pointShadowMatrix[ i ] * worldPosition; 28 | 29 | } 30 | 31 | #endif 32 | 33 | /* 34 | #if NUM_RECT_AREA_LIGHTS > 0 35 | 36 | // TODO (abelnation): update vAreaShadowCoord with area light info 37 | 38 | #endif 39 | */ 40 | 41 | #endif 42 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/skinbase_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_SKINNING 2 | 3 | mat4 boneMatX = getBoneMatrix( skinIndex.x ); 4 | mat4 boneMatY = getBoneMatrix( skinIndex.y ); 5 | mat4 boneMatZ = getBoneMatrix( skinIndex.z ); 6 | mat4 boneMatW = getBoneMatrix( skinIndex.w ); 7 | 8 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/skinning_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_SKINNING 2 | 3 | vec4 skinVertex = bindMatrix * vec4( transformed, 1.0 ); 4 | 5 | vec4 skinned = vec4( 0.0 ); 6 | skinned += boneMatX * skinVertex * skinWeight.x; 7 | skinned += boneMatY * skinVertex * skinWeight.y; 8 | skinned += boneMatZ * skinVertex * skinWeight.z; 9 | skinned += boneMatW * skinVertex * skinWeight.w; 10 | 11 | transformed = ( bindMatrixInverse * skinned ).xyz; 12 | 13 | #endif 14 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/skinnormal_vertex.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_SKINNING 2 | 3 | mat4 skinMatrix = mat4( 0.0 ); 4 | skinMatrix += skinWeight.x * boneMatX; 5 | skinMatrix += skinWeight.y * boneMatY; 6 | skinMatrix += skinWeight.z * boneMatZ; 7 | skinMatrix += skinWeight.w * boneMatW; 8 | skinMatrix = bindMatrixInverse * skinMatrix * bindMatrix; 9 | 10 | objectNormal = vec4( skinMatrix * vec4( objectNormal, 0.0 ) ).xyz; 11 | 12 | #endif 13 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/specularmap_fragment.glsl: -------------------------------------------------------------------------------- 1 | float specularStrength; 2 | 3 | #ifdef USE_SPECULARMAP 4 | 5 | vec4 texelSpecular = texture2D( specularMap, vUv ); 6 | specularStrength = texelSpecular.r; 7 | 8 | #else 9 | 10 | specularStrength = 1.0; 11 | 12 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/specularmap_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #ifdef USE_SPECULARMAP 2 | 3 | uniform sampler2D specularMap; 4 | 5 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/tonemapping_fragment.glsl: -------------------------------------------------------------------------------- 1 | #if defined( TONE_MAPPING ) 2 | 3 | gl_FragColor.rgb = toneMapping( gl_FragColor.rgb ); 4 | 5 | #endif 6 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/uv2_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #if defined( USE_LIGHTMAP ) || defined( USE_AOMAP ) 2 | 3 | varying vec2 vUv2; 4 | 5 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/uv2_pars_vertex.glsl: -------------------------------------------------------------------------------- 1 | #if defined( USE_LIGHTMAP ) || defined( USE_AOMAP ) 2 | 3 | attribute vec2 uv2; 4 | varying vec2 vUv2; 5 | 6 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/uv2_vertex.glsl: -------------------------------------------------------------------------------- 1 | #if defined( USE_LIGHTMAP ) || defined( USE_AOMAP ) 2 | 3 | vUv2 = uv2; 4 | 5 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/uv_pars_fragment.glsl: -------------------------------------------------------------------------------- 1 | #if defined( USE_MAP ) || defined( USE_BUMPMAP ) || defined( USE_NORMALMAP ) || defined( USE_SPECULARMAP ) || defined( USE_ALPHAMAP ) || defined( USE_EMISSIVEMAP ) || defined( USE_ROUGHNESSMAP ) || defined( USE_METALNESSMAP ) 2 | 3 | varying vec2 vUv; 4 | 5 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/uv_pars_vertex.glsl: -------------------------------------------------------------------------------- 1 | #if defined( USE_MAP ) || defined( USE_BUMPMAP ) || defined( USE_NORMALMAP ) || defined( USE_SPECULARMAP ) || defined( USE_ALPHAMAP ) || defined( USE_EMISSIVEMAP ) || defined( USE_ROUGHNESSMAP ) || defined( USE_METALNESSMAP ) 2 | 3 | varying vec2 vUv; 4 | uniform mat3 uvTransform; 5 | 6 | #endif 7 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/uv_vertex.glsl: -------------------------------------------------------------------------------- 1 | #if defined( USE_MAP ) || defined( USE_BUMPMAP ) || defined( USE_NORMALMAP ) || defined( USE_SPECULARMAP ) || defined( USE_ALPHAMAP ) || defined( USE_EMISSIVEMAP ) || defined( USE_ROUGHNESSMAP ) || defined( USE_METALNESSMAP ) 2 | 3 | vUv = ( uvTransform * vec3( uv, 1 ) ).xy; 4 | 5 | #endif -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderChunk/worldpos_vertex.glsl: -------------------------------------------------------------------------------- 1 | #if defined( USE_ENVMAP ) || defined( DISTANCE ) || defined ( USE_SHADOWMAP ) 2 | 3 | vec4 worldPosition = modelMatrix * vec4( transformed, 1.0 ); 4 | 5 | #endif 6 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/cube_frag.glsl: -------------------------------------------------------------------------------- 1 | uniform samplerCube tCube; 2 | uniform float tFlip; 3 | uniform float opacity; 4 | 5 | varying vec3 vWorldPosition; 6 | 7 | void main() { 8 | 9 | gl_FragColor = textureCube( tCube, vec3( tFlip * vWorldPosition.x, vWorldPosition.yz ) ); 10 | gl_FragColor.a *= opacity; 11 | 12 | } 13 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/cube_vert.glsl: -------------------------------------------------------------------------------- 1 | varying vec3 vWorldPosition; 2 | 3 | #include 4 | 5 | void main() { 6 | 7 | vWorldPosition = transformDirection( position, modelMatrix ); 8 | 9 | #include 10 | #include 11 | 12 | gl_Position.z = gl_Position.w; // set z to camera.far 13 | 14 | } 15 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/depth_frag.glsl: -------------------------------------------------------------------------------- 1 | #if DEPTH_PACKING == 3200 2 | 3 | uniform float opacity; 4 | 5 | #endif 6 | 7 | #include 8 | #include 9 | #include 10 | #include 11 | #include 12 | #include 13 | #include 14 | 15 | void main() { 16 | 17 | #include 18 | 19 | vec4 diffuseColor = vec4( 1.0 ); 20 | 21 | #if DEPTH_PACKING == 3200 22 | 23 | diffuseColor.a = opacity; 24 | 25 | #endif 26 | 27 | #include 28 | #include 29 | #include 30 | 31 | #include 32 | 33 | #if DEPTH_PACKING == 3200 34 | 35 | gl_FragColor = vec4( vec3( gl_FragCoord.z ), opacity ); 36 | 37 | #elif DEPTH_PACKING == 3201 38 | 39 | gl_FragColor = packDepthToRGBA( gl_FragCoord.z ); 40 | 41 | #endif 42 | 43 | } 44 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/depth_vert.glsl: -------------------------------------------------------------------------------- 1 | #include 2 | #include 3 | #include 4 | #include 5 | #include 6 | #include 7 | #include 8 | 9 | void main() { 10 | 11 | #include 12 | 13 | #include 14 | 15 | #ifdef USE_DISPLACEMENTMAP 16 | 17 | #include 18 | #include 19 | #include 20 | 21 | #endif 22 | 23 | #include 24 | #include 25 | #include 26 | #include 27 | #include 28 | #include 29 | #include 30 | 31 | } 32 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/distanceRGBA_frag.glsl: -------------------------------------------------------------------------------- 1 | #define DISTANCE 2 | 3 | uniform vec3 referencePosition; 4 | uniform float nearDistance; 5 | uniform float farDistance; 6 | varying vec3 vWorldPosition; 7 | 8 | #include 9 | #include 10 | #include 11 | #include 12 | #include 13 | #include 14 | 15 | void main () { 16 | 17 | #include 18 | 19 | vec4 diffuseColor = vec4( 1.0 ); 20 | 21 | #include 22 | #include 23 | #include 24 | 25 | float dist = length( vWorldPosition - referencePosition ); 26 | dist = ( dist - nearDistance ) / ( farDistance - nearDistance ); 27 | dist = saturate( dist ); // clamp to [ 0, 1 ] 28 | 29 | gl_FragColor = packDepthToRGBA( dist ); 30 | 31 | } 32 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/distanceRGBA_vert.glsl: -------------------------------------------------------------------------------- 1 | #define DISTANCE 2 | 3 | varying vec3 vWorldPosition; 4 | 5 | #include 6 | #include 7 | #include 8 | #include 9 | #include 10 | #include 11 | 12 | void main() { 13 | 14 | #include 15 | 16 | #include 17 | 18 | #ifdef USE_DISPLACEMENTMAP 19 | 20 | #include 21 | #include 22 | #include 23 | 24 | #endif 25 | 26 | #include 27 | #include 28 | #include 29 | #include 30 | #include 31 | #include 32 | #include 33 | 34 | vWorldPosition = worldPosition.xyz; 35 | 36 | } 37 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/equirect_frag.glsl: -------------------------------------------------------------------------------- 1 | uniform sampler2D tEquirect; 2 | 3 | varying vec3 vWorldPosition; 4 | 5 | #include 6 | 7 | void main() { 8 | 9 | vec3 direction = normalize( vWorldPosition ); 10 | 11 | vec2 sampleUV; 12 | 13 | sampleUV.y = asin( clamp( direction.y, - 1.0, 1.0 ) ) * RECIPROCAL_PI + 0.5; 14 | 15 | sampleUV.x = atan( direction.z, direction.x ) * RECIPROCAL_PI2 + 0.5; 16 | 17 | gl_FragColor = texture2D( tEquirect, sampleUV ); 18 | 19 | } 20 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/equirect_vert.glsl: -------------------------------------------------------------------------------- 1 | varying vec3 vWorldPosition; 2 | 3 | #include 4 | 5 | void main() { 6 | 7 | vWorldPosition = transformDirection( position, modelMatrix ); 8 | 9 | #include 10 | #include 11 | 12 | } 13 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/linedashed_frag.glsl: -------------------------------------------------------------------------------- 1 | uniform vec3 diffuse; 2 | uniform float opacity; 3 | 4 | uniform float dashSize; 5 | uniform float totalSize; 6 | 7 | varying float vLineDistance; 8 | 9 | #include 10 | #include 11 | #include 12 | #include 13 | #include 14 | 15 | void main() { 16 | 17 | #include 18 | 19 | if ( mod( vLineDistance, totalSize ) > dashSize ) { 20 | 21 | discard; 22 | 23 | } 24 | 25 | vec3 outgoingLight = vec3( 0.0 ); 26 | vec4 diffuseColor = vec4( diffuse, opacity ); 27 | 28 | #include 29 | #include 30 | 31 | outgoingLight = diffuseColor.rgb; // simple shader 32 | 33 | gl_FragColor = vec4( outgoingLight, diffuseColor.a ); 34 | 35 | #include 36 | #include 37 | #include 38 | #include 39 | 40 | } 41 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/linedashed_vert.glsl: -------------------------------------------------------------------------------- 1 | uniform float scale; 2 | attribute float lineDistance; 3 | 4 | varying float vLineDistance; 5 | 6 | #include 7 | #include 8 | #include 9 | #include 10 | #include 11 | 12 | void main() { 13 | 14 | #include 15 | 16 | vLineDistance = scale * lineDistance; 17 | 18 | vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 ); 19 | gl_Position = projectionMatrix * mvPosition; 20 | 21 | #include 22 | #include 23 | #include 24 | 25 | } 26 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/meshbasic_vert.glsl: -------------------------------------------------------------------------------- 1 | #include 2 | #include 3 | #include 4 | #include 5 | #include 6 | #include 7 | #include 8 | #include 9 | #include 10 | #include 11 | 12 | void main() { 13 | 14 | #include 15 | #include 16 | #include 17 | #include 18 | 19 | #ifdef USE_ENVMAP 20 | 21 | #include 22 | #include 23 | #include 24 | #include 25 | 26 | #endif 27 | 28 | #include 29 | #include 30 | #include 31 | #include 32 | #include 33 | 34 | #include 35 | #include 36 | #include 37 | #include 38 | 39 | } 40 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/normal_frag.glsl: -------------------------------------------------------------------------------- 1 | #define NORMAL 2 | 3 | uniform float opacity; 4 | 5 | #if defined( FLAT_SHADED ) || defined( USE_BUMPMAP ) || defined( USE_NORMALMAP ) 6 | 7 | varying vec3 vViewPosition; 8 | 9 | #endif 10 | 11 | #ifndef FLAT_SHADED 12 | 13 | varying vec3 vNormal; 14 | 15 | #endif 16 | 17 | #include 18 | #include 19 | #include 20 | #include 21 | #include 22 | 23 | void main() { 24 | 25 | #include 26 | #include 27 | 28 | gl_FragColor = vec4( packNormalToRGB( normal ), opacity ); 29 | 30 | } 31 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/points_frag.glsl: -------------------------------------------------------------------------------- 1 | uniform vec3 diffuse; 2 | uniform float opacity; 3 | 4 | #include 5 | #include 6 | #include 7 | #include 8 | #include 9 | #include 10 | #include 11 | #include 12 | 13 | void main() { 14 | 15 | #include 16 | 17 | vec3 outgoingLight = vec3( 0.0 ); 18 | vec4 diffuseColor = vec4( diffuse, opacity ); 19 | 20 | #include 21 | #include 22 | #include 23 | #include 24 | 25 | outgoingLight = diffuseColor.rgb; 26 | 27 | gl_FragColor = vec4( outgoingLight, diffuseColor.a ); 28 | 29 | #include 30 | #include 31 | #include 32 | #include 33 | 34 | } 35 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/points_vert.glsl: -------------------------------------------------------------------------------- 1 | uniform float size; 2 | uniform float scale; 3 | 4 | #include 5 | #include 6 | #include 7 | #include 8 | #include 9 | #include 10 | 11 | void main() { 12 | 13 | #include 14 | #include 15 | #include 16 | 17 | #ifdef USE_SIZEATTENUATION 18 | gl_PointSize = size * ( scale / - mvPosition.z ); 19 | #else 20 | gl_PointSize = size; 21 | #endif 22 | 23 | #include 24 | #include 25 | #include 26 | #include 27 | #include 28 | 29 | } 30 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/shadow_frag.glsl: -------------------------------------------------------------------------------- 1 | uniform vec3 color; 2 | uniform float opacity; 3 | 4 | #include 5 | #include 6 | #include 7 | #include 8 | #include 9 | #include 10 | #include 11 | 12 | void main() { 13 | 14 | gl_FragColor = vec4( color, opacity * ( 1.0 - getShadowMask() ) ); 15 | 16 | #include 17 | 18 | } 19 | -------------------------------------------------------------------------------- /lib/three/src/renderers/shaders/ShaderLib/shadow_vert.glsl: -------------------------------------------------------------------------------- 1 | #include 2 | #include 3 | 4 | void main() { 5 | 6 | #include 7 | #include 8 | #include 9 | #include 10 | #include 11 | 12 | } 13 | -------------------------------------------------------------------------------- /lib/three/src/renderers/webgl/WebGLObjects.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author mrdoob / http://mrdoob.com/ 3 | */ 4 | 5 | function WebGLObjects( geometries, infoRender ) { 6 | 7 | var updateList = {}; 8 | 9 | function update( object ) { 10 | 11 | var frame = infoRender.frame; 12 | 13 | var geometry = object.geometry; 14 | var buffergeometry = geometries.get( object, geometry ); 15 | 16 | // Update once per frame 17 | 18 | if ( updateList[ buffergeometry.id ] !== frame ) { 19 | 20 | if ( geometry.isGeometry ) { 21 | 22 | buffergeometry.updateFromObject( object ); 23 | 24 | } 25 | 26 | geometries.update( buffergeometry ); 27 | 28 | updateList[ buffergeometry.id ] = frame; 29 | 30 | } 31 | 32 | return buffergeometry; 33 | 34 | } 35 | 36 | function clear() { 37 | 38 | updateList = {}; 39 | 40 | } 41 | 42 | return { 43 | 44 | update: update, 45 | clear: clear 46 | 47 | }; 48 | 49 | } 50 | 51 | 52 | export { WebGLObjects }; 53 | -------------------------------------------------------------------------------- /lib/three/src/renderers/webgl/WebGLProperties.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author fordacious / fordacious.github.io 3 | */ 4 | 5 | function WebGLProperties() { 6 | 7 | var properties = {}; 8 | 9 | function get( object ) { 10 | 11 | var uuid = object.uuid; 12 | var map = properties[ uuid ]; 13 | 14 | if ( map === undefined ) { 15 | 16 | map = {}; 17 | properties[ uuid ] = map; 18 | 19 | } 20 | 21 | return map; 22 | 23 | } 24 | 25 | function remove( object ) { 26 | 27 | delete properties[ object.uuid ]; 28 | 29 | } 30 | 31 | function clear() { 32 | 33 | properties = {}; 34 | 35 | } 36 | 37 | return { 38 | get: get, 39 | remove: remove, 40 | clear: clear 41 | }; 42 | 43 | } 44 | 45 | 46 | export { WebGLProperties }; 47 | -------------------------------------------------------------------------------- /lib/three/src/scenes/Fog.js: -------------------------------------------------------------------------------- 1 | import { Color } from '../math/Color.js'; 2 | 3 | /** 4 | * @author mrdoob / http://mrdoob.com/ 5 | * @author alteredq / http://alteredqualia.com/ 6 | */ 7 | 8 | function Fog( color, near, far ) { 9 | 10 | this.name = ''; 11 | 12 | this.color = new Color( color ); 13 | 14 | this.near = ( near !== undefined ) ? near : 1; 15 | this.far = ( far !== undefined ) ? far : 1000; 16 | 17 | } 18 | 19 | Fog.prototype.isFog = true; 20 | 21 | Fog.prototype.clone = function () { 22 | 23 | return new Fog( this.color.getHex(), this.near, this.far ); 24 | 25 | }; 26 | 27 | Fog.prototype.toJSON = function ( /* meta */ ) { 28 | 29 | return { 30 | type: 'Fog', 31 | color: this.color.getHex(), 32 | near: this.near, 33 | far: this.far 34 | }; 35 | 36 | }; 37 | 38 | export { Fog }; 39 | -------------------------------------------------------------------------------- /lib/three/src/scenes/FogExp2.js: -------------------------------------------------------------------------------- 1 | import { Color } from '../math/Color.js'; 2 | 3 | /** 4 | * @author mrdoob / http://mrdoob.com/ 5 | * @author alteredq / http://alteredqualia.com/ 6 | */ 7 | 8 | function FogExp2( color, density ) { 9 | 10 | this.name = ''; 11 | 12 | this.color = new Color( color ); 13 | this.density = ( density !== undefined ) ? density : 0.00025; 14 | 15 | } 16 | 17 | FogExp2.prototype.isFogExp2 = true; 18 | 19 | FogExp2.prototype.clone = function () { 20 | 21 | return new FogExp2( this.color.getHex(), this.density ); 22 | 23 | }; 24 | 25 | FogExp2.prototype.toJSON = function ( /* meta */ ) { 26 | 27 | return { 28 | type: 'FogExp2', 29 | color: this.color.getHex(), 30 | density: this.density 31 | }; 32 | 33 | }; 34 | 35 | export { FogExp2 }; 36 | -------------------------------------------------------------------------------- /lib/three/src/textures/CanvasTexture.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author mrdoob / http://mrdoob.com/ 3 | */ 4 | 5 | import { Texture } from './Texture.js'; 6 | 7 | function CanvasTexture( canvas, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy ) { 8 | 9 | Texture.call( this, canvas, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy ); 10 | 11 | this.needsUpdate = true; 12 | 13 | } 14 | 15 | CanvasTexture.prototype = Object.create( Texture.prototype ); 16 | CanvasTexture.prototype.constructor = CanvasTexture; 17 | 18 | 19 | export { CanvasTexture }; 20 | -------------------------------------------------------------------------------- /lib/three/src/textures/CompressedTexture.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author alteredq / http://alteredqualia.com/ 3 | */ 4 | 5 | import { Texture } from './Texture.js'; 6 | 7 | function CompressedTexture( mipmaps, width, height, format, type, mapping, wrapS, wrapT, magFilter, minFilter, anisotropy, encoding ) { 8 | 9 | Texture.call( this, null, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy, encoding ); 10 | 11 | this.image = { width: width, height: height }; 12 | this.mipmaps = mipmaps; 13 | 14 | // no flipping for cube textures 15 | // (also flipping doesn't work for compressed textures ) 16 | 17 | this.flipY = false; 18 | 19 | // can't generate mipmaps for compressed textures 20 | // mips must be embedded in DDS files 21 | 22 | this.generateMipmaps = false; 23 | 24 | } 25 | 26 | CompressedTexture.prototype = Object.create( Texture.prototype ); 27 | CompressedTexture.prototype.constructor = CompressedTexture; 28 | 29 | CompressedTexture.prototype.isCompressedTexture = true; 30 | 31 | 32 | export { CompressedTexture }; 33 | -------------------------------------------------------------------------------- /lib/three/src/textures/CubeTexture.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author mrdoob / http://mrdoob.com/ 3 | */ 4 | 5 | import { Texture } from './Texture.js'; 6 | import { CubeReflectionMapping } from '../constants.js'; 7 | 8 | function CubeTexture( images, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy, encoding ) { 9 | 10 | images = images !== undefined ? images : []; 11 | mapping = mapping !== undefined ? mapping : CubeReflectionMapping; 12 | 13 | Texture.call( this, images, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy, encoding ); 14 | 15 | this.flipY = false; 16 | 17 | } 18 | 19 | CubeTexture.prototype = Object.create( Texture.prototype ); 20 | CubeTexture.prototype.constructor = CubeTexture; 21 | 22 | CubeTexture.prototype.isCubeTexture = true; 23 | 24 | Object.defineProperty( CubeTexture.prototype, 'images', { 25 | 26 | get: function () { 27 | 28 | return this.image; 29 | 30 | }, 31 | 32 | set: function ( value ) { 33 | 34 | this.image = value; 35 | 36 | } 37 | 38 | } ); 39 | 40 | 41 | export { CubeTexture }; 42 | -------------------------------------------------------------------------------- /lib/three/src/textures/DataTexture.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author alteredq / http://alteredqualia.com/ 3 | */ 4 | 5 | import { Texture } from './Texture.js'; 6 | import { NearestFilter } from '../constants.js'; 7 | 8 | function DataTexture( data, width, height, format, type, mapping, wrapS, wrapT, magFilter, minFilter, anisotropy, encoding ) { 9 | 10 | Texture.call( this, null, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy, encoding ); 11 | 12 | this.image = { data: data, width: width, height: height }; 13 | 14 | this.magFilter = magFilter !== undefined ? magFilter : NearestFilter; 15 | this.minFilter = minFilter !== undefined ? minFilter : NearestFilter; 16 | 17 | this.generateMipmaps = false; 18 | this.flipY = false; 19 | this.unpackAlignment = 1; 20 | 21 | } 22 | 23 | DataTexture.prototype = Object.create( Texture.prototype ); 24 | DataTexture.prototype.constructor = DataTexture; 25 | 26 | DataTexture.prototype.isDataTexture = true; 27 | 28 | 29 | export { DataTexture }; 30 | -------------------------------------------------------------------------------- /lib/three/src/utils.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author mrdoob / http://mrdoob.com/ 3 | */ 4 | 5 | function arrayMin( array ) { 6 | 7 | if ( array.length === 0 ) return Infinity; 8 | 9 | var min = array[ 0 ]; 10 | 11 | for ( var i = 1, l = array.length; i < l; ++ i ) { 12 | 13 | if ( array[ i ] < min ) min = array[ i ]; 14 | 15 | } 16 | 17 | return min; 18 | 19 | } 20 | 21 | function arrayMax( array ) { 22 | 23 | if ( array.length === 0 ) return - Infinity; 24 | 25 | var max = array[ 0 ]; 26 | 27 | for ( var i = 1, l = array.length; i < l; ++ i ) { 28 | 29 | if ( array[ i ] > max ) max = array[ i ]; 30 | 31 | } 32 | 33 | return max; 34 | 35 | } 36 | 37 | export { arrayMin, arrayMax }; 38 | -------------------------------------------------------------------------------- /lib/tofu.js/src/extras/panorama/AnchorBase.js: -------------------------------------------------------------------------------- 1 | import { Group, Matrix4 } from 'three'; 2 | 3 | /** 4 | * anchor class, help your to bind interaction event 5 | */ 6 | class AnchorBase extends Group { 7 | /** 8 | * help you caculate anchor position, relative which parent 9 | * 10 | * @param {Vector3} point global position relative camera 11 | * @param {Object3D} parent relative which parent 12 | * @return {Vector3} position relative parent coordinate system 13 | */ 14 | putWhere(point, parent) { 15 | point.multiplyScalar(0.9); 16 | point.applyMatrix4(new Matrix4().getInverse(parent.matrixWorld)); 17 | this.position.set(point.x, point.y, point.z); 18 | this.lookAt(0, 0, 0); 19 | return point; 20 | } 21 | 22 | /** 23 | * put anchor to which posotion, position was relative it's parent 24 | * 25 | * @param {Vector3} position position was relative it's parent 26 | */ 27 | putHere(position) { 28 | this.position.set(position.x, position.y, position.z); 29 | this.lookAt(0, 0, 0); 30 | } 31 | } 32 | 33 | export default AnchorBase; 34 | -------------------------------------------------------------------------------- /lib/tofu.js/src/postprocessing/ClearMaskPass.js: -------------------------------------------------------------------------------- 1 | import Pass from './Pass'; 2 | 3 | export default class ClearMaskPass extends Pass { 4 | constructor() { 5 | super(); 6 | this.needsSwap = false; 7 | } 8 | 9 | render(renderer) { 10 | renderer.state.buffers.stencil.setTest(false); 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /lib/tofu.js/src/postprocessing/Pass.js: -------------------------------------------------------------------------------- 1 | /* eslint no-unused-vars: 0 */ 2 | 3 | export default class Pass { 4 | constructor() { 5 | // if set to true, the pass is processed by the composer 6 | this.enabled = true; 7 | 8 | // if set to true, the pass indicates to swap read and write buffer after rendering 9 | this.needsSwap = true; 10 | 11 | // if set to true, the pass clears its buffer before rendering 12 | this.clear = false; 13 | 14 | // if set to true, the result of the pass is rendered to screen 15 | this.renderToScreen = false; 16 | } 17 | 18 | setSize(width, height) {} 19 | 20 | render(renderer, writeBuffer, readBuffer, delta) { 21 | console.error('Pass: .render() must be implemented in derived pass.'); 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /lib/tofu.js/src/shader/CopyShader.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author alteredq / http://alteredqualia.com/ 3 | * 4 | * Full-screen textured quad shader 5 | * @private 6 | */ 7 | 8 | const CopyShader = { 9 | 10 | uniforms: { 11 | 12 | tDiffuse: { value: null }, 13 | opacity: { value: 1.0 }, 14 | 15 | }, 16 | 17 | vertexShader: ` 18 | varying vec2 vUv; 19 | void main() { 20 | vUv = uv; 21 | gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 22 | }`, 23 | 24 | fragmentShader: ` 25 | uniform float opacity; 26 | uniform sampler2D tDiffuse; 27 | varying vec2 vUv; 28 | void main() { 29 | vec4 texel = texture2D( tDiffuse, vUv ); 30 | gl_FragColor = opacity * texel; 31 | }`, 32 | 33 | }; 34 | 35 | export default CopyShader; 36 | -------------------------------------------------------------------------------- /lib/tofu.js/src/utils/Smooth.js: -------------------------------------------------------------------------------- 1 | import { Vector3 } from 'three'; 2 | 3 | export default class Smooth { 4 | constructor(object, options) { 5 | options = options || {}; 6 | this.object = object; 7 | this.to = new Vector3().copy(object); 8 | this.now = this.to.clone(); 9 | this.speed = options.speed || 0.02; 10 | this.noise = options.noise || 0.000001; 11 | } 12 | goto(x, y, z) { 13 | this.to.set(x, y, z); 14 | } 15 | update() { 16 | const space = this.to.clone().sub(this.now).multiplyScalar(this.speed); 17 | if (space.length() < this.noise) return; 18 | this.now.add(space); 19 | this.object.x = this.now.x; 20 | this.object.y = this.now.y; 21 | this.object.z = this.now.z; 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /lib/tofu.shaderprimer/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines. 4 | 5 | 6 | ## 0.0.1 (2018-08-27) 7 | 8 | 9 | ### Features 10 | 11 | * **init:** init project and build up some script ([ab1d1aa](https://github.com/jasonChen1982/tofu.shaderprimer/commit/ab1d1aa)) 12 | -------------------------------------------------------------------------------- /lib/tofu.shaderprimer/README.md: -------------------------------------------------------------------------------- 1 | tofu.shaderprimer — shader primer class 2 | ============= 3 | 4 | ## Introduction 5 | 6 | use this library you can render a pixel-shader easy 7 | 8 | ## Examples 9 | 10 | you can visit here [shader-studio]() 11 | 12 | or clone this repository and install dependencies. 13 | 14 | ```sh 15 | npm i 16 | ``` 17 | 18 | after it all, run http-server and go to `./demos` path. 19 | 20 | ```sh 21 | npm run http 22 | ``` 23 | -------------------------------------------------------------------------------- /lib/tofu.shaderprimer/src/index.js: -------------------------------------------------------------------------------- 1 | import { 2 | PlaneBufferGeometry, 3 | UniformsUtils, 4 | ShaderMaterial, 5 | } from 'three'; 6 | import { Primer } from 'tofu.js'; 7 | 8 | class ShaderPrimer extends Primer { 9 | constructor(shader) { 10 | 11 | /** 12 | * geometry for this 2D context 13 | * @member {PlaneBufferGeometry} 14 | * @private 15 | */ 16 | const geo = new PlaneBufferGeometry(2, 2); 17 | 18 | const uniforms = UniformsUtils.clone(shader.uniforms); 19 | 20 | /** 21 | * material for this 2D context 22 | * @member {MeshBasicMaterial} 23 | * @private 24 | */ 25 | const mat = new ShaderMaterial({ 26 | uniforms, 27 | vertexShader: shader.vertexShader, 28 | fragmentShader: shader.fragmentShader, 29 | }); 30 | 31 | super(geo, mat, {}); 32 | 33 | this.uniforms = uniforms; 34 | } 35 | } 36 | 37 | export { ShaderPrimer }; 38 | --------------------------------------------------------------------------------