Add changelog and some docs (reference #429)

Author: bbrala

README.md

@@ -1,8 +1,5 @@
 # jQuery contextMenu plugin & polyfill #
 
-__IMPORTANT: 2.0.0 is release and has change the default names of the icon classes in order to stop CSS conflicts with frameworks which define the class 'icon'.__
-
-
 [![Travis Build Status](https://travis-ci.org/swisnl/jQuery-contextMenu.svg?branch=master)](https://travis-ci.org/swisnl/jQuery-contextMenu)
 
 $.contextMenu is a management facility for - you guessed it - context menus. It was designed for an application where there are hundreds of elements that may show a context menu - so intialization speed and memory usage are kept fairly small. It also allows to register context menus without providing actual markup, as $.contextMenu generates DOMElements as needed.
@@ -97,6 +94,12 @@ Font-Awesome icons used from [encharm/Font-Awesome-SVG-PNG](https://github.com/e
 
 ## Changelog ##
 
+### Unreleased ###
+
+### Added
+
+* Asynchronous promise support for submenu's ([Issue #429](https://github.com/swisnl/jQuery-contextMenu/issues/429)) thanks @Ruud-cb for the hard work.
+
 ### 2.2.4 ###
 
 #### Fixed

documentation/demo/async-promise.md

@@ -0,0 +1,93 @@
+---
+currentMenu: async-promis 
+---
+
+# Demo: Submenu through promis (asynchronous)
+
+<!-- START doctoc generated TOC please keep comment here to allow auto update -->
+<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
+
+
+- [Example code](#example-code)
+- [Example HTML](#example-html)
+
+<!-- END doctoc generated TOC please keep comment here to allow auto update -->
+
+<span class="context-menu-one btn btn-neutral">right click me</span>
+
+## Example code
+
+<script type="text/javascript" class="showcase">
+    var $ = jQuery;
+    $(document).ready(function () {
+        'use strict';
+        var errorItems = { "errorItem": { name: "Items Load error" },};
+        var loadItems = function () {
+            var dfd = jQuery.Deferred();
+            setTimeout(function () {
+                dfd.resolve(subItems);
+            }, 2000);
+            //setTimeout(function () {
+            //    dfd.reject(errorItems);
+            //}, 1000);
+            return dfd.promise();
+        };
+
+        var subItems = {
+            "sub1": { name: "Submenu1", icon: "edit" },
+            "sub2": { name: "Submenu2", icon: "cut" },
+        };
+
+        $.contextMenu({
+            selector: '.context-menu-one',
+            build: function ($trigger, e) {
+                return {
+                    callback: function (key, options) {
+                        var m = "clicked: " + key;
+                        console.log(m);
+                    },
+                    items: {
+                        "edit": { name: "Edit", icon: "edit" },
+                        "cut": { name: "Cut", icon: "cut" },
+                        "status": {
+                            name: "Status",
+                            icon: "delete",
+                            items: loadItems(),
+                        },
+                        "normalSub": {
+                            name: "Normal Sub",
+                            items: {
+                                "normalsub1": { name: "normal Sub 1"},
+                                "normalsub2": { name: "normal Sub 2"},
+                                "normalsub3": { name: "normal Sub 3" },
+                            }
+                        }
+                    }
+                };
+            }
+        });
+
+        //normal promise usage example
+        var completedPromise = function (status) {
+            console.log("completed promise:", status);
+        };
+
+        var failPromise = function (status) {
+            console.log("fail promise:", status);
+        };
+
+        var notifyPromise = function (status) {
+            console.log("notify promise:", status);
+        };
+
+        $.loadItemsAsync = function() {
+            console.log("loadItemsAsync");
+            var promise = loadItems();
+            $.when(promise).then(completedPromise, failPromise, notifyPromise);
+        };
+
+    });
+</script>
+
+## Example HTML
+<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>

documentation/docs/items.md

@@ -40,6 +40,10 @@ var items = {
 }
 ```
 
+Since 2.3 it is also possible to use a promise as item, so you can build submenu's based on a snynchronous promis.
+
+Check out the [demo using a promise](demo/async-promise.md) for an example how to use this. The example uses jQuery deferred, but any promise should do. 
+
 ## options.items
 
 ### name