Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 18 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,22 @@

## Installation

### Use with Vue CLI

#### Generating simple webpack boilerplate with Vue-cli

*Note*: you can skip this part if you already have application generated.

```bash
npm install -g vue-cli
vue init webpack-simple my-project
cd my-project
npm install
npm run dev
```

#### Add vue-froala-wysiwyg

Install `vue-froala-wysiwyg` from `npm`

```bash
Expand Down Expand Up @@ -84,6 +100,8 @@ export default {

#### 2. Make sure you have the right Webpack settings for loading the CSS files.

*Note*: you can skip this part if you created your application using boiler plate generation code stated above.

```javascript
var webpack = require('webpack')
var path = require('path')
Expand Down
24 changes: 19 additions & 5 deletions src/vue-froala.js
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,6 @@ export default (Vue, Options = {}) => {
}

this.currentConfig = this.clone(this.config || this.defaultConfig);
this.currentConfig = {...this.currentConfig};

this.setContent(true);

Expand Down Expand Up @@ -178,12 +177,21 @@ export default (Vue, Options = {}) => {

function htmlSet() {

self._editor.html.set(self.model || '');
// Check if editor not null
if (self._editor == null) {
return;
}

if (self._editor.html != undefined) {
self._editor.html.set(self.model || '');
}

//This will reset the undo stack everytime the model changes externally. Can we fix this?

self._editor.undo.saveStep();
self._editor.undo.reset();
if (self._editor.undo != undefined) {
self._editor.undo.saveStep();
self._editor.undo.reset();
}

}

Expand Down Expand Up @@ -217,6 +225,7 @@ export default (Vue, Options = {}) => {
},

destroyEditor: function() {
this.initEvents = [];

if (this._editor) {

Expand Down Expand Up @@ -279,7 +288,12 @@ export default (Vue, Options = {}) => {
var self = this;

this.registerEvent('initialized', function () {
if (self._editor.events) {

// Editor initialized
self.editorInitialized = true;

// Check if editor not null and editor has events
if (self._editor != null && self._editor.events) {
// bind contentChange and keyup event to froalaModel
self._editor.events.on('contentChanged', function () {
self.updateModel();
Expand Down