Bug 1292242 - move scrollIntoViewIfNeeded to its own module; r?bgrins draft
authorTom Tromey <tom@tromey.com>
Wed, 17 Aug 2016 11:13:54 -0600
changeset 401941 163503e6787a9e07f5dafed31326f75435fd1a35
parent 401182 52fa735c7cec7333737999f62a43856e7306f6ba
child 528611 3e8c708315fa720f11276ff0c96475404c01f8d2
push id26590
push userbmo:ttromey@mozilla.com
push dateWed, 17 Aug 2016 20:00:48 +0000
reviewersbgrins
bugs1292242
milestone51.0a1
Bug 1292242 - move scrollIntoViewIfNeeded to its own module; r?bgrins MozReview-Commit-ID: 8diNiffQmDB
devtools/client/inspector/markup/markup.js
devtools/client/shared/moz.build
devtools/client/shared/scroll.js
devtools/client/shared/test/browser_layoutHelpers.js
devtools/shared/layout/utils.js
--- a/devtools/client/inspector/markup/markup.js
+++ b/devtools/client/inspector/markup/markup.js
@@ -45,17 +45,17 @@ const {HTMLTooltip} = require("devtools/
 const {setImageTooltip, setBrokenImageTooltip} =
       require("devtools/client/shared/widgets/tooltip/ImageTooltipHelper");
 const {setEventTooltip} = require("devtools/client/shared/widgets/tooltip/EventTooltipHelper");
 const EventEmitter = require("devtools/shared/event-emitter");
 const Heritage = require("sdk/core/heritage");
 const {parseAttribute} =
       require("devtools/client/shared/node-attribute-parser");
 const {Task} = require("devtools/shared/task");
-const {scrollIntoViewIfNeeded} = require("devtools/shared/layout/utils");
+const {scrollIntoViewIfNeeded} = require("devtools/client/shared/scroll");
 const {PrefObserver} = require("devtools/client/styleeditor/utils");
 const {KeyShortcuts} = require("devtools/client/shared/key-shortcuts");
 const {template} = require("devtools/shared/gcli/templater");
 const nodeConstants = require("devtools/shared/dom-node-constants");
 const nodeFilterConstants = require("devtools/shared/dom-node-filter-constants");
 /* eslint-disable mozilla/reject-some-requires */
 const {XPCOMUtils} = require("resource://gre/modules/XPCOMUtils.jsm");
 /* eslint-enable mozilla/reject-some-requires */
--- a/devtools/client/shared/moz.build
+++ b/devtools/client/shared/moz.build
@@ -36,16 +36,17 @@ DevToolsModules(
     'Jsbeautify.jsm',
     'key-shortcuts.js',
     'l10n.js',
     'node-attribute-parser.js',
     'options-view.js',
     'output-parser.js',
     'poller.js',
     'prefs.js',
+    'scroll.js',
     'source-utils.js',
     'SplitView.jsm',
     'suggestion-picker.js',
     'telemetry.js',
     'theme-switching.js',
     'theme.js',
     'undo.js',
     'view-source.js',
new file mode 100644
--- /dev/null
+++ b/devtools/client/shared/scroll.js
@@ -0,0 +1,52 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+/**
+ * Scroll the document so that the element "elem" appears in the viewport.
+ *
+ * @param {DOMNode} elem
+ *        The element that needs to appear in the viewport.
+ * @param {Boolean} centered
+ *        true if you want it centered, false if you want it to appear on the
+ *        top of the viewport. It is true by default, and that is usually what
+ *        you want.
+ */
+function scrollIntoViewIfNeeded(elem, centered = true) {
+  let win = elem.ownerDocument.defaultView;
+  let clientRect = elem.getBoundingClientRect();
+
+  // The following are always from the {top, bottom}
+  // of the viewport, to the {top, …} of the box.
+  // Think of them as geometrical vectors, it helps.
+  // The origin is at the top left.
+
+  let topToBottom = clientRect.bottom;
+  let bottomToTop = clientRect.top - win.innerHeight;
+  // We allow one translation on the y axis.
+  let yAllowed = true;
+
+  // Whatever `centered` is, the behavior is the same if the box is
+  // (even partially) visible.
+  if ((topToBottom > 0 || !centered) && topToBottom <= elem.offsetHeight) {
+    win.scrollBy(0, topToBottom - elem.offsetHeight);
+    yAllowed = false;
+  } else if ((bottomToTop < 0 || !centered) &&
+             bottomToTop >= -elem.offsetHeight) {
+    win.scrollBy(0, bottomToTop + elem.offsetHeight);
+    yAllowed = false;
+  }
+
+  // If we want it centered, and the box is completely hidden,
+  // then we center it explicitly.
+  if (centered) {
+    if (yAllowed && (topToBottom <= 0 || bottomToTop >= 0)) {
+      win.scroll(win.scrollX,
+                 win.scrollY + clientRect.top
+                 - (win.innerHeight - elem.offsetHeight) / 2);
+    }
+  }
+}
+exports.scrollIntoViewIfNeeded = scrollIntoViewIfNeeded;
--- a/devtools/client/shared/test/browser_layoutHelpers.js
+++ b/devtools/client/shared/test/browser_layoutHelpers.js
@@ -1,13 +1,13 @@
 /* Any copyright is dedicated to the Public Domain.
  * http://creativecommons.org/publicdomain/zero/1.0/ */
 
 // Tests that scrollIntoViewIfNeeded works properly.
-var {scrollIntoViewIfNeeded} = require("devtools/shared/layout/utils");
+var {scrollIntoViewIfNeeded} = require("devtools/client/shared/scroll");
 
 const TEST_URI = TEST_URI_ROOT + "browser_layoutHelpers.html";
 
 add_task(function* () {
   let [host, win, doc] = yield createHost("bottom", TEST_URI);
   runTest(win);
   host.destroy();
 });
--- a/devtools/shared/layout/utils.js
+++ b/devtools/shared/layout/utils.js
@@ -458,63 +458,16 @@ function getElementFromPoint(document, x
       }
     }
   }
   return node;
 }
 exports.getElementFromPoint = getElementFromPoint;
 
 /**
- * Scroll the document so that the element "elem" appears in the viewport.
- *
- * @param {DOMNode} elem
- *        The element that needs to appear in the viewport.
- * @param {Boolean} centered
- *        true if you want it centered, false if you want it to appear on the
- *        top of the viewport. It is true by default, and that is usually what
- *        you want.
- */
-function scrollIntoViewIfNeeded(elem, centered = true) {
-  let win = elem.ownerDocument.defaultView;
-  let clientRect = elem.getBoundingClientRect();
-
-  // The following are always from the {top, bottom}
-  // of the viewport, to the {top, …} of the box.
-  // Think of them as geometrical vectors, it helps.
-  // The origin is at the top left.
-
-  let topToBottom = clientRect.bottom;
-  let bottomToTop = clientRect.top - win.innerHeight;
-  // We allow one translation on the y axis.
-  let yAllowed = true;
-
-  // Whatever `centered` is, the behavior is the same if the box is
-  // (even partially) visible.
-  if ((topToBottom > 0 || !centered) && topToBottom <= elem.offsetHeight) {
-    win.scrollBy(0, topToBottom - elem.offsetHeight);
-    yAllowed = false;
-  } else if ((bottomToTop < 0 || !centered) &&
-             bottomToTop >= -elem.offsetHeight) {
-    win.scrollBy(0, bottomToTop + elem.offsetHeight);
-    yAllowed = false;
-  }
-
-  // If we want it centered, and the box is completely hidden,
-  // then we center it explicitly.
-  if (centered) {
-    if (yAllowed && (topToBottom <= 0 || bottomToTop >= 0)) {
-      win.scroll(win.scrollX,
-                 win.scrollY + clientRect.top
-                 - (win.innerHeight - elem.offsetHeight) / 2);
-    }
-  }
-}
-exports.scrollIntoViewIfNeeded = scrollIntoViewIfNeeded;
-
-/**
  * Check if a node and its document are still alive
  * and attached to the window.
  *
  * @param {DOMNode} node
  * @return {Boolean}
  */
 function isNodeConnected(node) {
   if (!node.ownerDocument || !node.ownerDocument.defaultView) {