remove jQuery usage and dependency

rommguy · Apr 1, 2016 · d4f40f7 · d4f40f7
1 parent 540fcf8
commit d4f40f7
Show file tree

Hide file tree

Showing 6 changed files with 11 additions and 56 deletions.
diff --git a/dist/reactCustomScroll.js b/dist/reactCustomScroll.js
diff --git a/example/main.js b/example/main.js
@@ -4,13 +4,11 @@ require.config({
         lodash: 'https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.1/lodash.min',
         React: 'https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-with-addons.min',
         ReactDOM: 'https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.min',
-        jquery: 'https://code.jquery.com/jquery-2.1.4.min',
         customScroll: '../dist/reactCustomScroll'
     },
     shim: {
         lodash: {exports: '_'},
-        React: {exports: 'React'},
-        jquery: {exports: '$'}
+        React: {exports: 'React'}
     },
     map: {
         '*': {

diff --git a/package.json b/package.json
@@ -23,7 +23,6 @@
   },
   "homepage": "https://github.com/rommguy/react-custom-scroll#readme",
   "dependencies": {
-    "jquery": "^2.2.0",
     "lodash": "^3.10.1"
   },
   "devDependencies": {

diff --git a/src/main/customScroll.js b/src/main/customScroll.js
@@ -2,7 +2,6 @@
 var React = require('react');
 var reactDOM = require('react-dom');
 var _ = require('lodash');
-var $ = require('jquery');
 var template = require('./customScroll.rt.js');
 
 function ensureWithinLimits(value, min, max) {
@@ -58,15 +57,15 @@ module.exports = React.createClass({
         this.toggleScrollIfNeeded(contentHeight);
 
         this.position = {
-            top: boundingRect.top + $(window).scrollTop(),
-            left: boundingRect.left + $(window).scrollLeft()
+            top: boundingRect.top + window.pageYOffset,
+            left: boundingRect.left + window.pageXOffset
         };
 
         this.freezePosition(prevProps);
     },
     componentWillUnmount: function () {
-        $(document).off('mousemove', this.onHandleDrag);
-        $(document).off('mouseup', this.onHandleDragEnd);
+        document.removeEventListener('mousemove', this.onHandleDrag);
+        document.removeEventListener('mouseup', this.onHandleDragEnd);
     },
     freezePosition: function (prevProps) {
         var innerContainer = this.getScrolledElement();
@@ -156,8 +155,8 @@ module.exports = React.createClass({
         this.setState({
             onDrag: true
         });
-        $(document).on('mousemove', this.onHandleDrag);
-        $(document).on('mouseup', this.onHandleDragEnd);
+        document.addEventListener('mousemove', this.onHandleDrag);
+        document.addEventListener('mouseup', this.onHandleDragEnd);
     },
     onHandleDrag: function (event) {
         var mouseDeltaY = event.pageY - this.startDragMousePos;
@@ -169,8 +168,8 @@ module.exports = React.createClass({
         this.setState({
             onDrag: false
         });
-        $(document).off('mousemove', this.onHandleDrag);
-        $(document).off('mouseup', this.onHandleDragEnd);
+        document.removeEventListener('mousemove', this.onHandleDrag);
+        document.removeEventListener('mouseup', this.onHandleDragEnd);
     },
     blockOuterScroll: function (e) {
         if (this.props.allowOuterScroll) {

diff --git a/src/test/test-main.js b/src/test/test-main.js
diff --git a/webpack.config.js b/webpack.config.js
@@ -24,7 +24,6 @@ module.exports = {
     externals: {
         react: 'React',
         'react-dom': 'ReactDOM',
-        lodash: 'lodash',
-        jquery: 'jquery'
+        lodash: 'lodash'
     }
 };