jquery-atwho-rails 0.3.3 → 0.4.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: f23f3dd69a13e3d32ba15c24cf482ae50f7c25de
-  data.tar.gz: 515be810af285936cdb4bf39a92f6a0c9b831f96
+  metadata.gz: ee0d4a6e119e2f77127b810901f3572f95cf1d62
+  data.tar.gz: 02c7cea94f2a89ff6eff5ffdeb74eb57b3dc1c64
 SHA512:
-  metadata.gz: b65e6355e267e761c7235fafcff88510a3fa3e7453fb40be0d726351875bcbe7ac6805a268172af0af53412939b99c5421d227df286c455ad9ff410467109af1
-  data.tar.gz: 93d434497c9da9508767bf21bf7c1fe673f869f1e25abfc35ce1d3426d732499273c3d96467887d55fedb1d15341a6131e1e725a9e33757f6af38b7e9ab04a09
+  metadata.gz: 37fb91bd4a88c5dae9c152eda4cedf20be7270b3a567581e51e510f791b4c44cae23c53a42c502a1342f8f89ff13b67a3a035780689b3e28caf20a4a56e2e64e
+  data.tar.gz: b65c453e756f540f774b5cc32e6d9ef9b9c402852fbb3528432c1f2ada50a89ef154e648552a36d0bb2204144cd5855ecd8b42519f75f89f573d4880c75c8f89

data/lib/assets/javascripts/jquery.atwho.js

@@ -24,110 +24,196 @@
     }
   })(function($) {
     "use strict";
-    var Caret, Mirror, methods, pluginName;
+    var EditableCaret, InputCaret, Mirror, Utils, methods, pluginName;
 
     pluginName = 'caret';
-    Caret = (function() {
-      function Caret($inputor) {
+    EditableCaret = (function() {
+      function EditableCaret($inputor) {
         this.$inputor = $inputor;
         this.domInputor = this.$inputor[0];
       }
 
-      Caret.prototype.getPos = function() {
-        var end, endRange, inputor, len, normalizedValue, pos, range, start, textInputRange;
+      EditableCaret.prototype.setPos = function(pos) {
+        return this.domInputor;
+      };
 
-        inputor = this.domInputor;
-        inputor.focus();
-        if (document.selection) {
-          /*
-          #assume we select "HATE" in the inputor such as textarea -> { }.
-           *               start end-point.
-           *              /
-           * <  I really [HATE] IE   > between the brackets is the selection range.
-           *                   \
-           *                    end end-point.
-          */
+      EditableCaret.prototype.getIEPosition = function() {
+        return $.noop();
+      };
 
-          range = document.selection.createRange();
-          pos = 0;
-          if (range && range.parentElement() === inputor) {
-            normalizedValue = inputor.value.replace(/\r\n/g, "\n");
-            /* SOMETIME !!!
-             "/r/n" is counted as two char.
-              one line is two, two will be four. balalala.
-              so we have to using the normalized one's length.;
-            */
-
-            len = normalizedValue.length;
-            /*
-               <[  I really HATE IE   ]>:
-                the whole content in the inputor will be the textInputRange.
-            */
-
-            textInputRange = inputor.createTextRange();
-            /*                 _here must be the position of bookmark.
-                             /
-               <[  I really [HATE] IE   ]>
-                [---------->[           ] : this is what moveToBookmark do.
-               <   I really [[HATE] IE   ]> : here is result.
-                              \ two brackets in should be in line.
-            */
-
-            textInputRange.moveToBookmark(range.getBookmark());
-            endRange = inputor.createTextRange();
-            /*  [--------------------->[] : if set false all end-point goto end.
-              <  I really [[HATE] IE  []]>
-            */
-
-            endRange.collapse(false);
-            /*
-                            ___VS____
-                           /         \
-             <   I really [[HATE] IE []]>
-                                      \_endRange end-point.
-            
-            " > -1" mean the start end-point will be the same or right to the end end-point
-                     * simplelly, all in the end.
-            */
-
-            if (textInputRange.compareEndPoints("StartToEnd", endRange) > -1) {
-              start = end = len;
-            } else {
-              /*
-                      I really |HATE] IE   ]>
-                             <-|
-                    I really[ [HATE] IE   ]>
-                          <-[
-                  I reall[y  [HATE] IE   ]>
-              
-                will return how many unit have moved.
-              */
-
-              start = -textInputRange.moveStart("character", -len);
-              end = -textInputRange.moveEnd("character", -len);
-            }
+      EditableCaret.prototype.getPosition = function() {
+        return $.noop();
+      };
+
+      EditableCaret.prototype.getOldIEPos = function() {
+        var preCaretTextRange, textRange;
+
+        textRange = document.selection.createRange();
+        preCaretTextRange = document.body.createTextRange();
+        preCaretTextRange.moveToElementText(this.domInputor);
+        preCaretTextRange.setEndPoint("EndToEnd", textRange);
+        return preCaretTextRange.text.length;
+      };
+
+      EditableCaret.prototype.getPos = function() {
+        var clonedRange, pos, range;
+
+        if (range = this.range()) {
+          clonedRange = range.cloneRange();
+          clonedRange.selectNodeContents(this.domInputor);
+          clonedRange.setEnd(range.endContainer, range.endOffset);
+          pos = clonedRange.toString().length;
+          clonedRange.detach();
+          return pos;
+        } else if (document.selection) {
+          return this.getOldIEPos();
+        }
+      };
+
+      EditableCaret.prototype.getOldIEOffset = function() {
+        var range, rect;
+
+        range = document.selection.createRange().duplicate();
+        range.moveStart("character", -1);
+        rect = range.getBoundingClientRect();
+        return {
+          height: rect.bottom - rect.top,
+          left: rect.left,
+          top: rect.top
+        };
+      };
+
+      EditableCaret.prototype.getOffset = function(pos) {
+        var clonedRange, offset, range, rect;
+
+        offset = null;
+        if (window.getSelection && (range = this.range())) {
+          if (range.endOffset - 1 < 0) {
+            return null;
+          }
+          clonedRange = range.cloneRange();
+          clonedRange.setStart(range.endContainer, range.endOffset - 1);
+          clonedRange.setEnd(range.endContainer, range.endOffset);
+          rect = clonedRange.getBoundingClientRect();
+          offset = {
+            height: rect.height,
+            left: rect.left + rect.width,
+            top: rect.top
+          };
+          clonedRange.detach();
+          offset;
+        } else if (document.selection) {
+          this.getOldIEOffset();
+        }
+        return Utils.adjustOffset(offset, this.$inputor);
+      };
+
+      EditableCaret.prototype.range = function() {
+        var sel;
+
+        if (!window.getSelection) {
+          return;
+        }
+        sel = window.getSelection();
+        if (sel.rangeCount > 0) {
+          return sel.getRangeAt(0);
+        } else {
+          return null;
+        }
+      };
+
+      return EditableCaret;
+
+    })();
+    InputCaret = (function() {
+      function InputCaret($inputor) {
+        this.$inputor = $inputor;
+        this.domInputor = this.$inputor[0];
+      }
+
+      InputCaret.prototype.getIEPos = function() {
+        var endRange, inputor, len, normalizedValue, pos, range, textInputRange;
+
+        inputor = this.domInputor;
+        range = document.selection.createRange();
+        pos = 0;
+        if (range && range.parentElement() === inputor) {
+          normalizedValue = inputor.value.replace(/\r\n/g, "\n");
+          len = normalizedValue.length;
+          textInputRange = inputor.createTextRange();
+          textInputRange.moveToBookmark(range.getBookmark());
+          endRange = inputor.createTextRange();
+          endRange.collapse(false);
+          if (textInputRange.compareEndPoints("StartToEnd", endRange) > -1) {
+            pos = len;
+          } else {
+            pos = -textInputRange.moveStart("character", -len);
           }
+        }
+        return pos;
+      };
+
+      InputCaret.prototype.getPos = function() {
+        if (document.selection) {
+          return this.getIEPos();
         } else {
-          start = inputor.selectionStart;
+          return this.domInputor.selectionStart;
         }
-        return start;
       };
 
-      Caret.prototype.setPos = function(pos) {
+      InputCaret.prototype.setPos = function(pos) {
         var inputor, range;
 
         inputor = this.domInputor;
         if (document.selection) {
           range = inputor.createTextRange();
           range.move("character", pos);
-          return range.select();
+          range.select();
+        } else if (inputor.setSelectionRange) {
+          inputor.setSelectionRange(pos, pos);
+        }
+        return inputor;
+      };
+
+      InputCaret.prototype.getIEOffset = function(pos) {
+        var h, range, textRange, x, y;
+
+        textRange = this.domInputor.createTextRange();
+        if (pos) {
+          textRange.move('character', pos);
+        } else {
+          range = document.selection.createRange();
+          textRange.moveToBookmark(range.getBookmark());
+        }
+        x = textRange.boundingLeft;
+        y = textRange.boundingTop;
+        h = textRange.boundingHeight;
+        return {
+          left: x,
+          top: y,
+          height: h
+        };
+      };
+
+      InputCaret.prototype.getOffset = function(pos) {
+        var $inputor, offset, position;
+
+        $inputor = this.$inputor;
+        if (document.selection) {
+          return Utils.adjustOffset(this.getIEOffset(pos), $inputor);
         } else {
-          return inputor.setSelectionRange(pos, pos);
+          offset = $inputor.offset();
+          position = this.getPosition(pos);
+          return offset = {
+            left: offset.left + position.left,
+            top: offset.top + position.top,
+            height: position.height
+          };
         }
       };
 
-      Caret.prototype.getPosition = function(pos) {
-        var $inputor, at_rect, format, h, html, mirror, start_range, x, y;
+      InputCaret.prototype.getPosition = function(pos) {
+        var $inputor, at_rect, format, html, mirror, start_range;
 
         $inputor = this.$inputor;
         format = function(value) {
@@ -140,34 +226,10 @@
         html = "<span>" + format(start_range) + "</span>";
         html += "<span id='caret'>|</span>";
         mirror = new Mirror($inputor);
-        at_rect = mirror.create(html).rect();
-        x = at_rect.left - $inputor.scrollLeft();
-        y = at_rect.top - $inputor.scrollTop();
-        h = at_rect.height;
-        return {
-          left: x,
-          top: y,
-          height: h
-        };
-      };
-
-      Caret.prototype.getOffset = function(pos) {
-        var $inputor, h, offset, position, x, y;
-
-        $inputor = this.$inputor;
-        offset = $inputor.offset();
-        position = this.getPosition(pos);
-        x = offset.left + position.left;
-        y = offset.top + position.top;
-        h = position.height;
-        return {
-          left: x,
-          top: y,
-          height: h
-        };
+        return at_rect = mirror.create(html).rect();
       };
 
-      Caret.prototype.getIEPosition = function(pos) {
+      InputCaret.prototype.getIEPosition = function(pos) {
         var h, inputorOffset, offset, x, y;
 
         offset = this.getIEOffset(pos);
@@ -182,27 +244,7 @@
         };
       };
 
-      Caret.prototype.getIEOffset = function(pos) {
-        var h, range, textRange, x, y;
-
-        textRange = this.domInputor.createTextRange();
-        if (pos) {
-          textRange.move('character', pos);
-        } else {
-          range = document.selection.createRange();
-          textRange.moveToBookmark(range.getBookmark());
-        }
-        x = textRange.boundingLeft + this.$inputor.scrollLeft();
-        y = textRange.boundingTop + $(window).scrollTop() + this.$inputor.scrollTop();
-        h = textRange.boundingHeight;
-        return {
-          left: x,
-          top: y,
-          height: h
-        };
-      };
-
-      return Caret;
+      return InputCaret;
 
     })();
     Mirror = (function() {
@@ -254,6 +296,19 @@
       return Mirror;
 
     })();
+    Utils = {
+      adjustOffset: function(offset, $inputor) {
+        if (!offset) {
+          return;
+        }
+        offset.top += $(window).scrollTop() + $inputor.scrollTop();
+        offset.left += +$(window).scrollLeft() + $inputor.scrollLeft();
+        return offset;
+      },
+      contentEditable: function($inputor) {
+        return !!($inputor[0].contentEditable && $inputor[0].contentEditable === 'true');
+      }
+    };
     methods = {
       pos: function(pos) {
         if (pos) {
@@ -270,23 +325,23 @@
         }
       },
       offset: function(pos) {
-        if (document.selection) {
-          return this.getIEOffset(pos);
-        } else {
-          return this.getOffset(pos);
-        }
+        return this.getOffset(pos);
       }
     };
-    return $.fn.caret = function(method) {
+    $.fn.caret = function(method) {
       var caret;
 
-      caret = new Caret(this);
+      caret = Utils.contentEditable(this) ? new EditableCaret(this) : new InputCaret(this);
       if (methods[method]) {
         return methods[method].apply(caret, Array.prototype.slice.call(arguments, 1));
       } else {
         return $.error("Method " + method + " does not exist on jQuery.caret");
       }
     };
+    $.fn.caret.EditableCaret = EditableCaret;
+    $.fn.caret.InputCaret = InputCaret;
+    $.fn.caret.Utils = Utils;
+    return $.fn.caret.apis = methods;
   });
 
 }).call(this);
@@ -311,7 +366,7 @@
       return factory(window.jQuery);
     }
   })(function($) {
-    var $CONTAINER, Api, App, Controller, DEFAULT_CALLBACKS, DEFAULT_TPL, KEY_CODE, Model, View;
+    var $CONTAINER, Api, App, Atwho, Controller, DEFAULT_CALLBACKS, KEY_CODE, Model, View;
     App = (function() {
 
       function App(inputor) {
@@ -321,12 +376,12 @@
         this.listen();
       }
 
-      App.prototype.controller = function(key) {
-        return this.controllers[key || this.current_flag];
+      App.prototype.controller = function(at) {
+        return this.controllers[at || this.current_flag];
       };
 
-      App.prototype.set_context_for = function(key) {
-        this.current_flag = key;
+      App.prototype.set_context_for = function(at) {
+        this.current_flag = at;
         return this;
       };
 
@@ -361,7 +416,7 @@
         var _this = this;
         return $.map(this.controllers, function(c) {
           if (c.look_up()) {
-            return _this.set_context_for(c.key);
+            return _this.set_context_for(c.at);
           }
         });
       };
@@ -428,14 +483,16 @@
         return _uuid += 1;
       };
 
-      function Controller(app, key) {
+      function Controller(app, at) {
         this.app = app;
-        this.key = key;
+        this.at = at;
         this.$inputor = this.app.$inputor;
         this.id = this.$inputor[0].id || uuid();
         this.setting = null;
         this.query = null;
         this.pos = 0;
+        this.cur_rect = null;
+        this.range = null;
         $CONTAINER.append(this.$el = $("<div id='atwho-ground-" + this.id + "'></div>"));
         this.model = new Model(this);
         this.view = new View(this);
@@ -443,6 +500,7 @@
 
       Controller.prototype.init = function(setting) {
         this.setting = $.extend({}, this.setting || $.fn.atwho["default"], setting);
+        this.view.init();
         return this.model.reload(this.setting.data);
       };
 
@@ -468,20 +526,28 @@
         return this.get_opt("callbacks")[func_name] || DEFAULT_CALLBACKS[func_name];
       };
 
-      Controller.prototype.get_opt = function(key, default_value) {
+      Controller.prototype.get_opt = function(at, default_value) {
         try {
-          return this.setting[key];
+          return this.setting[at];
         } catch (e) {
           return null;
         }
       };
 
+      Controller.prototype.content = function() {
+        if (this.$inputor.is('textarea, input')) {
+          return this.$inputor.val();
+        } else {
+          return this.$inputor.text();
+        }
+      };
+
       Controller.prototype.catch_query = function() {
         var caret_pos, content, end, query, start, subtext;
-        content = this.$inputor.val();
+        content = this.content();
         caret_pos = this.$inputor.caret('pos');
         subtext = content.slice(0, caret_pos);
-        query = this.callbacks("matcher").call(this, this.key, subtext, this.get_opt('start_with_space'));
+        query = this.callbacks("matcher").call(this, this.at, subtext, this.get_opt('start_with_space'));
         if (typeof query === "string" && query.length <= this.get_opt('max_len', 20)) {
           start = caret_pos - query.length;
           end = start + query.length;
@@ -491,7 +557,7 @@
             'head_pos': start,
             'end_pos': end
           };
-          this.trigger("matched", [this.key, query.text]);
+          this.trigger("matched", [this.at, query.text]);
         } else {
           this.view.hide();
         }
@@ -500,7 +566,12 @@
 
       Controller.prototype.rect = function() {
         var c, scale_bottom;
-        c = this.$inputor.caret('offset', this.pos - 1);
+        if (!(c = this.$inputor.caret('offset', this.pos - 1))) {
+          return;
+        }
+        if (this.$inputor.attr('contentEditable') === 'true') {
+          c = (this.cur_rect || (this.cur_rect = c)) || c;
+        }
         scale_bottom = document.selection ? 0 : 2;
         return {
           left: c.left,
@@ -509,15 +580,78 @@
         };
       };
 
-      Controller.prototype.insert = function(str) {
-        var $inputor, source, start_str, text;
+      Controller.prototype.reset_rect = function() {
+        if (this.$inputor.attr('contentEditable') === 'true') {
+          return this.cur_rect = null;
+        }
+      };
+
+      Controller.prototype.mark_range = function() {
+        return this.range = this.get_range() || this.get_ie_range();
+      };
+
+      Controller.prototype.clear_range = function() {
+        return this.range = null;
+      };
+
+      Controller.prototype.get_range = function() {
+        return this.range || (window.getSelection ? window.getSelection().getRangeAt(0) : void 0);
+      };
+
+      Controller.prototype.get_ie_range = function() {
+        return this.range || (document.selection ? document.selection.createRange() : void 0);
+      };
+
+      Controller.prototype.insert_content_for = function($li) {
+        var data, data_value, tpl;
+        data_value = $li.data('value');
+        tpl = this.get_opt('insert_tpl');
+        if (this.$inputor.is('textarea, input') || !tpl) {
+          return data_value;
+        }
+        data = $.extend({}, $li.data('item-data'), {
+          'atwho-data-value': data_value,
+          'atwho-at': this.at
+        });
+        return this.callbacks("tpl_eval").call(this, tpl, data);
+      };
+
+      Controller.prototype.insert = function(content, $li) {
+        var $inputor, $insert_node, class_name, content_node, insert_node, pos, range, sel, source, start_str, text;
         $inputor = this.$inputor;
-        str = '' + str;
-        source = $inputor.val();
-        start_str = source.slice(0, this.query['head_pos'] || 0);
-        text = "" + start_str + str + " " + (source.slice(this.query['end_pos'] || 0));
-        $inputor.val(text);
-        $inputor.caret('pos', start_str.length + str.length + 1);
+        if ($inputor.attr('contentEditable') === 'true') {
+          class_name = "atwho-view-flag atwho-view-flag-" + (this.get_opt('alias') || this.at);
+          content_node = "" + content + "<span contenteditable='false'>&nbsp;<span>";
+          insert_node = "<span contenteditable='false' class='" + class_name + "'>" + content_node + "</span>";
+          $insert_node = $(insert_node).data('atwho-data-item', $li.data('item-data'));
+          if (document.selection) {
+            $insert_node = $("<span contenteditable='true'></span>").html($insert_node);
+          }
+        }
+        if ($inputor.is('textarea, input')) {
+          content = '' + content;
+          source = $inputor.val();
+          start_str = source.slice(0, Math.max(this.query.head_pos - this.at.length, 0));
+          text = "" + start_str + content + " " + (source.slice(this.query['end_pos'] || 0));
+          $inputor.val(text);
+          $inputor.caret('pos', start_str.length + content.length + 1);
+        } else if (range = this.get_range()) {
+          pos = range.startOffset - (this.query.end_pos - this.query.head_pos) - this.at.length;
+          range.setStart(range.endContainer, Math.max(pos, 0));
+          range.setEnd(range.endContainer, range.endOffset);
+          range.deleteContents();
+          range.insertNode($insert_node[0]);
+          range.collapse(false);
+          sel = window.getSelection();
+          sel.removeAllRanges();
+          sel.addRange(range);
+        } else if (range = this.get_ie_range()) {
+          range.moveStart('character', this.query.end_pos - this.query.head_pos - this.at.length);
+          range.pasteHTML($insert_node[0]);
+          range.collapse(false);
+          range.select();
+        }
+        $inputor.focus();
         return $inputor.change();
       };
 
@@ -554,7 +688,7 @@
 
       function Model(context) {
         this.context = context;
-        this.key = this.context.key;
+        this.at = this.context.at;
       }
 
       Model.prototype.saved = function() {
@@ -572,11 +706,11 @@
       };
 
       Model.prototype.fetch = function() {
-        return _storage[this.key] || [];
+        return _storage[this.at] || [];
       };
 
       Model.prototype.save = function(data) {
-        return _storage[this.key] = this.context.callbacks("before_save").call(this.context, data || []);
+        return _storage[this.at] = this.context.callbacks("before_save").call(this.context, data || []);
       };
 
       Model.prototype.load = function(data) {
@@ -609,25 +743,36 @@
 
       function View(context) {
         this.context = context;
-        this.key = this.context.key;
-        this.id = this.context.get_opt("alias") || ("at-view-" + (this.key.charCodeAt(0)));
-        this.$el = $("<div id='" + this.id + "' class='atwho-view'><ul id='" + this.id + "-ul' class='atwho-view-url'></ul></div>");
+        this.$el = $("<div class='atwho-view'><ul class='atwho-view-ul'></ul></div>");
         this.timeout_id = null;
         this.context.$el.append(this.$el);
         this.bind_event();
       }
 
+      View.prototype.init = function() {
+        var id;
+        id = this.context.get_opt("alias") || this.context.at.charCodeAt(0);
+        return this.$el.attr({
+          'id': "at-view-" + id
+        });
+      };
+
       View.prototype.bind_event = function() {
         var $menu,
           _this = this;
         $menu = this.$el.find('ul');
-        return $menu.on('mouseenter.view', 'li', function(e) {
+        $menu.on('mouseenter.atwho-view', 'li', function(e) {
           $menu.find('.cur').removeClass('cur');
           return $(e.currentTarget).addClass('cur');
         }).on('click', function(e) {
           _this.choose();
           return e.preventDefault();
         });
+        return this.$el.on('mouseenter.atwho-view', 'ul', function(e) {
+          return _this.context.mark_range();
+        }).on('mouseleave.atwho-view', 'ul', function(e) {
+          return _this.context.clear_range();
+        });
       };
 
       View.prototype.visible = function() {
@@ -635,16 +780,16 @@
       };
 
       View.prototype.choose = function() {
-        var $li;
+        var $li, content;
         $li = this.$el.find(".cur");
-        this.context.insert(this.context.callbacks("before_insert").call(this.context, $li.data("value"), $li));
+        content = this.context.insert_content_for($li);
+        this.context.insert(this.context.callbacks("before_insert").call(this.context, content, $li), $li);
         this.context.trigger("inserted", [$li]);
         return this.hide();
       };
 
-      View.prototype.reposition = function() {
-        var offset, rect;
-        rect = this.context.rect();
+      View.prototype.reposition = function(rect) {
+        var offset;
         if (rect.bottom + this.$el.height() - $(window).scrollTop() > $(window).height()) {
           rect.bottom = rect.top - this.$el.height();
         }
@@ -677,16 +822,20 @@
       };
 
       View.prototype.show = function() {
+        var rect;
         if (!this.visible()) {
           this.$el.show();
         }
-        return this.reposition();
+        if (rect = this.context.rect()) {
+          return this.reposition(rect);
+        }
       };
 
       View.prototype.hide = function(time) {
         var callback,
           _this = this;
         if (isNaN(time && this.visible())) {
+          this.context.reset_rect();
           return this.$el.hide();
         } else {
           callback = function() {
@@ -705,12 +854,15 @@
         }
         this.$el.find('ul').empty();
         $ul = this.$el.find('ul');
-        tpl = this.context.get_opt('tpl', DEFAULT_TPL);
+        tpl = this.context.get_opt('tpl');
         for (_i = 0, _len = list.length; _i < _len; _i++) {
           item = list[_i];
+          item = $.extend({}, item, {
+            'atwho-at': this.context.at
+          });
           li = this.context.callbacks("tpl_eval").call(this.context, tpl, item);
           $li = $(this.context.callbacks("highlighter").call(this.context, li, this.context.query.text));
-          $li.data("atwho-info", item);
+          $li.data("item-data", item);
           $ul.append($li);
         }
         this.show();
@@ -812,54 +964,87 @@
         return value;
       }
     };
-    DEFAULT_TPL = "<li data-value='${name}'>${name}</li>";
     Api = {
-      init: function(options) {
-        var $this, app;
-        app = ($this = $(this)).data("atwho");
-        if (!app) {
-          $this.data('atwho', (app = new App(this)));
-        }
-        return app.reg(options.at, options);
-      },
-      load: function(key, data) {
+      load: function(at, data) {
         var c;
-        if (c = this.controller(key)) {
+        if (c = this.controller(at)) {
           return c.model.load(data);
         }
       },
+      getInsertedItemsWithIDs: function(at) {
+        var c, ids, items;
+        if (!(c = this.controller(at))) {
+          return [null, null];
+        }
+        if (at) {
+          at = "-" + (c.get_opt('alias') || c.at);
+        }
+        ids = [];
+        items = $.map(this.$inputor.find("span.atwho-view-flag" + (at || "")), function(item) {
+          var data;
+          data = $(item).data('atwho-data-item');
+          if (ids.indexOf(data.id) > -1) {
+            return;
+          }
+          if (data.id) {
+            ids.push = data.id;
+          }
+          return data;
+        });
+        return [ids, items];
+      },
+      getInsertedItems: function(at) {
+        return Api.getInsertedItemsWithIDs.apply(this, [at])[1];
+      },
+      getInsertedIDs: function(at) {
+        return Api.getInsertedItemsWithIDs.apply(this, [at])[0];
+      },
       run: function() {
         return this.dispatch();
       }
     };
+    Atwho = {
+      init: function(options) {
+        var $this, app;
+        app = ($this = $(this)).data("atwho");
+        if (!app) {
+          $this.data('atwho', (app = new App(this)));
+        }
+        app.reg(options.at, options);
+        return this;
+      }
+    };
     $CONTAINER = $("<div id='atwho-container'></div>");
     $.fn.atwho = function(method) {
-      var _args;
+      var result, _args;
       _args = arguments;
       $('body').append($CONTAINER);
-      return this.filter('textarea, input').each(function() {
+      result = null;
+      this.filter('textarea, input, [contenteditable=true]').each(function() {
         var app;
         if (typeof method === 'object' || !method) {
-          return Api.init.apply(this, _args);
+          return Atwho.init.apply(this, _args);
         } else if (Api[method]) {
           if (app = $(this).data('atwho')) {
-            return Api[method].apply(app, Array.prototype.slice.call(_args, 1));
+            return result = Api[method].apply(app, Array.prototype.slice.call(_args, 1));
           }
         } else {
           return $.error("Method " + method + " does not exist on jQuery.caret");
         }
       });
+      return result || this;
     };
     return $.fn.atwho["default"] = {
       at: void 0,
       alias: void 0,
       data: null,
-      tpl: DEFAULT_TPL,
+      tpl: "<li data-value='${atwho-at}${name}'>${name}</li>",
+      insert_tpl: "<span>${atwho-data-value}</span>",
       callbacks: DEFAULT_CALLBACKS,
       search_key: "name",
+      start_with_space: true,
       limit: 5,
       max_len: 20,
-      start_with_space: true,
       display_timeout: 300
     };
   });

data/lib/jquery-atwho-rails/version.rb

@@ -1,7 +1,7 @@
 module Jquery
   module Atwho
     module Rails
-      VERSION = "0.3.3"
+      VERSION = "0.4.1"
     end
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: jquery-atwho-rails
 version: !ruby/object:Gem::Version
-  version: 0.3.3
+  version: 0.4.1
 platform: ruby
 authors:
 - ichord
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-08-24 00:00:00.000000000 Z
+date: 2013-09-28 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rspec
@@ -87,4 +87,3 @@ summary: 'jquery plugin: @mentions'
 test_files:
 - spec/generators/install_generator_spec.rb
 - spec/spec_helper.rb
-has_rdoc: