mirror of
https://github.com/sparksuite/simplemde-markdown-editor.git
synced 2024-06-15 12:16:07 +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
|
## Get the content
|
||||||
|
|
||||||
```JavaScript
|
```JavaScript
|
||||||
simplemde.codemirror.getValue();
|
simplemde.value();
|
||||||
```
|
```
|
||||||
|
|
||||||
## Configuration
|
## Configuration
|
||||||
|
|
||||||
- **element**: The DOM element for the textarea to use. Defaults to the first textarea on the page.
|
- **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
|
- Optionally, you can set an array of status bar elements to include
|
||||||
- **toolbar**: If set `false`, hide the toolbar. Defaults to `true`.
|
- **toolbar**: If set to `false`, hide the toolbar. Defaults to `true`.
|
||||||
- **autofocus**: If set `true`, autofocuses the editor. Defaults to `false`.
|
- **autofocus**: If set to `true`, autofocuses the editor. Defaults to `false`.
|
||||||
- **lineWrapping**: If set `false`, disable line wrapping. Defaults to `true`.
|
- **lineWrapping**: If set to `false`, disable line wrapping. Defaults to `true`.
|
||||||
- **indentWithTabs**: If set `false`, indent using spaces instead of tabs. 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`.
|
- **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
|
```JavaScript
|
||||||
new SimpleMDE({
|
new SimpleMDE({
|
||||||
|
@ -70,6 +74,11 @@ new SimpleMDE({
|
||||||
lineWrapping: false,
|
lineWrapping: false,
|
||||||
indentWithTabs: false,
|
indentWithTabs: false,
|
||||||
tabSize: 4,
|
tabSize: 4,
|
||||||
|
autosave: {
|
||||||
|
enabled: true,
|
||||||
|
unique_id: "MyUniqueID",
|
||||||
|
delay: 1000,
|
||||||
|
},
|
||||||
});
|
});
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
|
@ -524,10 +524,43 @@ SimpleMDE.prototype.render = function(el) {
|
||||||
if (options.status !== false) {
|
if (options.status !== false) {
|
||||||
this.createStatusbar();
|
this.createStatusbar();
|
||||||
}
|
}
|
||||||
|
if (options.autosave != undefined && options.autosave.enabled === true) {
|
||||||
|
this.autosave();
|
||||||
|
}
|
||||||
|
|
||||||
this._rendered = this.element;
|
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) {
|
SimpleMDE.prototype.createToolbar = function(items) {
|
||||||
items = items || this.options.toolbar;
|
items = items || this.options.toolbar;
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue