From 01e7a8a9dacd79d082ef1de62ca32d43b68745cd Mon Sep 17 00:00:00 2001
From: Mehrdad Dadkhah <dadkhah.ir@gmail.com>
Date: Sat, 21 Nov 2015 13:23:49 +0330
Subject: [PATCH] enhance usage way

---
 README.md       | 14 ++++++++++++--
 demo/demoApp.js |  9 ++++++++-
 demo/index.html |  9 ++++++---
 package.json    |  2 +-
 src/ngEmoji.js  | 10 ++--------
 5 files changed, 29 insertions(+), 15 deletions(-)

diff --git a/README.md b/README.md
index 199052c..fb38420 100644
--- a/README.md
+++ b/README.md
@@ -30,8 +30,18 @@ Table of Content:
 
 ```html
 <h2>input</h2>
-<input name="test[1]" ng-model="test[1]" value=""/>
+<input name="test" ng-model="test" value=""/>
 
 <h2>emoji panel</h2>
-<emoji input-model="1" input-name="test"></emoji>
+<emoji input-name="test"></emoji>
+```
+
+and in js code:
+
+```javascript
+$scope.$on('emji:addSuccess', function(event, emoji, inputName) {
+
+    $scope[inputName] += ' ' + emoji;
+    
+});
 ```
\ No newline at end of file
diff --git a/demo/demoApp.js b/demo/demoApp.js
index 38e8730..e42db31 100755
--- a/demo/demoApp.js
+++ b/demo/demoApp.js
@@ -1,11 +1,18 @@
 var demoApp = angular.module('demoApp',['ngEmoji']);
 
+var documentRoot = 'http://test.local/src/';
+
 var testController = demoApp.controller('testController',['$scope', function($scope){
 
 	var init = function(){
-		//DO sth
+		$scope.test = '';
 	}
 
+	$scope.$on('emji:addSuccess', function(event, emoji, inputName) {
+
+        $scope[inputName] += ' ' + emoji;
+        
+    });
 
 	init();
 }]);
\ No newline at end of file
diff --git a/demo/index.html b/demo/index.html
index e02cdaf..92e1182 100755
--- a/demo/index.html
+++ b/demo/index.html
@@ -12,10 +12,13 @@
 			<h1>DEMO of editablediv directive</h1>
 
 			<h2>input</h2>
-			<input name="test[1]" ng-model="test[1]" value=""/>
-
+			<input name="test" ng-model="test" value="" style="width: 500px;"/>
+			<p>
+				note that if want to see emoji icon instead of it's code you should use
+				<a href="https://github.com/Mehrdad-Dadkhah/ng-editable-div">editable div</a>
+			</p>
 			<h2>emoji panel</h2>
-			<emoji input-model="1" input-name="test"></emoji>
+			<emoji input-name="test"></emoji>
 		</div>
 	</body>
 </html>
\ No newline at end of file
diff --git a/package.json b/package.json
index 295c0c1..e0170ca 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "ng-emoji",
-    "version": "1.0.0",
+    "version": "1.0.1",
     "description": "An Angular directive for emojify complete panel",
     "repository": {
         "type": "git",
diff --git a/src/ngEmoji.js b/src/ngEmoji.js
index a6df87f..0595fca 100755
--- a/src/ngEmoji.js
+++ b/src/ngEmoji.js
@@ -1,13 +1,10 @@
 var app = angular.module('ngEmoji' , []);
 
-var documentRoot = 'http://test.local/src/';
-
 app.directive('emoji', function() {
     return {
         templateUrl: documentRoot + 'emoji.html',
         restrict: 'E',
         scope:{
-            inputModel: '@',
             inputName: '@'
         },  
         compile: function($scope, element){
@@ -27,10 +24,8 @@ app.directive('emoji', function() {
             emojify.run();
             element.$$element[0].innerHTML = emojify.replace(element.$$element[0].innerHTML);
         },
-        controller: function($scope, $element){
+        controller: function($scope, $rootScope, $element){
             var init = function(){
-                $scope.$parent[$scope.inputName] = [];
-                $scope.$parent[$scope.inputName][$scope.inputModel] = '';
                 $scope.showEmojiPanel = false;
             }
 
@@ -39,8 +34,7 @@ app.directive('emoji', function() {
             }
 
             $scope.addEmoji = function(emojiCode){
-                var text = $scope.$parent[$scope.inputName][$scope.inputModel];
-                $scope.$parent[$scope.inputName][$scope.inputModel] = text+emojify.replace(emojiCode);
+                $rootScope.$broadcast('emji:addSuccess', emojify.replace(emojiCode), $scope.inputName);
             }
 
             init();