Integrating new procedural textures library

proceduralTexturesLibrary/test/index.html

@@ -160,89 +160,76 @@
 				
 				// Create shaders
 				var std = new BABYLON.StandardMaterial("std", scene);
-				std.diffuseTexture = new BABYLON.Texture("textures/amiga.jpg", scene);
-				std.diffuseTexture.uScale = 5;
-				std.diffuseTexture.vScale = 5;
+				std.specularColor = new BABYLON.Color3(0, 0, 0);
+				
+				var diffuseTexture = new BABYLON.Texture("textures/amiga.jpg", scene);
+				diffuseTexture.uScale = 5;
+				diffuseTexture.vScale = 5;
 
                 // Fire Procedural Texture
                 var firePT = addFirePT();
-				var fireMaterial =  new BABYLON.StandardMaterial("fire", scene);
-				fireMaterial.diffuseTexture = firePT;
 				
 				// Wood Procedural Texture
                 var woodPT = addWoodPT();
-				var woodMaterial =  new BABYLON.StandardMaterial("wood", scene);
-				woodMaterial.diffuseTexture = woodPT;
 				
 				// Cloud Procedural Texture
                 var cloudPT = addCloudPT();
-				var cloudMaterial =  new BABYLON.StandardMaterial("cloud", scene);
-				cloudMaterial.diffuseTexture = cloudPT;
 				
 				// Grass Procedural Texture
                 var grassPT = addGrassPT();
-				var grassMaterial =  new BABYLON.StandardMaterial("grass", scene);
-				grassMaterial.diffuseTexture = grassPT;
 				
 				// Road Procedural Texture
                 var roadPT = addRoadPT();
-				var roadMaterial =  new BABYLON.StandardMaterial("road", scene);
-				roadMaterial.diffuseTexture = roadPT;
 				
 				// Brick Procedural Texture
                 var brickPT = addBrickPT();
-				var brickMaterial =  new BABYLON.StandardMaterial("brick", scene);
-				brickMaterial.diffuseTexture = brickPT;
 				
 				// Marble Procedural Texture
                 var marblePT = addMarblePT();
-				var marbleMaterial =  new BABYLON.StandardMaterial("marble", scene);
-				marbleMaterial.diffuseTexture = marblePT;
 				
 				// Starfield Procedural Texture
                 var starfieldPT = addStarfieldPT();
-				var starfieldMaterial =  new BABYLON.StandardMaterial("starfield", scene);
-			 	starfieldMaterial.diffuseTexture = starfieldPT;
 								
 				// Default to std
-				var currentMaterial = std;
+				var currentTexture = diffuseTexture;
 				sphere.material = std;				
 				sphere.receiveShadows = true;
+				std.diffuseTexture = currentTexture;
 
-				gui.add(options, 'material', ['none', 'fire', 'wood', 'cloud', 'grass', 'road', 'brick', 'marble', 'starfield']).onFinishChange(function () {
-					switch (options.material) {
+				gui.add(options, 'texture', ['default', 'fire', 'wood', 'cloud', 'grass', 'road', 'brick', 'marble', 'starfield']).onFinishChange(function () {
+					switch (options.texture) {
 						case "fire":
-							currentMaterial = fireMaterial;
+							currentTexture = firePT;
 							break;
 						case "wood":
-							currentMaterial = woodMaterial;
+							currentTexture = woodPT;
 							break;
 						case "cloud":
-							currentMaterial = cloudMaterial;
+							currentTexture = cloudPT;
 							break;
 						case "grass":
-							currentMaterial = grassMaterial;
+							currentTexture = grassPT;
 							break;
 						case "road":
-							currentMaterial = roadMaterial;
+							currentTexture = roadPT;
 							break;
 						case "brick":
-							currentMaterial = brickMaterial;
+							currentTexture = brickPT;
 							break;
 						case "marble":
-							currentMaterial = marbleMaterial;
+							currentTexture = marblePT;
 							break;
 						case "starfield":
-							currentMaterial = starfieldMaterial;
+							currentTexture = starfieldPT;
 							break;
 						case "none":
 						default:
-							currentMaterial = std;
+							currentTexture = diffuseTexture;
 							break;
 					}
 
-					currentMesh.material = currentMaterial;
-					window.enableMaterial(options.material);
+					std.diffuseTexture = currentTexture;
+					window.enableTexture(options.texture);
 				});
 
 				gui.add(options, 'mesh', ['sphere', 'knot', 'plane', 'ground', 'rabbit']).onFinishChange(function () {
@@ -266,7 +253,7 @@
 					}
 					currentMesh.setEnabled(true);
 					currentMesh.receiveShadows = true;
-					currentMesh.material = currentMaterial;
+					currentMesh.material = std;
 				});
 
 				var f1 = gui.addFolder('lights');

proceduralTexturesLibrary/test/index.js

@@ -1,7 +1,7 @@
 //UI
 var gui = new dat.GUI();
 var options = {
-	material: "standard",
+	texture: "standard",
 	mesh: "sphere",
 	hemisphericLight: true,
 	pointLight: false,
@@ -13,14 +13,14 @@ var options = {
 }
 
 var registeredUIs = {};
-var materialgui;
+var textureui;
 
-window.registerColorPicker = function(material, name, color, onChange, onSet) {
-    if (!registeredUIs[material]) {
-        registeredUIs[material] = [];
+window.registerColorPicker = function(texture, name, color, onChange, onSet) {
+    if (!registeredUIs[texture]) {
+        registeredUIs[texture] = [];
     }
 
-    registeredUIs[material].push({
+    registeredUIs[texture].push({
         name: name,
         color: "#ff0000",
         onChange: onChange,
@@ -29,12 +29,12 @@ window.registerColorPicker = function(material, name, color, onChange, onSet) {
 };
 
 
-window.registerRangeUI = function(material, name, minValue, maxValue, onChange, onSet) {
-	if (!registeredUIs[material]) {
-		registeredUIs[material] = [];
+window.registerRangeUI = function(texture, name, minValue, maxValue, onChange, onSet) {
+	if (!registeredUIs[texture]) {
+		registeredUIs[texture] = [];
 	}
 	
-	registeredUIs[material].push({
+	registeredUIs[texture].push({
 		name: name,
 		minValue: minValue,
 		maxValue: maxValue,
@@ -47,26 +47,26 @@ var setUi = function(ui) {
 	options[ui.name] = ui.onSet();
 
     if (ui.color) {
-        materialgui.addColor(options, ui.name).onChange(function(value) {
+        textureui.addColor(options, ui.name).onChange(function(value) {
             ui.onChange(value);
         });
     } else {
-        materialgui.add(options, ui.name, ui.minValue, ui.maxValue).onChange(function(value) {
+        textureui.add(options, ui.name, ui.minValue, ui.maxValue).onChange(function(value) {
             ui.onChange(value);
         });
     }
 }
 
-window.enableMaterial = function(material) {
-	if (materialgui) {
-		materialgui.domElement.parentElement.removeChild(materialgui.domElement);	
-		materialgui = null;
+window.enableTexture = function(texture) {
+	if (textureui) {
+		textureui.domElement.parentElement.removeChild(textureui.domElement);	
+		textureui = null;
 	}
 	
-	if (registeredUIs[material]) {
-		materialgui = new dat.GUI();
-		for (var index = 0; index < registeredUIs[material].length; index++) {
-			var ui = registeredUIs[material][index];
+	if (registeredUIs[texture]) {
+		textureui = new dat.GUI();
+		for (var index = 0; index < registeredUIs[texture].length; index++) {
+			var ui = registeredUIs[texture][index];
 			
 			setUi(ui);
 		}