mattdesl · TiraO · Nov 17, 2017
diff --git a/.gitignore b/.gitignore
@@ -1,5 +1,5 @@
-bower_components
 node_modules
 *.log
 .DS_Store
 bundle.js
+.idea/
diff --git a/.npmignore b/.npmignore
@@ -1,9 +1,7 @@
-bower_components
 node_modules
 *.log
 .DS_Store
 bundle.js
-test
-test.js
-demo/
-bower.json
+demo.js
+tests/
+.idea/
diff --git a/demo.js b/demo.js
@@ -0,0 +1,51 @@
+var createApp = require('canvas-testbed')
+
+var THREE = require('three')
+var OrbitControls = require('./')(THREE)
+
+createApp(render, start, {
+  context: 'webgl',
+  onResize: resize
+})
+
+var renderer,
+  scene,
+  camera,
+  controls
+
+function start(gl, width, height) {
+  renderer = new THREE.WebGLRenderer({
+    canvas: gl.canvas
+  })
+  renderer.setClearColor(0x000000, 1.0)
+
+  scene = new THREE.Scene()
+
+  // camera = new THREE.OrthographicCamera( 1 / - 2, 1 / 2, 1 / 2, 1 / - 2, 1, 1000 )
+  // camera.position.set(0, 0, -1)
+
+  camera = new THREE.PerspectiveCamera(50, width / height, 1, 1000)
+  camera.position.set(0, 1, -3)
+  camera.lookAt(new THREE.Vector3())
+
+  controls = new OrbitControls(camera)
+
+  var geo = new THREE.BoxGeometry(1, 1, 1)
+  var mat = new THREE.MeshBasicMaterial({ wireframe: true, color: 0xffffff })
+  var box = new THREE.Mesh(geo, mat)
+  scene.add(box)
+}
+
+function render(gl, width, height) {
+  renderer.render(scene, camera)
+}
+
+function resize(width, height) {
+  if (renderer) {
+    renderer.setViewport(0, 0, width, height)
+    camera.aspect = width / height
+    camera.updateProjectionMatrix()
+  } else {
+    return
+  }
+}
diff --git a/package.json b/package.json
@@ -13,12 +13,18 @@
   "devDependencies": {
     "browserify": "^8.1.1",
     "canvas-testbed": "^1.0.3",
+    "chai": "^4.1.2",
+    "jsdom": "^11.3.0",
+    "mocha": "^4.0.1",
     "scriptjs": "^2.5.7",
+    "sinon": "^4.1.2",
+    "sinon-chai": "^2.14.0",
     "three": "^0.82.1",
     "wzrd": "^1.2.1"
   },
   "scripts": {
-    "start": "wzrd test.js"
+    "start": "wzrd demo.js",
+    "test": "mocha ./tests{,/**/}**test.js --recursive"
   },
   "keywords": [
     "orbit",

diff --git a/test.js b/test.js
diff --git a/tests/three-orbit-controls-test.js b/tests/three-orbit-controls-test.js
@@ -0,0 +1,62 @@
+var expect = require('chai').expect;
+var THREE = require('three');
+var OrbitControls = require('../index')(THREE);
+var JSDOM = require('jsdom').JSDOM;
+
+var window = new JSDOM('<!DOCTYPE html><p>Hello world</p>').window;
+global.window = window;
+global.document = window.document;
+var MouseEvent = window.MouseEvent;
+
+function defineProperty(object, propertyName, propertyValue) {
+  Object.defineProperty(object, propertyName, {
+    get: function () {
+      return propertyValue;
+    },
+    enumerable: true,
+    configurable: true
+  });
+}
+
+describe("three-orbit-controls", function () {
+  describe("after depressing the orbit button", function () {
+    var orbitControls, camera, domElement;
+    beforeEach(function () {
+      domElement = window.document.createElement('div');
+      defineProperty(domElement, 'clientWidth', 100);
+      defineProperty(domElement, 'clientHeight', 100);
+      document.body.appendChild(domElement);
+
+      camera = new THREE.PerspectiveCamera(50, 1000, 1000);
+      camera.position.x = -100;
+      orbitControls = new OrbitControls(camera, domElement);
+
+      var mouseDown =
+        new MouseEvent('mousedown', {
+          button: orbitControls.mouseButtons.ORBIT,
+          clientX: 0,
+          clientY: 0
+        });
+      domElement.dispatchEvent(mouseDown);
+    });
+
+    afterEach(function () {
+      document.body.removeChild(domElement);
+    });
+
+    describe("moving the mouse downwards", function () {
+      var mouseMove;
+      beforeEach(function () {
+        mouseMove = new MouseEvent('mousemove', {
+          clientX: 0,
+          clientY: 10
+        });
+      });
+
+      it("moves the camera upwards", function () {
+        document.dispatchEvent(mouseMove);
+        expect(camera.position.y).to.be.greaterThan(10);
+      })
+    });
+  });
+});