juanpiwi / magi Goto Github PK

Sketching a small WebGL scene graph library

Goals: [- planned, + implemented, x started]
  Put together quick presentation graphics
    x slides/ -- semi-complete HTML slideshow app

  Write documentation
    + matrix.js changes -- glMatrix.js fork
    x gl_util.js -- WebGL utils, DOM utils, Colors, Curves, Klass
    - scenegraph.js -- Basic scene graph
    - scene_util.js -- More advanced stuff, default shaders
    - tar.js -- Tar archive loader
    - obj_loader.js -- Quite incomplete OBJ model format loader
    - bin_loader.js -- Custom binary model format loader

  Make simple things simple
    Drawing text
      + Draw text using the 2D canvas
      + Billboard text (buggy)
      - Extruded text (hmm?)
    Drawing images
      + Load image to textured quad
    Applying post-processing filters
      + Displays with FBO render targets
      + Material system
      - Easy way to chain filters
    Animation
      + Move along Bezier curves & Catmull-Rom splines
      x Animation vocabulary
      - Transformation tweens
    User inputs
      + Default camera navigation
      - Event handlers
    Loading and displaying simple textured models
      x Load archives with model and textures using XMLHttpRequest
      - Multiple lights
    Drawing presentation geometry
      + Quads, mesh quads
      + Fullscreen quads
      x Spheres
      x Cubes, mesh cubes
      x Ring segments, capped rings
      - Capped cylinders
      - Ribbons (along Bezier paths)
      - Dice
      - Layouted arrays of objects (grids, circles, ...)

  Not-so-complex stuff
    x Rewrite scene graph so that it can handle multiple passes easier.
    x Have a structure that's somewhat like this:
      - Display == render target + scene
        - to draw, bind FBO and render scene
        - write a custom draw method to do fancy stuff like envmaps or shadows
      x Camera == perspective & lookat matrices, used by display
      - Light == per-scene list of light attribs, for use in shaders
      x Scene == graph of nodes
      + Node == matrix + model + material + subgraph
      + Model == geometry
      + Material == shader + uniforms

  Complex stuff
    - Shadow maps
    - Depth-peeling
    - Envmaps