Merge pull request #1338 from summernote/refactoring-toolbar

Refactoring toolbar, popover
summernote · Sep 23, 2015 · 6671630 · 6671630
2 parents 27eb67f + 03ff70c
commit 6671630
Show file tree

Hide file tree

Showing 8 changed files with 685 additions and 506 deletions.
diff --git a/src/js/bs3/module/Button.js b/src/js/bs3/module/Button.js
diff --git a/src/js/bs3/module/ImageDialog.js b/src/js/bs3/module/ImageDialog.js
@@ -26,7 +26,7 @@ define([
                    '<input class="note-image-input form-control" type="file" name="files" accept="image/*" multiple="multiple" />' +
                    imageLimitation +
                  '</div>' +
-                 '<div class="form-group">' +
+                 '<div class="form-group" style="overflow:auto;">' +
                    '<label>' + lang.image.url + '</label>' +
                    '<input class="note-image-url form-control col-md-12" type="text" />' +
                  '</div>';

diff --git a/src/js/bs3/module/ImagePopover.js b/src/js/bs3/module/ImagePopover.js
@@ -9,63 +9,24 @@ define([
 
     var $note = summernote.layoutInfo.note;
     var $editingArea = summernote.layoutInfo.editingArea;
-    var lang = summernote.options.langInfo;
+    var options = summernote.options;
 
     var $popover = ui.popover({
-      className: 'note-image-popover',
-      children: [
-        ui.buttonGroup([
-          ui.button({
-            contents: '<span class="note-fontsize-10">100%</span>',
-            tooltip: lang.image.resizeFull,
-            click: summernote.createInvokeHandler('editor.resize', '1')
-          }),
-          ui.button({
-            contents: '<span class="note-fontsize-10">50%</span>',
-            tooltip: lang.image.resizeHalf,
-            click: summernote.createInvokeHandler('editor.resize', '0.5')
-          }),
-          ui.button({
-            contents: '<span class="note-fontsize-10">25%</span>',
-            tooltip: lang.image.resizeQuarter,
-            click: summernote.createInvokeHandler('editor.resize', '0.25')
-          })
-        ]),
-        ui.buttonGroup([
-          ui.button({
-            contents: '<i class="fa fa-align-left"/>',
-            tooltip: lang.image.floatLeft,
-            click: summernote.createInvokeHandler('editor.floatMe', 'left')
-          }),
-          ui.button({
-            contents: '<i class="fa fa-align-right"/>',
-            tooltip: lang.image.floatRight,
-            click: summernote.createInvokeHandler('editor.floatMe', 'right')
-          }),
-          ui.button({
-            contents: '<i class="fa fa-align-justify"/>',
-            tooltip: lang.image.floatNone,
-            click: summernote.createInvokeHandler('editor.floatMe', 'none')
-          })
-        ]),
-        ui.buttonGroup([
-          ui.button({
-            contents: '<i class="fa fa-trash-o"/>',
-            tooltip: lang.image.remove,
-            click: summernote.createInvokeHandler('editor.removeMedia')
-          })
-        ])
-      ]
+      className: 'note-image-popover'
     }).render();
 
     $editingArea.append($popover);
 
     this.initialize = function () {
+
+      summernote.generateButtons($popover.find('.popover-content'), options.popover.image);
+
       $note.on('summernote.keyup summernote.mouseup summernote.change', function (customEvent, event) {
         self.update(event.target);
       }).on('summernote.scroll', function () {
         self.update(summernote.invoke('editor.restoreTarget'));
       });
+
     };
 
     this.posFromPlaceholder = function (placeholder) {

diff --git a/src/js/bs3/module/LinkPopover.js b/src/js/bs3/module/LinkPopover.js
@@ -9,28 +9,18 @@ define([
 
     var $note = summernote.layoutInfo.note;
     var $editingArea = summernote.layoutInfo.editingArea;
-    var lang = summernote.options.langInfo;
+    var options = summernote.options;
 
     var $popover = ui.popover({
-      children: [
-        ui.buttonGroup([
-          ui.button({
-            contents: '<i class="fa fa-link"/>',
-            tooltip: lang.link.edit,
-            click: summernote.createInvokeHandler('linkDialog.show')
-          }),
-          ui.button({
-            contents: '<i class="fa fa-unlink"/>',
-            tooltip: lang.link.unlink,
-            click: summernote.createInvokeHandler('editor.unlink')
-          })
-        ])
-      ]
+      className: 'note-link-popover'
     }).render();
 
     $editingArea.append($popover);
 
     this.initialize = function () {
+
+      summernote.generateButtons($popover.find('.popover-content'), options.popover.link);
+
       $note.on('summernote.keyup summernote.mouseup summernote.change', function (customEvent, event) {
         self.update(event.target);
       }).on('summernote.scroll', function () {