react-scroll - npm Package Compare versions

Comparing version 1.0.6 to 1.0.7

lib/__tests__/events-test.js

@@ -10,2 +10,3 @@ /* React */
 import events   from '../mixins/scroll-events.js';
+import animateScroll from '../mixins/animate-scroll.js';
 /* Test */
@@ -17,7 +18,4 @@ import expect   from 'expect'
 describe('Events', () => {
-  
-  console.log("test");
 
   let node = document.createElement('div');
-  
   document.body.innerHtml = "";
@@ -48,5 +46,11 @@
   beforeEach(function () {
-    unmountComponentAtNode(node)
+    unmountComponentAtNode(node);
   });
-    
+
+  afterEach(() => {
+    // clean up the events after each test
+    events.scrollEvent.remove('begin');
+    events.scrollEvent.remove('end');
+  });
+
   it('direct link calls begin and end event', (done) => {
@@ -76,6 +80,6 @@
 
-  })
+  });
 
   it('it calls begin and end event', (done) => {
-    
+
     render(component, node, () => {
@@ -100,7 +104,25 @@
 
+
+        // wait to actually scroll so it doesn't affect the next test!
+        setTimeout(() => {
+          done();
+        }, scrollDuration * 3);
+    });
+
+  });
+
+  it('calls "end" event on scrollTo', (done) => {
+    render(component, node, () => {
+
+      var end = (to, target, endPosition) => {
+        expect(endPosition).toEqual(100);
         done();
+      };
+
+      events.scrollEvent.register('end', end);
+
+      animateScroll.scrollTo(100, scrollDuration);
     });
+  });
 
-  })
-
 });

lib/__tests__/page-test.js

@@ -48,2 +48,3 @@ /* React */
     unmountComponentAtNode(node)
+    window.scrollTo(0, 0);
   });
@@ -50,0 +51,0 @@

lib/mixins/animate-scroll.js

@@ -57,2 +57,15 @@ var smooth = require('./smooth');
 
+var pageHeight = function() {
+  var body = document.body;
+  var html = document.documentElement;
+
+  return Math.max(
+      body.scrollHeight,
+      body.offsetHeight,
+      html.clientHeight,
+      html.scrollHeight,
+      html.offsetHeight
+  );
+};
+
 var animateTopScroll = function(timestamp) {
@@ -82,3 +95,3 @@ // Cancel on specific events
   if(events.registered['end']) {
-    events.registered['end'](__to, __target);
+    events.registered['end'](__to, __target, __currentPositionY);
   }
@@ -92,4 +105,4 @@
   __startPositionY  = currentPositionY();
-  __targetPositionY = y + __startPositionY;
-  __duration        = options.duration || 1000;
+  __targetPositionY = options.absolute ? y : y + __startPositionY;
+  __duration        = isNaN(parseFloat(options.duration)) ? 1000 : parseFloat(options.duration);
   __to              = to;
@@ -102,8 +115,23 @@ __target          = target;
 var scrollToTop = function (duration) {
-  startAnimateTopScroll(-currentPositionY(), { duration : duration || 1000 });
+  startAnimateTopScroll(0, { duration : duration, absolute : true });
 };
 
+var scrollTo = function (toY, duration) {
+  startAnimateTopScroll(toY, { duration : duration, absolute : true });
+};
+
+var scrollToBottom = function(duration) {
+  startAnimateTopScroll(pageHeight(), { duration : duration , absolute : true});
+};
+
+var scrollMore = function(toY, duration) {
+  startAnimateTopScroll(currentPositionY() + toY, { duration : duration, absolute : true });
+};
+
 module.exports = {
   animateTopScroll: startAnimateTopScroll,
-  scrollToTop: scrollToTop
+  scrollToTop: scrollToTop,
+  scrollToBottom: scrollToBottom,
+  scrollTo: scrollTo,
+  scrollMore: scrollMore,
 };

package.json

 {
   "name": "react-scroll",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "description": "A scroll component for React.js",
@@ -5,0 +5,0 @@ "main": "lib",

README.md

@@ -54,2 +54,8 @@ ## React Scroll
   },
+  scrollTo: function() {
+    scroll.scrollTo(100);
+  },
+  scrollMore: function() {
+    scroll.scrollMore(10);
+  },
   render: function () {
@@ -75,2 +81,8 @@ return (
         <a onClick={this.scrollToTop}>To the top!</a>
+        <br/>
+        <a onClick={this.scrollToTop}>To bottom!</a>
+        <br/>
+        <a onClick={this.scrollTo}>Scroll to 100px from the top</a>
+        <br/>
+        <a onClick={this.scrollMore}>Scroll 10px more from the current position!</a>
       </div>
@@ -88,2 +100,48 @@ );
 
+### Scroll Methods
+
+> Scroll To Top
+
+```js
+
+var Scroll = require('react-scroll');
+var scroll = Scroll.animateScroll;
+
+scroll.scrollToTop();
+
+```
+
+> Scroll To Bottom
+
+```js
+
+var Scroll = require('react-scroll');
+var scroll = Scroll.animateScroll;
+
+scroll.scrollToBottom();
+
+```
+
+> Scroll To (px)
+
+```js
+
+var Scroll = require('react-scroll');
+var scroll = Scroll.animateScroll;
+
+scroll.scrollTo(100);
+
+```
+
+> Scroll More (px)
+
+```js
+
+var Scroll = require('react-scroll');
+var scroll = Scroll.animateScroll;
+
+scroll.scrollMore(10);
+
+```
+
 ### Scroll events
@@ -90,0 +148,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

31599

increased by22.61%

Number of package files

20

increased by5.26%

Lines of code

768

increased by22.68%

Number of lines in readme file

219

increased by36.02%

No dependency changes