diff options
Diffstat (limited to 'public/editor')
-rw-r--r-- | public/editor/editor.js | 46 | ||||
-rw-r--r-- | public/editor/quill-logo-36.png | bin | 0 -> 1730 bytes | |||
-rw-r--r-- | public/editor/style.css | 34 |
3 files changed, 79 insertions, 1 deletions
diff --git a/public/editor/editor.js b/public/editor/editor.js index 2c4972f..2d99674 100644 --- a/public/editor/editor.js +++ b/public/editor/editor.js @@ -1,5 +1,5 @@ var editor = new MediumEditor('.editable', { - buttons: ['bold', 'italic', 'header1', 'header2', 'quote', 'unorderedlist', 'pre'], + buttons: ['bold', 'italic', 'anchor', 'header1', 'header2', 'quote', 'unorderedlist', 'pre'], paste: { // This example includes the default options for paste, if nothing is passed this is what it used forcePlainText: false, @@ -30,3 +30,47 @@ $(function () { $('.placeholder').removeClass('placeholder'); }); }); + +/* ************************************************ */ +/* autosave loop */ +var autosaveTimeout = false; +function contentChanged() { + clearTimeout(autosaveTimeout); + $("#draft-status").text("Draft"); + autosaveTimeout = setTimeout(doAutoSave, 1000); +} +function doAutoSave() { + autosaveTimeout = false; + var savedData = { + title: $("#post-name").val(), + body: editor.serialize().content.value + } + localforage.setItem('currentdraft', savedData).then(function(){ + $("#draft-status").text("Saved"); + }); +} +$(function(){ + // Restore draft if present + localforage.getItem('currentdraft', function(err,val){ + if(val && val.body) { + $("#post-name").val(val.title); + $("#content").html(val.body); + $("#draft-status").text("Restored"); + } + }); +}); +/* ************************************************ */ + + +// Not sure why this isn't working +// editor.subscribe('editableInput', function(ev, editable) { +// console.log("stuff changed"); +// }); + +// This one works okay tho, but misses changes from the image uploader +editor.on(document.getElementById('content'), 'input', function(){ + contentChanged(); +}); +$(function(){ + $('#post-name').on('keyup', contentChanged); +}); diff --git a/public/editor/quill-logo-36.png b/public/editor/quill-logo-36.png Binary files differnew file mode 100644 index 0000000..90aebc4 --- /dev/null +++ b/public/editor/quill-logo-36.png diff --git a/public/editor/style.css b/public/editor/style.css index bec46db..8b91825 100644 --- a/public/editor/style.css +++ b/public/editor/style.css @@ -22,6 +22,38 @@ h1, h2, h3, h4, h5, h6, th, td, caption { font-weight:normal; } img { border: 0; } +/* ************************************** */ +/* Toolbar */ + +.toolbar { + padding: 13px; + border-bottom: 1px #eee solid; + background-color: rgba(255,255,255,0.97); + position: fixed; + top: 0; + width: 100%; + z-index: 1000; +} +.toolbar-left { + float: left; +} +.toolbar-right { + float: right; +} +.toolbar-left .item { + margin-right: 8px; + display: inline-block; +} +#draft-status { + font-size: 18px; + color: #aaa; +} +.toolbar .clear { + clear: both; +} + + +/* ************************************** */ /* Editor CSS */ body { @@ -39,6 +71,8 @@ body, input { .container { width: 960px; margin: 0 auto; + margin-top: 63px; + z-index: 0; } #post-name { |