From 450bead2d16d62f9a30c13522d8e773db3c0b2e6 Mon Sep 17 00:00:00 2001 From: firm1 Date: Wed, 15 Apr 2020 12:16:00 +0200 Subject: [PATCH 1/3] fix #181 : allow saving only on change content --- CHANGELOG.md | 1 + README.md | 2 ++ src/js/easymde.js | 29 +++++++++++++++++++++-------- 3 files changed, 24 insertions(+), 8 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index aa754fe..db7dba4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,6 +8,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Added - Support for Node.js 14. - Preview without fullscreen (Thanks to [@nick-denry], [#196]). +- `autosave.saveOnChangeText` option to save the text only when modifying the content of the easymde instance (Thanks to [@firm1], [#181]). ### Fixed - Fix cursor displayed position on activity ([#183]). diff --git a/README.md b/README.md index 451c3c0..c05404e 100644 --- a/README.md +++ b/README.md @@ -121,6 +121,7 @@ easyMDE.value('New input for **EasyMDE**'); - **enabled**: If set to `true`, saves the text automatically. Defaults to `false`. - **delay**: Delay between saves, in milliseconds. Defaults to `10000` (10s). - **submit_delay**: Delay before assuming that submit of the form failed and saving the text, in milliseconds. Defaults to `autosave.delay` or `10000` (10s). + - **saveOnChangeText**: Saves the text only when the content has been changed. Without this parameter, the text will be saved periodically according to the `autosave.delay` parameter. - **uniqueId**: You must set a unique string identifier so that EasyMDE can autosave. Something that separates this from other instances of EasyMDE elsewhere on your website. - **timeFormat**: Set DateTimeFormat. More information see [DateTimeFormat instances](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat). Default `locale: en-US, format: hour:minute`. - **text**: Set text for autosave. @@ -210,6 +211,7 @@ var editor = new EasyMDE({ uniqueId: "MyUniqueID", delay: 1000, submit_delay: 5000, + saveOnChangeText: true, timeFormat: { locale: 'en-US', format: { diff --git a/src/js/easymde.js b/src/js/easymde.js index e5bba82..0ab7e46 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -2035,7 +2035,16 @@ EasyMDE.prototype.render = function (el) { this.gui.statusbar = this.createStatusbar(); } if (options.autosave != undefined && options.autosave.enabled === true) { - this.autosave(); + if(this.options.autosave.saveOnChangeText !== undefined && this.options.autosave.saveOnChangeText === true) { + this.autosave(false); // use to load localstorage content + this.codemirror.on('change', function () { + setTimeout(function () { + self.autosave(false); + }, self.options.autosave.submit_delay || self.options.autosave.delay || 1000); + }); + } else { + this.autosave(true); + } } this.gui.sideBySide = this.createSideBySide(); @@ -2066,7 +2075,7 @@ function isLocalStorageAvailable() { return true; } -EasyMDE.prototype.autosave = function () { +EasyMDE.prototype.autosave = function (repeatSaving) { if (isLocalStorageAvailable()) { var easyMDE = this; @@ -2084,9 +2093,11 @@ EasyMDE.prototype.autosave = function () { localStorage.removeItem('smde_' + easyMDE.options.autosave.uniqueId); // Restart autosaving in case the submit will be cancelled down the line - setTimeout(function () { - easyMDE.autosave(); - }, easyMDE.options.autosave.submit_delay || easyMDE.options.autosave.delay || 10000); + if (repeatSaving === true) { + setTimeout(function () { + easyMDE.autosave(repeatSaving); + }, easyMDE.options.autosave.submit_delay || easyMDE.options.autosave.delay || 10000); + } }); } @@ -2118,9 +2129,11 @@ EasyMDE.prototype.autosave = function () { el.innerHTML = save + dd; } - this.autosaveTimeoutId = setTimeout(function () { - easyMDE.autosave(); - }, this.options.autosave.delay || 10000); + if (repeatSaving === true) { + this.autosaveTimeoutId = setTimeout(function () { + easyMDE.autosave(repeatSaving); + }, this.options.autosave.delay || 10000); + } } else { console.log('EasyMDE: localStorage not available, cannot autosave'); } From 825c65e204426487a4a7b93c947e71ad757f4e27 Mon Sep 17 00:00:00 2001 From: firm1 Date: Tue, 28 Apr 2020 10:32:10 +0200 Subject: [PATCH 2/3] not an option but a bugfix --- CHANGELOG.md | 2 +- README.md | 2 -- src/js/easymde.js | 31 +++++++------------------------ 3 files changed, 8 insertions(+), 27 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index db7dba4..6c60671 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,11 +8,11 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Added - Support for Node.js 14. - Preview without fullscreen (Thanks to [@nick-denry], [#196]). -- `autosave.saveOnChangeText` option to save the text only when modifying the content of the easymde instance (Thanks to [@firm1], [#181]). ### Fixed - Fix cursor displayed position on activity ([#183]). - Checkboxes always have bullets in front of them ([#136]). +- Save the text only when modifying the content of the easymde instance (Thanks to [@firm1], [#181]). ## [2.10.1] - 2020-04-06 ### Fixed diff --git a/README.md b/README.md index c05404e..451c3c0 100644 --- a/README.md +++ b/README.md @@ -121,7 +121,6 @@ easyMDE.value('New input for **EasyMDE**'); - **enabled**: If set to `true`, saves the text automatically. Defaults to `false`. - **delay**: Delay between saves, in milliseconds. Defaults to `10000` (10s). - **submit_delay**: Delay before assuming that submit of the form failed and saving the text, in milliseconds. Defaults to `autosave.delay` or `10000` (10s). - - **saveOnChangeText**: Saves the text only when the content has been changed. Without this parameter, the text will be saved periodically according to the `autosave.delay` parameter. - **uniqueId**: You must set a unique string identifier so that EasyMDE can autosave. Something that separates this from other instances of EasyMDE elsewhere on your website. - **timeFormat**: Set DateTimeFormat. More information see [DateTimeFormat instances](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat). Default `locale: en-US, format: hour:minute`. - **text**: Set text for autosave. @@ -211,7 +210,6 @@ var editor = new EasyMDE({ uniqueId: "MyUniqueID", delay: 1000, submit_delay: 5000, - saveOnChangeText: true, timeFormat: { locale: 'en-US', format: { diff --git a/src/js/easymde.js b/src/js/easymde.js index 0ab7e46..e1b465e 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -2035,16 +2035,12 @@ EasyMDE.prototype.render = function (el) { this.gui.statusbar = this.createStatusbar(); } if (options.autosave != undefined && options.autosave.enabled === true) { - if(this.options.autosave.saveOnChangeText !== undefined && this.options.autosave.saveOnChangeText === true) { - this.autosave(false); // use to load localstorage content - this.codemirror.on('change', function () { - setTimeout(function () { - self.autosave(false); - }, self.options.autosave.submit_delay || self.options.autosave.delay || 1000); - }); - } else { - this.autosave(true); - } + this.autosave(); // use to load localstorage content + this.codemirror.on('change', function () { + setTimeout(function () { + self.autosave(); + }, self.options.autosave.submit_delay || self.options.autosave.delay || 1000); + }); } this.gui.sideBySide = this.createSideBySide(); @@ -2075,7 +2071,7 @@ function isLocalStorageAvailable() { return true; } -EasyMDE.prototype.autosave = function (repeatSaving) { +EasyMDE.prototype.autosave = function () { if (isLocalStorageAvailable()) { var easyMDE = this; @@ -2091,13 +2087,6 @@ EasyMDE.prototype.autosave = function (repeatSaving) { easyMDE.autosaveTimeoutId = undefined; localStorage.removeItem('smde_' + easyMDE.options.autosave.uniqueId); - - // Restart autosaving in case the submit will be cancelled down the line - if (repeatSaving === true) { - setTimeout(function () { - easyMDE.autosave(repeatSaving); - }, easyMDE.options.autosave.submit_delay || easyMDE.options.autosave.delay || 10000); - } }); } @@ -2128,12 +2117,6 @@ EasyMDE.prototype.autosave = function (repeatSaving) { el.innerHTML = save + dd; } - - if (repeatSaving === true) { - this.autosaveTimeoutId = setTimeout(function () { - easyMDE.autosave(repeatSaving); - }, this.options.autosave.delay || 10000); - } } else { console.log('EasyMDE: localStorage not available, cannot autosave'); } From 5db44ab734115651045799a561cd329594ff5c6c Mon Sep 17 00:00:00 2001 From: firm1 Date: Mon, 8 Jun 2020 11:15:30 +0200 Subject: [PATCH 3/3] better debounce --- src/js/easymde.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/js/easymde.js b/src/js/easymde.js index e1b465e..682a9c7 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -2037,7 +2037,8 @@ EasyMDE.prototype.render = function (el) { if (options.autosave != undefined && options.autosave.enabled === true) { this.autosave(); // use to load localstorage content this.codemirror.on('change', function () { - setTimeout(function () { + clearTimeout(self._autosave_timeout); + self._autosave_timeout = setTimeout(function () { self.autosave(); }, self.options.autosave.submit_delay || self.options.autosave.delay || 1000); }); @@ -2072,6 +2073,7 @@ function isLocalStorageAvailable() { } EasyMDE.prototype.autosave = function () { + console.log('save'); if (isLocalStorageAvailable()) { var easyMDE = this;