Browse Source

Fix drag and drop on Sandstorm

This bug was introduced with the introduction of fast-render in
41b23f8. With fast-render data is available instantly after the page
logging, but calls to `Meteor.userId()` still return `null` as the
user isn't authenticated on the DDP channel yet (previously the data
was loaded on DDP after user authentication). Which mean that we know
need to reactively activate Drag and Drop on user log in.

I'm not sure why I was not able to reproduce this bug outside of
Sandstorm.

Fixes #453
Maxime Quandalle 9 years ago
parent
commit
f6c01161a0

+ 8 - 6
client/components/boards/boardBody.js

@@ -135,9 +135,6 @@ Template.boardBody.onRendered(function() {
     },
     },
   };
   };
 
 
-  if (!Meteor.user() || !Meteor.user().isBoardMember())
-    return;
-
   $(self.listsDom).sortable({
   $(self.listsDom).sortable({
     tolerance: 'pointer',
     tolerance: 'pointer',
     helper: 'clone',
     helper: 'clone',
@@ -163,16 +160,21 @@ Template.boardBody.onRendered(function() {
     },
     },
   });
   });
 
 
-  // Disable drag-dropping while in multi-selection mode
+  function userIsMember() {
+    return Meteor.user() && Meteor.user().isBoardMember();
+  }
+
+  // Disable drag-dropping while in multi-selection mode, or if the current user
+  // is not a board member
   self.autorun(() => {
   self.autorun(() => {
     $(self.listsDom).sortable('option', 'disabled',
     $(self.listsDom).sortable('option', 'disabled',
-      MultiSelection.isActive());
+      MultiSelection.isActive() || !userIsMember());
   });
   });
 
 
   // If there is no data in the board (ie, no lists) we autofocus the list
   // If there is no data in the board (ie, no lists) we autofocus the list
   // creation form by clicking on the corresponding element.
   // creation form by clicking on the corresponding element.
   const currentBoard = Boards.findOne(Session.get('currentBoard'));
   const currentBoard = Boards.findOne(Session.get('currentBoard'));
-  if (currentBoard.lists().count() === 0) {
+  if (userIsMember() && currentBoard.lists().count() === 0) {
     self.openNewListForm();
     self.openNewListForm();
   }
   }
 });
 });

+ 9 - 3
client/components/lists/list.js

@@ -22,9 +22,6 @@ BlazeComponent.extendComponent({
   // callback, we basically solve all issues related to reactive updates. A
   // callback, we basically solve all issues related to reactive updates. A
   // comment below provides further details.
   // comment below provides further details.
   onRendered() {
   onRendered() {
-    if (!Meteor.user() || !Meteor.user().isBoardMember())
-      return;
-
     const boardComponent = this.parentComponent();
     const boardComponent = this.parentComponent();
     const itemsSelector = '.js-minicard:not(.placeholder, .js-card-composer)';
     const itemsSelector = '.js-minicard:not(.placeholder, .js-card-composer)';
     const $cards = this.$('.js-minicards');
     const $cards = this.$('.js-minicards');
@@ -85,6 +82,15 @@ BlazeComponent.extendComponent({
       },
       },
     });
     });
 
 
+    function userIsMember() {
+      return Meteor.user() && Meteor.user().isBoardMember();
+    }
+
+    // Disable drag-dropping if the current user is not a board member
+    this.autorun(() => {
+      $cards.sortable('option', 'disabled', !userIsMember());
+    });
+
     // We want to re-run this function any time a card is added.
     // We want to re-run this function any time a card is added.
     this.autorun(() => {
     this.autorun(() => {
       const currentBoardId = Tracker.nonreactive(() => {
       const currentBoardId = Tracker.nonreactive(() => {

+ 10 - 4
client/components/sidebar/sidebar.js

@@ -195,9 +195,6 @@ Template.labelsWidget.events({
 // autorun function and register a dependency on the both members and labels
 // autorun function and register a dependency on the both members and labels
 // fields of the current board document.
 // fields of the current board document.
 function draggableMembersLabelsWidgets() {
 function draggableMembersLabelsWidgets() {
-  if (!Meteor.user() || !Meteor.user().isBoardMember())
-    return;
-
   this.autorun(() => {
   this.autorun(() => {
     const currentBoardId = Tracker.nonreactive(() => {
     const currentBoardId = Tracker.nonreactive(() => {
       return Session.get('currentBoard');
       return Session.get('currentBoard');
@@ -209,7 +206,8 @@ function draggableMembersLabelsWidgets() {
       },
       },
     });
     });
     Tracker.afterFlush(() => {
     Tracker.afterFlush(() => {
-      this.$('.js-member,.js-label').draggable({
+      const $draggables = this.$('.js-member,.js-label');
+      $draggables.draggable({
         appendTo: 'body',
         appendTo: 'body',
         helper: 'clone',
         helper: 'clone',
         revert: 'invalid',
         revert: 'invalid',
@@ -220,6 +218,14 @@ function draggableMembersLabelsWidgets() {
           EscapeActions.executeUpTo('popup-back');
           EscapeActions.executeUpTo('popup-back');
         },
         },
       });
       });
+
+      function userIsMember() {
+        return Meteor.user() && Meteor.user().isBoardMember();
+      }
+
+      this.autorun(() => {
+        $draggables.draggable('option', 'disabled', !userIsMember());
+      });
     });
     });
   });
   });
 }
 }