Add Shader processing

Tools/Gulp/helpers/gulp-processShaders.js

@@ -0,0 +1,55 @@
+var through = require('through2');
+var PluginError = require('gulp-util').PluginError;
+var uncommentShaders = require('./gulp-removeShaderComments');
+let path = require('path');
+//let fs = require('fs');
+
+let tsTemplate = 
+`import { Effect } from "babylonjs";
+
+let shader = '';
+let name = '';
+
+##PLACEHOLDER##
+
+Effect.ShadersStore[name] = shader;
+
+export { shader, name };
+`;
+
+function getShaderName(filename) {
+    let parts = filename.split('.');
+    if (parts[1] !== 'fx') {
+        return parts[0] + (parts[1] === 'fragment' ? 'Pixel' : 'Vertex') + "Shader";
+    } else {
+        return parts[0];
+    }
+}
+
+function main() {
+    return uncommentShaders()
+        .pipe(through.obj(function (file, enc, cb) {
+            if (file.isNull()) {
+                cb(null, file);
+                return;
+            }
+            if (file.isStream()) {
+                cb(new PluginError("Remove Shader Comments", "Streaming not supported."));
+            }
+    
+            let filename = path.basename(file.path);
+            let normalized = path.normalize(file.path);
+            let directory = path.dirname(normalized);
+            let shaderName = getShaderName(filename);
+            let tsFilename = filename.replace('.fx', '.fx.ts');
+            let data = file.contents.toString();
+
+            let tsContent = tsTemplate.replace('##PLACEHOLDER##', `name = '${shaderName}'; shader = \`${data}\`;  `);
+            fs.writeFileSync(directory + '/' + tsFilename, tsContent);
+
+            return cb();
+        })
+    );
+}
+
+module.exports = main;

Tools/Gulp/tasks/gulpTasks-libraries.js

@@ -2,10 +2,10 @@
 var gulp = require("gulp");
 var webpack = require('webpack');
 var webpackStream = require("webpack-stream");
-var fs = require("fs");
 var dtsBundle = require('dts-bundle');
 var merge2 = require("merge2");
 var path = require("path");
+var processShaders = require("../helpers/gulp-processShaders");
 
 // Gulp Helpers
 var processDeclaration = require('../helpers/gulp-processTypescriptDeclaration');
@@ -18,43 +18,48 @@ var config = require("../config.json");
  * Build a single library (one of the material of mat lib) from a module (materialsLibrary for instance)
  */
 var buildExternalLibrary = function(library, settings, cb) {
-    const sequence = [];
-    var outputDirectory = config.build.outputDirectory + settings.build.distOutputDirectory;
-
-    // Webpack Config.
-    var wpConfig = require(settings.build.webpack);
-    wpConfig.entry = {
-        'main': path.resolve(wpConfig.context, library.entry),
-    };
-    wpConfig.output.filename = library.output;
-
-    // Generate minified file.
-    let wpBuildMin = webpackStream(wpConfig, webpack);
-    let buildEventMin = wpBuildMin.pipe(gulp.dest(outputDirectory));
-    sequence.push(buildEventMin);
-
-    // Generate unminified file.
-    wpConfig.mode = "development";
-    wpConfig.output.filename = wpConfig.output.filename.replace(".min", "");
-    let wpBuildMax = webpackStream(wpConfig, webpack);
-    let buildEventMax = wpBuildMax.pipe(gulp.dest(outputDirectory));
-    sequence.push(buildEventMax);
-
-    var minAndMax = merge2(sequence);
-
-    // TODO. Generate all d.ts
-    if (!library.preventLoadLibrary) {
-        minAndMax.on("end", function() {
-            dtsBundle.bundle(settings.build.dtsBundle);
-
-            let fileLocation = path.join(outputDirectory, settings.build.processDeclaration.filename);
-            processDeclaration(fileLocation, settings.build.processDeclaration);
-
-            cb();
-        });
-    }
-
-    return minAndMax;
+    var task = gulp.src(settings.build.srcDirectory + "**/*.fx")
+        .pipe(processShaders());
+
+    task.on("end", function() {
+        const sequence = [];
+        var outputDirectory = config.build.outputDirectory + settings.build.distOutputDirectory;
+
+        // Webpack Config.
+        var wpConfig = require(settings.build.webpack);
+        wpConfig.entry = {
+            'main': path.resolve(wpConfig.context, library.entry),
+        };
+        wpConfig.output.filename = library.output;
+
+        // Generate minified file.
+        let wpBuildMin = webpackStream(wpConfig, webpack);
+        let buildEventMin = wpBuildMin.pipe(gulp.dest(outputDirectory));
+        sequence.push(buildEventMin);
+
+        // Generate unminified file.
+        wpConfig.mode = "development";
+        wpConfig.output.filename = wpConfig.output.filename.replace(".min", "");
+        let wpBuildMax = webpackStream(wpConfig, webpack);
+        let buildEventMax = wpBuildMax.pipe(gulp.dest(outputDirectory));
+        sequence.push(buildEventMax);
+
+        var minAndMax = merge2(sequence);
+
+        // TODO. Generate all d.ts
+        if (!library.preventLoadLibrary) {
+            minAndMax.on("end", function() {
+                dtsBundle.bundle(settings.build.dtsBundle);
+
+                let fileLocation = path.join(outputDirectory, settings.build.processDeclaration.filename);
+                processDeclaration(fileLocation, settings.build.processDeclaration);
+            });
+        }
+
+        minAndMax.on("end", cb);
+    });
+
+    return task;
 }
 
 /**

Tools/WebpackShaderLoader/parser.js

@@ -5,7 +5,7 @@ function parse(loader, source, context, cb) {
     var imports = [];
     var importPattern = /@import ([.\/\w_-]+);/gi;
     var match = importPattern.exec(source);
-     while (match != null) {
+    while (match != null) {
         imports.push({
             key: match[1],
             target: match[0],
@@ -95,7 +95,7 @@ function processImports(loader, source, context, imports, cb) {
             if (err) {
                 return cb(err);
             }
-             parse(loader, src, path.dirname(resolved), function (err, bld) {
+            parse(loader, src, path.dirname(resolved), function (err, bld) {
                 if (err) {
                     return cb(err);
                 }