From 6969064b7c0eb16074128391d157f446b9d0567a Mon Sep 17 00:00:00 2001 From: Wes Cossick Date: Fri, 26 Jun 2015 15:33:28 -0500 Subject: [PATCH] Basic autosave functionality --- README.md | 21 +++++++++++++++------ source files/markdownify.js | 33 +++++++++++++++++++++++++++++++++ 2 files changed, 48 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index c301b71..3b28622 100644 --- a/README.md +++ b/README.md @@ -46,19 +46,23 @@ simplemde.render(); ## Get the content ```JavaScript -simplemde.codemirror.getValue(); +simplemde.value(); ``` ## Configuration - **element**: The DOM element for the textarea to use. Defaults to the first textarea on the page. -- **status**: If set `false`, hide the status bar. Defaults to `true`. +- **status**: If set to `false`, hide the status bar. Defaults to `true`. - Optionally, you can set an array of status bar elements to include -- **toolbar**: If set `false`, hide the toolbar. Defaults to `true`. -- **autofocus**: If set `true`, autofocuses the editor. Defaults to `false`. -- **lineWrapping**: If set `false`, disable line wrapping. Defaults to `true`. -- **indentWithTabs**: If set `false`, indent using spaces instead of tabs. Defaults to `true`. +- **toolbar**: If set to `false`, hide the toolbar. Defaults to `true`. +- **autofocus**: If set to `true`, autofocuses the editor. Defaults to `false`. +- **lineWrapping**: If set to `false`, disable line wrapping. Defaults to `true`. +- **indentWithTabs**: If set to `false`, indent using spaces instead of tabs. Defaults to `true`. - **tabSize**: If set, customize the tab size. Defaults to `2`. +- **autosave**: *Saves the content that users are writing, and clears it when the form is submitted* + - **enabled**: If set to `true`, autosave the editor. Defaults to `false`. + - **unique_id**: You must set a unique identifier so that SimpleMDE can autosave. Something that separates this from other textareas. + - **delay**: Delay between saves, in milliseconds. Defaults to `10000` (10s). ```JavaScript new SimpleMDE({ @@ -70,6 +74,11 @@ new SimpleMDE({ lineWrapping: false, indentWithTabs: false, tabSize: 4, + autosave: { + enabled: true, + unique_id: "MyUniqueID", + delay: 1000, + }, }); ``` diff --git a/source files/markdownify.js b/source files/markdownify.js index 421a539..90e2184 100644 --- a/source files/markdownify.js +++ b/source files/markdownify.js @@ -524,10 +524,43 @@ SimpleMDE.prototype.render = function(el) { if (options.status !== false) { this.createStatusbar(); } + if (options.autosave != undefined && options.autosave.enabled === true) { + this.autosave(); + } this._rendered = this.element; }; +SimpleMDE.prototype.autosave = function() { + var content = this.value(); + var simplemde = this; + + if(this.options.autosave.unique_id == undefined || this.options.autosave.unique_id == ""){ + console.log("SimpleMDE: You must set a unique_id to use the autosave feature"); + return; + } + + if(simplemde.element.form != null && simplemde.element.form != undefined){ + simplemde.element.form.addEventListener("submit", function(){ + localStorage.setItem(simplemde.options.autosave.unique_id, ""); + }); + } + + if(this.options.autosave.loaded !== true){ + console.log(localStorage.getItem(this.options.autosave.unique_id)); + this.codemirror.setValue(localStorage.getItem(this.options.autosave.unique_id)); + this.options.autosave.loaded = true; + } + + if(localStorage) { + localStorage.setItem(this.options.autosave.unique_id, content); + } + + setTimeout(function() { + simplemde.autosave(); + }, this.options.autosave.delay || 10000); +}; + SimpleMDE.prototype.createToolbar = function(items) { items = items || this.options.toolbar;