Skip to content

Latest commit

 

History

History
82 lines (64 loc) · 2.08 KB

README.md

File metadata and controls

82 lines (64 loc) · 2.08 KB

Build Status

ember-trix

This ember addon wrapped trix editor from Basecamp. Trix is a WYSIWYG editor, visit their demo site to know more about it.

Installation

$> ember install ember-trix

Example

Dummy page in test can help you understand the coding example. Here is an snippet about how to use closure action to save content.

/* /tests/dummy/app/controllers/index.js */
...
actions{
  handleTrixEvent(event) {
    ...
    let document = event.target.editor.getDocument();
    let raw = Trix.serializeToContentType(document, 'text/html');
    set(this, 'raw', raw);
  }
  ...
}

/* /tests/dummy/app/templates/index.hbs */
...
{{ember-trix
  autofocus=true
  class="my-trix-editor"
  placeholder="Type Something or Drag an Image here"
  trix-attachment-add=(action "handleTrixAttachmentAddEvent")
  trix-attachment-remove=(action "handleTrixEvent")
  trix-blur=(action "handleTrixEvent")
  trix-change=(action "handleTrixEvent")
  trix-file-accept=(action "handleTrixEvent")
  trix-focus=(action "handleTrixEvent")
  trix-initialize=(action "handleTrixInitializeEvent")
  trix-selection-change=(action "handleTrixEvent")
}}
..

The accepted parameters are autofocus, class, placeholder, and you can assign your closure actions as trix event handler.

The built-in events are:

  • trix-attachment-add
  • trix-attachment-remove
  • trix-blur
  • trix-change
  • trix-file-accept
  • trix-focus
  • trix-initialize
  • trix-selection-change

For more detail about trix, check out their Github page.

Developing

  • git clone this repository
  • npm install
  • bower install

Running

Running Tests

  • npm test (Runs ember try:testall to test your addon against multiple Ember versions)
  • ember test
  • ember test --server

Building

  • ember build

For more information on using ember-cli, visit http://www.ember-cli.com/.