ember-summernote-lite

Description

A wrapper around the "lite" version of summernote for use in ember-cli projects.

This is a fork of devotox's ember-cli-summernote-editor, which removes the dependency on Bootstrap by using the "lite" version of summernote.

DEMO

Installation

• ember install ember-summernote-lite

Usage

Handlebar Template

import Ember from 'ember';
 
export default Ember.Controller.extend({
  height: 200,
  value: "Some intial contents go here. Lorem Ipsum is simply dummy text of the printing.",
  disabled: false,
 
  actions: {
    changeHeight(someObject) {
      let height = someObject.doSomeCalculationToGetHeight();
      set(this, 'height', height)
    }
  }
});

 
{{summernote-lite
  focus=false
  btnSize=bs-sm
  airMode=false
  height=height
  buttons=buttons
  toolbar=toolbar
  disabled=disabled
  callbacks=callbacks
  content=(readonly value)
  onContentChange=(action (mut value))
}}

Custom buttons usage

In hbs file

    {{summernote-lite content=article buttons=customButtons}}

In controller file

    import Ember from 'ember';
 
    export default Ember.Controller.extend({
        article: 'some text',
        customButtons: [],
 
        init() {
 
            let _onNewBlock = this.get('onNewBlock').bind(this);
 
            let newBlockButton = function (context) {
                var ui = $.summernote.ui;
 
                var button = ui.button({
                    contents: '<i class="fa fa-file-text-o"/> New div',
                    tooltip: 'New div',
                    click: _onNewBlock
                });
 
                return button.render();
            }
 
            this.customButtons.push(newBlockButton);
 
        },
 
        onNewBlock() {
            let blocks = '<div class="header" id="headerBlock"></div>';
            this.set('article', article + blocks);
        }
    });

All callbacks except onChange are supported.

The onChange callback are used internally for the onContentChange action.

    callbackOptions: {
      onInit: function() {
        console.log('Summernote is launched');
      },
      onEnter: function() {
        console.log('Enter/Return key pressed');
      },
      onPaste: function(e) {
        console.log('Called event paste');
      },
    },

Available options

See original library Summernote

License

MIT license.