tsl-textures 0.2.0 → 0.3.0

package/package.json

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

package/src/camouflage.js

@@ -4,7 +4,7 @@
 
 
 import { Color } from 'three';
-import { tslFn, If, round, vec3, exp, positionLocal } from 'three/nodes';
+import { exp, If, positionLocal, round, tslFn, vec3 } from 'three/nodes';
 import { noise } from 'tsl-textures/tsl-utils.js';
 
 

package/src/cave-art.js

@@ -0,0 +1,54 @@
+
+//	TSL-Textures: Cave Art
+
+
+
+import { Color } from "three";
+import { abs, add, exp, float, If, mix, or, positionLocal, pow2, sub, tslFn } from 'three/nodes';
+import { noise } from 'tsl-textures/tsl-utils.js';
+
+
+var caveArt = tslFn( ( params ) => {
+
+	var pos = positionLocal.mul( exp( params.scale ) ).add( params.seed ).toVar( );
+
+	var k1 = noise( pos ).mul( 4 ).sin().toVar();
+	var k2 = noise( pos.mul( 1.5 ) ).mul( 4 ).cos().toVar();
+
+	var thinness = exp( sub( float( 3 ), params.thinness ) );
+	var k = sub( thinness, pow2( abs( add( k1, k2 ) ) ).mul( 20 ) ).toVar();
+
+	If( or( k1.greaterThan( k2 ), k.lessThan( 0 ) ), ()=>{
+
+		k.assign( 0 );
+
+	} );
+
+	If( k.lessThanEqual( 0 ), ()=>{
+
+		k.assign( params.noise.mul( pow2( noise( pos.mul( 30 ) ) ) ) );
+
+	} );
+
+	return mix( params.background, params.color, k );
+
+} );
+
+
+
+caveArt.defaults = {
+	$name: 'Cave art',
+
+	scale: 2,
+	thinness: 2,
+	noise: 0.3,
+
+	color: new Color( 0xD34545 ),
+	background: new Color( 0xFFF8F0 ),
+
+	seed: 0,
+};
+
+
+
+export { caveArt };

package/src/entangled.js

@@ -0,0 +1,49 @@
+
+//	TSL-Textures: Entangled
+
+
+
+import { Color } from "three";
+import { abs, exp, float, floor, loop, max, mix, mul, oneMinus, positionLocal, pow, sin, tslFn } from 'three/nodes';
+import { noise } from 'tsl-textures/tsl-utils.js';
+
+
+
+var entangled = tslFn( ( params ) => {
+
+	var scale = exp( params.scale.div( 2 ) ).toVar( );
+	var pos = positionLocal.add( params.seed ).toVar( );
+	var k = float( -10000 ).toVar( );
+	var k1 = float( 0 ).toVar( );
+
+	loop( floor( float( params.density ) ), ()=> {
+
+		k1.assign( sin( noise( mul( pos, scale ) ).mul( 3*Math.PI ) ) );
+		k.assign( max( k, k1 ) );
+		scale.mulAssign( 1.2 );
+
+	} );
+
+	k.assign( oneMinus( pow( abs( k ), 5 ) ).mul( 6 ) );
+
+	return mix( params.color, params.background, k );
+
+} );
+
+
+
+entangled.defaults = {
+	$name: 'Entangled',
+
+	scale: 2,
+	density: 10,
+
+	color: new Color( 0x002040 ),
+	background: new Color( 0xFFFFFF ),
+
+	seed: 0,
+};
+
+
+
+export { entangled };

package/src/fordite.js

@@ -4,8 +4,8 @@
 
 
 import { Color } from 'three';
-import { tslFn, vec3, sin, mul, exp, positionLocal } from 'three/nodes';
-import { noise, hsl } from 'tsl-textures/tsl-utils.js';
+import { exp, mul, positionLocal, sin, tslFn, vec3 } from 'three/nodes';
+import { hsl, noise } from 'tsl-textures/tsl-utils.js';
 
 
 

package/src/isolines.js

@@ -4,7 +4,7 @@
 
 
 import { Color } from "three";
-import { tslFn, oneMinus, sub, smoothstep, sin, add, mix, exp, positionLocal } from 'three/nodes';
+import { add, exp, mix, oneMinus, positionLocal, sin, smoothstep, sub, tslFn } from 'three/nodes';
 import { noise } from 'tsl-textures/tsl-utils.js';
 
 

package/src/marble.js

@@ -4,7 +4,7 @@
 
 
 import { Color } from "three";
-import { tslFn, add, oneMinus, If, div, pow, mix, mul, exp, positionLocal } from 'three/nodes';
+import { add, div, exp, If, mix, mul, oneMinus, positionLocal, pow, tslFn } from 'three/nodes';
 import { noise } from 'tsl-textures/tsl-utils.js';
 
 

package/src/stars.js

@@ -0,0 +1,44 @@
+
+//	TSL-Textures: Stars
+
+
+
+import { Color } from "three";
+import { abs, add, cond, exp, mix, positionLocal, tslFn } from 'three/nodes';
+import { hsl, noise, toHsl } from 'tsl-textures/tsl-utils.js';
+
+
+
+var stars = tslFn( ( params ) => {
+
+	var pos = positionLocal.mul( exp( params.scale.div( 2 ).add( 3 ) ) ).add( params.seed ).toVar( );
+
+	var k = abs( noise( pos ) ).pow( 10 ).mul( 10 );
+
+	k = k.mul( exp( params.density.sub( 2 ) ) );
+
+	var dS = cond( k.greaterThan( 0.1 ), params.variation.mul( noise( pos ) ), 0 );
+
+	var col = toHsl( mix( params.background, params.color, k ) );
+
+	return hsl( add( col.x, dS ), col.y, col.z );
+
+} );
+
+
+
+stars.defaults = {
+	$name: 'Stars',
+
+	scale: 2,
+	density: 2,
+	variation: 0,
+
+	color: new Color( 0xfff5f0 ),
+	background: new Color( 0x000060 ),
+
+	seed: 0,
+};
+
+
+export { stars };

package/src/tsl-utils.js

@@ -3,7 +3,7 @@
 //
 
 import { MathUtils } from 'three';
-import { tslFn, sub, vec3, min, max, uniform } from 'three/nodes';
+import { add, cond, cos, float, If, max, min, sin, sub, tslFn, uniform, vec3 } from 'three/nodes';
 import { mx_perlin_noise_float as noise } from 'three/addons/nodes/materialx/lib/mx_noise.js';
 
 
@@ -53,7 +53,7 @@ hslHelper.setLayout( {
 
 
 
-
+// convert from hsl to rgb
 const hsl = tslFn( ([ h, s, l ]) => {
 
 	h = h.fract().add( 1 ).fract();
@@ -79,6 +79,50 @@ hsl.setLayout( {
 } );
 
 
+// convert from rgb to hsl
+const toHsl = tslFn( ([ rgb ]) => {
+
+	var R = float( rgb.x ).toVar(),
+		G = float( rgb.y ).toVar(),
+		B = float( rgb.z ).toVar();
+
+	var mx = max( R, max( G, B ) ).toVar();
+	var mn = min( R, min( G, B ) ).toVar();
+
+	var H = float( 0 ).toVar(),
+		S = float( 0 ).toVar(),
+		L = add( mx, mn ).div( 2 );
+
+	If( mn.notEqual( mx ), ()=>{
+
+		const delta = sub( mx, mn ).toVar();
+
+		S.assign( cond( L.lessThanEqual( 0.5 ), delta.div( add( mn, mx ) ), delta.div( sub( 2, add( mn, mx ) ) ) ) );
+		If( mx.equal( R ), ()=>{
+
+			H.assign( sub( G, B ).div( delta ).add( cond( G.lessThanEqual( B ), 6, 0 ) ) );
+
+		} )
+			.elseif( mx.equal( G ), ()=>{
+
+				H.assign( sub( B, R ).div( delta ).add( 2 ) );
+
+			} )
+			.else( ()=>{
+
+				H.assign( sub( R, G ).div( delta ).add( 4 ) );
+
+			} );
+		H.divAssign( 6 );
+
+	} );
+	return vec3( H, S, L );
+
+} );
+
+
+
+
 
 // make all elements dynamic (i.e. uniform)
 function dynamic( params ) {
@@ -98,11 +142,34 @@ function dynamic( params ) {
 
 
 
+// convert phi-theta angles to position on unit sphere
+const spherical = tslFn( ([ phi, theta ]) => {
+
+	return vec3(
+		sin( theta ).mul( sin( phi ) ),
+		cos( phi ),
+		cos( theta ).mul( sin( phi ) )
+	);
+
+} );
+
+spherical.setLayout( {
+	name: 'spherical',
+	type: 'vec3',
+	inputs: [
+		{ name: 'phi', type: 'float' },
+		{ name: 'theta', type: 'float' },
+	]
+} );
+
+
 export
 {
 	map,
 	mapExp,
 	noise,
 	hsl,
-	dynamic
+	toHsl,
+	dynamic,
+	spherical
 };

package/src/zebra-lines.js

@@ -0,0 +1,48 @@
+
+//	TSL-Textures: Zebra Lines
+
+
+
+import { Color } from "three";
+import { acos, clamp, exp, mix, positionLocal, sin, tslFn } from 'three/nodes';
+import { spherical } from 'tsl-textures/tsl-utils.js';
+
+
+
+var zebraLines = tslFn( ( params ) => {
+
+	var pos = positionLocal.normalize().toVar( );
+
+	var dir = spherical( params.phi, params.theta ).toVar();
+
+	var angle = acos( clamp( dir.dot( pos ), -1, 1 ) );
+
+	var scale = exp( params.scale.add( 1 ) ).toVar();
+
+	var k = sin( angle.mul( scale ) ).sub( params.thinness.sub( 0.5 ).mul( 2 ) );
+
+	k = clamp( k.mul( 1000 ).div( scale ), -1, 1 ).mul( 0.5 ).add( 0.5 );
+
+	return mix( params.background, params.color, k );
+
+} );
+
+
+
+zebraLines.defaults = {
+	$name: 'Zebra lines',
+
+	scale: 2,
+	thinness: 0.5,
+	phi: 0,
+	theta: 0,
+
+	color: new Color( 0x0 ),
+	background: new Color( 0xFFFFFF ),
+
+	// no seed for zebra lines
+};
+
+
+
+export { zebraLines };