added exit pointer lock, jquery selector support

Author: BigTeri

README.md

@@ -1,4 +1,37 @@
 # jspointerlock
-[![NPM Version](http://img.shields.io/npm/v/jspointerlock.svg?style=flat)](https://www.npmjs.org/package/jspointerlock)
+[![NPM Version][npm-image]][npm-url]
+[![NPM Downloads][downloads-image]][downloads-url]
 
-HTML5 Pointerlock lib
+**HTML5 Pointer Lock Lib**
+
+## Usage
+
+```js
+import $ from "jquery";
+import PointerLock from "jspointerlock";
+
+const element = document.body;
+const pointerlock = new PointerLock(element);
+
+pointerlock.on("change", (isLocked) => {
+  console.log(`pointer is ${isLocked ? 'locked' : 'not locked'}`);
+});
+
+$(element).on("click", () => {
+  pointerlock.requestPointerLock();
+
+  setTimeout(() => {
+    pointerlock.exitPointerLock();
+  }, 3000);
+});
+```
+
+
+## License
+
+[MIT](LICENSE)
+
+[npm-image]: https://img.shields.io/npm/v/jspointerlock.svg
+[npm-url]: https://npmjs.org/package/jspointerlock
+[downloads-image]: https://img.shields.io/npm/dm/jspointerlock.svg
+[downloads-url]: https://npmjs.org/package/jspointerlock

index.js

@@ -4,10 +4,14 @@ import PointerLock from "./src/index";
 const element = document.body;
 const pointerlock = new PointerLock(element);
 
-pointerlock.on("change", (isOn) => {
-  console.log("pointerlock is " + (isOn ? "on" : "off"));
+pointerlock.on("change", (isLocked) => {
+  console.log(`pointer is ${isLocked ? 'locked' : 'not locked'}`);
 });
 
 $(element).on("click", () => {
   pointerlock.requestPointerLock();
+
+  setTimeout(() => {
+    pointerlock.exitPointerLock();
+  }, 3000);
 });

package.json

@@ -1,7 +1,7 @@
 {
   "name": "jspointerlock",
-  "version": "0.1.3",
-  "description": "HTML5 Pointerlock lib",
+  "version": "0.2.0",
+  "description": "HTML5 Pointer Lock Lib",
   "main": "src/index.js",
   "scripts": {
     "start": "http-server ./",
@@ -18,8 +18,6 @@
     "jspm": "^0.16.47"
   },
   "jspm": {
-    "jspmPackage": true,
-    "main": "src/index.js",
     "dependencies": {
       "events": "github:jspm/nodelibs-events@^0.1.1",
       "jquery": "npm:jquery@^3.1.1"

src/index.js

@@ -7,19 +7,20 @@ export default class PointerLock extends EventEmitter {
   constructor(element) {
     super();
 
-    this.element = element;
+    this.$element = $(element);
+    this.element = this.$element.get(0);
+    this.isLocked = this.getLockState();
 
     $(document).on("pointerlockchange mozpointerlockchange, webkitpointerlockchange", this.pointerLockChange.bind(this));
   }
 
+  getLockState() {
+    return this.getPointerLockElement() === this.element;
+  }
+
   pointerLockChange() {
-    if (this.getPointerLockElement() === this.element) {
-      this.isLocked = true;
-      this.emit("change", this.isLocked);
-    } else {
-      this.isLocked = false;
-      this.emit("change", this.isLocked);
-    }
+    this.isLocked = this.getLockState();
+    this.emit("change", this.isLocked);
   }
 
   requestPointerLock() {
@@ -32,6 +33,14 @@ export default class PointerLock extends EventEmitter {
     }
   }
 
+  exitPointerLock() {
+    if (document.exitPointerLock) {
+      document.exitPointerLock();
+    } else if (document.mozExitPointerLock) {
+      document.mozExitPointerLock();
+    }
+  }
+
   getPointerLockElement() {
     return document.pointerLockElement ||
       document.mozPointerLockElement ||