Merge pull request #167 from carpii/docs

Documentation

README.md

@@ -79,16 +79,28 @@ Default options
       autocorrect       : "off", // autocorrect https://davidwalsh.name/disable-autocorrect
       autocapitalize    : "off", // autocapitalize http://www.w3schools.com/tags/att_input_autocomplete.asp
 
+      buttonTitle       : "Use the TAB key to insert emoji faster", // title of emojionearea smiley button
       placeholder       : null, // placeholder
+      pickerPosition:   : "top", // position of picker in relation to input [ top | bottom | right ]
       container         : null, // by default, emojionearea container created directly under source,
                                 // in this option you can specify custom {jQuery|selector} container
+      tones             : true, // whether to show the skin tone buttons in Emoji picker
+      tonesStyle        : "bullet" // style of skin tones selector [ bullet | radio | square | checkbox ]
 
-      hideSource        : true, // hide source element after binding
+      hideSource        : true,  // hide source element after binding
       autoHideFilters   : false, // auto hide filters panel
 
-      sprite         : true, // use sprite instead of images, is awesome, but not works in old browsers
+      sprite            : true, // use sprite instead of images, is awesome, but not works in old browsers
       shortnames        : false, // if true - will converts emojis to short names,
                                  // by default converts emojis to unicode characters
+      standalone        : false, // whether to use standalone EmojiOneArea picker (for EmojiOneArea 2.1 only)
+      useInternalCDN    : true, 
+      recentEmojis      : true, // whether to show recently select Emoji's in picker
+
+      textcomplete: {
+        maxCount: 15,           // max amount of items to show in autocomplete drop-down list
+        placement: null,        // placement of autocomplete dropdown list [ null (default) | top | absleft | absright ]
+      },
 
       filters: {
         // customize filters & emoji buttons
@@ -277,6 +289,8 @@ or by `.on()` & `.off()` methods:
 ```
 ## Building
 
+Building EmojiOneArea requires grunt, compass, and sass to be available
+
 For making changes and build project (scss/js):
 ```
 npm update
@@ -286,6 +300,50 @@ node node_modules/grunt-cli/bin/grunt
 PRs welcome.
 
 
+## FAQ / Troubleshooting
+
+#### EmojiOne icons are appearing larger than expected
+Most likely caused by including some scripts in the wrong order (or perhaps not at all!)
+Include jQuery, then EmojiOne, then EmojiOneArea scripts
+
+#### Can I use EmojiOneArea to just display Emoji icons in a div?
+EmojiOneArea is intended to be a text editor which supports EmojiOne. 
+If you just want to display Emoji icons, the EmojiOne library already provides everything you need. 
+
+#### Can I add extra buttons into EmojiOneArea, alongside the existing emoji picker icon?
+This is not fully supported, but you could respond to the jQuery onLoad event which EmojiOneArea fires once its initialised, and insert your buttons into the DOM at this point
+see https://github.com/mervick/emojionearea/issues/152
+
+#### Firefox is not positioning the input caret correctly in EmojiOneArea
+This appears to be a long standing FireFox bug, apparently related to contenteditable, the placeholder attribute, and the pseudo :before or :after classes
+https://bugzilla.mozilla.org/show_bug.cgi?id=1020973
+
+There are various workarounds such as changing placeholder, or adding some padding 
+See https://github.com/mervick/emojionearea/issues/86
+
+#### Can I modify the position of EmojiOneArea picker?
+You can use the `pickerPosition` option which provides basic control of where the picker appears, in relation to the source input.
+For more control, you could apply translate CSS to the picker 
+
+## Known Issues
+
+#### Internet Explorer focus issues
+IE 11 causes EmojiOneArea to hide (and trigger blur event) when the emoji picker scrollbar is clicked
+There is no current fix for this, although there are a few crude workarounds
+See https://github.com/mervick/emojionearea/issues/127
+
+#### EmojiOneArea positioning 
+There are known issues with positioning the EmojiOneArea picker. 
+It does not currently ensure the picker is entirely visible on small screen devices, or positioned properly when it is invoked from the bottom of a page (it could be clipped) 
+See https://github.com/mervick/emojionearea/issues/131
+
+#### Browser loads the textcomplete.js from CDN, everytime an EmojiOneArea is instantiated
+You can avoid this by explicitly including the textcomplete script into your document. 
+If it already exists, EmojiOneArea will use the preloaded script instead of attempting to load it from CDN for each instance
+You can also avoid this by disabling autocomplate entirely by setting the autocomplete option to false
+
+
+
 ## Requirements
 
 - [jQuery](https://jquery.com/) >= 1.8.2