From bf2950d43b7326558e3fe1e111b5b7c47e333a2e Mon Sep 17 00:00:00 2001
From: paresh-accolite <paresh.rai@accoliteindia.com>
Date: Fri, 25 Sep 2020 17:28:21 +0530
Subject: [PATCH 1/2] pr fixes

---
 README.md         | 18 ++++++++++++++++++
 src/vue-froala.js | 34 ++++++++++++++++++++++++----------
 2 files changed, 42 insertions(+), 10 deletions(-)

diff --git a/README.md b/README.md
index fa31fe1..ebfcb34 100644
--- a/README.md
+++ b/README.md
@@ -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
@@ -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')
diff --git a/src/vue-froala.js b/src/vue-froala.js
index 61df008..9f0304f 100644
--- a/src/vue-froala.js
+++ b/src/vue-froala.js
@@ -89,17 +89,16 @@ export default (Vue, Options = {}) => {
         }
 
         this.currentConfig = this.clone(this.config || this.defaultConfig);
-        this.currentConfig =  {...this.currentConfig};
+
+        this._editor = new FroalaEditor(this.$el, this.currentConfig, () => {
+          this.initListeners();
+          this.editorInitialized = true;
+        });
 
         this.setContent(true);
 
         // Bind editor events.
         this.registerEvents();
-        this.initListeners();
-
-        this._editor = new FroalaEditor(this.$el, this.currentConfig)
-
-        this.editorInitialized = true;
 
       },
 
@@ -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();
+          }
 
         }
 
@@ -217,6 +225,7 @@ export default (Vue, Options = {}) => {
       },
 
       destroyEditor: function() {
+        this.initEvents = [];
 
         if (this._editor) {
 
@@ -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();

From 74c0ec2ef8c4f1a747b0e708c7558c2789d5ca6d Mon Sep 17 00:00:00 2001
From: paresh-accolite <paresh.rai@accoliteindia.com>
Date: Wed, 30 Sep 2020 15:02:07 +0530
Subject: [PATCH 2/2] fixed the issue of initialize event

---
 src/vue-froala.js | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/vue-froala.js b/src/vue-froala.js
index 9f0304f..6553662 100644
--- a/src/vue-froala.js
+++ b/src/vue-froala.js
@@ -90,15 +90,15 @@ export default (Vue, Options = {}) => {
 
         this.currentConfig = this.clone(this.config || this.defaultConfig);
 
-        this._editor = new FroalaEditor(this.$el, this.currentConfig, () => {
-          this.initListeners();
-          this.editorInitialized = true;
-        });
-
         this.setContent(true);
 
         // Bind editor events.
         this.registerEvents();
+        this.initListeners();
+
+        this._editor = new FroalaEditor(this.$el, this.currentConfig)
+
+        this.editorInitialized = true;
 
       },