jquery-emojiarea-rails 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 8bfbc0275921ae25575c47096eec45a5c97d3203
+  data.tar.gz: d658748fd242fa831353b48626bb3c70ba314cd2
+SHA512:
+  metadata.gz: a5ea60ce6eafba1dec75d403600984a221ca90aa4e816c23f5232d8e44af3476f70757fbbd559a32abcbf44f03c424e63ffc6bdb98b72e69c0e766e421040286
+  data.tar.gz: c542bcccea39e66b71035e6cb50737518f5a27c54dce92bef89cdb5b9b1fae4bb98ab52ef4402fd6ed25584f40780424c2863efa6d39d340c52283b61b2187c9

data/LICENSE.txt

@@ -0,0 +1,22 @@
+Copyright (c) 2017 Lucius Choi
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md

@@ -0,0 +1,76 @@
+# Jquery::Emojiarea::Rails
+
+jquery.emojiarea.js plugin is wrapped with a gem for Rails asset pipeline.
+
+https://github.com/diy/jquery-emojiarea
+
+## Installation
+
+Add this line to your application's Gemfile:
+
+```ruby
+gem 'jquery-emojiarea-rails'
+```
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install jquery-emojiarea-rails
+
+## Usage
+
+`assets/javascripts/application.js` :
+
+```javascript
+...
+
+// alternatively, jquery.emojiarea.min
+//= require jquery.emojiarea    
+//= require packs/basic/emojis
+...
+
+```
+
+`assets/javascripts/emojiarea_init.coffee` ;
+
+```coffee
+$(document).on "turbolinks:load", ->
+  $('.emojiarea').emojiarea
+    wysiwyg: true
+```
+
+
+`assets/stylesheets/application.scss` :
+
+```css
+
+@import 'jquery.emojiarea';
+@import 'emojiarea_init';
+
+```
+
+`_form.html.erb` :
+
+```rb
+<%= simple_form_for @message, remote: true do | f | %>
+  <%= f.input :content, as: :text, label: false, input_html: { class: 'emojiarea', rows: 5 }  %>
+  <%= f.submit class: 'btn btn-outline-primary' %>
+<% end %>
+```
+
+## Development
+
+After checking out the repo, run `bin/setup` to install dependencies. Then, run `bin/console` for an interactive prompt that will allow you to experiment.
+
+To install this gem onto your local machine, run `bundle exec rake install`. To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release` to create a git tag for the version, push git commits and tags, and push the `.gem` file to [rubygems.org](https://rubygems.org).
+
+## Contributing
+
+1. Fork it ( https://github.com/[my-github-username]/jquery-emojiarea-rails/fork )
+2. Create your feature branch (`git checkout -b my-new-feature`)
+3. Commit your changes (`git commit -am 'Add some feature'`)
+4. Push to the branch (`git push origin my-new-feature`)
+5. Create a new Pull Request

data/lib/jquery/emojiarea/rails.rb

@@ -0,0 +1,10 @@
+require "jquery/emojiarea/rails/version"
+
+module Jquery
+  module Emojiarea
+    module Rails
+      class Engine < ::Rails::Engine
+      end
+    end
+  end
+end

data/lib/jquery/emojiarea/rails/version.rb

@@ -0,0 +1,7 @@
+module Jquery
+  module Emojiarea
+    module Rails
+      VERSION = "0.1.0"
+    end
+  end
+end

data/vendor/assets/javascripts/jquery.emojiarea.js

@@ -0,0 +1,458 @@
+/**
+ * emojiarea - A rich textarea control that supports emojis, WYSIWYG-style.
+ * Copyright (c) 2012 DIY Co
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
+ * file except in compliance with the License. You may obtain a copy of the License at:
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
+ * ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ *
+ * @author Brian Reavis <brian@diy.org>
+ */
+
+(function($, window, document) {
+
+	var ELEMENT_NODE = 1;
+	var TEXT_NODE = 3;
+	var TAGS_BLOCK = ['p', 'div', 'pre', 'form'];
+	var KEY_ESC = 27;
+	var KEY_TAB = 9;
+
+	// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+
+	$.emojiarea = {
+		path: '',
+		icons: {},
+		defaults: {
+			button: null,
+			buttonLabel: 'Emojis',
+			buttonPosition: 'after'
+		}
+	};
+
+	$.fn.emojiarea = function(options) {
+		options = $.extend({}, $.emojiarea.defaults, options);
+		return this.each(function() {
+			var $textarea = $(this);
+			if ('contentEditable' in document.body && options.wysiwyg !== false) {
+				new EmojiArea_WYSIWYG($textarea, options);
+			} else {
+				new EmojiArea_Plain($textarea, options);
+			}
+		});
+	};
+
+	// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+
+	var util = {};
+
+	util.restoreSelection = (function() {
+		if (window.getSelection) {
+			return function(savedSelection) {
+				var sel = window.getSelection();
+				sel.removeAllRanges();
+				for (var i = 0, len = savedSelection.length; i < len; ++i) {
+					sel.addRange(savedSelection[i]);
+				}
+			};
+		} else if (document.selection && document.selection.createRange) {
+			return function(savedSelection) {
+				if (savedSelection) {
+					savedSelection.select();
+				}
+			};
+		}
+	})();
+
+	util.saveSelection = (function() {
+		if (window.getSelection) {
+			return function() {
+				var sel = window.getSelection(), ranges = [];
+				if (sel.rangeCount) {
+					for (var i = 0, len = sel.rangeCount; i < len; ++i) {
+						ranges.push(sel.getRangeAt(i));
+					}
+				}
+				return ranges;
+			};
+		} else if (document.selection && document.selection.createRange) {
+			return function() {
+				var sel = document.selection;
+				return (sel.type.toLowerCase() !== 'none') ? sel.createRange() : null;
+			};
+		}
+	})();
+
+	util.replaceSelection = (function() {
+		if (window.getSelection) {
+			return function(content) {
+				var range, sel = window.getSelection();
+				var node = typeof content === 'string' ? document.createTextNode(content) : content;
+				if (sel.getRangeAt && sel.rangeCount) {
+					range = sel.getRangeAt(0);
+					range.deleteContents();
+					range.insertNode(document.createTextNode(' '));
+					range.insertNode(node);
+					range.setStart(node, 0);
+
+					window.setTimeout(function() {
+						range = document.createRange();
+						range.setStartAfter(node);
+						range.collapse(true);
+						sel.removeAllRanges();
+						sel.addRange(range);
+					}, 0);
+				}
+			}
+		} else if (document.selection && document.selection.createRange) {
+			return function(content) {
+				var range = document.selection.createRange();
+				if (typeof content === 'string') {
+					range.text = content;
+				} else {
+					range.pasteHTML(content.outerHTML);
+				}
+			}
+		}
+	})();
+
+	util.insertAtCursor = function(text, el) {
+		text = ' ' + text;
+		var val = el.value, endIndex, startIndex, range;
+		if (typeof el.selectionStart != 'undefined' && typeof el.selectionEnd != 'undefined') {
+			startIndex = el.selectionStart;
+			endIndex = el.selectionEnd;
+			el.value = val.substring(0, startIndex) + text + val.substring(el.selectionEnd);
+			el.selectionStart = el.selectionEnd = startIndex + text.length;
+		} else if (typeof document.selection != 'undefined' && typeof document.selection.createRange != 'undefined') {
+			el.focus();
+			range = document.selection.createRange();
+			range.text = text;
+			range.select();
+		}
+	};
+
+	util.extend = function(a, b) {
+		if (typeof a === 'undefined' || !a) { a = {}; }
+		if (typeof b === 'object') {
+			for (var key in b) {
+				if (b.hasOwnProperty(key)) {
+					a[key] = b[key];
+				}
+			}
+		}
+		return a;
+	};
+
+	util.escapeRegex = function(str) {
+		return (str + '').replace(/([.?*+^$[\]\\(){}|-])/g, '\\$1');
+	};
+
+	util.htmlEntities = function(str) {
+		return String(str).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+	};
+
+	// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+
+	var EmojiArea = function() {};
+
+	EmojiArea.prototype.setup = function() {
+		var self = this;
+
+		this.$editor.on('focus', function() { self.hasFocus = true; });
+		this.$editor.on('blur', function() { self.hasFocus = false; });
+
+		this.setupButton();
+	};
+
+	EmojiArea.prototype.setupButton = function() {
+		var self = this;
+		var $button;
+
+		if (this.options.button) {
+			$button = $(this.options.button);
+		} else if (this.options.button !== false) {
+			$button = $('<a href="javascript:void(0)">');
+			$button.html(this.options.buttonLabel);
+			$button.addClass('emoji-button');
+			$button.attr({title: this.options.buttonLabel});
+			this.$editor[this.options.buttonPosition]($button);
+		} else {
+			$button = $('');
+		}
+
+		$button.on('click', function(e) {
+			EmojiMenu.show(self);
+			e.stopPropagation();
+		});
+
+		this.$button = $button;
+	};
+
+	EmojiArea.createIcon = function(emoji) {
+		var filename = $.emojiarea.icons[emoji];
+		var path = $.emojiarea.path || '';
+		if (path.length && path.charAt(path.length - 1) !== '/') {
+			path += '/';
+		}
+		return '<img src="' + path + filename + '" alt="' + util.htmlEntities(emoji) + '">';
+	};
+
+	// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+
+	/**
+	 * Editor (plain-text)
+	 *
+	 * @constructor
+	 * @param {object} $textarea
+	 * @param {object} options
+	 */
+
+	var EmojiArea_Plain = function($textarea, options) {
+		this.options = options;
+		this.$textarea = $textarea;
+		this.$editor = $textarea;
+		this.setup();
+	};
+
+	EmojiArea_Plain.prototype.insert = function(emoji) {
+		if (!$.emojiarea.icons.hasOwnProperty(emoji)) return;
+		util.insertAtCursor(emoji, this.$textarea[0]);
+		this.$textarea.trigger('change');
+	};
+
+	EmojiArea_Plain.prototype.val = function() {
+		return this.$textarea.val();
+	};
+
+	util.extend(EmojiArea_Plain.prototype, EmojiArea.prototype);
+
+	// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+
+	/**
+	 * Editor (rich)
+	 *
+	 * @constructor
+	 * @param {object} $textarea
+	 * @param {object} options
+	 */
+
+	var EmojiArea_WYSIWYG = function($textarea, options) {
+		var self = this;
+
+		this.options = options;
+		this.$textarea = $textarea;
+		this.$editor = $('<div>').addClass('emoji-wysiwyg-editor');
+		this.$editor.text($textarea.val());
+		this.$editor.attr({contenteditable: 'true'});
+		this.$editor.on('blur keyup paste', function() { return self.onChange.apply(self, arguments); });
+		this.$editor.on('mousedown focus', function() { document.execCommand('enableObjectResizing', false, false); });
+		this.$editor.on('blur', function() { document.execCommand('enableObjectResizing', true, true); });
+
+		var html = this.$editor.text();
+		var emojis = $.emojiarea.icons;
+		for (var key in emojis) {
+			if (emojis.hasOwnProperty(key)) {
+				html = html.replace(new RegExp(util.escapeRegex(key), 'g'), EmojiArea.createIcon(key));
+			}
+		}
+		this.$editor.html(html);
+
+		$textarea.hide().after(this.$editor);
+
+		this.setup();
+
+		this.$button.on('mousedown', function() {
+			if (self.hasFocus) {
+				self.selection = util.saveSelection();
+			}
+		});
+	};
+
+	EmojiArea_WYSIWYG.prototype.onChange = function() {
+		this.$textarea.val(this.val()).trigger('change');
+	};
+
+	EmojiArea_WYSIWYG.prototype.insert = function(emoji) {
+		var content;
+		var $img = $(EmojiArea.createIcon(emoji));
+		if ($img[0].attachEvent) {
+			$img[0].attachEvent('onresizestart', function(e) { e.returnValue = false; }, false);
+		}
+
+		this.$editor.trigger('focus');
+		if (this.selection) {
+			util.restoreSelection(this.selection);
+		}
+		try { util.replaceSelection($img[0]); } catch (e) {}
+		this.onChange();
+	};
+
+	EmojiArea_WYSIWYG.prototype.val = function() {
+		var lines = [];
+		var line  = [];
+
+		var flush = function() {
+			lines.push(line.join(''));
+			line = [];
+		};
+
+		var sanitizeNode = function(node) {
+			if (node.nodeType === TEXT_NODE) {
+				line.push(node.nodeValue);
+			} else if (node.nodeType === ELEMENT_NODE) {
+				var tagName = node.tagName.toLowerCase();
+				var isBlock = TAGS_BLOCK.indexOf(tagName) !== -1;
+
+				if (isBlock && line.length) flush();
+
+				if (tagName === 'img') {
+					var alt = node.getAttribute('alt') || '';
+					if (alt) line.push(alt);
+					return;
+				} else if (tagName === 'br') {
+					flush();
+				}
+
+				var children = node.childNodes;
+				for (var i = 0; i < children.length; i++) {
+					sanitizeNode(children[i]);
+				}
+
+				if (isBlock && line.length) flush();
+			}
+		};
+
+		var children = this.$editor[0].childNodes;
+		for (var i = 0; i < children.length; i++) {
+			sanitizeNode(children[i]);
+		}
+
+		if (line.length) flush();
+
+		return lines.join('\n');
+	};
+
+	util.extend(EmojiArea_WYSIWYG.prototype, EmojiArea.prototype);
+
+	// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+
+	/**
+	 * Emoji Dropdown Menu
+	 *
+	 * @constructor
+	 * @param {object} emojiarea
+	 */
+	var EmojiMenu = function() {
+		var self = this;
+		var $body = $(document.body);
+		var $window = $(window);
+
+		this.visible = false;
+		this.emojiarea = null;
+		this.$menu = $('<div>');
+		this.$menu.addClass('emoji-menu');
+		this.$menu.hide();
+		this.$items = $('<div>').appendTo(this.$menu);
+
+		$body.append(this.$menu);
+
+		$body.on('keydown', function(e) {
+			if (e.keyCode === KEY_ESC || e.keyCode === KEY_TAB) {
+				self.hide();
+			}
+		});
+
+		$body.on('mouseup', function() {
+			self.hide();
+		});
+
+		$window.on('resize', function() {
+			if (self.visible) self.reposition();
+		});
+
+		this.$menu.on('mouseup', 'a', function(e) {
+			e.stopPropagation();
+			return false;
+		});
+
+		this.$menu.on('click', 'a', function(e) {
+			var emoji = $('.label', $(this)).text();
+			window.setTimeout(function() {
+				self.onItemSelected.apply(self, [emoji]);
+			}, 0);
+			e.stopPropagation();
+			return false;
+		});
+
+		this.load();
+	};
+
+	EmojiMenu.prototype.onItemSelected = function(emoji) {
+		this.emojiarea.insert(emoji);
+		this.hide();
+	};
+
+	EmojiMenu.prototype.load = function() {
+		var html = [];
+		var options = $.emojiarea.icons;
+		var path = $.emojiarea.path;
+		if (path.length && path.charAt(path.length - 1) !== '/') {
+			path += '/';
+		}
+
+		for (var key in options) {
+			if (options.hasOwnProperty(key)) {
+				var filename = options[key];
+				html.push('<a href="javascript:void(0)" title="' + util.htmlEntities(key) + '">' + EmojiArea.createIcon(key) + '<span class="label">' + util.htmlEntities(key) + '</span></a>');
+			}
+		}
+
+		this.$items.html(html.join(''));
+	};
+
+	EmojiMenu.prototype.reposition = function() {
+		var $button = this.emojiarea.$button;
+		var offset = $button.offset();
+		offset.top += $button.outerHeight();
+		offset.left += Math.round($button.outerWidth() / 2);
+
+		this.$menu.css({
+			top: offset.top,
+			left: offset.left
+		});
+	};
+
+	EmojiMenu.prototype.hide = function(callback) {
+		if (this.emojiarea) {
+			this.emojiarea.menu = null;
+			this.emojiarea.$button.removeClass('on');
+			this.emojiarea = null;
+		}
+		this.visible = false;
+		this.$menu.hide();
+	};
+
+	EmojiMenu.prototype.show = function(emojiarea) {
+		if (this.emojiarea && this.emojiarea === emojiarea) return;
+		this.emojiarea = emojiarea;
+		this.emojiarea.menu = this;
+
+		this.reposition();
+		this.$menu.show();
+		this.visible = true;
+	};
+
+	EmojiMenu.show = (function() {
+		var menu = null;
+		return function(emojiarea) {
+			menu = menu || new EmojiMenu();
+			menu.show(emojiarea);
+		};
+	})();
+
+})(jQuery, window, document);

data/vendor/assets/javascripts/jquery.emojiarea.min.js

@@ -0,0 +1,14 @@
+/*! jquery.emojiarea.js | https://github.com/diy/jquery-emojiarea | Apache License (v2) */
+(function(d,i,e){var p=["p","div","pre","form"];d.emojiarea={path:"",icons:{},defaults:{button:null,buttonLabel:"Emojis",buttonPosition:"after"}};d.fn.emojiarea=function(a){a=d.extend({},d.emojiarea.defaults,a);return this.each(function(){var b=d(this);"contentEditable"in e.body&&!1!==a.wysiwyg?new l(b,a):new m(b,a)})};var g={},k;k=i.getSelection?function(a){var b=i.getSelection();b.removeAllRanges();for(var c=0,f=a.length;c<f;++c)b.addRange(a[c])}:e.selection&&e.selection.createRange?function(a){a&&
+a.select()}:void 0;g.restoreSelection=k;k=i.getSelection?function(){var a=i.getSelection(),b=[];if(a.rangeCount)for(var c=0,f=a.rangeCount;c<f;++c)b.push(a.getRangeAt(c));return b}:e.selection&&e.selection.createRange?function(){var a=e.selection;return"none"!==a.type.toLowerCase()?a.createRange():null}:void 0;g.saveSelection=k;k=i.getSelection?function(a){var b,c=i.getSelection(),f="string"===typeof a?e.createTextNode(a):a;c.getRangeAt&&c.rangeCount&&(b=c.getRangeAt(0),b.deleteContents(),b.insertNode(e.createTextNode(" ")),
+b.insertNode(f),b.setStart(f,0),i.setTimeout(function(){b=e.createRange();b.setStartAfter(f);b.collapse(!0);c.removeAllRanges();c.addRange(b)},0))}:e.selection&&e.selection.createRange?function(a){var b=e.selection.createRange();"string"===typeof a?b.text=a:b.pasteHTML(a.outerHTML)}:void 0;g.replaceSelection=k;g.insertAtCursor=function(a,b){var a=" "+a,c=b.value,f;"undefined"!=typeof b.selectionStart&&"undefined"!=typeof b.selectionEnd?(f=b.selectionStart,b.value=c.substring(0,f)+a+c.substring(b.selectionEnd),
+b.selectionStart=b.selectionEnd=f+a.length):"undefined"!=typeof e.selection&&"undefined"!=typeof e.selection.createRange&&(b.focus(),c=e.selection.createRange(),c.text=a,c.select())};g.extend=function(a,b){if("undefined"===typeof a||!a)a={};if("object"===typeof b)for(var c in b)b.hasOwnProperty(c)&&(a[c]=b[c]);return a};g.escapeRegex=function(a){return(a+"").replace(/([.?*+^$[\]\\(){}|-])/g,"\\$1")};g.htmlEntities=function(a){return String(a).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,
+"&gt;").replace(/"/g,"&quot;")};var j=function(){};j.prototype.setup=function(){var a=this;this.$editor.on("focus",function(){a.hasFocus=!0});this.$editor.on("blur",function(){a.hasFocus=!1});this.setupButton()};j.prototype.setupButton=function(){var a=this,b;this.options.button?b=d(this.options.button):!1!==this.options.button?(b=d('<a href="javascript:void(0)">'),b.html(this.options.buttonLabel),b.addClass("emoji-button"),b.attr({title:this.options.buttonLabel}),this.$editor[this.options.buttonPosition](b)):
+b=d("");b.on("click",function(b){h.show(a);b.stopPropagation()});this.$button=b};j.createIcon=function(a){var b=d.emojiarea.icons[a],c=d.emojiarea.path||"";c.length&&"/"!==c.charAt(c.length-1)&&(c+="/");return'<img src="'+c+b+'" alt="'+g.htmlEntities(a)+'">'};var m=function(a,b){this.options=b;this.$editor=this.$textarea=a;this.setup()};m.prototype.insert=function(a){d.emojiarea.icons.hasOwnProperty(a)&&(g.insertAtCursor(a,this.$textarea[0]),this.$textarea.trigger("change"))};m.prototype.val=function(){return this.$textarea.val()};
+g.extend(m.prototype,j.prototype);var l=function(a,b){var c=this;this.options=b;this.$textarea=a;this.$editor=d("<div>").addClass("emoji-wysiwyg-editor");this.$editor.text(a.val());this.$editor.attr({contenteditable:"true"});this.$editor.on("blur keyup paste",function(){return c.onChange.apply(c,arguments)});this.$editor.on("mousedown focus",function(){e.execCommand("enableObjectResizing",!1,!1)});this.$editor.on("blur",function(){e.execCommand("enableObjectResizing",!0,!0)});var f=this.$editor.text(),
+i=d.emojiarea.icons,h;for(h in i)i.hasOwnProperty(h)&&(f=f.replace(RegExp(g.escapeRegex(h),"g"),j.createIcon(h)));this.$editor.html(f);a.hide().after(this.$editor);this.setup();this.$button.on("mousedown",function(){c.hasFocus&&(c.selection=g.saveSelection())})};l.prototype.onChange=function(){this.$textarea.val(this.val()).trigger("change")};l.prototype.insert=function(a){a=d(j.createIcon(a));a[0].attachEvent&&a[0].attachEvent("onresizestart",function(a){a.returnValue=!1},!1);this.$editor.trigger("focus");
+this.selection&&g.restoreSelection(this.selection);try{g.replaceSelection(a[0])}catch(b){}this.onChange()};l.prototype.val=function(){for(var a=[],b=[],c=function(){a.push(b.join(""));b=[]},f=function(a){if(3===a.nodeType)b.push(a.nodeValue);else if(1===a.nodeType){var d=a.tagName.toLowerCase(),e=-1!==p.indexOf(d);e&&b.length&&c();if("img"===d)(e=a.getAttribute("alt")||"")&&b.push(e);else{"br"===d&&c();a=a.childNodes;for(d=0;d<a.length;d++)f(a[d]);e&&b.length&&c()}}},d=this.$editor[0].childNodes,
+e=0;e<d.length;e++)f(d[e]);b.length&&c();return a.join("\n")};g.extend(l.prototype,j.prototype);var h=function(){var a=this,b=d(e.body),c=d(i);this.visible=!1;this.emojiarea=null;this.$menu=d("<div>");this.$menu.addClass("emoji-menu");this.$menu.hide();this.$items=d("<div>").appendTo(this.$menu);b.append(this.$menu);b.on("keydown",function(b){(27===b.keyCode||9===b.keyCode)&&a.hide()});b.on("mouseup",function(){a.hide()});c.on("resize",function(){a.visible&&a.reposition()});this.$menu.on("mouseup",
+"a",function(a){a.stopPropagation();return!1});this.$menu.on("click","a",function(b){var c=d(".label",d(this)).text();i.setTimeout(function(){a.onItemSelected.apply(a,[c])},0);b.stopPropagation();return!1});this.load()};h.prototype.onItemSelected=function(a){this.emojiarea.insert(a);this.hide()};h.prototype.load=function(){var a=[],b=d.emojiarea.icons,c=d.emojiarea.path;c.length&&c.charAt(c.length-1);for(var e in b)b.hasOwnProperty(e)&&a.push('<a href="javascript:void(0)" title="'+g.htmlEntities(e)+
+'">'+j.createIcon(e)+'<span class="label">'+g.htmlEntities(e)+"</span></a>");this.$items.html(a.join(""))};h.prototype.reposition=function(){var a=this.emojiarea.$button,b=a.offset();b.top+=a.outerHeight();b.left+=Math.round(a.outerWidth()/2);this.$menu.css({top:b.top,left:b.left})};h.prototype.hide=function(){this.emojiarea&&(this.emojiarea.menu=null,this.emojiarea.$button.removeClass("on"),this.emojiarea=null);this.visible=!1;this.$menu.hide()};h.prototype.show=function(a){this.emojiarea&&this.emojiarea===
+a||(this.emojiarea=a,this.emojiarea.menu=this,this.reposition(),this.$menu.show(),this.visible=!0)};var n=null;h.show=function(a){n=n||new h;n.show(a)}})(jQuery,window,document);

data/vendor/assets/javascripts/packs/basic/emojis.js

@@ -0,0 +1,8 @@
+$.emojiarea.path = 'assets/packs/basic';
+$.emojiarea.icons = {
+	':smile:'     : 'smile.png',
+	':angry:'     : 'angry.png',
+	':flushed:'   : 'flushed.png',
+	':neckbeard:' : 'neckbeard.png',
+	':laughing:'  : 'laughing.png'
+};

data/vendor/assets/stylesheets/jquery.emojiarea.css

@@ -0,0 +1,59 @@
+.emoji-wysiwyg-editor {
+	border: 1px solid #d0d0d0;
+	overflow: auto;
+	outline: none;
+}
+.emoji-wysiwyg-editor img {
+	width: 20px;
+	height: 20px;
+	vertical-align: middle;
+	margin: -3px 0 0 0;
+}
+.emoji-menu {
+	position: absolute;
+	z-index: 999;
+	width: 180px;
+	margin-left: -100px;
+	padding: 0;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+}
+.emoji-menu > div {
+	max-height: 200px;
+	overflow: hidden;
+	background: #fff;
+	-webkit-border-radius: 3px;
+	-moz-border-radius: 3px;
+	border-radius: 3px;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+	-webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.3);
+	-moz-box-shadow: 0 1px 5px rgba(0,0,0,0.3);
+	box-shadow: 0 1px 5px rgba(0,0,0,0.3);
+}
+.emoji-menu img {
+	width: 25px;
+	height: 25px;
+	vertical-align: middle;
+	border: 0 none;
+}
+.emoji-menu a {
+	margin: -1px 0 0 -1px;
+	border: 1px solid #f2f2f2;
+	padding: 5px;
+	display: block;
+	float: left;
+}
+.emoji-menu a:hover {
+	background-color: #fffae7;
+}
+.emoji-menu:after {
+	content: ' ';
+	display: block;
+	clear: left;
+}
+.emoji-menu a .label {
+	display: none;
+}

metadata

@@ -0,0 +1,86 @@
+--- !ruby/object:Gem::Specification
+name: jquery-emojiarea-rails
+version: !ruby/object:Gem::Version
+  version: 0.1.0
+platform: ruby
+authors:
+- Lucius Choi
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2017-04-14 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: bundler
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1.9'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1.9'
+- !ruby/object:Gem::Dependency
+  name: rake
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '10.0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '10.0'
+description: Wrap jquery-emojiarea plugin for Rails asset pipeline.
+email:
+- lucius.choi@gmail.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- LICENSE.txt
+- README.md
+- lib/jquery/emojiarea/rails.rb
+- lib/jquery/emojiarea/rails/version.rb
+- vendor/assets/javascripts/jquery.emojiarea.js
+- vendor/assets/javascripts/jquery.emojiarea.min.js
+- vendor/assets/javascripts/packs/basic/angry.png
+- vendor/assets/javascripts/packs/basic/emojis.js
+- vendor/assets/javascripts/packs/basic/flushed.png
+- vendor/assets/javascripts/packs/basic/laughing.png
+- vendor/assets/javascripts/packs/basic/neckbeard.png
+- vendor/assets/javascripts/packs/basic/smile.png
+- vendor/assets/javascripts/packs/basic/sunglasses.png
+- vendor/assets/stylesheets/jquery.emojiarea.css
+homepage: https://github.com/lucius/jquery-emojiarea-rails
+licenses: []
+metadata:
+  allowed_push_host: https://rubygems.org
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 2.4.5
+signing_key: 
+specification_version: 4
+summary: Wrap jquery-emojiarea plugin with a gem.
+test_files: []