From b63da767e898ceec84894b533efa50f11f7edf9a Mon Sep 17 00:00:00 2001
From: Johan Brook <johan.jvb@gmail.com>
Date: Sun, 17 Jul 2011 17:19:19 +0200
Subject: [PATCH] Removed 'maximum-scale=1.0' from meta tag. Mobile visitors
 should be able to zoom. Added JS fix for the iOS bug where the site will
 autozoom whenever the orientation is changed (see
 http://adactio.com/journal/4470/).

---
 index.html         |  2 +-
 javascripts/app.js | 16 ++++++++++++++++
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index 30e4a02..2e36de2 100644
--- a/index.html
+++ b/index.html
@@ -17,7 +17,7 @@
 	
 	<!-- Mobile Specific Metas
   ================================================== -->
-	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" /> 
+	<meta name="viewport" content="width=device-width, initial-scale=1" /> 
 	
 	<!-- CSS
   ================================================== -->
diff --git a/javascripts/app.js b/javascripts/app.js
index 90d46c8..698f701 100644
--- a/javascripts/app.js
+++ b/javascripts/app.js
@@ -9,6 +9,22 @@
 	
 
 $(document).ready(function() {
+	
+	/* 	Prevent iPhone and iPad to autoscale the page when rotated 
+		(http://adactio.com/journal/4470/)
+	================================================================ */
+
+  	if (navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i)) {
+   	  var viewportmeta = document.querySelector('meta[name="viewport"]');
+   	  if (viewportmeta) {
+   	    viewportmeta.content = 'width=device-width, minimum-scale=1.0, maximum-scale=1.0';
+   	    document.body.addEventListener('gesturestart', function() {
+   	      viewportmeta.content = 'width=device-width, minimum-scale=0.25, maximum-scale=1.6';
+   	    }, false);
+   	  }
+   	}
+
+
 
 	/* Tabs Activiation
 	================================================== */