0.2.3

fuermosi777 · Nov 8, 2016 · 755edd5 · 755edd5
1 parent a2fcd47
commit 755edd5
Show file tree

Hide file tree

Showing 5 changed files with 45 additions and 32 deletions.
diff --git a/demo/src/entry.jsx b/demo/src/entry.jsx
@@ -48,7 +48,7 @@ let Root = React.createClass({
                         <div className="col-md-6">
                             <h4>Horizontal</h4>
                             <div className="horizontal">
-                            <FreeScrollBar>
+                            <FreeScrollBar start={'bottom right'}>
                                 <img src="http://designmodo.github.io/Flat-UI/docs/assets/img/example-image.jpg" className="img-rounded"/>
                             </FreeScrollBar>
                         </div>

diff --git a/dist/index.js b/dist/index.js
@@ -122,7 +122,17 @@ module.exports = React.createClass({
     componentDidMount: function componentDidMount() {
         document.addEventListener('mousemove', this.handleHandlerMouseMove);
         document.addEventListener('mouseup', this.handleHandlerMouseUp);
-
+        window.onload = this.handleWindowLoad;
+    },
+    componentWillUnmount: function componentWillUnmount() {
+        document.removeEventListener('mousemove', this.handleHandlerMouseMove);
+        document.removeEventListener('mouseup', this.handleHandlerMouseUp);
+        window.removeEventListener('load', this.handleWindowLoad);
+    },
+    componentDidUpdate: function componentDidUpdate() {
+        this.updateTrackVisibilities();
+    },
+    handleWindowLoad: function handleWindowLoad() {
         this.collectInfo();
         this.updateTrackVisibilities();
         this.handlerContainerScroll();
@@ -134,13 +144,6 @@ module.exports = React.createClass({
             this.el.scrollLeft = this.el.scrollWidth;
         }
     },
-    componentWillUnmount: function componentWillUnmount() {
-        document.removeEventListener('mousemove', this.handleHandlerMouseMove);
-        document.removeEventListener('mouseup', this.handleHandlerMouseUp);
-    },
-    componentDidUpdate: function componentDidUpdate() {
-        this.updateTrackVisibilities();
-    },
     collectInfo: function collectInfo() {
         this.el = findDOMNode(this.refs.container);
         this.offsetWidth = this.el.offsetWidth;
@@ -213,6 +216,7 @@ module.exports = React.createClass({
         var scrollHeight = el.scrollHeight,
             scrollWidth = el.scrollWidth;
         if (scrollHeight === this.lastScrollHeight && scrollWidth === this.lastScrollWidth) return;
+        console.log(scrollHeight, this.offsetHeight);
         this.setState({
             showVeriticalTrack: scrollHeight > this.offsetHeight,
             showHorizontalTrack: scrollWidth > this.offsetWidth

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-free-scrollbar",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "description": "A react module for creating customizable scroll area",
   "main": "dist/index.js",
   "scripts": {

diff --git a/site/index.js b/site/index.js
@@ -63,7 +63,7 @@
 /******/ 	}
 
 /******/ 	var hotApplyOnUpdate = true;
-/******/ 	var hotCurrentHash = "c828347c0b967fdb09bb"; // eslint-disable-line no-unused-vars
+/******/ 	var hotCurrentHash = "19aa799e26772e227bea"; // eslint-disable-line no-unused-vars
 /******/ 	var hotCurrentModuleData = {};
 /******/ 	var hotCurrentParents = []; // eslint-disable-line no-unused-vars
 
@@ -723,7 +723,7 @@
 	                            { className: 'quick-start' },
 	                            _react2.default.createElement(
 	                                _index2.default,
-	                                null,
+	                                { start: "top" },
 	                                _react2.default.createElement(
 	                                    'div',
 	                                    { className: 'inner' },
@@ -751,7 +751,7 @@
 	                            { className: 'horizontal' },
 	                            _react2.default.createElement(
 	                                _index2.default,
-	                                null,
+	                                { start: 'bottom right' },
 	                                _react2.default.createElement('img', { src: 'http://designmodo.github.io/Flat-UI/docs/assets/img/example-image.jpg', className: 'img-rounded' })
 	                            )
 	                        )
@@ -794,7 +794,7 @@
 	                        _react2.default.createElement(
 	                            'h4',
 	                            null,
-	                            'Auto hide'
+	                            'Auto hide, and the starting position is on the "bottom right".'
 	                        ),
 	                        _react2.default.createElement(
 	                            'div',
@@ -22760,7 +22760,17 @@
 	    componentDidMount: function componentDidMount() {
 	        document.addEventListener('mousemove', this.handleHandlerMouseMove);
 	        document.addEventListener('mouseup', this.handleHandlerMouseUp);
-
+	        window.onload = this.handleWindowLoad;
+	    },
+	    componentWillUnmount: function componentWillUnmount() {
+	        document.removeEventListener('mousemove', this.handleHandlerMouseMove);
+	        document.removeEventListener('mouseup', this.handleHandlerMouseUp);
+	        window.removeEventListener('load', this.handleWindowLoad);
+	    },
+	    componentDidUpdate: function componentDidUpdate() {
+	        this.updateTrackVisibilities();
+	    },
+	    handleWindowLoad: function handleWindowLoad() {
 	        this.collectInfo();
 	        this.updateTrackVisibilities();
 	        this.handlerContainerScroll();
@@ -22772,13 +22782,6 @@
 	            this.el.scrollLeft = this.el.scrollWidth;
 	        }
 	    },
-	    componentWillUnmount: function componentWillUnmount() {
-	        document.removeEventListener('mousemove', this.handleHandlerMouseMove);
-	        document.removeEventListener('mouseup', this.handleHandlerMouseUp);
-	    },
-	    componentDidUpdate: function componentDidUpdate() {
-	        this.updateTrackVisibilities();
-	    },
 	    collectInfo: function collectInfo() {
 	        this.el = findDOMNode(this.refs.container);
 	        this.offsetWidth = this.el.offsetWidth;
@@ -22851,6 +22854,7 @@
 	        var scrollHeight = el.scrollHeight,
 	            scrollWidth = el.scrollWidth;
 	        if (scrollHeight === this.lastScrollHeight && scrollWidth === this.lastScrollWidth) return;
+	        console.log(scrollHeight, this.offsetHeight);
 	        this.setState({
 	            showVeriticalTrack: scrollHeight > this.offsetHeight,
 	            showHorizontalTrack: scrollWidth > this.offsetWidth

diff --git a/src/index.jsx b/src/index.jsx
@@ -118,9 +118,22 @@ module.exports = React.createClass({
     componentDidMount() {
         document.addEventListener('mousemove', this.handleHandlerMouseMove);
         document.addEventListener('mouseup', this.handleHandlerMouseUp);
+        window.onload = this.handleWindowLoad;
+    },
+
+    componentWillUnmount() {
+        document.removeEventListener('mousemove', this.handleHandlerMouseMove);
+        document.removeEventListener('mouseup', this.handleHandlerMouseUp);
+        window.removeEventListener('load', this.handleWindowLoad);
+    },
+
+    componentDidUpdate() {
+        this.updateTrackVisibilities();  
+    },
 
+    handleWindowLoad() {
         this.collectInfo();
-        this.updateTrackVisibilities();    
+        this.updateTrackVisibilities();  
         this.handlerContainerScroll();  
 
         if (this.props.start.includes('bottom')) {
@@ -131,15 +144,6 @@ module.exports = React.createClass({
         }
     },
 
-    componentWillUnmount() {
-        document.removeEventListener('mousemove', this.handleHandlerMouseMove);
-        document.removeEventListener('mouseup', this.handleHandlerMouseUp);
-    },
-
-    componentDidUpdate() {
-        this.updateTrackVisibilities();  
-    },
-
     collectInfo() {
         this.el = findDOMNode(this.refs.container);
         this.offsetWidth = this.el.offsetWidth;
@@ -212,6 +216,7 @@ module.exports = React.createClass({
         var el = this.el;
         var scrollHeight = el.scrollHeight, scrollWidth = el.scrollWidth;
         if (scrollHeight === this.lastScrollHeight && scrollWidth === this.lastScrollWidth) return;
+        console.log(scrollHeight, this.offsetHeight);
         this.setState({
             showVeriticalTrack: scrollHeight > this.offsetHeight,
             showHorizontalTrack: scrollWidth > this.offsetWidth