From e8c20c6696b20707261af208d23e3b3b8428c406 Mon Sep 17 00:00:00 2001
From: Daniel Freedman <dfreedm@google.com>
Date: Mon, 6 Jan 2014 17:35:29 -0800
Subject: [PATCH] add simple pinchrotate sample

---
 samples/pinchrotate/index.html | 52 ++++++++++++++++++++++++++++++++++
 1 file changed, 52 insertions(+)
 create mode 100644 samples/pinchrotate/index.html
diff --git a/samples/pinchrotate/index.html b/samples/pinchrotate/index.html
new file mode 100644
index 0000000..315717c
--- /dev/null
+++ b/samples/pinchrotate/index.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>Pinch Zoom Sample</title>
+  <style>
+    body, html {
+      margin: 0;
+      height: 100%;
+      position: relative;
+    }
+    body {
+      overflow: auto;
+    }
+    #box {
+      height: 100px;
+      width: 100px;
+      margin: -50px;
+      background: gray;
+    }
+  </style>
+  <script src="../../pointergestures.js"></script>
+</head>
+<body touch-action="none">
+  <div id="box" touch-action="none"></div>
+  <script>
+    var zoom = 1;
+    var angle = 0;
+    var x = 0, y = 0;
+
+    document.addEventListener('pinch', function(e) {
+      zoom = e.scale;
+      x = e.centerX;
+      y = e.centerY;
+    });
+    document.addEventListener('rotate', function(e) {
+      angle = e.angle;
+      x = e.centerX;
+      y = e.centerY;
+    });
+
+    function draw() {
+      var trans = 'translate(' + Math.floor(x) + 'px, ' + Math.floor(y) + 'px) scale(' + zoom.toFixed(2) + ') rotate(' + angle.toFixed(1) + 'deg)';
+      box.style.webkitTransform = box.style.transform = trans;
+      requestAnimationFrame(draw);
+    };
+
+    requestAnimationFrame(draw);
+
+  </script>
+</body>
+</html>
