tsl-textures 0.8.0 → 0.9.1

package/README.md

@@ -12,3 +12,12 @@ for both the planet and its moon; and [stars.js](https://boytchev.github.io/tsl-
 for the stars. Click on the image for a live demo.
 
 [<img src="https://boytchev.github.io/tsl-textures/examples/example-planet.jpg">](https://boytchev.github.io/tsl-textures/examples/example-planet.html)
+
+
+#### Example "Normal map"
+
+Uses tsl-utils.js to generate two normal maps and the transition between them.
+The normal are created directly without using any of the TSL texture generators.
+Click on the image for a live demo.
+
+[<img src="https://boytchev.github.io/tsl-textures/examples/example-normal-map.jpg">](https://boytchev.github.io/tsl-textures/examples/example-normal-map.html)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tsl-textures",
-  "version": "0.8.0",
+  "version": "0.9.1",
   "description": "A collection of Three.js Shading Language (TSL) textures ",
   "main": "index.js",
   "repository": {

package/src/concrete.js

@@ -3,7 +3,7 @@
 
 
 
-import { abs, cos, cross, exp, normalLocal, positionLocal, pow, remap, sin, sub, tangentLocal, tslFn, vec3 } from 'three/nodes';
+import { abs, cos, cross, exp, modelNormalMatrix, normalLocal, positionLocal, pow, remap, sin, sub, tangentLocal, tslFn, vec3 } from 'three/nodes';
 import { noise } from 'tsl-textures/tsl-utils.js';
 
 
@@ -37,7 +37,7 @@ var concrete = tslFn( ( params ) => {
 	var dU = sub( posU, pos ),
 		dV = sub( posV, pos );
 
-	return cross( dU, dV ).normalize();
+	return modelNormalMatrix.mul( cross( dU, dV ).normalize() );
 
 } );
 

package/src/polka-dots.js

@@ -4,8 +4,8 @@
 
 
 import { Color } from "three";
-import { acos, add, distance, exp, float, loop, max, min, mix, mul, oneMinus, positionLocal, pow, smoothstep, tslFn, } from 'three/nodes';
-import { mod, spherical } from 'tsl-textures/tsl-utils.js';
+import { acos, add, distance, exp, float, loop, max, min, mix, mod, mul, oneMinus, positionLocal, pow, smoothstep, tslFn, } from 'three/nodes';
+import { spherical } from 'tsl-textures/tsl-utils.js';
 
 
 

package/src/scepter-head.js

@@ -4,8 +4,8 @@
 
 
 import { Color } from "three";
-import { abs, add, cos, floor, max, mix, mul, positionLocal, remapClamp, sign, tan, tslFn, vec3 } from 'three/nodes';
-import { hsl, mod, noise, remapExp, toHsl } from 'tsl-textures/tsl-utils.js';
+import { abs, add, cos, floor, max, mix, mod, mul, positionLocal, remapClamp, sign, tan, tslFn, vec3 } from 'three/nodes';
+import { hsl, noise, remapExp, toHsl } from 'tsl-textures/tsl-utils.js';
 
 
 

package/src/tsl-utils.js

@@ -8,7 +8,7 @@
 
 
 
-import { add, cond, cos, cross, div, float, floor, If, log2, max, min, mul, pow, remap, sin, sub, tslFn, uniform, vec3, vec4 } from 'three/nodes';
+import { add, cond, cos, cross, float, If, log2, max, min, mul, pow, remap, sin, sub, tslFn, uniform, vec3, vec4 } from 'three/nodes';
 import { mx_perlin_noise_float as noise } from 'three/addons/nodes/materialx/lib/mx_noise.js';
 
 
@@ -187,14 +187,6 @@ const applyQuaternion = tslFn( ([ vec, quat ]) => {
 } );
 
 
-// calculate modulo (missing in TSL?)
-const mod = tslFn( ([ x, y ]) => {
-
-	return sub( x, floor( div( x, y ) ).mul( y ) );
-
-} );
-
-
 
 // exponential version of remap
 const remapExp = tslFn( ([ x, fromMin, fromMax, toMin, toMax ]) => {
@@ -227,6 +219,5 @@ export
 	dynamic,
 	spherical,
 	applyEuler,
-	mod,
 	remapExp
 };

package/src/{concrete.js.bak → water-drops.js}

@@ -1,59 +1,60 @@
 
-// TSL-Textures: Concrete
+// TSL-Textures: Water Drops
 
 
 
-import { abs, cos, cross, exp, mul, normalLocal, positionLocal, pow, remap, sin, sub, tangentLocal, tslFn, vec3 } from 'three/nodes';
+import { cos, cross, exp, modelNormalMatrix, normalLocal, positionLocal, remap, sin, sub, tangentLocal, tslFn, vec3 } from 'three/nodes';
 import { noise } from 'tsl-textures/tsl-utils.js';
 
 
 
 var surfacePos = tslFn( ([ pos, normal, bump, density, seed ]) => {
 
-	var k = noise( pos.add( seed ) ).mul( 0.5 ).add( 0.5 );
-	k = bump.mul( pow( abs( k ), density ) );
+	var k = noise( pos.add( seed ) ).add( density ).clamp( 0, 1 );
+	k = cos( k.mul( Math.PI ) ).add( 1 ).pow( 0.5 ).toVar();
+
+	return pos.add( k.mul( normal, bump ) );
 
-	return pos.add( k.mul( normal ) );
-
 } );
 
 
-var concrete = tslFn( ( params ) => {
+var waterDrops = tslFn( ( params ) => {
 
 	var eps = 0.001;
 
-	var position = positionLocal.mul( exp( params.scale.div( 2 ).add( 2 ) ) ).toVar( ),
+	var position = positionLocal.mul( exp( params.scale.div( 1 ).add( 1 ) ) ).toVar( ),
 		normal = normalLocal.normalize().toVar(),
 		tangent = tangentLocal.normalize().mul( eps ).toVar(),
 		bitangent = cross( normal, tangent ).normalize().mul( eps ).toVar();
 
-	var density = remap( params.density, 0, 1, 10, 0.5 ).toVar();
+	var density = remap( params.density, 0, 1, 1.5, 0.7 ).toVar();
 	var seed = vec3( sin( params.seed ).mul( 100 ), cos( params.seed.div( 2 ) ).mul( 100 ), sin( params.seed.div( 3 ) ).mul( 100 ) ).toVar();
 
 	var pos = surfacePos( position, normal, params.bump, density, seed );
+
 	var posU = surfacePos( position.add( tangent ), normal, params.bump, density, seed );
 	var posV = surfacePos( position.add( bitangent ), normal, params.bump, density, seed );
 
 	var dU = sub( posU, pos ),
 		dV = sub( posV, pos );
 
-	return cross( dU, dV ).normalize();
+	return modelNormalMatrix.mul( cross( dU, dV ).normalize() );
 
 } );
 
 
 
-concrete.defaults = {
-	$name: 'Concrete',
+waterDrops.defaults = {
+	$name: 'Water Drops',
 	$normalNode: true,
 
-	scale: 2,
+	scale: 1.4,
 	density: 0.5,
-	bump: 0.5,
+	bump: 0.6,
 
 	seed: 0,
 };
 
 
 
-export { concrete };
+export { waterDrops };