meteor-autoform-summernote icon indicating copy to clipboard operation
meteor-autoform-summernote copied to clipboard

Custom Button (Dropdown)

Open mcinano opened this issue 9 years ago • 0 comments

Hi I'm trying to implement a custom button into my summernote toolbar. Using mpowaga/meteor-autoform-summernote.

My Schema refers to autoform and summernote:

autoform: {
  afFieldInput: {
    type: 'summernote',
    class: 'editor', // optional
    settings: SummernoteConfig.description // summernote options goes here
  },
}

my config is

SummernoteConfig = {};

var ObjectInsertButton = function (context) {
var ui = $.summernote.ui;
var buttonGroup = ui.buttonGroup([
  ui.button({
    contents: '<i class="fa fa-external-link"/><span class="caret"></span>',
    tooltip: 'Add an object from your universe',
    data:{
    toggle: 'dropdown'
  }
}),
ui.dropdown({
  className: 'dropdown-style',
    contents: "<ol><li>hello</li><li>hello europe</li><li>hello europe</li></ol>",
    callback: function ($dropdown) {
      $dropdown.find('li').each(function () {
        $(this).click(function() {
          context.invoke('editor.insertText', 'hello');
        });
      });
    }
})
]);

 return buttonGroup.render();   // return button as query object
};

SummernoteConfig.description = {
height: 250,
toolbar: [
  // [groupName, [list of button]]
  ['paragraph',['style']],
  ['style', ['bold', 'italic', 'underline', 'clear']],
  ['color', ['color']],
  ['para', ['ul', 'ol', 'paragraph']],
  ['mayouga',['objectinsertbtn']]
],
buttons: {
  objectinsertbtn: ObjectInsertButton
}
};

when invoking the click event context is undefined.

What do i have to do? Help appreciated.

mcinano avatar May 08 '16 13:05 mcinano