Upd deps

.eslintrc.json

@@ -0,0 +1,43 @@
+{
+    "env": {
+        "browser": true,
+        "node": true,
+        "commonjs": true,
+        "es6": true
+    },
+    "extends": "eslint:recommended",
+    "rules": {
+        "strict": 2,
+        "indent": 0,
+        "linebreak-style": 0,
+        "quotes": 0,
+        "semi": 0,
+        "no-cond-assign": 1,
+        "no-constant-condition": 1,
+        "no-duplicate-case": 1,
+        "no-empty": 1,
+        "no-ex-assign": 1,
+        "no-extra-boolean-cast": 1,
+        "no-extra-semi": 1,
+        "no-fallthrough": 1,
+        "no-func-assign": 1,
+        "no-global-assign": 1,
+        "no-implicit-globals": 2,
+        "no-inner-declarations": ["error", "functions"],
+        "no-irregular-whitespace": 2,
+        "no-loop-func": 1,
+        "no-multi-str": 1,
+        "no-mixed-spaces-and-tabs": 1,
+        "no-proto": 1,
+        "no-sequences": 1,
+        "no-throw-literal": 1,
+        "no-unmodified-loop-condition": 1,
+        "no-useless-call": 1,
+        "no-void": 1,
+        "no-with": 2,
+        "wrap-iife": 1,
+        "no-redeclare": 1,
+        "no-unused-vars": ["error", { "vars": "all", "args": "none" }],
+        "no-sparse-arrays": 1
+    }
+}

.gitignore

@@ -0,0 +1,62 @@
+components
+
+node_modules
+# Compiled source #
+###################
+*.com
+*.class
+*.dll
+*.exe
+*.o
+*.so
+*.bin
+
+# Packages #
+############
+# it's better to unpack these files and commit the raw source
+# git has its own built in compression methods
+*.7z
+*.dmg
+*.gz
+*.iso
+*.jar
+*.rar
+*.tar
+*.zip
+
+# Logs and databases #
+######################
+*.log
+*.sql
+*.sqlite
+
+# OS generated files #
+######################
+.DS_Store
+.DS_Store?
+*._*
+.Spotlight-V100
+.Trashes
+Icon?
+ehthumbs.db
+Thumbs.db
+
+# My extension #
+################
+*.lock
+*.bak
+lsn
+*.dump
+*.beam
+*.[0-9]
+*._[0-9]
+*.ns
+Scripting_*
+docs
+*.pdf
+*.pak
+
+demo
+design
+instances
+*node_modules

index.js

@@ -0,0 +1,83 @@
+/**
+ * @module  pan-zoom
+ *
+ * Events for pan and zoom
+ */
+'use strict';
+
+
+const Impetus = require('impetus');
+const wheel = require('wheel');
+const touchPinch = require('touch-pinch');
+const position = require('touch-position');
+
+
+module.exports = panzoom;
+
+
+function panzoom (target, pan, zoom) {
+	if (!target) return false;
+
+	let pos = position({
+		element: target
+	});
+
+	let impetus;
+
+	//enable panning
+	if (pan instanceof Function) {
+		let lastY = 0, lastX = 0;
+		impetus = new Impetus({
+			source: target,
+			update: (x, y) => {
+				pan(x - lastX, y - lastY, pos[0], pos[1]);
+				lastX = x;
+				lastY = y;
+			},
+			multiplier: 1,
+			friction: .75
+		});
+	}
+
+
+	//enable zooming
+	if (zoom instanceof Function) {
+		wheel.addWheelListener(target, (e) => {
+			e.preventDefault();
+			zoom(e.wheelDeltaX, e.wheelDeltaY, pos[0], pos[1]);
+		});
+
+		//mobile pinch zoom
+		let pinch = touchPinch(target);
+		let mult = 2;
+		let lastDist, initialCoords;
+
+		pinch.on('start', (curr) => {
+			impetus && impetus.pause();
+
+			let [f1, f2] = pinch.fingers;
+
+			lastDist = [Math.abs(f2.position[0] - f1.position[0]), Math.abs(f2.position[1] - f1.position[1])];
+
+			initialCoords = [f2.position[0]*.5 + f1.position[0]*.5, f2.position[1]*.5 + f1.position[1]*.5];
+		});
+		pinch.on('end', () => {
+			lastDist = null;
+			initialCoords = null;
+
+			impetus && impetus.resume();
+		});
+		pinch.on('change', (curr, prev) => {
+			if (!pinch.pinching || !lastDist || !initialCoords) return;
+
+			let [f1, f2] = pinch.fingers;
+
+			let dist = [Math.abs(f2.position[0] - f1.position[0]), Math.abs(f2.position[1] - f1.position[1])];
+			let delta = [dist[0] - lastDist[0], dist[1] - lastDist[1]];
+
+			lastDist = dist;
+
+			zoom(delta[0]*mult, delta[1]*mult, initialCoords[0], initialCoords[1]);
+		});
+	}
+}

package.json

@@ -0,0 +1,36 @@
+{
+  "name": "pan-zoom",
+  "version": "1.0.0",
+  "description": "Pan and zoom events for any element",
+  "main": "index.js",
+  "scripts": {
+    "test": "budo test.js"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/dfcreative/pan-zoom.git"
+  },
+  "keywords": [
+    "pan",
+    "zoom",
+    "pinch",
+    "touch",
+    "canvas",
+    "webgl"
+  ],
+  "author": "ΔY <[email protected]>",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/dfcreative/pan-zoom/issues"
+  },
+  "homepage": "https://github.com/dfcreative/pan-zoom#readme",
+  "dependencies": {
+    "impetus": "^0.8.3",
+    "touch-pinch": "^1.0.0",
+    "touch-position": "^2.0.0",
+    "wheel": "^0.0.4"
+  },
+  "devDependencies": {
+    "eslint": "^3.8.1"
+  }
+}

readme.md

@@ -0,0 +1,30 @@
+# pan-zoom  [![unstable](http://badges.github.io/stability-badges/dist/unstable.svg)](http://github.com/badges/stability-badges) ![tiny](https://img.shields.io/badge/size-4.8kb-brightgreen.svg)
+
+Panning and zooming events for any target. May come handy for webgl, canvas, svg, images or pure html manipulations. Handles mobile pinch-zoom, drag and scroll interactions, provides inertial movement.
+
+See [demo](https://dfcreative.github.io/plot-grid).
+
+[![npm install pan-zoom](https://nodei.co/npm/pan-zoom.png?mini=true)](https://npmjs.org/package/pan-zoom/)
+
+```js
+const panzoom = require('pan-zoom');
+
+panzoom(
+	target,
+	function onPan (dx, dy, cx, cy) => {
+		//dx and dy are deltas from the last call
+	},
+	function onZoom (dx, dy, cx, cy) => {
+		//cx and cy are pointer coordinates relative to the target
+	}
+);
+```
+
+## Credits
+
+This package puts together high-quality tiny components, for what acknowledgment to their authors:
+
+* [impetus](http://npmjs.org/package/impetus) by **[Chris Bateman @chrisbateman](https://github.com/chrisbateman)** handles inertial drag.
+* [wheel](https://github.com/anvaka/wheel) by **[Andrei Kashcha @anvaka](https://github.com/anvaka)** covers cross-browser wheel event.
+* [touch-pinch](https://www.npmjs.com/package/touch-pinch) by **[Matt DesLauriers @mattdesl](https://github.com/mattdesl)** handles mobile pinch gestures.
+* [touch-position](https://www.npmjs.com/package/touch-position) by **[Matt DesLauriers @mattdesl](https://github.com/mattdesl)** tracks mouse and touch coordinates.