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
new file mode 100644
index 0000000..90aebc4
Binary files /dev/null and b/public/editor/quill-logo-36.png differ
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 {
diff --git a/views/editor.php b/views/editor.php
index fc4fcc6..8bef0e5 100644
--- a/views/editor.php
+++ b/views/editor.php
@@ -41,9 +41,20 @@
+
+
diff --git a/views/partials/appcache.php b/views/partials/appcache.php
index 546685f..0bc21a6 100644
--- a/views/partials/appcache.php
+++ b/views/partials/appcache.php
@@ -17,6 +17,7 @@ CACHE MANIFEST
/editor/medium-editor/js/medium-editor.min.js
/editor/medium-editor/js/medium-editor-insert-plugin.min.js
/editor/localforage/localforage.js
+/editor/quill-logo-36.png
NETWORK:
*
+ Draft
+