Request users for mentions, send mentions

apps/api/documents/api.js

@@ -198,6 +198,7 @@
         _config.editorConfig.canRequestClose = _config.events && !!_config.events.onRequestClose;
         _config.editorConfig.canRename = _config.events && !!_config.events.onRequestRename;
         _config.editorConfig.canMakeActionLink = _config.events && !!_config.events.onMakeActionLink;
+        _config.editorConfig.canRequestUsers = _config.events && !!_config.events.onRequestUsers;
         _config.editorConfig.mergeFolderUrl = _config.editorConfig.mergeFolderUrl || _config.editorConfig.saveAsUrl;
         _config.frameEditorId = placeholderId;
 
@@ -536,6 +537,22 @@
             });
         };
 
+        var _setUsers = function(data) {
+            _sendCommand({
+                command: 'setUsers',
+                data: {
+                    data: data
+                }
+            });
+        };
+
+        var _showSharingSettings = function(data) {
+            _sendCommand({
+                command: 'showSharingSettings',
+                data: data
+            });
+        };
+
         var _processMouse = function(evt) {
             var r = iframe.getBoundingClientRect();
             var data = {
@@ -575,7 +592,9 @@
             serviceCommand      : _serviceCommand,
             attachMouseEvents   : _attachMouseEvents,
             detachMouseEvents   : _detachMouseEvents,
-            destroyEditor       : _destroyEditor
+            destroyEditor       : _destroyEditor,
+            setUsers            : _setUsers,
+            showSharingSettings : _showSharingSettings
         }
     };
 

apps/common/Gateway.js

@@ -98,6 +98,14 @@ if (Common === undefined) {
 
             'resetFocus': function(data) {
                 $me.trigger('resetfocus', data);
+            },
+
+            'setUsers': function(data) {
+                $me.trigger('setusers', data);
+            },
+
+            'showSharingSettings': function(data) {
+                $me.trigger('showsharingsettings', data);
             }
         };
 
@@ -262,6 +270,14 @@ if (Common === undefined) {
                 _postMessage({event:'onMakeActionLink', data: config})
             },
 
+            requestUsers:  function () {
+                _postMessage({event:'onRequestUsers'})
+            },
+
+            requestSendNotify:  function (emails) {
+                _postMessage({event:'onRequestSendNotify', data: emails})
+            },
+
             on: function(event, handler){
                 var localHandler = function(event, data){
                     handler.call(me, data)

apps/common/main/lib/controller/Comments.js

@@ -1125,10 +1125,9 @@ define([
                 this.popover = Common.Views.ReviewPopover.prototype.getPopover({
                     commentsStore : this.popoverComments,
                     renderTo : this.sdkViewName,
-                    userEmail: (this.mode) ? this.mode.userEmail : undefined
+                    canRequestUsers: (this.mode) ? this.mode.canRequestUsers : undefined
                 });
                 this.popover.setCommentsStore(this.popoverComments);
-                (this.mode) && this.popover.setUserEmail(this.mode.userEmail);
             }
             return this.popover;
         },
@@ -1341,9 +1340,9 @@ define([
                     if (!_.isUndefined(comment.asc_putDocumentFlag))
                         comment.asc_putDocumentFlag(false);
 
-                    this.api.asc_addComment(comment);
+                    var commentId = this.api.asc_addComment(comment);
                     this.view.showEditContainer(false);
-                    this.mode && this.mode.userEmail && this.view.pickEMail(commentVal);
+                    this.mode && this.mode.canRequestUsers && this.view.pickEMail(commentId, commentVal);
                     if (!_.isUndefined(this.api.asc_SetDocumentPlaceChangedEnabled)) {
                         this.api.asc_SetDocumentPlaceChangedEnabled(false);
                     }

apps/common/main/lib/view/Comments.js

@@ -721,10 +721,23 @@ define([
             return str_res;
         },
 
-        pickEMail: function (message) {
+        pickEMail: function (commentId, message) {
             var arr = Common.Utils.String.htmlEncode(message).match(/\B[@+][A-Z0-9._%+-]+@[A-Z0-9._]+\.[A-Z]+\b/gi);
             console.log(arr); // send e-mails
-            return arr;
+            arr = _.map(arr, function(str){
+                return str.slice(1, str.length);
+            });
+            Common.Gateway.requestSendNotify({
+                emails: arr,
+                actionId: commentId, // comment id
+                actionLink: {
+                    action: {
+                        type: "comment",
+                        data: commentId
+                    }
+                },
+                message: message //comment text
+            });
         },
 
         textComments            : 'Comments',

apps/common/main/lib/view/ReviewPopover.js

@@ -100,7 +100,8 @@ define([
 
             this.commentsStore = options.commentsStore;
             this.reviewStore = options.reviewStore;
-            this.userEmail = options.userEmail;
+            this.canRequestUsers = options.canRequestUsers;
+            this.externalUsers = [];
             this._state = {commentsVisible: false, reviewVisible: false};
 
             _options.tpl = _.template(this.template)(_options);
@@ -109,6 +110,9 @@ define([
             this.sdkBounds = {width: 0, height: 0, padding: 10, paddingTop: 20};
 
             Common.UI.Window.prototype.initialize.call(this, _options);
+
+            this.canRequestUsers && Common.Gateway.on('setusers', _.bind(this.setUsers, this));
+
             return this;
         },
         render: function (comments, review) {
@@ -890,7 +894,7 @@ define([
                 me.e = event;
             });
 
-            if (this.userEmail && this.userEmail.length>0) {
+            if (this.canRequestUsers) {
                 textBox && textBox.keydown(function (event) {
                     if ( event.keyCode == Common.UI.Keys.SPACE ||
                         event.keyCode == Common.UI.Keys.HOME || event.keyCode == Common.UI.Keys.END || event.keyCode == Common.UI.Keys.RIGHT ||
@@ -960,8 +964,12 @@ define([
                 this.commentsView.setStore(this.commentsStore);
         },
 
-        setUserEmail: function(email) {
+        setUsers: function(data) {
-            this.userEmail = email;
+            this.externalUsers = data.data || [];
+            if (this.loadMask)
+                this.loadMask.hide();
+            this.loadMask = null;
+            this._state.emailSearch && this.onEmailListMenu(this._state.emailSearch.str, this._state.emailSearch.left, this._state.emailSearch.right);
         },
 
         getPopover: function(options) {
@@ -989,64 +997,84 @@ define([
         },
 
         onEmailListMenu: function(str, left, right) {
-            var emails = this.userEmail;
             var me   = this,
+                users = me.externalUsers,
                 menu = me.emailMenu;
+
+            if (users.length<1) {
+                this._state.emailSearch = {
+                    str: str,
+                    left: left,
+                    right: right
+                };
+
+                if (this.loadMask) return;
+            }
             if (typeof str == 'string') {
                 var menuContainer = me.$window.find(Common.Utils.String.format('#menu-container-{0}', menu.id)),
-                    arr = [];
+                    textbox = this.commentsView.getTextBox(),
-                str = str.toLowerCase();
+                    textboxDom = textbox ? textbox[0] : null,
+                    showPoint = textboxDom ? [textboxDom.offsetLeft, textboxDom.offsetTop + textboxDom.clientHeight + 3] : [0, 0];
+
+                if (!menu.rendered) {
+                    // Prepare menu container
+                    if (menuContainer.length < 1) {
+                        menuContainer = $(Common.Utils.String.format('<div id="menu-container-{0}" style="position: absolute; z-index: 10000;"><div class="dropdown-toggle" data-toggle="dropdown"></div></div>', menu.id));
+                        me.$window.append(menuContainer);
+                    }
+
+                    menu.render(menuContainer);
+                    menu.cmpEl.css('min-width', textboxDom ? textboxDom.clientWidth : 220);
+                    menu.cmpEl.attr({tabindex: "-1"});
+                    menu.on('hide:after', function(){
+                        setTimeout(function(){
+                            var tb = me.commentsView.getTextBox();
+                            tb && tb.focus();
+                        }, 10);
+                    });
+                }
 
                 for (var i = 0; i < menu.items.length; i++) {
                     menu.removeItem(menu.items[i]);
                     i--;
                 }
-                if (str.length>0) {
-                    for (var i = 0; i < emails.length; i++) {
-                        if (0 === emails[i].toLowerCase().indexOf(str)) {
-                            arr.push(emails[i]);
-                        }
-                    }
-                } else
-                    arr = emails;
 
-                _.each(arr, function(menuItem, index) {
+                if (users.length<1) {
-                    var mnu = new Common.UI.MenuItem({
+                    menu.addItem(new Common.UI.MenuItem({
-                        caption     : menuItem
+                        template: _.template([
-                    }).on('click', function(item, e) {
+                            '<div style="height: 100px;"></div>'
-                        me.insertEmailToTextbox(item.caption, left, right);
+                        ].join(''))
-                    });
+                    }));
-                    menu.addItem(mnu);
+                    this.loadMask = new Common.UI.LoadMask({owner: menu.cmpEl.find('li > div')});
-                });
+                    this.loadMask.setTitle(this.textLoading);
-
+                } else {
-                var textbox = this.commentsView.getTextBox();
+                    str = str.toLowerCase();
-                if (arr.length>0 && textbox) {
+                    if (str.length>0) {
-                    var textboxDom = textbox[0],
+                        users = _.filter(users, function(item) {
-                        showPoint = [textboxDom.offsetLeft, textboxDom.offsetTop + textboxDom.clientHeight + 3];
+                            return (0 === item.email.toLowerCase().indexOf(str))
-
-                    if (!menu.rendered) {
-                        // Prepare menu container
-                        if (menuContainer.length < 1) {
-                            menuContainer = $(Common.Utils.String.format('<div id="menu-container-{0}" style="position: absolute; z-index: 10000;"><div class="dropdown-toggle" data-toggle="dropdown"></div></div>', menu.id));
-                            me.$window.append(menuContainer);
-                        }
-
-                        menu.render(menuContainer);
-                        menu.cmpEl.css('min-width', textboxDom.clientWidth);
-                        menu.cmpEl.attr({tabindex: "-1"});
-                        menu.on('hide:after', function(){
-                            setTimeout(function(){
-                                var tb = me.commentsView.getTextBox();
-                                tb && tb.focus();
-                            }, 10);
                         });
                     }
+                    _.each(users, function(menuItem, index) {
+                        var mnu = new Common.UI.MenuItem({
+                            caption     : menuItem.email
+                        }).on('click', function(item, e) {
+                            me.insertEmailToTextbox(item.caption, left, right);
+                        });
+                        menu.addItem(mnu);
+                    });
+                }
 
+                if (users.length>0 || this.loadMask) {
                     menuContainer.css({left: showPoint[0], top : showPoint[1]});
                     menu.menuAlignEl = textbox;
                     menu.show();
                     menu.cmpEl.css('display', '');
                     menu.alignPosition('bl-tl', -5);
+
+                    if (this.loadMask) {
+                        this.loadMask.show();
+                        Common.Gateway.requestUsers();
+                    }
                 } else {
                     menu.rendered && menu.cmpEl.css('display', 'none');
                 }
@@ -1071,7 +1099,8 @@ define([
         textReply               : 'Reply',
         textClose               : 'Close',
         textResolve             : 'Resolve',
-        textOpenAgain           : "Open Again"
+        textOpenAgain           : "Open Again",
+        textLoading             : 'Loading'
 
     }, Common.Views.ReviewPopover || {}))
 });

apps/documenteditor/main/app/controller/Main.js

@@ -339,6 +339,7 @@ define([
                 this.appOptions.canPlugins      = false;
                 this.plugins                    = this.editorConfig.plugins;
                 this.appOptions.canMakeActionLink = this.editorConfig.canMakeActionLink;
+                this.appOptions.canRequestUsers = this.editorConfig.canRequestUsers;
 
                 appHeader = this.getApplication().getController('Viewport').getView('Common.Views.Header');
                 appHeader.setCanBack(this.appOptions.canBackToFolder === true, (this.appOptions.canBackToFolder) ? this.editorConfig.customization.goback.text : '')