Merge pull request #69 from hugobessaa/features/64-scrolltop-position

Option to scroll by total pixels scrolled or proportionally
BrowserSync · Feb 10, 2014 · 60573da · 60573da
2 parents ec16f35 + 9b78253
commit 60573da
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 6 deletions.
diff --git a/lib/client/browser-sync-client.js b/lib/client/browser-sync-client.js
@@ -160,6 +160,7 @@
 
             if (data.assetFileName && data.fileExtension) {
 
+
                 var domData = this.getElems(data.fileExtension);
                 var elems = this.getMatches(domData.elems, data.assetFileName, domData.attr);
 
@@ -550,9 +551,12 @@
         listeners: {
             scroll: function () {
 
-                var url;
+                var pos, url;
 
-                var scrollTop = ghost.getScrollTopPercentage(); // Get % of y axis of scroll
+                var scrollTop = {
+                    raw:          ghost.getScrollTop(), // Get px of y axis of scroll
+                    proportional: ghost.getScrollTopPercentage() // Get % of y axis of scroll
+                };
                 var newScroll = new Date().getTime();
                 var scrollThrottle = 0;
 
@@ -571,6 +575,11 @@
                     if (scope.ghostMode.enabled) {
                         scope.ghostMode.lastScroll = newScroll;
 
+                        if (scope.options.scrollProportionally) {
+                            pos = scrollTop.proportional;
+                        } else {
+                            pos = scrollTop.raw;
+                        }
                         url = window.location.host + window.location.pathname;
 
                         ghost.emitEvent("scroll", {
@@ -692,9 +701,13 @@
 
     socket.on("scroll:update", function (data) {
         if (data.url === window.location.host + window.location.pathname) {
-            var scrollSpace = ghost.getScrollSpace();
             scope.ghostMode.enabled = false;
-            window.scrollTo(0, scrollSpace[1] * data.position); // proportional scroll
+            if (scope.options.scrollProportionally) {
+                var scrollSpace = ghost.getScrollSpace();
+                window.scrollTo(0, scrollSpace[1] * data.position.proportional); // % of y axis of scroll to px
+            } else {
+                window.scrollTo(0, data.position.raw);
+            }
         }
     });
 

diff --git a/lib/client/browser-sync-client.min.js b/lib/client/browser-sync-client.min.js
diff --git a/lib/config.js b/lib/config.js
@@ -89,6 +89,14 @@ module.exports = {
      */
     injectChanges: true,
 
+    /*
+     |--------------------------------------------------------------------------
+     | Scroll Proportionally (true|false)
+     |--------------------------------------------------------------------------
+     | https://github.com/shakyShane/browser-sync/wiki/options#wiki-scrollproportionally
+     */
+    scrollProportionally: true,
+
     /*
      |--------------------------------------------------------------------------
      | Scroll Throttle (milliseconds)

diff --git a/lib/index.js b/lib/index.js
@@ -26,6 +26,7 @@ var defaultConfig = {
     notify: true,
     devMode: false,
     fileTimeout: 1000,
+    scrollProportionally: true,
     scrollThrottle: 0,
     reloadDelay: 0,
     injectChanges: true,
@@ -455,4 +456,4 @@ module.exports.init = function (files, userConfig) {
         }
     }
     return setup.kickoff(files, config);
-};
+};