iOS: stop keyboard pushing content offscreen

Previously using the onscreen keyboard would shrink the visual viewport
while leaving the elements at the same size, meaning some of the content
had to be offscreen. As we scrolled the page to have the cursor in view,
this would move the notebook bar offscreen.

To avoid the possibility of the cursor leaving the screen or the bottom
toolbar being offscren, we can use the VisualViewport API to force the
logical viewport to have the same size as the visual one

This won't have an effect in iframes as the logical and visual viewport
in iframes are always the same, and we already scale to 100% height by
default anyway

Signed-off-by: Skyler <skyler.grey@collabora.com>
Change-Id: I07726bee8b61334f6a32e873ab2d5428fa60dca3

browser/js/global.js

@@ -1281,4 +1281,15 @@ window.app = {
 			this.socket.onopen();
 		}
 	}
+
+	function handleViewportChange(event) {
+		var visualViewport = event.target;
+
+		document.body.style.height = visualViewport.height + 'px';
+	}
+
+	if (window.visualViewport !== undefined) {
+		window.visualViewport.addEventListener('scroll', handleViewportChange);
+		window.visualViewport.addEventListener('resize', handleViewportChange);
+	}
 }(window));