Import members: UI flow ok

.meteor/release

@@ -1 +1 @@
-METEOR@1.2.0.2
+METEOR@1.2.2-cdn-url

.meteor/versions

@@ -1,19 +1,19 @@
-3stack:presence@1.0.3
-accounts-base@1.2.1
-accounts-password@1.1.3
+3stack:presence@1.0.4
+accounts-base@1.2.2
+accounts-password@1.1.4
 aldeed:collection2@2.5.0
 aldeed:simple-schema@1.3.3
 alethes:pages@1.8.4
 arillo:flow-router-helpers@0.4.5
 audit-argument-checks@1.0.4
-autoupdate@1.2.3
+autoupdate@1.2.4
 babel-compiler@5.8.24_1
 babel-runtime@0.1.4
 base64@1.0.4
 binary-heap@1.0.4
 blaze@2.1.3
 blaze-tools@1.0.4
-boilerplate-generator@1.0.4
+boilerplate-generator@1.0.5-cdn-url
 caching-compiler@1.0.0
 caching-html-compiler@1.0.2
 callback-hook@1.0.4
@@ -34,22 +34,22 @@ cfs:storage-adapter@0.2.3
 cfs:tempstore@0.1.5
 cfs:upload-http@0.0.20
 cfs:worker@0.1.4
-check@1.0.6
-coffeescript@1.0.10
-cosmos:browserify@0.5.1
-dburles:collection-helpers@1.0.3
+check@1.1.0
+coffeescript@1.0.11
+cosmos:browserify@0.8.3
+dburles:collection-helpers@1.0.4
 ddp@1.2.2
 ddp-client@1.2.1
-ddp-common@1.2.1
+ddp-common@1.2.2
 ddp-rate-limiter@1.0.0
-ddp-server@1.2.1
+ddp-server@1.2.2
 deps@1.0.9
 diff-sequence@1.0.1
-ecmascript@0.1.5
-ecmascript-collections@0.1.6
+ecmascript@0.1.6
+ecmascript-runtime@0.2.6
 ejson@1.0.7
-email@1.0.7
-es5-shim@4.1.13
+email@1.0.8
+es5-shim@4.1.14
 fastclick@1.0.7
 fortawesome:fontawesome@4.4.0
 geojson-utils@1.0.4
@@ -58,20 +58,19 @@ html-tools@1.0.5
 htmljs@1.0.5
 http@1.1.1
 id-map@1.0.4
-idmontie:migrations@1.0.0
+idmontie:migrations@1.0.1
 jquery@1.11.4
-jsx@0.1.6
 kadira:blaze-layout@2.2.0
-kadira:dochead@1.1.0
-kadira:flow-router@2.7.0
-kenton:accounts-sandstorm@0.1.6
+kadira:dochead@1.3.2
+kadira:flow-router@2.9.0
+kenton:accounts-sandstorm@0.1.8
 launch-screen@1.0.4
 livedata@1.0.15
 localstorage@1.0.5
 logging@1.0.8
 matb33:collection-hooks@0.8.1
 matteodem:easy-search@1.6.4
-meteor@1.1.9
+meteor@1.1.10
 meteor-base@1.0.1
 meteor-platform@1.2.3
 meteorhacks:aggregate@1.3.0
@@ -82,14 +81,14 @@ meteorspark:util@0.2.0
 minifiers@1.1.7
 minimongo@1.0.10
 mobile-status-bar@1.0.6
-mongo@1.1.2
+mongo@1.1.3
 mongo-id@1.0.1
 mongo-livedata@1.0.9
 mousetrap:mousetrap@1.4.6_1
 mquandalle:autofocus@1.0.0
 mquandalle:collection-mutations@0.1.0
-mquandalle:jade@0.4.4
-mquandalle:jade-compiler@0.4.4
+mquandalle:jade@0.4.5
+mquandalle:jade-compiler@0.4.5
 mquandalle:jquery-textcomplete@0.8.0_1
 mquandalle:jquery-ui-drag-drop-sort@0.1.0
 mquandalle:moment@1.0.0
@@ -102,17 +101,17 @@ observe-sequence@1.0.7
 ongoworks:speakingurl@1.1.0
 ordered-dict@1.0.4
 peerlibrary:assert@0.2.5
-peerlibrary:base-component@0.13.0
-peerlibrary:blaze-components@0.14.0
-peerlibrary:computed-field@0.3.0
+peerlibrary:base-component@0.14.0
+peerlibrary:blaze-components@0.15.1
+peerlibrary:computed-field@0.3.1
 peerlibrary:reactive-field@0.1.0
 perak:markdown@1.0.5
-promise@0.5.0
+promise@0.5.1
 raix:eventemitter@0.1.3
 raix:handlebar-helpers@0.2.5
-random@1.0.4
+random@1.0.5
 rate-limit@1.0.0
-reactive-dict@1.1.2
+reactive-dict@1.1.3
 reactive-var@1.0.6
 reload@1.1.4
 retry@1.0.4
@@ -126,10 +125,10 @@ softwarerero:accounts-t9n@1.1.4
 spacebars@1.0.7
 spacebars-compiler@1.0.7
 srp@1.0.4
-standard-minifiers@1.0.1
+standard-minifiers@1.0.2
 tap:i18n@1.7.0
 templates:tabs@2.2.0
-templating@1.1.4
+templating@1.1.5
 templating-tools@1.0.0
 tracker@1.0.9
 ui@1.0.8
@@ -139,6 +138,6 @@ useraccounts:core@1.12.4
 useraccounts:flow-routing@1.12.4
 useraccounts:unstyled@1.12.4
 verron:autosize@3.0.8
-webapp@1.2.2
+webapp@1.2.4-cdn-url
 webapp-hashing@1.0.5
 zimme:active-route@2.3.2

client/components/import/import.jade

@@ -7,9 +7,42 @@ template(name="importPopup")
     input.primary.wide(type="submit" value="{{_ 'import'}}")
 
 template(name="mapMembersPopup")
-  p {{_ 'import-members-map'}}
-  ul
-    each members
-      li.item {{ fullName }} > world
-  form
-    input.primary.wide(type="submit" value="{{_ 'import'}}")
+  .map-members
+    p {{_ 'import-members-map'}}
+    .mapping-list
+      each members
+        .mapping
+          a.source
+            div.full-name
+              = fullName
+            div.username
+              | ({{username}})
+          .wekan
+            if wekan
+              +userAvatar(userId=wekan._id)
+            else
+              a.member.add-member.js-add-members
+                i.fa.fa-plus
+    form
+      input.primary.wide(type="submit" value="{{_ 'import'}}")
+
+      template(name="addMemberPopup")
+
+template(name="mapMembersAddPopup")
+  .select-member
+    p Hello world
+    .js-map-member
+      +esInput(index="users")
+    ul.pop-over-list
+      +esEach(index="users")
+        li.item.js-member-item
+          a.name.js-select-member(title="{{profile.name}} ({{username}})" data-id="{{_id}}")
+            +userAvatar(userId=_id esSearch=true)
+            span.full-name
+              = profile.name
+              | (<span class="username">{{username}}</span>)
+      +ifEsIsSearching(index='users')
+        +spinner
+      +ifEsHasNoResults(index="users")
+        .manage-member-section
+          p.quiet {{_ 'no-results'}}

client/components/import/import.js

@@ -11,60 +11,76 @@ const ImportPopup = BlazeComponent.extendComponent({
     return 'importPopup';
   },
 
-  events() {
-    return [{
-      submit(evt) {
-        evt.preventDefault();
-        const dataJson = $(evt.currentTarget).find('.js-import-json').val();
-        let dataObject;
-        try {
-          dataObject = JSON.parse(dataJson);
-          this.setError('');
-        } catch (e) {
-          this.setError('error-json-malformed');
-          return;
+  onCreated() {
+    this.error = new ReactiveVar('');
+    this.dataToImport = '';
+  },
+
+  onFinish() {
+    Popup.close();
+  },
+
+  onSubmit(evt){
+    evt.preventDefault();
+    const dataJson = $(evt.currentTarget).find('.js-import-json').val();
+    let dataObject;
+    try {
+      dataObject = JSON.parse(dataJson);
+      this.setError('');
+    } catch (e) {
+      this.setError('error-json-malformed');
+      return;
+    }
+    // if there are members listed in the import, we need to map them
+    if(dataObject.members.length > 0) {
+      // we will work on the list itself (an ordered array of POJO)
+      // when a mapping is done, we add a 'wekan' field to the POJO representing the imported member
+      const membersToMap = dataObject.members;
+      // todo save initial import object - to save later, on mapping submission
+      // this.data().toImport = dataObject;
+
+      // auto-map based on username
+      const wekanMembers = Users;
+      membersToMap.forEach((importedMember) => {
+        const wekanUser = Users.findOne({username: importedMember.username})
+        if(wekanUser) {
+          importedMember.wekan = wekanUser;
         }
-        if(dataObject.members.length > 0) {
-          this.data().toImport = dataObject;
-          members.forEach(
-            // todo if there is a Wekan user with same name, add it as a field 'wekanUser'
-          );
-          this.data().members = dataObject.members;
-          // we bind to preserve data context
-          Popup.open('mapMembers').bind(this)(evt);
-        } else {
-          Meteor.call(this.getMethodName(), dataObject, this.getAdditionalData(),
-            (error, response) => {
-              if (error) {
-                this.setError(error.error);
-              } else {
-                Filter.addException(response);
-                this.onFinish(response);
-              }
-            }
-          );
+      });
+      // store members data and mapping in Session
+      // (we go deep and 2-way, so storing in data context is not a viable option)
+      Session.set('import.membersToMap', membersToMap);
+      Popup.open('mapMembers')(evt);
+    } else {
+      Meteor.call(this.getMethodName(), dataObject, this.getAdditionalData(),
+        (error, response) => {
+          if (error) {
+            this.setError(error.error);
+          } else {
+            // ensure will display what we just imported
+            Filter.addException(response);
+            this.onFinish(response);
+          }
         }
-      },
-    }];
+      );
+    }
   },
 
-  onCreated() {
-    this.error = new ReactiveVar('');
-    this.dataToImport = '';
+  events() {
+    return [{
+      submit: this.onSubmit,
+    }];
   },
 
   setError(error) {
     this.error.set(error);
   },
 
-  onFinish() {
-    Popup.close();
-  },
 });
 
 ImportPopup.extendComponent({
   getAdditionalData() {
-    const listId = this.data()._id;
+    const listId = this.currentData()._id;
     const selector = `#js-list-${this.currentData()._id} .js-minicard:first`;
     const firstCardDom = $(selector).get(0);
     const sortIndex = Utils.calculateIndex(null, firstCardDom).base;
@@ -100,13 +116,119 @@ ImportPopup.extendComponent({
   },
 }).register('boardImportBoardPopup');
 
-BlazeComponent.extendComponent({
+const ImportMapMembers = BlazeComponent.extendComponent({
+  members() {
+    return Session.get('import.membersToMap');
+  },
+  _refreshMembers(listOfMembers) {
+    Session.set('import.membersToMap', listOfMembers);
+  },
+  /**
+   * Will look into the list of members to import for the specified memberId,
+   * then set its property to the supplied value.
+   * If unset is true, it will remove the property from the rest of the list as well.
+   *
+   * use:
+   * - memberId = null to use selected member
+   * - value = null to unset a property
+   * - unset = true to ensure property is only set on 1 member at a time
+   */
+  _setPropertyForMember(property, value, memberId, unset = false) {
+    const listOfMembers = this.members();
+    let finder = null;
+    if(memberId) {
+      finder = (member) => member.id === memberId;
+    } else {
+      finder = (member) => member.selected;
+    }
+    listOfMembers.forEach((member) => {
+      if(finder(member)) {
+        if(value !== null) {
+          member[property] = true;
+        } else {
+          delete member[property];
+        }
+        if(!unset) {
+          // we shortcut if we don't care about unsetting the others
+          return false;
+        }
+      } else {
+        if(unset) {
+          delete member[property];
+        }
+      }
+      return true;
+    });
+    // Session.get gives us a copy, we have to set it back so it sticks
+    this._refreshMembers(listOfMembers);
+  },
+  setSelectedMember(memberId) {
+    return this._setPropertyForMember('selected', true, memberId, true);
+  },
+  /**
+   * returns the member with specified id,
+   * or the selected member if memberId is not specified
+   */
+  getMember(memberId = null) {
+    const allMembers = Session.get('import.membersToMap');
+    let finder = null;
+    if(memberId) {
+      finder = (user) => user.id === memberId;
+    } else {
+      finder = (user) => user.selected;
+    }
+    return allMembers.find(finder);
+  },
+  mapSelectedMember(wekan) {
+    return this._setPropertyForMember('wekan', wekan, null);
+  },
+  unmapMember(memberId){
+    return this._setPropertyForMember('wekan', null, memberId);
+  },
+});
+
+ImportMapMembers.extendComponent({
+  onSelectMember(evt) {
+    const memberToMap = this.currentData();
+    this.setSelectedMember(memberToMap.id);
+    console.log(`selected member#${memberToMap.id}`);
+    Popup.open('mapMembersAdd')(evt);
+  },
+  onRemove(evt){
+    const userId = this.currentData()._id;
+    console.log(`confirm and then call unmapMember ${userId}`);
+  },
+  onSubmit(evt) {
+    console.log("Mapping:");
+    console.log(this.members());
+  },
   events() {
     return [{
-      'submit': (evt) => {
-        evt.preventDefault();
-        console.log(this.data());
-      },
+      'submit': this.onSubmit,
+      'click .js-add-members': this.onSelectMember,
+      'click .js-member': this.onRemove,
     }];
   },
 }).register('mapMembersPopup');
+
+ImportMapMembers.extendComponent({
+  //template() {
+  //  return "mapMembersAddPopup";
+  //},
+  onSelectUser(){
+    const wekanUser = this.currentData();
+    console.log(`clicked on ${wekanUser._id}`);
+    console.log(wekanUser);
+    //this.mapSelectedMember(this.currentData());
+  },
+  events() {
+    return [{
+      //'click .js-select-member': this.onSelectUser(),
+    }];
+  },
+  onRendered() {
+    console.log('rendered');
+    // todo XXX why do I not focus??
+    $('.js-map-member input').focus();
+  },
+}).register('mapMembersAddPopup');

client/components/import/import.styl

@@ -0,0 +1,13 @@
+.map-members
+  .mapping
+    margin-bottom: 10px
+    margin-top: 10px
+    border-bottom: solid
+    .source
+      display: inline-block
+      width: 80%
+    .wekan
+      display: inline-block
+      width: 35px
+      .member
+        float: none

client/components/sidebar/sidebar.jade

@@ -89,7 +89,7 @@ template(name="addMemberPopup")
         a.name.js-select-member(title="{{profile.name}} ({{username}})")
           +userAvatar(userId=_id esSearch=true)
           span.full-name
-            = profile.name
+            = profile.fullname
             | (<span class="username">{{username}}</span>)
           if isBoardMember
             .quiet ({{_ 'joined'}})

i18n/en.i18n.json

@@ -166,6 +166,7 @@
     "log-out": "Log Out",
     "loginPopup-title": "Log In",
     "mapMembersPopup-title": "Map members",
+    "mapMembersAddPopup-title": "Select Wekan member",
     "memberMenuPopup-title": "Member Settings",
     "members": "Members",
     "menu": "Menu",

models/users.js

@@ -2,12 +2,14 @@ Users = Meteor.users;
 
 // Search a user in the complete server database by its name or username. This
 // is used for instance to add a new user to a board.
-const searchInFields = ['username', 'profile.name'];
+const searchInFields = ['username', 'profile.fullname'];
 Users.initEasySearch(searchInFields, {
   use: 'mongo-db',
   returnFields: [...searchInFields, 'profile.avatarUrl'],
 });
 
+
+
 Users.helpers({
   boards() {
     return Boards.find({ userId: this._id });