Changed structure to keep code contained to file_upload.jsx

web/react/components/file_upload.jsx

@@ -113,31 +113,33 @@ module.exports = React.createClass({
         var self = this;
 
         if (this.props.postType === 'post') {
-            $('body').on('dragover', '.post-list__table', function(e) {
+            $('body').on('dragover dragleave', '.app__content', function(e) {
                 e.preventDefault();
             });
-            $('body').on('dragenter', '.post-list__table', function(e) {
+            $('body').on('dragenter', '.app__content', function(e) {
                 e.preventDefault();
+                console.log('HERE');
+                $('.app__content').addClass('center-file-overlay');
+                $('.post-right__container').removeClass('right-file-overlay');
             });
-            $('body').on('dragleave', '.post-list__table', function(e) {
+            $('body').on('drop', '.app__content', function(e) {
-                e.preventDefault();
-            });
-            $('body').on('drop', '.post-list__table', function(e) {
                 e.preventDefault();
+                $('.app__content').removeClass('center-file-overlay');
                 self.handleDrop(e);
             });
         } else if (this.props.postType === 'comment') {
-            $('body').on('dragover', '.sidebar--right', function(e) {
+            $('body').on('dragover dragleave', '.post-right__container', function(e) {
                 e.preventDefault();
             });
-            $('body').on('dragenter', '.sidebar--right', function(e) {
+            $('body').on('dragenter', '.post-right__container', function(e) {
                 e.preventDefault();
+                console.log('HERE RIGHT');
+                $('.post-right__container').addClass('right-file-overlay');
+                $('.app__content').removeClass('center-file-overlay');
             });
-            $('body').on('dragleave', '.sidebar--right', function(e) {
+            $('body').on('drop', '.post-right__container', function(e) {
-                e.preventDefault();
-            });
-            $('body').on('drop', '.sidebar--right', function(e) {
                 e.preventDefault();
+                $('.post-right__container').removeClass('right-file-overlay');
                 self.handleDrop(e);
             });
         }

web/react/components/post_list.jsx

@@ -280,10 +280,6 @@ module.exports = React.createClass({
                 }
             );
     },
-    handleDragEnter: function() {
-        console.log("HERE ENTER");
-        this.setState({fileDrag: true});
-    },
     getInitialState: function() {
         return getStateFromStores();
     },
@@ -472,7 +468,7 @@ module.exports = React.createClass({
 
         return (
             <div ref="postlist" className="post-list-holder-by-time">
-                <div className={"post-list__table " + fileDragOverlay} onDragEnter={this.handleDragEnter}>
+                <div className="post-list__table">
                     <div className="post-list__content">
                         { more_messages }
                         { postCtls }

web/react/components/post_right.jsx

@@ -243,10 +243,6 @@ module.exports = React.createClass({
             this.refs[id].forceUpdate();
         }
     },
-    handleDragEnter: function() {
-        console.log("HERE ENTER RIGHT");
-        this.setState({fileDrag: true});
-    },
     getInitialState: function() {
         return getStateFromStores();
     },
@@ -304,7 +300,7 @@ module.exports = React.createClass({
         }
 
         return (
-            <div className={"post-right__container" + fileDragOverlay} onDragEnter={this.handleDragEnter}>
+            <div className="post-right__container ">
                 <div className="search-bar__container sidebar--right__search-header">{searchForm}</div>
                 <div className="sidebar-right__body">
                     <RhsHeaderPost fromSearch={this.props.fromSearch} isMentionSearch={this.props.isMentionSearch} />

web/sass-files/sass/partials/_files.scss

@@ -202,3 +202,15 @@
     }
   }
 }
+
+.center-file-overlay {
+  width: 100%;
+  height: 100%;
+  background:rgba(255,255,255,0.5);
+}
+
+.right-file-overlay {
+  width: 100%;
+  height: 100%;
+  background:rgba(255,255,255,0.5);
+}

web/sass-files/sass/partials/_post_right.scss

@@ -1,11 +1,5 @@
 .post-right__container {
 
-	.post-right-file-overlay {
-		width: 100%;
-		height: 100%;
-		background:rgba(255,255,255,0.5);
-	}
-
 	.post-right-root-message {
 		padding: 1em 1em 0;
 	}