Car layer (#33)

* add car obj

* load and converted car obj

* fix geometry indice binding

* use refs instead of reactDom.findDomNode

* remove reactdom

* add luma back to dependencies

* upgrade to luma 2.0.0-beta1

* remove car layer

* typp

* remove _initializeprimitiveattribtues in layer.js

.gitignore

@@ -1,6 +1,7 @@
 dist/*
 build/*
 .project
+.idea
 .DS_Store
 *.zip
 *.rar

package.json

@@ -16,7 +16,11 @@
     "url": "https://github.com/uber-common/deck.gl.git"
   },
   "main": "dist/index.js",
-  "files": ["dist", "shaderlib", "src"],
+  "files": [
+    "dist",
+    "shaderlib",
+    "src"
+  ],
   "browserify": {
     "transform": [
       "babelify",
@@ -35,6 +39,8 @@
   "dependencies": {
     "autobind-decorator": "^1.3.3",
     "babel-core": "^6.7.7",
+    "babel-polyfill": "^6.1.19",
+    "babel-plugin-transform-builtin-extend": "^1.1.0",
     "earcut": "^2.0.6",
     "geojson-normalize": "0.0.1",
     "get-pixels": "^3.3.0",
@@ -44,13 +50,13 @@
     "lodash.isfunction": "^3.0.6",
     "lodash.throttle": "^3.0.4",
     "lodash.where": "^3.1.0",
-    "luma.gl": "^2.0.4-0",
+    "luma.gl": "2.0.0-beta1",
     "save-pixels": "^2.3.0",
-    "viewport-mercator-project": "^2.0.1"
+    "viewport-mercator-project": "^2.0.1",
+    "webgl-obj-loader": "^0.1.1"
   },
   "devDependencies": {
     "babel-plugin-glslify": "^1.0.0",
-    "babel-polyfill": "^6.1.19",
     "babel-cli": "^6.3.15",
     "babel-eslint": "^4.1.6",
     "babel-plugin-transform-builtin-extend": "1.1.0",

src/layer.js

@@ -330,9 +330,6 @@ export default class Layer {
     assert(this.state.model, 'Model must be set in initializeState');
     this.setViewport();
 
-    // Add any primitive attributes
-    this._initializePrimitiveAttributes();
-
     // TODO - the app must be able to override
 
     // Add any subclass attributes
@@ -436,28 +433,6 @@ export default class Layer {
   }
 
   // INTERNAL METHODS
-
-  // Set up attributes relating to the primitive itself (not the instances)
-  _initializePrimitiveAttributes() {
-    const {gl, model, attributeManager} = this.state;
-
-    // TODO - this unpacks and repacks the attributes, seems unnecessary
-    if (model.geometry.hasAttribute('vertices')) {
-      const vertices = model.geometry.getArray('vertices');
-      attributeManager.addVertices(vertices);
-    }
-
-    if (model.geometry.hasAttribute('normals')) {
-      const normals = model.geometry.getArray('normals');
-      attributeManager.addNormals(normals);
-    }
-
-    if (model.geometry.hasAttribute('indices')) {
-      const indices = model.geometry.getArray('indices');
-      attributeManager.addIndices(indices, gl);
-    }
-  }
-
   _updateModel({gl}) {
     const {model, attributeManager, uniforms} = this.state;
 

src/webgl-renderer.js

@@ -21,9 +21,8 @@
 /* eslint-disable no-console, no-try-catch */
 /* global console */
 import React, {PropTypes} from 'react';
-import ReactDOM from 'react-dom';
 import autobind from 'autobind-decorator';
-import {createGLContext, Camera, Scene, Events, Fx} from 'luma.gl';
+import {createGLContext, Camera, Scene, Events, Fx, glGet} from 'luma.gl';
 import throttle from 'lodash.throttle';
 
 const PROP_TYPES = {
@@ -99,7 +98,7 @@ export default class WebGLRenderer extends React.Component {
   }
 
   componentDidMount() {
-    const canvas = ReactDOM.findDOMNode(this);
+    const canvas = this.refs.overlay;
     this._initWebGL(canvas);
     this._animationLoop();
   }
@@ -191,14 +190,14 @@ export default class WebGLRenderer extends React.Component {
     // setup bledning
     if (enable) {
       gl.enable(gl.BLEND);
-      gl.blendFunc(...blendFunc.map(s => gl.get(s)));
-      gl.blendEquation(gl.get(blendEquation));
+      gl.blendFunc(...blendFunc.map(s => glGet(gl, s)));
+      gl.blendEquation(glGet(gl, blendEquation));
     } else {
       gl.disable(gl.BLEND);
     }
 
     onBeforeRenderFrame();
-    scene.render(gl, {camera});
+    scene.render({camera});
     onAfterRenderFrame();
   }
 
@@ -216,6 +215,7 @@ export default class WebGLRenderer extends React.Component {
     const {id, width, height, pixelRatio} = this.props;
     return (
       <canvas
+        ref={ 'overlay' }
         id={ id }
         width={ width * pixelRatio || 1 }
         height={ height * pixelRatio || 1 }