Skip to content

Commit 407f069

Browse files
committed
fix bug: Can not autofocus after click the at-list in FireFox. ichord#95
1 parent 917f033 commit 407f069

File tree

5 files changed

+52
-30
lines changed

5 files changed

+52
-30
lines changed

dist/js/jquery.atwho.js

Lines changed: 22 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -88,8 +88,11 @@
8888

8989
offset = null;
9090
if (window.getSelection && (range = this.range())) {
91+
if (range.endOffset - 1 < 0) {
92+
return null;
93+
}
9194
clonedRange = range.cloneRange();
92-
clonedRange.setStart(range.endContainer, Math.max(1, range.endOffset) - 1);
95+
clonedRange.setStart(range.endContainer, range.endOffset - 1);
9396
clonedRange.setEnd(range.endContainer, range.endOffset);
9497
rect = clonedRange.getBoundingClientRect();
9598
offset = {
@@ -563,7 +566,9 @@
563566

564567
Controller.prototype.rect = function() {
565568
var c, scale_bottom;
566-
c = this.$inputor.caret('offset', this.pos - 1);
569+
if (!(c = this.$inputor.caret('offset', this.pos - 1))) {
570+
return;
571+
}
567572
if (this.$inputor.attr('contentEditable') === 'true') {
568573
c = (this.cur_rect || (this.cur_rect = c)) || c;
569574
}
@@ -612,12 +617,16 @@
612617
};
613618

614619
Controller.prototype.insert = function(content, $li) {
615-
var $inputor, $insert_node, pos, range, sel, source, start_str, text;
620+
var $inputor, $insert_node, class_name, content_node, insert_node, pos, range, sel, source, start_str, text;
616621
$inputor = this.$inputor;
617622
if ($inputor.attr('contentEditable') === 'true') {
618-
$insert_node = $("<span contenteditable='false' " + ("class='atwho-view-flag atwho-view-flag-" + (this.get_opt('alias') || this.at) + "'>") + ("" + content + "&nbsp;</span>"));
619-
$insert_node.data('atwho-data-item', $li.data('item-data'));
620-
$insert_node = $("<span contentEditable='true'></span>").html($insert_node);
623+
class_name = "atwho-view-flag atwho-view-flag-" + (this.get_opt('alias') || this.at);
624+
content_node = "" + content + "<span contenteditable='false'>&nbsp;<span>";
625+
insert_node = "<span contenteditable='false' class='" + class_name + "'>" + content_node + "</span>";
626+
$insert_node = $(insert_node).data('atwho-data-item', $li.data('item-data'));
627+
if (document.selection) {
628+
$insert_node = $("<span contenteditable='true'></span>").html($insert_node);
629+
}
621630
}
622631
if ($inputor.is('textarea, input')) {
623632
content = '' + content;
@@ -642,6 +651,7 @@
642651
range.collapse(false);
643652
range.select();
644653
}
654+
$inputor.focus();
645655
return $inputor.change();
646656
};
647657

@@ -772,9 +782,8 @@
772782
return this.hide();
773783
};
774784

775-
View.prototype.reposition = function() {
776-
var offset, rect;
777-
rect = this.context.rect();
785+
View.prototype.reposition = function(rect) {
786+
var offset;
778787
if (rect.bottom + this.$el.height() - $(window).scrollTop() > $(window).height()) {
779788
rect.bottom = rect.top - this.$el.height();
780789
}
@@ -807,10 +816,13 @@
807816
};
808817

809818
View.prototype.show = function() {
819+
var rect;
810820
if (!this.visible()) {
811821
this.$el.show();
812822
}
813-
return this.reposition();
823+
if (rect = this.context.rect()) {
824+
return this.reposition(rect);
825+
}
814826
};
815827

816828
View.prototype.hide = function(time) {

dist/js/jquery.atwho.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

example.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@
3535
$('.inputor').atwho('run').atwho({
3636
at: "@",
3737
alias: "at-mentions",
38-
// tpl: "<li data-value='@${name}'>${name} <small>${name}</small></li>",
38+
// tpl: "<li data-value='${name}'>${name} <small>${name}</small></li>",
3939
// max_len: 3,
4040
// 'data':data,
4141
'callbacks': {

src/jquery.atwho.coffee

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -191,7 +191,7 @@
191191
#
192192
# @return [Hash] the offset which look likes this: {top: y, left: x, bottom: bottom}
193193
rect: ->
194-
c = @$inputor.caret('offset', @pos - 1)
194+
return if not c = @$inputor.caret('offset', @pos - 1)
195195
c = (@cur_rect ||= c) || c if @$inputor.attr('contentEditable') == 'true'
196196
scale_bottom = if document.selection then 0 else 2
197197
{left: c.left, top: c.top, bottom: c.top + c.height + scale_bottom}
@@ -227,11 +227,12 @@
227227
$inputor = @$inputor
228228

229229
if $inputor.attr('contentEditable') == 'true'
230-
$insert_node = $("<span contenteditable='false' " \
231-
+ "class='atwho-view-flag atwho-view-flag-#{this.get_opt('alias') || @at}'>" \
232-
+ "#{content}&nbsp;</span>")
233-
$insert_node.data('atwho-data-item', $li.data('item-data'))
234-
$insert_node = $("<span contentEditable='true'></span>").html($insert_node)
230+
class_name = "atwho-view-flag atwho-view-flag-#{this.get_opt('alias') || @at}"
231+
content_node = "#{content}<span contenteditable='false'>&nbsp;<span>"
232+
insert_node = "<span contenteditable='false' class='#{class_name}'>#{content_node}</span>"
233+
$insert_node = $(insert_node).data('atwho-data-item', $li.data('item-data'))
234+
if document.selection
235+
$insert_node = $("<span contenteditable='true'></span>").html($insert_node)
235236

236237
if $inputor.is('textarea, input')
237238
# ensure str is str.
@@ -260,6 +261,7 @@
260261
range.pasteHTML($insert_node[0])
261262
range.collapse(false)
262263
range.select()
264+
$inputor.focus()
263265
$inputor.change()
264266

265267
# Render list view
@@ -372,8 +374,7 @@
372374
@context.trigger "inserted", [$li]
373375
this.hide()
374376

375-
reposition: ->
376-
rect = @context.rect()
377+
reposition: (rect) ->
377378
if rect.bottom + @$el.height() - $(window).scrollTop() > $(window).height()
378379
rect.bottom = rect.top - @$el.height()
379380
offset = {left:rect.left, top:rect.bottom}
@@ -394,7 +395,7 @@
394395

395396
show: ->
396397
@$el.show() if not this.visible()
397-
this.reposition()
398+
this.reposition(rect) if rect = @context.rect()
398399

399400
hide: (time) ->
400401
if isNaN time and this.visible()

src/jquery.atwho.js

Lines changed: 18 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -218,7 +218,9 @@
218218

219219
Controller.prototype.rect = function() {
220220
var c, scale_bottom;
221-
c = this.$inputor.caret('offset', this.pos - 1);
221+
if (!(c = this.$inputor.caret('offset', this.pos - 1))) {
222+
return;
223+
}
222224
if (this.$inputor.attr('contentEditable') === 'true') {
223225
c = (this.cur_rect || (this.cur_rect = c)) || c;
224226
}
@@ -267,12 +269,16 @@
267269
};
268270

269271
Controller.prototype.insert = function(content, $li) {
270-
var $inputor, $insert_node, pos, range, sel, source, start_str, text;
272+
var $inputor, $insert_node, class_name, content_node, insert_node, pos, range, sel, source, start_str, text;
271273
$inputor = this.$inputor;
272274
if ($inputor.attr('contentEditable') === 'true') {
273-
$insert_node = $("<span contenteditable='false' " + ("class='atwho-view-flag atwho-view-flag-" + (this.get_opt('alias') || this.at) + "'>") + ("" + content + "&nbsp;</span>"));
274-
$insert_node.data('atwho-data-item', $li.data('item-data'));
275-
$insert_node = $("<span contentEditable='true'></span>").html($insert_node);
275+
class_name = "atwho-view-flag atwho-view-flag-" + (this.get_opt('alias') || this.at);
276+
content_node = "" + content + "<span contenteditable='false'>&nbsp;<span>";
277+
insert_node = "<span contenteditable='false' class='" + class_name + "'>" + content_node + "</span>";
278+
$insert_node = $(insert_node).data('atwho-data-item', $li.data('item-data'));
279+
if (document.selection) {
280+
$insert_node = $("<span contenteditable='true'></span>").html($insert_node);
281+
}
276282
}
277283
if ($inputor.is('textarea, input')) {
278284
content = '' + content;
@@ -297,6 +303,7 @@
297303
range.collapse(false);
298304
range.select();
299305
}
306+
$inputor.focus();
300307
return $inputor.change();
301308
};
302309

@@ -427,9 +434,8 @@
427434
return this.hide();
428435
};
429436

430-
View.prototype.reposition = function() {
431-
var offset, rect;
432-
rect = this.context.rect();
437+
View.prototype.reposition = function(rect) {
438+
var offset;
433439
if (rect.bottom + this.$el.height() - $(window).scrollTop() > $(window).height()) {
434440
rect.bottom = rect.top - this.$el.height();
435441
}
@@ -462,10 +468,13 @@
462468
};
463469

464470
View.prototype.show = function() {
471+
var rect;
465472
if (!this.visible()) {
466473
this.$el.show();
467474
}
468-
return this.reposition();
475+
if (rect = this.context.rect()) {
476+
return this.reposition(rect);
477+
}
469478
};
470479

471480
View.prototype.hide = function(time) {

0 commit comments

Comments
 (0)