diff --git a/frappe/public/js/frappe/form/footer/timeline.js b/frappe/public/js/frappe/form/footer/timeline.js
index 1c78149f16..e0ab13f400 100644
--- a/frappe/public/js/frappe/form/footer/timeline.js
+++ b/frappe/public/js/frappe/form/footer/timeline.js
@@ -40,7 +40,10 @@ frappe.ui.form.Comments = Class.extend({
this.list.on("click", ".toggle-blockquote", function() {
$(this).parent().siblings("blockquote").toggleClass("hidden");
});
+
+ this.setup_mentions();
},
+
refresh: function(scroll_to_end) {
var me = this;
@@ -66,6 +69,7 @@ frappe.ui.form.Comments = Class.extend({
this.frm.sidebar.refresh_comments();
},
+
render_comment: function(c) {
var me = this;
this.prepare_comment(c);
@@ -310,5 +314,155 @@ frappe.ui.form.Comments = Class.extend({
});
return last_email;
+ },
+
+ setup_mentions: function() {
+ var me = this;
+
+ this.cursor_from = this.cursor_to = 0
+ this.codes = $.ui.keyCode;
+ this.up = $.Event("keydown", {"keyCode": this.codes.UP});
+ this.down = $.Event("keydown", {"keyCode": this.codes.DOWN});
+ this.enter = $.Event("keydown", {"keyCode": this.codes.ENTER});
+
+ this.setup_autocomplete_for_mentions();
+
+ this.setup_textarea_event();
+ },
+
+ setup_autocomplete_for_mentions: function() {
+ var me = this;
+
+ var username_user_map = {};
+ for (var name in frappe.boot.user_info) {
+ var _user = frappe.boot.user_info[name];
+ username_user_map[_user.username] = _user;
+ }
+
+ this.mention_input = this.wrapper.find(".mention-input");
+
+ this.mention_input.autocomplete({
+ minLength: 0,
+ autoFocus: true,
+ source: Object.keys(username_user_map),
+ select: function(event, ui) {
+ var value = ui.item.value;
+ var textarea_value = me.input.val();
+
+ var new_value = textarea_value.substring(0, me.cursor_from)
+ + value
+ + textarea_value.substring(me.cursor_to);
+
+ me.input.val(new_value);
+
+ var new_cursor_location = me.cursor_from + value.length;
+
+ // move cursor to right position
+ if (me.input[0].setSelectionRange) {
+ me.input.focus();
+ me.input[0].setSelectionRange(new_cursor_location, new_cursor_location);
+
+ } else if (me.input[0].createTextRange) {
+ var range = input[0].createTextRange();
+ range.collapse(true);
+ range.moveEnd('character', new_cursor_location);
+ range.moveStart('character', new_cursor_location);
+ range.select();
+
+ } else {
+ me.input.focus();
+ }
+ }
+ });
+
+ this.mention_widget = this.mention_input.autocomplete("widget");
+
+ this.autocomplete_open = false;
+ this.mention_input
+ .on('autocompleteclose', function() {
+ me.autocomplete_open = false;
+ })
+ .on('autocompleteopen', function() {
+ me.autocomplete_open = true;
+ });
+
+ // dirty hack to prevent backspace from navigating back to history
+ $(document).on("keydown", function(e) {
+ if (e.which===me.codes.BACKSPACE && me.autocomplete_open && document.activeElement==me.mention_widget.get(0)) {
+ // me.input.focus();
+
+ return false;
+ }
+ });
+ },
+
+ setup_textarea_event: function() {
+ var me = this;
+
+ // binding this in keyup to get the value after it is set in textarea
+ this.input.keyup(function(e) {
+ if (e.which===16) {
+ // don't trigger for shift
+ return;
+
+ } else if ([me.codes.UP, me.codes.DOWN].indexOf(e.which)!==-1) {
+ // focus on autocomplete if up and down arrows
+ if (me.autocomplete_open) {
+ me.mention_widget.focus();
+ me.mention_widget.trigger(e.which===me.codes.UP ? me.up : me.down);
+ }
+ return;
+
+ } else if ([me.codes.ENTER, me.codes.ESCAPE, me.codes.TAB, me.codes.SPACE].indexOf(e.which)!==-1) {
+ me.mention_input.autocomplete("close");
+ return;
+
+ } else if (e.which !== 0 && !e.ctrlKey && !e.metaKey && !e.altKey) {
+ if(!String.fromCharCode(e.which)) {
+ // no point in parsing it if it is not a character key
+ return;
+ }
+ }
+
+ var value = $(this).val() || "";
+ var i = e.target.selectionStart;
+ var key = value[i-1];
+ var substring = value.substring(0, i);
+ var mention = substring.match(/(?=[^\w]|^)@([\w]*)$/);
+
+ if (mention && mention.length) {
+ var mention = mention[0].slice(1);
+
+ // record location of cursor
+ me.cursor_from = i - mention.length;
+ me.cursor_to = i;
+
+ // render autocomplete at the bottom of the textbox and search for mention
+ me.mention_input.autocomplete("option", "position", {
+ of: me.input,
+ my: "left top",
+ at: "left bottom"
+ });
+ me.mention_input.autocomplete("search", mention);
+
+ } else {
+ me.cursor_from = me.cursor_to = 0;
+ me.mention_input.autocomplete("close");
+ }
+ });
+
+ // binding this in keydown to prevent default action
+ this.input.keydown(function(e) {
+ // enter, escape, tab
+ if (me.autocomplete_open) {
+ if ([me.codes.ENTER, me.codes.TAB].indexOf(e.which)!==-1) {
+ // set focused value
+ me.mention_widget.trigger(me.enter);
+
+ // prevent default
+ return false;
+ }
+ }
+ });
}
});
diff --git a/frappe/templates/emails/mentioned_in_comment.html b/frappe/templates/emails/mentioned_in_comment.html
new file mode 100644
index 0000000000..2e84e6b847
--- /dev/null
+++ b/frappe/templates/emails/mentioned_in_comment.html
@@ -0,0 +1,7 @@
+
+ {{ _("{0} mentioned you in a comment in {1}").format(sender_fullname, link) }}
+
+
+ {{ comment.comment | markdown }}
+