michael@0: /* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
michael@0: /* vim: set ts=2 sw=2 sts=2 et: */
michael@0: 
michael@0: /* This Source Code Form is subject to the terms of the Mozilla Public
michael@0:  * License, v. 2.0. If a copy of the MPL was not distributed with this file,
michael@0:  * You can obtain one at http://mozilla.org/MPL/2.0/. */
michael@0: 
michael@0: "use strict";
michael@0: dump("############################### browserElementPanning.js loaded\n");
michael@0: 
michael@0: let { classes: Cc, interfaces: Ci, results: Cr, utils: Cu }  = Components;
michael@0: Cu.import("resource://gre/modules/Services.jsm");
michael@0: Cu.import("resource://gre/modules/Geometry.jsm");
michael@0: 
michael@0: var global = this;
michael@0: 
michael@0: const kObservedEvents = [
michael@0:   "BEC:ShownModalPrompt",
michael@0:   "Activity:Success",
michael@0:   "Activity:Error"
michael@0: ];
michael@0: 
michael@0: const ContentPanning = {
michael@0:   // Are we listening to touch or mouse events?
michael@0:   watchedEventsType: '',
michael@0: 
michael@0:   // Are mouse events being delivered to this content along with touch
michael@0:   // events, in violation of spec?
michael@0:   hybridEvents: false,
michael@0: 
michael@0:   init: function cp_init() {
michael@0:     // If APZ is enabled, we do active element handling in C++
michael@0:     // (see widget/xpwidgets/ActiveElementManager.h), and panning
michael@0:     // itself in APZ, so we don't need to handle any touch events here.
michael@0:     if (docShell.asyncPanZoomEnabled === false) {
michael@0:       this._setupListenersForPanning();
michael@0:     }
michael@0: 
michael@0:     addEventListener("unload",
michael@0: 		     this._unloadHandler.bind(this),
michael@0: 		     /* useCapture = */ false,
michael@0: 		     /* wantsUntrusted = */ false);
michael@0: 
michael@0:     addMessageListener("Viewport:Change", this._recvViewportChange.bind(this));
michael@0:     addMessageListener("Gesture:DoubleTap", this._recvDoubleTap.bind(this));
michael@0:     addEventListener("visibilitychange", this._handleVisibilityChange.bind(this));
michael@0:     kObservedEvents.forEach((topic) => {
michael@0:       Services.obs.addObserver(this, topic, false);
michael@0:     });
michael@0:   },
michael@0: 
michael@0:   _setupListenersForPanning: function cp_setupListenersForPanning() {
michael@0:     var events;
michael@0:     try {
michael@0:       content.document.createEvent('TouchEvent');
michael@0:       events = ['touchstart', 'touchend', 'touchmove'];
michael@0:       this.watchedEventsType = 'touch';
michael@0: #ifdef MOZ_WIDGET_GONK
michael@0:       // The gonk widget backend does not deliver mouse events per
michael@0:       // spec.  Third-party content isn't exposed to this behavior,
michael@0:       // but that behavior creates some extra work for us here.
michael@0:       let appInfo = Cc["@mozilla.org/xre/app-info;1"];
michael@0:       let isParentProcess =
michael@0:         !appInfo || appInfo.getService(Ci.nsIXULRuntime)
michael@0:                            .processType == Ci.nsIXULRuntime.PROCESS_TYPE_DEFAULT;
michael@0:       this.hybridEvents = isParentProcess;
michael@0: #endif
michael@0:     } catch(e) {
michael@0:       // Touch events aren't supported, so fall back on mouse.
michael@0:       events = ['mousedown', 'mouseup', 'mousemove'];
michael@0:       this.watchedEventsType = 'mouse';
michael@0:     }
michael@0: 
michael@0:     let els = Cc["@mozilla.org/eventlistenerservice;1"]
michael@0:                 .getService(Ci.nsIEventListenerService);
michael@0: 
michael@0:     events.forEach(function(type) {
michael@0:       // Using the system group for mouse/touch events to avoid
michael@0:       // missing events if .stopPropagation() has been called.
michael@0:       els.addSystemEventListener(global, type,
michael@0:                                  this.handleEvent.bind(this),
michael@0:                                  /* useCapture = */ false);
michael@0:     }.bind(this));
michael@0:   },
michael@0: 
michael@0:   handleEvent: function cp_handleEvent(evt) {
michael@0:     // Ignore events targeting a <iframe mozbrowser> since those will be
michael@0:     // handle by the BrowserElementPanning.js instance of it.
michael@0:     if (evt.target instanceof Ci.nsIMozBrowserFrame) {
michael@0:       return;
michael@0:     }
michael@0: 
michael@0:     if (evt.defaultPrevented || evt.multipleActionsPrevented) {
michael@0:       // clean up panning state even if touchend/mouseup has been preventDefault.
michael@0:       if(evt.type === 'touchend' || evt.type === 'mouseup') {
michael@0:         if (this.dragging &&
michael@0:             (this.watchedEventsType === 'mouse' ||
michael@0:              this.findPrimaryPointer(evt.changedTouches))) {
michael@0:           this._finishPanning();
michael@0:         }
michael@0:       }
michael@0:       return;
michael@0:     }
michael@0: 
michael@0:     switch (evt.type) {
michael@0:       case 'mousedown':
michael@0:       case 'touchstart':
michael@0:         this.onTouchStart(evt);
michael@0:         break;
michael@0:       case 'mousemove':
michael@0:       case 'touchmove':
michael@0:         this.onTouchMove(evt);
michael@0:         break;
michael@0:       case 'mouseup':
michael@0:       case 'touchend':
michael@0:         this.onTouchEnd(evt);
michael@0:         break;
michael@0:       case 'click':
michael@0:         evt.stopPropagation();
michael@0:         evt.preventDefault();
michael@0: 
michael@0:         let target = evt.target;
michael@0:         let view = target.ownerDocument ? target.ownerDocument.defaultView
michael@0:                                         : target;
michael@0:         view.removeEventListener('click', this, true, true);
michael@0:         break;
michael@0:     }
michael@0:   },
michael@0: 
michael@0:   observe: function cp_observe(subject, topic, data) {
michael@0:     this._resetHover();
michael@0:   },
michael@0: 
michael@0:   position: new Point(0 , 0),
michael@0: 
michael@0:   findPrimaryPointer: function cp_findPrimaryPointer(touches) {
michael@0:     if (!('primaryPointerId' in this))
michael@0:       return null;
michael@0: 
michael@0:     for (let i = 0; i < touches.length; i++) {
michael@0:       if (touches[i].identifier === this.primaryPointerId) {
michael@0:         return touches[i];
michael@0:       }
michael@0:     }
michael@0:     return null;
michael@0:   },
michael@0: 
michael@0:   onTouchStart: function cp_onTouchStart(evt) {
michael@0:     let screenX, screenY;
michael@0:     if (this.watchedEventsType == 'touch') {
michael@0:       if ('primaryPointerId' in this || evt.touches.length >= 2) {
michael@0:         this._resetActive();
michael@0:         return;
michael@0:       }
michael@0: 
michael@0:       let firstTouch = evt.changedTouches[0];
michael@0:       this.primaryPointerId = firstTouch.identifier;
michael@0:       this.pointerDownTarget = firstTouch.target;
michael@0:       screenX = firstTouch.screenX;
michael@0:       screenY = firstTouch.screenY;
michael@0:     } else {
michael@0:       this.pointerDownTarget = evt.target;
michael@0:       screenX = evt.screenX;
michael@0:       screenY = evt.screenY;
michael@0:     }
michael@0:     this.dragging = true;
michael@0:     this.panning = false;
michael@0: 
michael@0:     let oldTarget = this.target;
michael@0:     [this.target, this.scrollCallback] = this.getPannable(this.pointerDownTarget);
michael@0: 
michael@0:     // If we have a pointer down target, we may need to fill in for EventStateManager
michael@0:     // in setting the active state on the target element.  Set a timer to
michael@0:     // ensure the pointer-down target is active.  (If it's already
michael@0:     // active, the timer is a no-op.)
michael@0:     if (this.pointerDownTarget !== null) {
michael@0:       // If there's no possibility this is a drag/pan, activate now.
michael@0:       // Otherwise wait a little bit to see if the gesture isn't a
michael@0:       // tap.
michael@0:       if (this.target === null) {
michael@0:         this.notify(this._activationTimer);
michael@0:       } else {
michael@0:         this._activationTimer.initWithCallback(this,
michael@0:                                                this._activationDelayMs,
michael@0:                                                Ci.nsITimer.TYPE_ONE_SHOT);
michael@0:       }
michael@0:     }
michael@0: 
michael@0:     // If there is a pan animation running (from a previous pan gesture) and
michael@0:     // the user touch back the screen, stop this animation immediatly and
michael@0:     // prevent the possible click action if the touch happens on the same
michael@0:     // target.
michael@0:     this.preventNextClick = false;
michael@0:     if (KineticPanning.active) {
michael@0:       KineticPanning.stop();
michael@0: 
michael@0:       if (oldTarget && oldTarget == this.target)
michael@0:         this.preventNextClick = true;
michael@0:     }
michael@0: 
michael@0:     this.position.set(screenX, screenY);
michael@0:     KineticPanning.reset();
michael@0:     KineticPanning.record(new Point(0, 0), evt.timeStamp);
michael@0: 
michael@0:     // We prevent start events to avoid sending a focus event at the end of this
michael@0:     // touch series. See bug 889717.
michael@0:     if ((this.panning || this.preventNextClick)) {
michael@0:       evt.preventDefault();
michael@0:     }
michael@0:   },
michael@0: 
michael@0:   onTouchEnd: function cp_onTouchEnd(evt) {
michael@0:     let touch = null;
michael@0:     if (!this.dragging ||
michael@0:         (this.watchedEventsType == 'touch' &&
michael@0:          !(touch = this.findPrimaryPointer(evt.changedTouches)))) {
michael@0:       return;
michael@0:     }
michael@0: 
michael@0:     // !isPan() and evt.detail should always give the same answer here
michael@0:     // since they use the same heuristics, but use the native gecko
michael@0:     // computation when possible.
michael@0:     //
michael@0:     // NB: when we're using touch events, then !KineticPanning.isPan()
michael@0:     // => this.panning, so we'll never attempt to block the click
michael@0:     // event.  That's OK however, because we won't fire a synthetic
michael@0:     // click when we're using touch events and this touch series
michael@0:     // wasn't a "tap" gesture.
michael@0:     let click = (this.watchedEventsType == 'mouse') ?
michael@0:       evt.detail : !KineticPanning.isPan();
michael@0:     // Additionally, if we're seeing non-compliant hybrid events, a
michael@0:     // "real" click will be generated if we started and ended on the
michael@0:     // same element.
michael@0:     if (this.hybridEvents) {
michael@0:       let target =
michael@0:         content.document.elementFromPoint(touch.clientX, touch.clientY);
michael@0:       click |= (target === this.pointerDownTarget);
michael@0:     }
michael@0: 
michael@0:     if (this.target && click && (this.panning || this.preventNextClick)) {
michael@0:       if (this.hybridEvents) {
michael@0:         let target = this.target;
michael@0:         let view = target.ownerDocument ? target.ownerDocument.defaultView
michael@0:                                         : target;
michael@0:         view.addEventListener('click', this, true, true);
michael@0:       } else {
michael@0:         // We prevent end events to avoid sending a focus event. See bug 889717.
michael@0:         evt.preventDefault();
michael@0:       }
michael@0:     } else if (this.target && click && !this.panning) {
michael@0:       this.notify(this._activationTimer);
michael@0:     }
michael@0: 
michael@0:     this._finishPanning();
michael@0: 
michael@0:     // Now that we're done, avoid entraining the thing we just panned.
michael@0:     this.pointerDownTarget = null;
michael@0:   },
michael@0: 
michael@0:   onTouchMove: function cp_onTouchMove(evt) {
michael@0:     if (!this.dragging)
michael@0:       return;
michael@0: 
michael@0:     let screenX, screenY;
michael@0:     if (this.watchedEventsType == 'touch') {
michael@0:       let primaryTouch = this.findPrimaryPointer(evt.changedTouches);
michael@0:       if (evt.touches.length > 1 || !primaryTouch)
michael@0:         return;
michael@0:       screenX = primaryTouch.screenX;
michael@0:       screenY = primaryTouch.screenY;
michael@0:     } else {
michael@0:       screenX = evt.screenX;
michael@0:       screenY = evt.screenY;
michael@0:     }
michael@0: 
michael@0:     let current = this.position;
michael@0:     let delta = new Point(screenX - current.x, screenY - current.y);
michael@0:     current.set(screenX, screenY);
michael@0: 
michael@0:     KineticPanning.record(delta, evt.timeStamp);
michael@0: 
michael@0:     let isPan = KineticPanning.isPan();
michael@0: 
michael@0:     // If we've detected a pan gesture, cancel the active state of the
michael@0:     // current target.
michael@0:     if (!this.panning && isPan) {
michael@0:       this._resetActive();
michael@0:     }
michael@0: 
michael@0:     // There's no possibility of us panning anything.
michael@0:     if (!this.scrollCallback) {
michael@0:       return;
michael@0:     }
michael@0: 
michael@0:     // Scroll manually.
michael@0:     this.scrollCallback(delta.scale(-1));
michael@0: 
michael@0:     if (!this.panning && isPan) {
michael@0:       this.panning = true;
michael@0:       this._activationTimer.cancel();
michael@0:     }
michael@0: 
michael@0:     if (this.panning) {
michael@0:       // Only do this when we're actually executing a pan gesture.
michael@0:       // Otherwise synthetic mouse events will be canceled.
michael@0:       evt.stopPropagation();
michael@0:       evt.preventDefault();
michael@0:     }
michael@0:   },
michael@0: 
michael@0:   // nsITimerCallback
michael@0:   notify: function cp_notify(timer) {
michael@0:     this._setActive(this.pointerDownTarget);
michael@0:   },
michael@0: 
michael@0:   onKineticBegin: function cp_onKineticBegin(evt) {
michael@0:   },
michael@0: 
michael@0:   onKineticPan: function cp_onKineticPan(delta) {
michael@0:     return !this.scrollCallback(delta);
michael@0:   },
michael@0: 
michael@0:   onKineticEnd: function cp_onKineticEnd() {
michael@0:     if (!this.dragging)
michael@0:       this.scrollCallback = null;
michael@0:   },
michael@0: 
michael@0:   getPannable: function cp_getPannable(node) {
michael@0:     let pannableNode = this._findPannable(node);
michael@0:     if (pannableNode) {
michael@0:       return [pannableNode, this._generateCallback(pannableNode)];
michael@0:     }
michael@0: 
michael@0:     return [null, null];
michael@0:   },
michael@0: 
michael@0:   _findPannable: function cp_findPannable(node) {
michael@0:     if (!(node instanceof Ci.nsIDOMHTMLElement) || node.tagName == 'HTML') {
michael@0:       return null;
michael@0:     }
michael@0: 
michael@0:     let nodeContent = node.ownerDocument.defaultView;
michael@0:     while (!(node instanceof Ci.nsIDOMHTMLBodyElement)) {
michael@0:       let style = nodeContent.getComputedStyle(node, null);
michael@0: 
michael@0:       let overflow = [style.getPropertyValue('overflow'),
michael@0:                       style.getPropertyValue('overflow-x'),
michael@0:                       style.getPropertyValue('overflow-y')];
michael@0: 
michael@0:       let rect = node.getBoundingClientRect();
michael@0:       let isAuto = (overflow.indexOf('auto') != -1 &&
michael@0:                    (rect.height < node.scrollHeight ||
michael@0:                     rect.width < node.scrollWidth));
michael@0: 
michael@0:       let isScroll = (overflow.indexOf('scroll') != -1);
michael@0: 
michael@0:       let isScrollableTextarea = (node.tagName == 'TEXTAREA' &&
michael@0:           (node.scrollHeight > node.clientHeight ||
michael@0:            node.scrollWidth > node.clientWidth ||
michael@0:            ('scrollLeftMax' in node && node.scrollLeftMax > 0) ||
michael@0:            ('scrollTopMax' in node && node.scrollTopMax > 0)));
michael@0:       if (isScroll || isAuto || isScrollableTextarea) {
michael@0:         return node;
michael@0:       }
michael@0: 
michael@0:       node = node.parentNode;
michael@0:     }
michael@0: 
michael@0:     if (nodeContent.scrollMaxX || nodeContent.scrollMaxY) {
michael@0:       return nodeContent;
michael@0:     }
michael@0: 
michael@0:     if (nodeContent.frameElement) {
michael@0:       return this._findPannable(nodeContent.frameElement);
michael@0:     }
michael@0: 
michael@0:     return null;
michael@0:   },
michael@0: 
michael@0:   _generateCallback: function cp_generateCallback(root) {
michael@0:     let firstScroll = true;
michael@0:     let target;
michael@0:     let current;
michael@0:     let win, doc, htmlNode, bodyNode;
michael@0: 
michael@0:     function doScroll(node, delta) {
michael@0:       if (node instanceof Ci.nsIDOMHTMLElement) {
michael@0:         return node.scrollByNoFlush(delta.x, delta.y);
michael@0:       } else if (node instanceof Ci.nsIDOMWindow) {
michael@0:         win = node;
michael@0:         doc = win.document;
michael@0: 
michael@0:         // "overflow:hidden" on either the <html> or the <body> node should
michael@0:         // prevent the user from scrolling the root viewport.
michael@0:         if (doc instanceof Ci.nsIDOMHTMLDocument) {
michael@0:           htmlNode = doc.documentElement;
michael@0:           bodyNode = doc.body;
michael@0:           if (win.getComputedStyle(htmlNode, null).overflowX == "hidden" ||
michael@0:               win.getComputedStyle(bodyNode, null).overflowX == "hidden") {
michael@0:             delta.x = 0;
michael@0:           }
michael@0:           if (win.getComputedStyle(htmlNode, null).overflowY == "hidden" ||
michael@0:               win.getComputedStyle(bodyNode, null).overflowY == "hidden") {
michael@0:             delta.y = 0;
michael@0:           }
michael@0:         }
michael@0:         let oldX = node.scrollX;
michael@0:         let oldY = node.scrollY;
michael@0:         node.scrollBy(delta.x, delta.y);
michael@0:         return (node.scrollX != oldX || node.scrollY != oldY);
michael@0:       }
michael@0:       // If we get here, |node| isn't an HTML element and it's not a window,
michael@0:       // but findPannable apparently thought it was scrollable... What is it?
michael@0:       return false;
michael@0:     }
michael@0: 
michael@0:     function targetParent(node) {
michael@0:       return node.parentNode || node.frameElement || null;
michael@0:     }
michael@0: 
michael@0:     function scroll(delta) {
michael@0:       current = root;
michael@0:       firstScroll = true;
michael@0:       while (current) {
michael@0:         if (doScroll(current, delta)) {
michael@0:           firstScroll = false;
michael@0:           return true;
michael@0:         }
michael@0: 
michael@0:         // TODO The current code looks for possible scrolling regions only if
michael@0:         // this is the first scroll action but this should be more dynamic.
michael@0:         if (!firstScroll) {
michael@0:           return false;
michael@0:         }
michael@0: 
michael@0:         current = ContentPanning._findPannable(targetParent(current));
michael@0:       }
michael@0: 
michael@0:       // There is nothing scrollable here.
michael@0:       return false;
michael@0:     }
michael@0:     return scroll;
michael@0:   },
michael@0: 
michael@0:   get _domUtils() {
michael@0:     delete this._domUtils;
michael@0:     return this._domUtils = Cc['@mozilla.org/inspector/dom-utils;1']
michael@0:                               .getService(Ci.inIDOMUtils);
michael@0:   },
michael@0: 
michael@0:   get _activationTimer() {
michael@0:     delete this._activationTimer;
michael@0:     return this._activationTimer = Cc["@mozilla.org/timer;1"]
michael@0:                                      .createInstance(Ci.nsITimer);
michael@0:   },
michael@0: 
michael@0:   get _activationDelayMs() {
michael@0:     let delay = Services.prefs.getIntPref('ui.touch_activation.delay_ms');
michael@0:     delete this._activationDelayMs;
michael@0:     return this._activationDelayMs = delay;
michael@0:   },
michael@0: 
michael@0:   _resetActive: function cp_resetActive() {
michael@0:     let elt = this.pointerDownTarget || this.target;
michael@0:     let root = elt.ownerDocument || elt.document;
michael@0:     this._setActive(root.documentElement);
michael@0:   },
michael@0: 
michael@0:   _resetHover: function cp_resetHover() {
michael@0:     const kStateHover = 0x00000004;
michael@0:     try {
michael@0:       let element = content.document.createElement('foo');
michael@0:       this._domUtils.setContentState(element, kStateHover);
michael@0:     } catch(e) {}
michael@0:   },
michael@0: 
michael@0:   _setActive: function cp_setActive(elt) {
michael@0:     const kStateActive = 0x00000001;
michael@0:     this._domUtils.setContentState(elt, kStateActive);
michael@0:   },
michael@0: 
michael@0:   _recvViewportChange: function(data) {
michael@0:     let metrics = data.json;
michael@0:     this._viewport = new Rect(metrics.x, metrics.y,
michael@0:                               metrics.viewport.width,
michael@0:                               metrics.viewport.height);
michael@0:     this._cssCompositedRect = new Rect(metrics.x, metrics.y,
michael@0:                                        metrics.cssCompositedRect.width,
michael@0:                                        metrics.cssCompositedRect.height);
michael@0:     this._cssPageRect = new Rect(metrics.cssPageRect.x,
michael@0:                                  metrics.cssPageRect.y,
michael@0:                                  metrics.cssPageRect.width,
michael@0:                                  metrics.cssPageRect.height);
michael@0:   },
michael@0: 
michael@0:   _recvDoubleTap: function(data) {
michael@0:     let data = data.json;
michael@0: 
michael@0:     // We haven't received a metrics update yet; don't do anything.
michael@0:     if (this._viewport == null) {
michael@0:       return;
michael@0:     }
michael@0: 
michael@0:     let win = content;
michael@0: 
michael@0:     let element = ElementTouchHelper.anyElementFromPoint(win, data.x, data.y);
michael@0:     if (!element) {
michael@0:       this._zoomOut();
michael@0:       return;
michael@0:     }
michael@0: 
michael@0:     while (element && !this._shouldZoomToElement(element))
michael@0:       element = element.parentNode;
michael@0: 
michael@0:     if (!element) {
michael@0:       this._zoomOut();
michael@0:     } else {
michael@0:       const margin = 15;
michael@0:       let rect = ElementTouchHelper.getBoundingContentRect(element);
michael@0: 
michael@0:       let cssPageRect = this._cssPageRect;
michael@0:       let viewport = this._viewport;
michael@0:       let bRect = new Rect(Math.max(cssPageRect.x, rect.x - margin),
michael@0:                            rect.y,
michael@0:                            rect.w + 2 * margin,
michael@0:                            rect.h);
michael@0:       // constrict the rect to the screen's right edge
michael@0:       bRect.width = Math.min(bRect.width, cssPageRect.right - bRect.x);
michael@0: 
michael@0:       // if the rect is already taking up most of the visible area and is stretching the
michael@0:       // width of the page, then we want to zoom out instead.
michael@0:       if (this._isRectZoomedIn(bRect, this._cssCompositedRect)) {
michael@0:         this._zoomOut();
michael@0:         return;
michael@0:       }
michael@0: 
michael@0:       rect.x = Math.round(bRect.x);
michael@0:       rect.y = Math.round(bRect.y);
michael@0:       rect.w = Math.round(bRect.width);
michael@0:       rect.h = Math.round(bRect.height);
michael@0: 
michael@0:       // if the block we're zooming to is really tall, and the user double-tapped
michael@0:       // more than a screenful of height from the top of it, then adjust the y-coordinate
michael@0:       // so that we center the actual point the user double-tapped upon. this prevents
michael@0:       // flying to the top of a page when double-tapping to zoom in (bug 761721).
michael@0:       // the 1.2 multiplier is just a little fuzz to compensate for bRect including horizontal
michael@0:       // margins but not vertical ones.
michael@0:       let cssTapY = viewport.y + data.y;
michael@0:       if ((bRect.height > rect.h) && (cssTapY > rect.y + (rect.h * 1.2))) {
michael@0:         rect.y = cssTapY - (rect.h / 2);
michael@0:       }
michael@0: 
michael@0:       Services.obs.notifyObservers(docShell, 'browser-zoom-to-rect', JSON.stringify(rect));
michael@0:     }
michael@0:   },
michael@0: 
michael@0:   _handleVisibilityChange: function(evt) {
michael@0:     if (!evt.target.hidden)
michael@0:       return;
michael@0: 
michael@0:     this._resetHover();
michael@0:   },
michael@0: 
michael@0:   _shouldZoomToElement: function(aElement) {
michael@0:     let win = aElement.ownerDocument.defaultView;
michael@0:     if (win.getComputedStyle(aElement, null).display == "inline")
michael@0:       return false;
michael@0:     if (aElement instanceof Ci.nsIDOMHTMLLIElement)
michael@0:       return false;
michael@0:     if (aElement instanceof Ci.nsIDOMHTMLQuoteElement)
michael@0:       return false;
michael@0:     return true;
michael@0:   },
michael@0: 
michael@0:   _zoomOut: function() {
michael@0:     let rect = new Rect(0, 0, 0, 0);
michael@0:     Services.obs.notifyObservers(docShell, 'browser-zoom-to-rect', JSON.stringify(rect));
michael@0:   },
michael@0: 
michael@0:   _isRectZoomedIn: function(aRect, aViewport) {
michael@0:     // This function checks to see if the area of the rect visible in the
michael@0:     // viewport (i.e. the "overlapArea" variable below) is approximately 
michael@0:     // the max area of the rect we can show.
michael@0:     let vRect = new Rect(aViewport.x, aViewport.y, aViewport.width, aViewport.height);
michael@0:     let overlap = vRect.intersect(aRect);
michael@0:     let overlapArea = overlap.width * overlap.height;
michael@0:     let availHeight = Math.min(aRect.width * vRect.height / vRect.width, aRect.height);
michael@0:     let showing = overlapArea / (aRect.width * availHeight);
michael@0:     let ratioW = (aRect.width / vRect.width);
michael@0:     let ratioH = (aRect.height / vRect.height);
michael@0: 
michael@0:     return (showing > 0.9 && (ratioW > 0.9 || ratioH > 0.9)); 
michael@0:   },
michael@0: 
michael@0:   _finishPanning: function() {
michael@0:     this.dragging = false;
michael@0:     delete this.primaryPointerId;
michael@0:     this._activationTimer.cancel();
michael@0: 
michael@0:     // If there is a scroll action, let's do a manual kinetic panning action.
michael@0:     if (this.panning) {
michael@0:       KineticPanning.start(this);
michael@0:     }
michael@0:   },
michael@0: 
michael@0:   _unloadHandler: function() {
michael@0:     kObservedEvents.forEach((topic) => {
michael@0:       Services.obs.removeObserver(this, topic);
michael@0:     });
michael@0:   }
michael@0: };
michael@0: 
michael@0: // Min/max velocity of kinetic panning. This is in pixels/millisecond.
michael@0: const kMinVelocity = 0.2;
michael@0: const kMaxVelocity = 6;
michael@0: 
michael@0: // Constants that affect the "friction" of the scroll pane.
michael@0: const kExponentialC = 1000;
michael@0: const kPolynomialC = 100 / 1000000;
michael@0: 
michael@0: // How often do we change the position of the scroll pane?
michael@0: // Too often and panning may jerk near the end.
michael@0: // Too little and panning will be choppy. In milliseconds.
michael@0: const kUpdateInterval = 16;
michael@0: 
michael@0: // The numbers of momentums to use for calculating the velocity of the pan.
michael@0: // Those are taken from the end of the action
michael@0: const kSamples = 5;
michael@0: 
michael@0: const KineticPanning = {
michael@0:   _position: new Point(0, 0),
michael@0:   _velocity: new Point(0, 0),
michael@0:   _acceleration: new Point(0, 0),
michael@0: 
michael@0:   get active() {
michael@0:     return this.target !== null;
michael@0:   },
michael@0: 
michael@0:   target: null,
michael@0:   start: function kp_start(target) {
michael@0:     this.target = target;
michael@0: 
michael@0:     // Calculate the initial velocity of the movement based on user input
michael@0:     let momentums = this.momentums;
michael@0:     let flick = momentums[momentums.length - 1].time - momentums[0].time < 300;
michael@0: 
michael@0:     let distance = new Point(0, 0);
michael@0:     momentums.forEach(function(momentum) {
michael@0:       distance.add(momentum.dx, momentum.dy);
michael@0:     });
michael@0: 
michael@0:     function clampFromZero(x, min, max) {
michael@0:       if (x >= 0)
michael@0:         return Math.max(min, Math.min(max, x));
michael@0:       return Math.min(-min, Math.max(-max, x));
michael@0:     }
michael@0: 
michael@0:     let elapsed = momentums[momentums.length - 1].time - momentums[0].time;
michael@0:     let velocityX = clampFromZero(distance.x / elapsed, 0, kMaxVelocity);
michael@0:     let velocityY = clampFromZero(distance.y / elapsed, 0, kMaxVelocity);
michael@0: 
michael@0:     let velocity = this._velocity;
michael@0:     if (flick) {
michael@0:       // Very fast pan action that does not generate a click are very often pan
michael@0:       // action. If this is a small gesture then it will not move the view a lot
michael@0:       // and so it will be above the minimun threshold and not generate any
michael@0:       // kinetic panning. This does not look on a device since this is often
michael@0:       // a real gesture, so let's lower the velocity threshold for such moves.
michael@0:       velocity.set(velocityX, velocityY);
michael@0:     } else {
michael@0:       velocity.set(Math.abs(velocityX) < kMinVelocity ? 0 : velocityX,
michael@0:                    Math.abs(velocityY) < kMinVelocity ? 0 : velocityY);
michael@0:     }
michael@0:     this.momentums = [];
michael@0: 
michael@0:     // Set acceleration vector to opposite signs of velocity
michael@0:     function sign(x) {
michael@0:       return x ? (x > 0 ? 1 : -1) : 0;
michael@0:     }
michael@0: 
michael@0:     this._acceleration.set(velocity.clone().map(sign).scale(-kPolynomialC));
michael@0: 
michael@0:     // Reset the position
michael@0:     this._position.set(0, 0);
michael@0: 
michael@0:     this._startAnimation();
michael@0: 
michael@0:     this.target.onKineticBegin();
michael@0:   },
michael@0: 
michael@0:   stop: function kp_stop() {
michael@0:     this.reset();
michael@0: 
michael@0:     if (!this.target)
michael@0:       return;
michael@0: 
michael@0:     this.target.onKineticEnd();
michael@0:     this.target = null;
michael@0:   },
michael@0: 
michael@0:   reset: function kp_reset() {
michael@0:     this.momentums = [];
michael@0:     this.distance.set(0, 0);
michael@0:   },
michael@0: 
michael@0:   momentums: [],
michael@0:   record: function kp_record(delta, timestamp) {
michael@0:     this.momentums.push({ 'time': this._getTime(timestamp),
michael@0:                           'dx' : delta.x, 'dy' : delta.y });
michael@0: 
michael@0:     // We only need to keep kSamples in this.momentums.
michael@0:     if (this.momentums.length > kSamples) {
michael@0:       this.momentums.shift();
michael@0:     }
michael@0: 
michael@0:     this.distance.add(delta.x, delta.y);
michael@0:   },
michael@0: 
michael@0:   _getTime: function kp_getTime(time) {
michael@0:     // Touch events generated by the platform or hand-made are defined in
michael@0:     // microseconds instead of milliseconds. Bug 77992 will fix this at the
michael@0:     // platform level.
michael@0:     if (time > Date.now()) {
michael@0:       return Math.floor(time / 1000);
michael@0:     } else {
michael@0:       return time;
michael@0:     }
michael@0:   },
michael@0: 
michael@0:   get threshold() {
michael@0:     let dpi = content.QueryInterface(Ci.nsIInterfaceRequestor)
michael@0:                      .getInterface(Ci.nsIDOMWindowUtils)
michael@0:                      .displayDPI;
michael@0: 
michael@0:     let threshold = Services.prefs.getIntPref('ui.dragThresholdX') / 240 * dpi;
michael@0: 
michael@0:     delete this.threshold;
michael@0:     return this.threshold = threshold;
michael@0:   },
michael@0: 
michael@0:   distance: new Point(0, 0),
michael@0:   isPan: function cp_isPan() {
michael@0:     return (Math.abs(this.distance.x) > this.threshold ||
michael@0:             Math.abs(this.distance.y) > this.threshold);
michael@0:   },
michael@0: 
michael@0:   _startAnimation: function kp_startAnimation() {
michael@0:     let c = kExponentialC;
michael@0:     function getNextPosition(position, v, a, t) {
michael@0:       // Important traits for this function:
michael@0:       //   p(t=0) is 0
michael@0:       //   p'(t=0) is v0
michael@0:       //
michael@0:       // We use exponential to get a smoother stop, but by itself exponential
michael@0:       // is too smooth at the end. Adding a polynomial with the appropriate
michael@0:       // weight helps to balance
michael@0:       position.set(v.x * Math.exp(-t / c) * -c + a.x * t * t + v.x * c,
michael@0:                    v.y * Math.exp(-t / c) * -c + a.y * t * t + v.y * c);
michael@0:     }
michael@0: 
michael@0:     let startTime = content.mozAnimationStartTime;
michael@0:     let elapsedTime = 0, targetedTime = 0, averageTime = 0;
michael@0: 
michael@0:     let velocity = this._velocity;
michael@0:     let acceleration = this._acceleration;
michael@0: 
michael@0:     let position = this._position;
michael@0:     let nextPosition = new Point(0, 0);
michael@0:     let delta = new Point(0, 0);
michael@0: 
michael@0:     let callback = (function(timestamp) {
michael@0:       if (!this.target)
michael@0:         return;
michael@0: 
michael@0:       // To make animation end fast enough but to keep smoothness, average the
michael@0:       // ideal time frame (smooth animation) with the actual time lapse
michael@0:       // (end fast enough).
michael@0:       // Animation will never take longer than 2 times the ideal length of time.
michael@0:       elapsedTime = timestamp - startTime;
michael@0:       targetedTime += kUpdateInterval;
michael@0:       averageTime = (targetedTime + elapsedTime) / 2;
michael@0: 
michael@0:       // Calculate new position.
michael@0:       getNextPosition(nextPosition, velocity, acceleration, averageTime);
michael@0:       delta.set(Math.round(nextPosition.x - position.x),
michael@0:                 Math.round(nextPosition.y - position.y));
michael@0: 
michael@0:       // Test to see if movement is finished for each component.
michael@0:       if (delta.x * acceleration.x > 0)
michael@0:         delta.x = position.x = velocity.x = acceleration.x = 0;
michael@0: 
michael@0:       if (delta.y * acceleration.y > 0)
michael@0:         delta.y = position.y = velocity.y = acceleration.y = 0;
michael@0: 
michael@0:       if (velocity.equals(0, 0) || delta.equals(0, 0)) {
michael@0:         this.stop();
michael@0:         return;
michael@0:       }
michael@0: 
michael@0:       position.add(delta);
michael@0:       if (this.target.onKineticPan(delta.scale(-1))) {
michael@0:         this.stop();
michael@0:         return;
michael@0:       }
michael@0: 
michael@0:       content.mozRequestAnimationFrame(callback);
michael@0:     }).bind(this);
michael@0: 
michael@0:     content.mozRequestAnimationFrame(callback);
michael@0:   }
michael@0: };
michael@0: 
michael@0: const ElementTouchHelper = {
michael@0:   anyElementFromPoint: function(aWindow, aX, aY) {
michael@0:     let cwu = aWindow.QueryInterface(Ci.nsIInterfaceRequestor).getInterface(Ci.nsIDOMWindowUtils);
michael@0:     let elem = cwu.elementFromPoint(aX, aY, true, true);
michael@0: 
michael@0:     let HTMLIFrameElement = Ci.nsIDOMHTMLIFrameElement;
michael@0:     let HTMLFrameElement = Ci.nsIDOMHTMLFrameElement;
michael@0:     while (elem && (elem instanceof HTMLIFrameElement || elem instanceof HTMLFrameElement)) {
michael@0:       let rect = elem.getBoundingClientRect();
michael@0:       aX -= rect.left;
michael@0:       aY -= rect.top;
michael@0:       cwu = elem.contentDocument.defaultView.QueryInterface(Ci.nsIInterfaceRequestor).getInterface(Ci.nsIDOMWindowUtils);
michael@0:       elem = cwu.elementFromPoint(aX, aY, true, true);
michael@0:     }
michael@0: 
michael@0:     return elem;
michael@0:   },
michael@0: 
michael@0:   getBoundingContentRect: function(aElement) {
michael@0:     if (!aElement)
michael@0:       return {x: 0, y: 0, w: 0, h: 0};
michael@0: 
michael@0:     let document = aElement.ownerDocument;
michael@0:     while (document.defaultView.frameElement)
michael@0:       document = document.defaultView.frameElement.ownerDocument;
michael@0: 
michael@0:     let cwu = document.defaultView.QueryInterface(Ci.nsIInterfaceRequestor).getInterface(Ci.nsIDOMWindowUtils);
michael@0:     let scrollX = {}, scrollY = {};
michael@0:     cwu.getScrollXY(false, scrollX, scrollY);
michael@0: 
michael@0:     let r = aElement.getBoundingClientRect();
michael@0: 
michael@0:     // step out of iframes and frames, offsetting scroll values
michael@0:     for (let frame = aElement.ownerDocument.defaultView; frame.frameElement && frame != content; frame = frame.parent) {
michael@0:       // adjust client coordinates' origin to be top left of iframe viewport
michael@0:       let rect = frame.frameElement.getBoundingClientRect();
michael@0:       let left = frame.getComputedStyle(frame.frameElement, "").borderLeftWidth;
michael@0:       let top = frame.getComputedStyle(frame.frameElement, "").borderTopWidth;
michael@0:       scrollX.value += rect.left + parseInt(left);
michael@0:       scrollY.value += rect.top + parseInt(top);
michael@0:     }
michael@0: 
michael@0:     return {x: r.left + scrollX.value,
michael@0:             y: r.top + scrollY.value,
michael@0:             w: r.width,
michael@0:             h: r.height };
michael@0:   }
michael@0: };