Adding anaglyphPostProcess

Adding new anaglyphCamera

Babylon/Cameras/babylon.anaglyphCamera.js

@@ -0,0 +1,76 @@
+"use strict";
+
+var BABYLON = BABYLON || {};
+
+(function () {
+    var eventPrefix = BABYLON.Tools.GetPointerPrefix();
+
+    BABYLON.AnaglyphCamera = function (name, alpha, beta, radius, target, eyeSpace, scene) {
+        BABYLON.ArcRotateCamera.call(this, name, alpha, beta, radius, target, scene);
+
+        this._eyeSpace = BABYLON.Tools.ToRadians(eyeSpace);
+
+        this._leftCamera = new BABYLON.ArcRotateCamera(name + "_left", alpha - this._eyeSpace, beta, radius, target, scene);
+        this._rightCamera = new BABYLON.ArcRotateCamera(name + "_right", alpha + this._eyeSpace, beta, radius, target, scene);
+        
+        this._leftTexture = new BABYLON.PassPostProcess(name + "_leftTexture", 1.0, this._leftCamera);
+        this._rightTexture = new BABYLON.PassPostProcess(name + "_rightTexture", 1.0, this._rightCamera);
+
+        this._anaglyphPostProcess = new BABYLON.AnaglyphPostProcess(name + "_anaglyph", 1.0, this);
+
+        var that = this;
+        this._anaglyphPostProcess.onApply = function (effect) {
+            effect.setTextureFromPostProcess("leftSampler", that._leftTexture);
+            effect.setTextureFromPostProcess("rightSampler", that._rightTexture);
+        };
+
+        scene.activeCameras.push(this._leftCamera);
+        scene.activeCameras.push(this._rightCamera);
+        scene.activeCameras.push(this);
+    };
+
+    BABYLON.AnaglyphCamera.prototype = Object.create(BABYLON.ArcRotateCamera.prototype);
+
+    BABYLON.AnaglyphCamera.prototype._update = function () {
+        this._updateCamera(this._leftCamera);
+        this._updateCamera(this._rightCamera);
+
+        this._leftCamera.alpha = this.alpha - this._eyeSpace;
+        this._rightCamera.alpha = this.alpha + this._eyeSpace;
+
+        BABYLON.ArcRotateCamera.prototype._update.call(this);
+    };
+
+    BABYLON.AnaglyphCamera.prototype._updateCamera = function (camera) {
+        camera.inertialAlphaOffset = this.inertialAlphaOffset;
+        camera.inertialBetaOffset = this.inertialBetaOffset;
+        camera.inertialRadiusOffset = this.inertialRadiusOffset;
+        camera.lowerAlphaLimit = this.lowerAlphaLimit;
+        camera.upperAlphaLimit = this.upperAlphaLimit;
+        camera.lowerBetaLimit = this.lowerBetaLimit;
+        camera.upperBetaLimit = this.upperBetaLimit;
+        camera.lowerRadiusLimit = this.lowerRadiusLimit;
+        camera.upperRadiusLimit = this.upperRadiusLimit;
+        camera.angularSensibility = this.angularSensibility;
+        camera.wheelPrecision = this.wheelPrecision;
+
+        camera.minZ = this.minZ;
+        camera.maxZ = this.maxZ;
+
+        camera.target = this.target;
+    };
+
+    BABYLON.AnaglyphCamera.prototype.attachControl = function (canvas, noPreventDefault) {
+        BABYLON.ArcRotateCamera.prototype.attachControl.call(this, canvas);
+
+        this._leftCamera.attachControl(canvas, noPreventDefault);
+        this._rightCamera.attachControl(canvas, noPreventDefault);
+    };
+
+    BABYLON.AnaglyphCamera.prototype.detachControl = function (canvas) {
+        BABYLON.ArcRotateCamera.prototype.detachControl.call(this, canvas);
+
+        this._leftCamera.detachControl(canvas);
+        this._rightCamera.detachControl(canvas);
+    };
+})();

Babylon/PostProcess/babylon.anaglyphPostProcess.js

@@ -0,0 +1,12 @@
+"use strict";
+
+var BABYLON = BABYLON || {};
+
+(function () {
+    BABYLON.AnaglyphPostProcess = function (name, ratio, camera, samplingMode, engine, reusable) {
+        BABYLON.PostProcess.call(this, name, "anaglyph", null, ["leftSampler", "rightSampler"], ratio, camera, samplingMode, engine, reusable);
+    };
+
+    BABYLON.AnaglyphPostProcess.prototype = Object.create(BABYLON.PostProcess.prototype);
+
+})();

Babylon/Shaders/anaglyph.fragment.fx

@@ -0,0 +1,20 @@
+#ifdef GL_ES
+precision mediump float;
+#endif
+
+// Samplers
+varying vec2 vUV;
+uniform sampler2D textureSampler;
+uniform sampler2D rightSampler;
+uniform sampler2D leftSampler;
+
+void main(void)
+{
+    vec4 leftFrag = texture2D(leftSampler, vUV);
+    leftFrag = vec4(1.0, leftFrag.g, leftFrag.b, 1.0);
+
+    vec4 rightFrag = texture2D(rightSampler, vUV);
+    rightFrag = vec4(rightFrag.r, 1.0, 1.0, 1.0);
+
+    gl_FragColor = vec4(rightFrag.rgb * leftFrag.rgb, 1.0);
+}

Tools/BuildOurOwnBabylonJS/BuildOurOwnBabylonJS/babylonJS.xml

@@ -15,6 +15,7 @@
   <script src="Babylon/Collisions/babylon.pickingInfo.js"></script>
   <script src="Babylon/LensFlare/babylon.lensFlareSystem.js"></script>
   <script src="Babylon/LensFlare/babylon.lensFlare.js"></script>
+  <script src="Babylon/PostProcess/babylon.anaglyphPostProcess.js"></script>
   <script src="Babylon/PostProcess/babylon.fxaaPostProcess.js"></script>
   <script src="Babylon/PostProcess/babylon.filterPostProcess.js"></script>
   <script src="Babylon/PostProcess/babylon.convolutionPostProcess.js"></script>
@@ -56,6 +57,7 @@
   <script src="Babylon/Mesh/babylon.mesh.vertexData.js"></script>
   <script src="Babylon/Mesh/babylon.vertexBuffer.js"></script>
   <script src="Babylon/babylon.scene.js"></script>
+  <script src="Babylon/Cameras/babylon.anaglyphCamera.js"></script>
   <script src="Babylon/Cameras/babylon.arcRotateCamera.js"></script>
   <script src="Babylon/Cameras/babylon.deviceOrientationCamera.js"></script>
   <script src="Babylon/Cameras/babylon.touchCamera.js"></script>