jax 0.0.0.4 → 0.0.0.5

data/lib/jax/version.rb

@@ -3,7 +3,7 @@ module Jax
     MAJOR = 0
     MINOR = 0
     TINY  = 0
-    PATCH = 4
+    PATCH = 5
 
     STRING = PATCH == 0 ? "#{MAJOR}.#{MINOR}.#{TINY}" : "#{MAJOR}.#{MINOR}.#{TINY}.#{PATCH}"
   end

data/spec/example_app/app/controllers/noise_controller.js

@@ -0,0 +1,18 @@
+//= require "application_controller"
+
+var NoiseController = (function() {
+  return Jax.Controller.create("noise", ApplicationController, {
+    index: function() {
+      var model = new Jax.Model({mesh:new Jax.Mesh.Sphere({material:Material.find("blob")})});
+      this.world.addObject(model);
+      this.player.camera.move(-5);
+    },
+
+    
+    // Some special actions are fired whenever the corresponding input is
+    // received from the user.
+    mouse_clicked: function(event) {
+      
+    }
+  });
+})();

data/spec/example_app/app/helpers/noise_helper.js

@@ -0,0 +1,3 @@
+var NoiseHelper = Jax.Helper.create({
+
+});

data/spec/example_app/app/resources/materials/blob.yml

@@ -0,0 +1,28 @@
+# ambient component multiplied with the light source's ambient component
+ambient:
+  red:   1.0
+  green: 1.0
+  blue:  1.0
+  alpha: 1.0
+
+# diffuse component multiplied with the light source's diffuse component
+diffuse:
+  red:   1.0
+  green: 1.0
+  blue:  1.0
+  alpha: 1.0
+
+# specular component multiplied with the light source's specular component
+specular:
+  red:   1.0
+  green: 1.0
+  blue:  1.0
+  alpha: 1.0
+
+shininess: 30
+
+layers:
+  # remove Lighting to conserve video memory if you don't need/want support for light sources
+  - type: Lighting
+
+  - type: Blob

data/spec/example_app/app/shaders/blob/common.ejs

@@ -0,0 +1,18 @@
+//= require "functions/noise"
+
+// Shared variables save on graphics memory and allow you to "piggy-back" off of
+// variables defined in other shaders:
+
+shared uniform mat3 nMatrix;
+shared uniform mat4 mvMatrix, pMatrix;
+
+shared varying vec2 vTexCoords;
+shared varying vec3 vNormals;
+shared varying vec4 vColor;
+
+// If a variable isn't shared, it will be defined specifically for this shader.
+// If this shader is used twice in one materials, unshared variables will be
+// defined twice -- once for each use of the shader.
+
+//   uniform sampler2D Texture;
+//   uniform float TextureScaleX, TextureScaleY;

data/spec/example_app/app/shaders/blob/fragment.ejs

@@ -0,0 +1,8 @@
+/*
+  If you don't need the color attributes, use
+      void main(void)
+  to make your shader more efficient.
+*/
+void main(inout vec4 ambient, inout vec4 diffuse, inout vec4 specular) {
+  diffuse = vColor;
+}

data/spec/example_app/app/shaders/blob/manifest.yml

@@ -0,0 +1,15 @@
+description: |
+  Causes the object to have "blob-like" edges, like a thick liquid
+
+
+# Add an 'options' attribute if your shader's Material can accept
+# multiple configurations. Usually, you'll have an option for each
+# corresponding uniform or attribute variable.
+
+# Example:
+
+#options:
+#  path: "/path/to/texture.png"
+#  flip_y: false
+#  scale_x: 1.0
+#  scale_y: 1.0

data/spec/example_app/app/shaders/blob/material.js

@@ -0,0 +1,48 @@
+Jax.Material.Blob = (function() {
+  function getNoise(self, context) {
+    var noise = self.noise[context.id];
+    if (!noise) noise = self.noise[context.id] = new Jax.Noise(context);
+    return noise;
+  }
+  
+  return Jax.Class.create(Jax.Material, {
+    initialize: function($super, options) {
+      options = Jax.Util.normalizeOptions(options, {
+        shader: "blob",
+
+        // You can specify default options (see +manifest.yml+) here.
+      });
+
+      $super(options);
+      this.noise = {};
+    },
+  
+    setUniforms: function($super, context, mesh, options, uniforms) {
+      $super(context, mesh, options, uniforms);
+
+      uniforms.set('mvMatrix', context.getModelViewMatrix());
+      uniforms.set('nMatrix', context.getNormalMatrix());
+      uniforms.set('pMatrix', context.getProjectionMatrix());
+
+      // uniforms.texture('Texture', this.texture, context);
+    
+      this.l = this.l || new Date().getTime();
+      var tc = (new Date().getTime() - this.l) / 1000;
+
+      var noise = getNoise(this, context);
+        
+      uniforms.texture('permTexture', noise.perm, context);
+      uniforms.texture('simplexTexture', noise.simplex, context);
+      uniforms.texture('gradTexture', noise.grad, context);
+  
+      uniforms.set('time', tc);
+    },
+
+    setAttributes: function($super, context, mesh, options, attributes) {
+      attributes.set('VERTEX_POSITION',  mesh.getVertexBuffer());
+      attributes.set('VERTEX_COLOR',     mesh.getColorBuffer());
+      attributes.set('VERTEX_NORMAL',    mesh.getNormalBuffer());
+      attributes.set('VERTEX_TEXCOORDS', mesh.getTextureCoordsBuffer());
+    }
+  });
+})();

data/spec/example_app/app/shaders/blob/vertex.ejs

@@ -0,0 +1,13 @@
+shared attribute vec4 VERTEX_POSITION, VERTEX_COLOR;
+shared attribute vec3 VERTEX_NORMAL;
+shared attribute vec2 VERTEX_TEXCOORDS;
+
+void main(void) {
+  vec4 pos = VERTEX_POSITION;
+  float n = snoise(vec4(pos.xyz, time));
+  pos.xyz += normalize(pos.xyz)*n;
+  
+  gl_Position = pMatrix * mvMatrix * pos;
+
+  vColor = vec4(n);
+}

data/spec/example_app/app/views/noise/index.js

@@ -0,0 +1,4 @@
+Jax.views.push('noise/index', function() {
+  this.glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
+  this.world.render();
+});

data/spec/example_app/config/routes.rb

@@ -1,4 +1,5 @@
 ExampleApp.routes.map do
+  map 'noise/index'
   map 'textures/index'
   root 'lighting'
   map 'shadows'

data/spec/example_app/spec/javascripts/controllers/noise_controller_spec.js

@@ -0,0 +1,11 @@
+describe("NoiseController", function() {
+  var controller;
+
+  beforeEach(function() {
+    controller = new NoiseController();
+  });
+
+  it("does something", function() {
+    expect(1).toEqual(1);
+  });
+});

data/spec/example_app/spec/javascripts/helpers/noise_helper_spec.js

@@ -0,0 +1,12 @@
+describe("NoiseHelper", function() {
+  var helper;
+
+  beforeEach(function() {
+    var klass = Jax.Class.create({helpers: function() { return [NoiseHelper]; } });
+    helper = new klass();
+  });
+
+  it("does something", function() {
+    expect(1).toEqual(1);
+  });
+});

data/spec/example_app/spec/javascripts/shaders/blob_spec.js

@@ -0,0 +1,30 @@
+describe("Shader 'blob'", function() {
+  var context, material, mesh;
+  
+    beforeEach(function() {
+      context = new Jax.Context('webgl-canvas');
+      mesh = new Jax.Mesh.Quad();
+    });
+  
+    afterEach(function() { context.dispose(); });
+  
+    describe("stand-alone", function() {
+      beforeEach(function() { mesh.material = new Jax.Material.Blob(); });
+  
+      xit("should render without error", function() {
+        expect(function() { mesh.render(context); }).not.toThrow();
+      });
+    });
+  
+    describe("as a layer", function() {
+      beforeEach(function() {
+        mesh.material = new Jax.Material({layers:[{
+          type:"Blob"
+        }]});
+      });
+  
+      xit("should render without error", function() {
+        expect(function() { mesh.render(context); }).not.toThrow();
+      });
+    });
+});

data/spec/example_app/spec/javascripts/support/spec_layout.html.erb

@@ -77,7 +77,8 @@
 <div id="jax_nav">
   <a href="#" onclick="context.redirectTo('/');return false;">Lighting w/Multiple Sources</a> |
   <a href="#" onclick="context.redirectTo('shadows');return false;">Shadows</a> |
-  <a href="#" onclick="context.redirectTo('textures');return false;">Textures</a>
+  <a href="#" onclick="context.redirectTo('textures');return false;">Textures</a> |
+  <a href="#" onclick="context.redirectTo('noise');return false;">Noise Functions</a>
 </div>
 <div id="jasmine_content"></div>
 </body>

data/spec/javascripts/shaders/core_materials_spec.js

@@ -27,6 +27,7 @@ describe("Core Materials", function() {
       
       it("should coexist with all other builtins", function() {
         var m = new Jax.Material();
+
         if (name != "basic" && name != "default")
           m.addLayer(Jax.Material.find(name));
         

data/spec/javascripts/shaders/{dual_paraboloid_spec.js → paraboloid_spec.js}

@@ -1,10 +1,10 @@
-describe("Material segment 'dual_paraboloid'", function() {
+describe("Material segment 'paraboloid'", function() {
   var context;
   var matr;
   
   beforeEach(function() {
     context = new Jax.Context(document.getElementById('canvas-element'));
-    matr = new Jax.Material.DualParaboloid();
+    matr = new Jax.Material.Paraboloid();
     spyOn(matr, 'prepareShader').andCallThrough();
   });
   

data/src/constants.yml

@@ -0,0 +1 @@
+JAX_VERSION: 0.0.0.5

data/src/constants.yml.erb

@@ -0,0 +1 @@
+JAX_VERSION: <%=Jax::Version::STRING%>

data/src/jax.js

@@ -2,7 +2,19 @@
  * Jax
  * Root namespace containing all Jax data
  **/
-var Jax = { PRODUCTION: 1 };
+var Jax = { PRODUCTION: 1, VERSION: "<%=JAX_VERSION%>" };
+
+/* Called by Jax applications as of version 0.0.0.5 to alert the user to incomplete upgrades */
+Jax.doVersionCheck = function(targetVersion) {
+  // don't do this in production cause that would be a Bad Idea
+  if (Jax.environment && Jax.environment == Jax.PRODUCTION) return;
+  
+  if (Jax.VERSION != targetVersion) {
+    alert("Jax version mismatch!\n\n" +
+          "Your Jax gem is version "+targetVersion+", but the Jax JS library is version "+Jax.VERSION+"!\n\n" +
+          "Please run `rake jax:update` at the command line to fix this issue.");
+  }
+};
 
 // note: the default_shader is used immediately after Jax.Material has been defined. So, most
 // likely the end user won't be able to customize it with the expected result. Materials created
@@ -24,6 +36,7 @@ Jax.default_shader = "basic";
 //= require "jax/route_set"
 //= require "jax/view"
 //= require "jax/context"
+//= require "jax/noise"
 
 Jax.shaders = {};
 

data/src/jax/noise.js

@@ -0,0 +1,193 @@
+Jax.Noise = (function() {
+  var perm/*[256]*/ = [151,160,137,91,90,15,
+    131,13,201,95,96,53,194,233,7,225,140,36,103,30,69,142,8,99,37,240,21,10,23,
+    190, 6,148,247,120,234,75,0,26,197,62,94,252,219,203,117,35,11,32,57,177,33,
+    88,237,149,56,87,174,20,125,136,171,168, 68,175,74,165,71,134,139,48,27,166,
+    77,146,158,231,83,111,229,122,60,211,133,230,220,105,92,41,55,46,245,40,244,
+    102,143,54, 65,25,63,161, 1,216,80,73,209,76,132,187,208, 89,18,169,200,196,
+    135,130,116,188,159,86,164,100,109,198,173,186, 3,64,52,217,226,250,124,123,
+    5,202,38,147,118,126,255,82,85,212,207,206,59,227,47,16,58,17,182,189,28,42,
+    223,183,170,213,119,248,152, 2,44,154,163, 70,221,153,101,155,167, 43,172,9,
+    129,22,39,253, 19,98,108,110,79,113,224,232,178,185, 112,104,218,246,97,228,
+    251,34,242,193,238,210,144,12,191,179,162,241, 81,51,145,235,249,14,239,107,
+    49,192,214, 31,181,199,106,157,184, 84,204,176,115,121,50,45,127, 4,150,254,
+    138,236,205,93,222,114,67,29,24,72,243,141,128,195,78,66,215,61,156,180];
+
+  /* These are Ken Perlin's proposed gradients for 3D noise. I kept them for
+     better consistency with the reference implementation, but there is really
+     no need to pad this to 16 gradients for this particular implementation.
+     If only the "proper" first 12 gradients are used, they can be extracted
+     from the grad4[][] array: grad3[i][j] == grad4[i*2][j], 0<=i<=11, j=0,1,2
+  */
+  var grad3/*[16][3]*/ = [0,1,1,    0,1,-1,   0,-1,1,   0,-1,-1,
+                          1,0,1,    1,0,-1,  -1,0,1,   -1,0,-1,
+                          1,1,0,    1,-1,0,  -1,1,0,   -1,-1,0, // 12 cube edges
+                          1,0,-1,  -1,0,-1,   0,-1,1,   0,1,1]; // 4 more to make 16
+
+  /* These are my own proposed gradients for 4D noise. They are the coordinates
+     of the midpoints of each of the 32 edges of a tesseract, just like the 3D
+     noise gradients are the midpoints of the 12 edges of a cube.
+  */
+  var grad4/*[32][4]*/ = [0,1,1,1,   0,1,1,-1,   0,1,-1,1,   0,1,-1,-1, // 32 tesseract edges
+                          0,-1,1,1,  0,-1,1,-1,  0,-1,-1,1,  0,-1,-1,-1,
+                          1,0,1,1,   1,0,1,-1,   1,0,-1,1,   1,0,-1,-1,
+                         -1,0,1,1,  -1,0,1,-1,  -1,0,-1,1,  -1,0,-1,-1,
+                          1,1,0,1,   1,1,0,-1,   1,-1,0,1,   1,-1,0,-1,
+                         -1,1,0,1,  -1,1,0,-1,  -1,-1,0,1,  -1,-1,0,-1,
+                          1,1,1,0,   1,1,-1,0,   1,-1,1,0,   1,-1,-1,0,
+                         -1,1,1,0,  -1,1,-1,0,  -1,-1,1,0,  -1,-1,-1,0];
+
+  /* This is a look-up table to speed up the decision on which simplex we
+     are in inside a cube or hypercube "cell" for 3D and 4D simplex noise.
+     It is used to avoid complicated nested conditionals in the GLSL code.
+     The table is indexed in GLSL with the results of six pair-wise
+     comparisons beween the components of the P=(x,y,z,w) coordinates
+     within a hypercube cell.
+     c1 = x>=y ? 32 : 0;
+     c2 = x>=z ? 16 : 0;
+     c3 = y>=z ? 8 : 0;
+     c4 = x>=w ? 4 : 0;
+     c5 = y>=w ? 2 : 0;
+     c6 = z>=w ? 1 : 0;
+     offsets = simplex[c1+c2+c3+c4+c5+c6];
+     o1 = step(160,offsets);
+     o2 = step(96,offsets);
+     o3 = step(32,offsets);
+     (For the 3D case, c4, c5, c6 and o3 are not needed.)
+  */
+    var simplex4/*[][4]*/ = [0,64,128,192,   0,64,192,128,   0,0,0,0,        0,128,192,64,
+                             0,0,0,0,        0,0,0,0,        0,0,0,0,        64,128,192,0,
+                             0,128,64,192,   0,0,0,0,        0,192,64,128,   0,192,128,64,
+                             0,0,0,0,        0,0,0,0,        0,0,0,0,        64,192,128,0,
+                             0,0,0,0,        0,0,0,0,        0,0,0,0,        0,0,0,0,
+                             0,0,0,0,        0,0,0,0,        0,0,0,0,        0,0,0,0,
+                             64,128,0,192,   0,0,0,0,        64,192,0,128,   0,0,0,0,
+                             0,0,0,0,        0,0,0,0,        128,192,0,64,   128,192,64,0,
+                             64,0,128,192,   64,0,192,128,   0,0,0,0,        0,0,0,0,
+                             0,0,0,0,        128,0,192,64,   0,0,0,0,        128,64,192,0,
+                             0,0,0,0,        0,0,0,0,        0,0,0,0,        0,0,0,0,
+                             0,0,0,0,        0,0,0,0,        0,0,0,0,        0,0,0,0,
+                             128,0,64,192,   0,0,0,0,        0,0,0,0,        0,0,0,0,
+                             192,0,64,128,   192,0,128,64,   0,0,0,0,        192,64,128,0,
+                             128,64,0,192,   0,0,0,0,        0,0,0,0,        0,0,0,0,
+                             192,64,0,128,   0,0,0,0,        192,128,0,64,   192,128,64,0];
+                             
+  var simplex_buf = null, perm_buf = null, grad_buf = null;
+  
+  /*
+   * initPermTexture() - create and load a 2D texture for
+   * a combined index permutation and gradient lookup table.
+   * This texture is used for 2D and 3D noise, both classic and simplex.
+   */
+  function initPermTexture(context)
+  {
+    var tex = new Jax.Texture({min_filter: GL_NEAREST, mag_filter: GL_NEAREST, width:256, height:256});
+    
+    if (!perm_buf) {
+      var pixels = new Array(256*256*4);
+      var i,j;
+      for(i = 0; i<256; i++)
+        for(j = 0; j<256; j++) {
+          var offset = (i*256+j)*4;
+          var value = perm[(j+perm[i]) & 0xFF];
+          var g = (value & 0x0F) * 3;
+          pixels[offset]   = grad3[g+0] * 64 + 64; // Gradient x
+          pixels[offset+1] = grad3[g+1] * 64 + 64; // Gradient y
+          pixels[offset+2] = grad3[g+2] * 64 + 64; // Gradient z
+          pixels[offset+3] = value;                // Permuted index
+        }
+      perm_buf = new Uint8Array(pixels);
+    }
+
+    tex.bind(context, function() {
+      context.glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, 256, 256, 0, GL_RGBA, GL_UNSIGNED_BYTE, perm_buf);
+    });
+    
+    return tex;
+  }
+  
+  /*
+   * initSimplexTexture() - create and load a 1D texture for a
+   * simplex traversal order lookup table. This is used for simplex noise only,
+   * and only for 3D and 4D noise where there are more than 2 simplices.
+   * (3D simplex noise has 6 cases to sort out, 4D simplex noise has 24 cases.)
+   */
+  function initSimplexTexture(context)
+  {
+    // webgl doesn't support 1D so we'll simulate it with a 64x1 texture
+
+    if (!simplex_buf) simplex_buf = new Uint8Array(simplex4);
+    var tex = new Jax.Texture({min_filter:GL_NEAREST,mag_filter:GL_NEAREST, width:64, height:1});
+    tex.bind(context, function() {
+      context.glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, 64, 1, 0, GL_RGBA, GL_UNSIGNED_BYTE, simplex_buf);
+    });
+    return tex;
+  }
+  
+  /*
+   * initGradTexture(context) - create and load a 2D texture
+   * for a 4D gradient lookup table. This is used for 4D noise only.
+   */
+  function initGradTexture(context)
+  {
+    var tex = new Jax.Texture({min_filter: GL_NEAREST, mag_filter: GL_NEAREST, width:256, height:256});
+
+    if (!grad_buf) {
+      var pixels = new Array(256*256*4);
+      var i,j;
+
+      for(i = 0; i<256; i++)
+        for(j = 0; j<256; j++) {
+          var offset = (i*256+j)*4;
+          var value = perm[(j+perm[i]) & 0xFF];
+          var g = (value & 0x1F) * 4;
+          pixels[offset]   = grad4[g+0] * 64 + 64; // Gradient x
+          pixels[offset+1] = grad4[g+1] * 64 + 64; // Gradient y
+          pixels[offset+2] = grad4[g+2] * 64 + 64; // Gradient z
+          pixels[offset+3] = grad4[g+3] * 64 + 64; // Gradient z
+        }
+      
+      grad_buf = new Uint8Array(pixels);
+    }
+
+    tex.bind(context, function() {
+      context.glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, 256, 256, 0, GL_RGBA, GL_UNSIGNED_BYTE, grad_buf);
+    });
+    return tex;
+  }
+
+  /**
+   * class Jax.Noise
+   *
+   * Used by +Jax.Material.Noise+.
+   **/
+  return Jax.Class.create({
+    initialize: function(context) {
+      /** 
+       * Jax.Noise#perm -> Jax.Texture
+       * A 2D texture for a combined index permutation and gradient lookup table.
+       * This texture is used for both 2D and 3D noise, both classic and simplex.
+       **/
+      this.perm = initPermTexture(context);
+      
+      /** 
+       * Jax.Noise#simplex -> Jax.Texture
+       * A 1D texture for a simplex transversal order lookup table. This is used
+       * for simplex noise only, and only for 3D and 4D noise where there are more
+       * than 2 simplices. (3D simplex noise has 6 cases to sort out, 4D simplex
+       * noise has 24 cases.)
+       *
+       * Note that WebGL does not support 1D textures, so this is technically a
+       * 2D texture with a height of 1 pixel.
+       **/
+      this.simplex = initSimplexTexture(context);
+      
+      /** 
+       * Jax.Noise#grad -> Jax.Texture
+       * A 2D texture for a 4D gradient lookup table. This is used for 4D noise
+       * only.
+       **/
+      this.grad = initGradTexture(context);
+    }
+  });
+})();