Add auto-save support and saving indicator

2020-10-14 11:25:26 -05:00
parent 9a53faf338
commit 9f80842b9f
6 changed files with 64 additions and 6 deletions
--- a/src/app/pages/editor/editor.page.html
+++ b/src/app/pages/editor/editor.page.html
@@ -11,6 +11,12 @@
          class="title-input"
        ></ion-input>
      </ion-title>
+      <ion-buttons slot="end">
+        <button class="save-button" (click)="editorService.triggerSave()" title="Manually save this note">
+          <i *ngIf="!(editorService.isSaving || editorService.willSave)" class="fa fa-check-circle"></i>
+          {{ (editorService.isSaving || editorService.willSave) ? 'Saving...' : 'Saved!' }}
+        </button>
+      </ion-buttons>
    </ion-toolbar>
  </ion-header>

--- a/src/app/pages/editor/editor.page.scss
+++ b/src/app/pages/editor/editor.page.scss
@@ -48,3 +48,11 @@ ion-icon.invisible {
    color: #4d4d4d;
  }
 }
+
+.save-button {
+  color: #777;
+
+  i {
+    margin-right: 5px;
+  }
+}