mirror of
https://github.com/sparksuite/simplemde-markdown-editor.git
synced 2024-06-15 20:25:17 +02:00
Basic autosave functionality
This commit is contained in:
parent
cac8f44891
commit
6969064b7c
21
README.md
21
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,
|
||||
},
|
||||
});
|
||||
```
|
||||
|
||||
|
|
|
@ -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;
|
||||
|
||||
|
|
Loading…
Reference in a new issue