@dailies-studio/tsl-textures 3.0.4

package/src/water-drops.js

@@ -0,0 +1,96 @@
+
+// TSL-Textures: Water Drops
+
+
+
+import { cos, cross, exp, Fn, normalLocal, positionGeometry, remap, tangentLocal, vec3 } from 'three/tsl';
+import { approximateNormal, noise } from './tsl-utils.js';
+
+
+
+var defaults = {
+	$name: 'Water Drops',
+	$normalNode: true,
+
+	position: positionGeometry,
+
+	scale: 1.4,
+	density: 0.5,
+	bump: 0.6,
+
+	seed: 0,
+};
+
+
+
+var surfacePos = Fn( ([ pos, normal, density ]) => {
+
+	var k = noise( pos, 1, density ).clamp( 0, 1 );
+	k = cos( k.mul( Math.PI ) ).add( 1 ).pow( 0.5 ).toVar();
+
+	return pos.add( normal.mul( k ) );
+
+} ).setLayout( {
+	name: 'surfacePos',
+	type: 'vec3',
+	inputs: [
+		{ name: 'position', type: 'vec3' },
+		{ name: 'normal', type: 'vec3' },
+		{ name: 'density', type: 'float' },
+	] }
+);
+
+
+
+var waterDropsRaw = Fn( ([ position, normal, tangent, scale, density, bump, seed ]) => {
+
+	var EPS = 0.001;
+
+	var seed3d = vec3( 1, 2, 3 ).mul( seed ).sin().mul( 100 ).toVar( );
+
+	var xposition = position.mul( exp( scale.div( 1 ).add( 1 ) ) ).add( seed3d ).toVar( ),
+		xnormal = normal.normalize().toVar(),
+		xtangent = tangent.normalize().mul( EPS ).toVar(),
+		xbitangent = cross( xnormal, xtangent ).normalize().mul( EPS ).toVar();
+
+	var xdensity = remap( density, 0, 1, 1.5, 0.7 ).toVar();
+
+	xnormal.mulAssign( bump );
+
+	var pos = surfacePos( xposition, xnormal, xdensity ),
+		posU = surfacePos( xposition.add( xtangent ), xnormal, xdensity ),
+		posV = surfacePos( xposition.add( xbitangent ), xnormal, xdensity );
+
+	return approximateNormal( pos, posU, posV );
+
+} ).setLayout( {
+	name: 'waterDropsRaw',
+	type: 'vec3',
+	inputs: [
+		{ name: 'position', type: 'vec3' },
+		{ name: 'normal', type: 'vec3' },
+		{ name: 'tangent', type: 'vec3' },
+		{ name: 'scale', type: 'float' },
+		{ name: 'density', type: 'float' },
+		{ name: 'bump', type: 'float' },
+		{ name: 'seed', type: 'float' },
+	] }
+);
+
+
+
+function waterDrops( params={} ) {
+
+	var { position, scale, density, bump, seed } = { ...defaults, ...params };
+
+	return waterDropsRaw( position, normalLocal, tangentLocal, scale, density, bump, seed );
+
+}
+
+
+
+waterDrops.defaults = defaults;
+
+
+
+export { waterDrops };

package/src/watermelon.js

@@ -0,0 +1,87 @@
+
+//	TSL-Textures: Watermelon
+
+
+
+import { Color } from 'three';
+import { equirectUV, exp, Fn, mix, positionGeometry, screenUV, vec3 } from 'three/tsl';
+import { noise } from './tsl-utils.js';
+
+
+
+var defaults = {
+	$name: 'Watermelon',
+	$replaceExportUVS: screenUV,
+
+	position: positionGeometry,
+	uvs: equirectUV( positionGeometry.normalize() ),
+
+	scale: 2,
+	stripes: 12,
+	variation: 0.5,
+	noise: 0.25,
+
+	color: new Color( 'yellowgreen' ),
+	background: new Color( 'darkgreen' ),
+
+	seed: 0,
+};
+
+
+
+var watermelonRaw = Fn( ([ position, uvs, scale, stripes, variation, xnoise, color, background, seed ])=>{
+
+	var pos = position.mul( exp( scale.div( 4 ).add( 2 ) ) ).add( seed ).toVar( );
+
+	var a = uvs.x.mul( stripes, 2*Math.PI ).add( noise( pos.mul( vec3( 1, 0.3, 1 ) ) ).mul( 2 ) );
+
+	var k = a.sin().add( 0.5 ).div( 2 ).mul( uvs.y.remap( 0, 1, -Math.PI, Math.PI ).cos().add( 1.2 ).clamp( 0, 1 ) )
+		.add( variation.mul( 2, noise( pos.mul( 1.5 ) ).div( 2 ) ) )
+		.add( variation.mul( 2, noise( pos.mul( 4 ) ).div( 6 ) ) )
+		.toVar();
+
+	k.assign(
+		k.mix( k.round(), 0.75 )
+			.add( noise( pos.mul( 2 ) ).mul( xnoise, 0.5 ) )
+			.add( noise( pos.mul( 3 ) ).mul( xnoise, 1 ) )
+			.add( noise( pos.mul( 15 ) ).mul( xnoise, 0.2 ) )
+			.clamp( 0, 1 )
+	);
+
+	var color = mix( background, color, k ).toVar();
+
+	return color;
+
+} ).setLayout( {
+	name: 'watermelonRaw',
+	type: 'vec3',
+	inputs: [
+		{ name: 'position', type: 'vec3' },
+		{ name: 'uvs', type: 'vec2' },
+		{ name: 'scale', type: 'float' },
+		{ name: 'stripes', type: 'int' },
+		{ name: 'variation', type: 'float' },
+		{ name: 'xnoise', type: 'float' },
+		{ name: 'color', type: 'vec3' },
+		{ name: 'background', type: 'vec3' },
+		{ name: 'seed', type: 'float' },
+	] }
+);
+
+
+
+function watermelon( params={} ) {
+
+	var { position, uvs, scale, stripes, variation, noise, color, background, seed } = { ...defaults, ...params };
+
+	return watermelonRaw( position, uvs, scale, stripes, variation, noise, color, background, seed );
+
+}
+
+
+
+watermelon.defaults = defaults;
+
+
+
+export { watermelon };

package/src/waves.js

@@ -0,0 +1,150 @@
+
+//	TSL-Textures: Waves
+
+
+
+import { Color } from "three";
+import { exp, float, Fn, mix, positionGeometry, time, vec3 } from 'three/tsl';
+import { fractal } from './tsl-utils.js';
+
+
+var defaults = {
+	$name: 'Waves',
+
+	position: positionGeometry,
+	scale: 2,
+	speed: 0,
+	time: time,
+	level: -0.4,
+	rough: 10,
+	height: 0.5,
+
+	foamSize: 0.2,
+	foamEdge: 0.5,
+
+	color: new Color( 0xFFFFFF ),
+	background: new Color( 0x2060FF ),
+
+	seed: 0,
+};
+
+
+
+var waves_core = Fn( ([ position, scale, speed, time, level, rough, height, foamSize, /*foamEdge,*/ seed ]) => {
+
+	const xscale = exp( scale.sub( 1 ) ).toVar();
+	const pos = position.mul( xscale ).add( seed ).toVar( 'pos' );
+	const xtime = time.mul( speed.exp() );
+
+	var posXZ = vec3( pos.x, 0, pos.z ).div( 3 );
+
+	const xfoamSize = foamSize.mul( fractal( pos, rough.div( 2 ) ).div( 2 ).add( 1 ).div( 2 ) );
+
+	var xheight = height.div( xscale, 0.8 ).toVar();
+
+	var wave = position.y.sub( level )
+		.add( fractal( posXZ, 1 ).mul( 2*3.14 ).add( xtime ).sin().div( 2 ).mul( xheight ) )
+		.sub( fractal( pos, rough ).mul( 2*3.14 ).add( xtime.mul( 2 ) ).sin().sub( 1 ).div( 5 ).mul( xheight ) )
+		.smoothstep( float( 0.5 ).sub( xfoamSize ), float( 0.5 ).add( xfoamSize ) )
+		.toVar();
+
+	return wave;
+
+} ).setLayout( {
+	name: 'waves_core',
+	type: 'float',
+	inputs: [
+		{ name: 'position', type: 'vec3' },
+		{ name: 'scale', type: 'float' },
+		{ name: 'speed', type: 'float' },
+		{ name: 'time', type: 'float' },
+		{ name: 'level', type: 'float' },
+		{ name: 'rough', type: 'float' },
+		{ name: 'height', type: 'float' },
+		{ name: 'foamSize', type: 'float' },
+		/*{ name: 'foamEdge', type: 'float' },*/
+		{ name: 'seed', type: 'float' },
+	] }
+);
+
+
+
+var wavesRaw = Fn( ([ position, scale, speed, time, level, rough, height, foamSize, /*foamEdge,*/ color, background, seed ]) => {
+
+	var k = waves_core( position, scale, speed, time, level, rough, height, foamSize, /*foamEdge,*/ seed );
+	return mix( background, color, k.clamp( 0, 1 ) );
+
+
+} ).setLayout( {
+	name: 'wavesRaw',
+	type: 'vec3',
+	inputs: [
+		{ name: 'position', type: 'vec3' },
+		{ name: 'scale', type: 'float' },
+		{ name: 'speed', type: 'float' },
+		{ name: 'time', type: 'float' },
+		{ name: 'level', type: 'float' },
+		{ name: 'rough', type: 'float' },
+		{ name: 'height', type: 'float' },
+		{ name: 'foamSize', type: 'float' },
+		/*{ name: 'foamEdge', type: 'float' },*/
+		{ name: 'color', type: 'vec3' },
+		{ name: 'background', type: 'vec3' },
+		{ name: 'seed', type: 'float' },
+	] }
+);
+
+
+
+var wavesOpacityRaw = Fn( ([ position, scale, speed, time, level, rough, height, foamSize, foamEdge, /*color,background,*/ seed ]) => {
+
+	var k = waves_core( position, scale, speed, time, level, rough, height, foamSize, /*foamEdge,*/ seed ).oneMinus();
+
+	return k.smoothstep( 0, foamEdge.oneMinus().div( 10 ) );
+
+} ).setLayout( {
+	name: 'wavesOpacityRaw',
+	type: 'float',
+	inputs: [
+		{ name: 'position', type: 'vec3' },
+		{ name: 'scale', type: 'float' },
+		{ name: 'speed', type: 'float' },
+		{ name: 'time', type: 'float' },
+		{ name: 'level', type: 'float' },
+		{ name: 'rough', type: 'float' },
+		{ name: 'height', type: 'float' },
+		{ name: 'foamSize', type: 'float' },
+		{ name: 'foamEdge', type: 'float' },
+		/*{ name: 'color', type: 'vec3' },*/
+		/*{ name: 'subcolor', type: 'vec3' },*/
+		{ name: 'seed', type: 'float' },
+	] }
+);
+
+
+
+function waves( params={} ) {
+
+	var { position, scale, speed, time, level, rough, height, foamSize, /*foamEdge,*/ color, background, seed } = { ...defaults, ...params };
+
+	return wavesRaw( position, scale, speed, time, level, rough, height, foamSize, /*foamEdge,*/ color, background, seed );
+
+}
+
+
+
+waves.opacity = function ( params={} ) {
+
+	var { position, scale, speed, time, level, rough, height, foamSize, foamEdge, /*color,background,*/seed } = { ...defaults, ...params };
+
+	return wavesOpacityRaw( position, scale, speed, time, level, rough, height, foamSize, foamEdge, /*color,background,*/seed );
+
+};
+
+
+
+waves.defaults = defaults;
+
+
+
+export { waves };

package/src/wood.js

@@ -0,0 +1,99 @@
+
+//	TSL-Textures: Wood
+
+
+
+import { Color } from 'three';
+import { add, cos, exp, float, Fn, Loop, mix, mul, positionGeometry, radians, reciprocal, sin, sub, vec3 } from 'three/tsl';
+import { noise } from './tsl-utils.js';
+
+
+
+var defaults = {
+	$name: 'Wood',
+
+	position: positionGeometry,
+	scale: 2.5,
+
+	rings: 4.5,
+	lengths: 1,
+	angle: 0,
+
+	fibers: 0.3,
+	fibersDensity: 10,
+
+	color: new Color( 0.8, 0.4, 0 ),
+	background: new Color( 0.4, 0.1, 0 ),
+
+	seed: 0,
+};
+
+
+
+var woodRaw = Fn( ([ position, scale, rings, lengths, angle, fibers, fibersDensity, color, background, seed ]) => {
+
+	var angle = radians( angle ).toVar();
+	var posLocal = vec3(
+		sub( position.x.mul( cos( angle ) ), position.y.mul( sin( angle ) ) ),
+		add( position.x.mul( sin( angle ) ), position.y.mul( cos( angle ) ) ),
+		position.z,
+	).toVar();
+
+
+	// main pattern with rings
+	var pos = posLocal.mul( exp( scale.sub( 3 ) ).mul( vec3( reciprocal( lengths ), 4, reciprocal( lengths ) ) ) ).add( seed ).toVar( );
+	var k = noise( pos ).add( 1 ).mul( 10 ).mul( rings );
+	k = k.add( k.cos() ).cos().add( 1 ).div( 2 );
+
+	var kk = float( 0 ).toVar(),
+		sum = float( 0 ).toVar(),
+		scale = exp( scale.sub( 2 ) ).mul( vec3( 1, fibersDensity, 1 ) ).toVar(),
+		power = float( 2 ).toVar();
+
+	Loop( 10, ()=>{
+
+		kk.addAssign( mul( power, noise( posLocal.mul( scale ).add( seed ) ) ) );
+		sum.addAssign( power );
+		scale.mulAssign( 1.8 );
+		power.mulAssign( 0.6 );
+
+	} );
+
+	kk.assign( mul( kk, 5 ).div( sum ).mul( 10 ).sin().add( 1 ).div( 2 ) );
+
+	return mix( color, background, mix( k, kk, fibers ) );
+
+} ).setLayout( {
+	name: 'woodRaw',
+	type: 'vec3',
+	inputs: [
+		{ name: 'position', type: 'vec3' },
+		{ name: 'scale', type: 'float' },
+		{ name: 'rings', type: 'float' },
+		{ name: 'lengths', type: 'float' },
+		{ name: 'angle', type: 'float' },
+		{ name: 'fibers', type: 'float' },
+		{ name: 'fibersDensity', type: 'float' },
+		{ name: 'color', type: 'vec3' },
+		{ name: 'background', type: 'vec3' },
+		{ name: 'seed', type: 'float' },
+	] }
+);
+
+
+
+function wood( params={} ) {
+
+	var { position, scale, rings, lengths, angle, fibers, fibersDensity, color, background, seed } = { ...defaults, ...params };
+
+	return woodRaw( position, scale, rings, lengths, angle, fibers, fibersDensity, color, background, seed );
+
+}
+
+
+
+wood.defaults = defaults;
+
+
+
+export { wood };

package/src/zebra-lines.js

@@ -0,0 +1,77 @@
+
+//	TSL-Textures: Zebra Lines
+
+
+
+import { Color } from "three";
+import { acos, clamp, cos, exp, Fn, mix, positionGeometry, select, sin, vec2 } from 'three/tsl';
+import { spherical } from './tsl-utils.js';
+
+
+
+var defaults = {
+	$name: 'Zebra lines',
+
+	position: positionGeometry,
+	scale: 2,
+	thinness: 0.5,
+	phi: 0,
+	theta: 0,
+
+	color: new Color( 0x0 ),
+	background: new Color( 0xFFFFFF ),
+
+	flat: 0,
+	// no seed for zebra lines
+};
+
+
+
+var zebraLinesRaw = Fn( ([ position, scale, thinness, phi, theta, color, background, xflat ]) => {
+
+	var pos = select( xflat, position, position.normalize() ).toVar( );
+
+	var dir = select( xflat, vec2( cos( phi ), sin( phi ) ), spherical( phi, theta ) ).toVar();
+
+	var angle = select( xflat, clamp( dir.dot( pos ), -2, 2 ), acos( clamp( dir.dot( pos ), -1, 1 ) ) ).toVar();
+
+	var scale = exp( scale.add( 1 ) ).toVar();
+
+	var k = sin( angle.mul( scale ) ).sub( thinness.sub( 0.5 ).mul( 2 ) );
+
+	k = clamp( k.mul( 1000 ).div( scale ), -1, 1 ).mul( 0.5 ).add( 0.5 );
+
+	return mix( background, color, k );
+
+} ).setLayout( {
+	name: 'zebraLinesRaw',
+	type: 'vec3',
+	inputs: [
+		{ name: 'position', type: 'vec3' },
+		{ name: 'scale', type: 'float' },
+		{ name: 'thinness', type: 'float' },
+		{ name: 'phi', type: 'float' },
+		{ name: 'theta', type: 'float' },
+		{ name: 'color', type: 'vec3' },
+		{ name: 'background', type: 'vec3' },
+		{ name: 'xflat', type: 'int' },
+	] }
+);
+
+
+
+function zebraLines( params={} ) {
+
+	var { position, scale, thinness, phi, theta, color, background, flat } = { ...defaults, ...params };
+
+	return zebraLinesRaw( position, scale, thinness, phi, theta, color, background, flat );
+
+}
+
+
+
+zebraLines.defaults = defaults;
+
+
+
+export { zebraLines };