add the on-media-delete callback

related with #92

README.md

@@ -99,6 +99,39 @@ summernote's options can be specified as attributes.
 <summernote airMode></summernote>
 ```
 
+If you use the `removeMedia` button in popover, like below:
+
+```
+<summernote airMode config="options" on-media-delete="mediaDelete(target)"></summernote>
+```
+
+```
+function DemoController($scope) {
+  $scope.options = {
+    popover: {
+      image: [['remove', ['removeMedia']] ],
+      air: [['insert', ['picture']]]
+    }
+  };
+  $scope.mediaDelete = function(target) {
+    console.log('media is delted:', target);
+  }
+}
+```
+
+You can use the 'onMediaDelete` callback. The `target` object has information of the DOM that is removed like:
+
+```
+{
+  tagName: "IMG",
+  attrs: {
+    data-filename: "image-name.jpg",
+    src: "http://path/to/image",
+    style: "width: 100px;"
+  }
+}
+```
+
 #### options object
 
 You can specify all options using ngModel in `config` attribute.

examples/index.html

@@ -80,7 +80,7 @@ <h4>lang</h4>
     <div ng-controller="AirmodeCtrl">
       <h4>airmode</h4>
       <div class="example">
-        <summernote airMode ng-model="text"></summernote>
+        <summernote airMode ng-model="text" config="options" on-media-delete="mediaDelete(target)"></summernote>
       </div>
     </div>
 
@@ -130,6 +130,28 @@ <h4>use callbacks</h4>
         })
         .controller('AirmodeCtrl', function($scope) {
           $scope.text = "<h3>This is an Air-mode editable area.</h3>";
+          $scope.options = {
+            popover: {
+              image: [
+                ['imagesize', ['imageSize100', 'imageSize50', 'imageSize25']],
+                ['float', ['floatLeft', 'floatRight', 'floatNone']],
+                ['remove', ['removeMedia']]
+              ],
+              link: [
+                ['link', ['linkDialogShow', 'unlink']]
+              ],
+              air: [
+                ['color', ['color']],
+                ['font', ['bold', 'underline', 'clear']],
+                ['para', ['ul', 'paragraph']],
+                ['table', ['table']],
+                ['insert', ['link', 'picture']]
+              ]
+            }
+          };
+          $scope.mediaDelete = function(target) {
+            console.log('media is delted:', target);
+          }
         })
         .controller('CodeCtrl', function($scope) {
           $scope.text = "Hello World";

src/angular-summernote.js

@@ -30,6 +30,17 @@ angular.module('summernote', [])
         $scope.imageUpload({files:files, editable: $scope.editable});
       };
     }
+    if (angular.isDefined($attrs.onMediaDelete)) {
+      callbacks.onMediaDelete = function(target) {
+        // make new object that has information of target to avoid error:isecdom
+        var removedMedia = {attrs: {}};
+        removedMedia.tagName = target[0].tagName;
+        angular.forEach(target[0].attributes, function(attr) {
+          removedMedia.attrs[attr.name] = attr.value;
+        });
+        $scope.mediaDelete({target: removedMedia});
+      }
+    }
 
     this.activate = function(scope, element, ngModel) {
       var updateNgModel = function() {
@@ -127,7 +138,8 @@ angular.module('summernote', [])
         keyup: '&onKeyup',
         keydown: '&onKeydown',
         change: '&onChange',
-        imageUpload: '&onImageUpload'
+        imageUpload: '&onImageUpload',
+        mediaDelete: '&onMediaDelete'
       },
       template: '<div class="summernote"></div>',
       link: function(scope, element, attrs, ctrls, transclude) {