fix: enable, disable, sync editor stack per note

standardnotes · Jul 7, 2020 · e280309 · e280309
1 parent e45d28b
commit e280309
Show file tree

Hide file tree

Showing 2 changed files with 181 additions and 178 deletions.
diff --git a/app/assets/javascripts/views/editor/editor-view.pug b/app/assets/javascripts/views/editor/editor-view.pug
@@ -1,9 +1,9 @@
 #editor-column.section.editor.sn-component(aria-label='Note')
   .sn-component
     .sk-app-bar.no-edges(
-      ng-if='self.noteLocked', 
-      ng-init="self.lockText = 'Note Locked'", 
-      ng-mouseleave="self.lockText = 'Note Locked'", 
+      ng-if='self.noteLocked',
+      ng-init="self.lockText = 'Note Locked'",
+      ng-mouseleave="self.lockText = 'Note Locked'",
       ng-mouseover="self.lockText = 'Unlock'"
       )
       .left
@@ -12,17 +12,17 @@
             i.icon.ion-locked
             | {{self.lockText}}
   #editor-title-bar.section-title-bar(
-    ng-class="{'locked' : self.noteLocked}", 
+    ng-class="{'locked' : self.noteLocked}",
     ng-show='self.note && !self.note.errorDecrypting'
     )
     .title
       input#note-title-editor.input(
-        ng-blur='self.onTitleBlur()', 
-        ng-change='self.onTitleChange()', 
-        ng-disabled='self.noteLocked', 
-        ng-focus='self.onTitleFocus()', 
-        ng-keyup='$event.keyCode == 13 && self.onTitleEnter($event)', 
-        ng-model='self.editorValues.title', 
+        ng-blur='self.onTitleBlur()',
+        ng-change='self.onTitleChange()',
+        ng-disabled='self.noteLocked',
+        ng-focus='self.onTitleFocus()',
+        ng-keyup='$event.keyCode == 13 && self.onTitleEnter($event)',
+        ng-model='self.editorValues.title',
         select-on-focus='true',
         spellcheck='false'
         )
@@ -34,28 +34,28 @@
     .editor-tags
       #note-tags-component-container(ng-if='self.activeTagsComponent')
         component-view.component-view(
-          component-uuid='self.activeTagsComponent.uuid', 
-          ng-class="{'locked' : self.noteLocked}", 
+          component-uuid='self.activeTagsComponent.uuid',
+          ng-class="{'locked' : self.noteLocked}",
           ng-style="self.noteLocked && {'pointer-events' : 'none'}",
           application='self.application'
           )
       input.tags-input(
-        ng-blur='self.onTagsInputBlur()', 
-        ng-disabled='self.noteLocked', 
-        ng-if='!self.activeTagsComponent', 
-        ng-keyup='$event.keyCode == 13 && $event.target.blur();', 
-        ng-model='self.editorValues.tagsInputValue', 
-        placeholder='#tags', 
-        spellcheck='false', 
+        ng-blur='self.onTagsInputBlur()',
+        ng-disabled='self.noteLocked',
+        ng-if='!self.activeTagsComponent',
+        ng-keyup='$event.keyCode == 13 && $event.target.blur();',
+        ng-model='self.editorValues.tagsInputValue',
+        placeholder='#tags',
+        spellcheck='false',
         type='text'
         )
   .sn-component(ng-if='self.note')
     #editor-menu-bar.sk-app-bar.no-edges
       .left
         .sk-app-bar-item(
-          click-outside=`self.setMenuState('showOptionsMenu', false)`, 
-          is-open='self.state.showOptionsMenu', 
-          ng-class="{'selected' : self.state.showOptionsMenu}", 
+          click-outside=`self.setMenuState('showOptionsMenu', false)`,
+          is-open='self.state.showOptionsMenu',
+          ng-class="{'selected' : self.state.showOptionsMenu}",
           ng-click="self.toggleMenu('showOptionsMenu')"
           )
           .sk-label Options
@@ -64,182 +64,182 @@
               .sk-menu-panel-header
                 .sk-menu-panel-header-title Note Options
               menu-row(
-                action='self.selectedMenuItem(true); self.togglePin()' 
-                desc="'Pin or unpin a note from the top of your list'", 
+                action='self.selectedMenuItem(true); self.togglePin()'
+                desc="'Pin or unpin a note from the top of your list'",
                 label="self.note.pinned ? 'Unpin' : 'Pin'"
                 )
               menu-row(
-                action='self.selectedMenuItem(true); self.toggleArchiveNote()' 
-                desc="'Archive or unarchive a note from your Archived system tag'", 
+                action='self.selectedMenuItem(true); self.toggleArchiveNote()'
+                desc="'Archive or unarchive a note from your Archived system tag'",
                 label="self.note.archived ? 'Unarchive' : 'Archive'"
                 )
               menu-row(
-                action='self.selectedMenuItem(true); self.toggleLockNote()' 
-                desc="'Locking notes prevents unintentional editing'", 
+                action='self.selectedMenuItem(true); self.toggleLockNote()'
+                desc="'Locking notes prevents unintentional editing'",
                 label="self.noteLocked ? 'Unlock' : 'Lock'"
                 )
               menu-row(
-                action='self.selectedMenuItem(true); self.toggleProtectNote()' 
-                desc=`'Protecting a note will require credentials to view 
-                  it (Manage Privileges via Account menu)'`, 
+                action='self.selectedMenuItem(true); self.toggleProtectNote()'
+                desc=`'Protecting a note will require credentials to view
+                  it (Manage Privileges via Account menu)'`,
                 label="self.note.protected ? 'Unprotect' : 'Protect'"
                 )
               menu-row(
-                action='self.selectedMenuItem(true); self.toggleNotePreview()' 
-                circle="self.note.hidePreview ? 'danger' : 'success'", 
-                circle-align="'right'", 
-                desc="'Hide or unhide the note preview from the list of notes'", 
+                action='self.selectedMenuItem(true); self.toggleNotePreview()'
+                circle="self.note.hidePreview ? 'danger' : 'success'",
+                circle-align="'right'",
+                desc="'Hide or unhide the note preview from the list of notes'",
                 label="'Preview'"
                 )
               menu-row(
-                action='self.selectedMenuItem(); self.deleteNote()' 
-                desc="'Send this note to the trash'", 
-                label="'Move to Trash'", 
-                ng-show='!self.state.altKeyDown && !self.note.trashed && !self.note.errorDecrypting', 
+                action='self.selectedMenuItem(); self.deleteNote()'
+                desc="'Send this note to the trash'",
+                label="'Move to Trash'",
+                ng-show='!self.state.altKeyDown && !self.note.trashed && !self.note.errorDecrypting',
                 stylekit-class="'warning'"
                 )
               menu-row(
-                action='self.selectedMenuItem(); self.deleteNotePermanantely()' 
-                desc="'Delete this note permanently from all your devices'", 
-                label="'Delete Permanently'", 
-                ng-show='!self.note.trashed && self.note.errorDecrypting', 
+                action='self.selectedMenuItem(); self.deleteNotePermanantely()'
+                desc="'Delete this note permanently from all your devices'",
+                label="'Delete Permanently'",
+                ng-show='!self.note.trashed && self.note.errorDecrypting',
                 stylekit-class="'danger'"
                 )
             div(ng-if='self.note.trashed || self.state.altKeyDown')
               menu-row(
-                action='self.selectedMenuItem(true); self.restoreTrashedNote()' 
-                desc="'Undelete this note and restore it back into your notes'", 
-                label="'Restore'", 
-                ng-show='self.note.trashed', 
+                action='self.selectedMenuItem(true); self.restoreTrashedNote()'
+                desc="'Undelete this note and restore it back into your notes'",
+                label="'Restore'",
+                ng-show='self.note.trashed',
                 stylekit-class="'info'"
                 )
               menu-row(
-                action='self.selectedMenuItem(true); self.deleteNotePermanantely()' 
-                desc="'Delete this note permanently from all your devices'", 
-                label="'Delete Permanently'", 
+                action='self.selectedMenuItem(true); self.deleteNotePermanantely()'
+                desc="'Delete this note permanently from all your devices'",
+                label="'Delete Permanently'",
                 stylekit-class="'danger'"
                 )
               menu-row(
-                action='self.selectedMenuItem(true); self.emptyTrash()' 
-                desc="'Permanently delete all notes in the trash'", 
-                label="'Empty Trash'", 
-                ng-show='self.note.trashed || !self.state.altKeyDown', 
-                stylekit-class="'danger'", 
+                action='self.selectedMenuItem(true); self.emptyTrash()'
+                desc="'Permanently delete all notes in the trash'",
+                label="'Empty Trash'",
+                ng-show='self.note.trashed || !self.state.altKeyDown',
+                stylekit-class="'danger'",
                 subtitle="self.getTrashCount() + ' notes in trash'"
                 )
             .sk-menu-panel-section
               .sk-menu-panel-header
                 .sk-menu-panel-header-title Global Display
               menu-row(
-                action="self.selectedMenuItem(true); self.toggleWebPrefKey(self.prefKeyMonospace)" 
-                circle="self.state.monospaceFont ? 'success' : 'neutral'", 
-                desc="'Toggles the font style for the default editor'", 
-                disabled='self.activeEditorComponent', 
-                label="'Monospace Font'", 
+                action="self.selectedMenuItem(true); self.toggleWebPrefKey(self.prefKeyMonospace)"
+                circle="self.state.monospaceFont ? 'success' : 'neutral'",
+                desc="'Toggles the font style for the default editor'",
+                disabled='self.activeEditorComponent',
+                label="'Monospace Font'",
                 subtitle="self.activeEditorComponent ? 'Not available with editor extensions' : null"
                 )
               menu-row(
-                action="self.selectedMenuItem(true); self.toggleWebPrefKey(self.prefKeySpellcheck)" 
-                circle="self.state.spellcheck ? 'success' : 'neutral'", 
-                desc="'Toggles spellcheck for the default editor'", 
-                disabled='self.activeEditorComponent', 
-                label="'Spellcheck'", 
+                action="self.selectedMenuItem(true); self.toggleWebPrefKey(self.prefKeySpellcheck)"
+                circle="self.state.spellcheck ? 'success' : 'neutral'",
+                desc="'Toggles spellcheck for the default editor'",
+                disabled='self.activeEditorComponent',
+                label="'Spellcheck'",
                 subtitle=`
-                  self.activeEditorComponent 
-                    ? 'Not available with editor extensions' 
+                  self.activeEditorComponent
+                    ? 'Not available with editor extensions'
                     : (self.state.isDesktop ? 'May degrade editor performance' : null)
                   `)
               menu-row(
-                action="self.selectedMenuItem(true); self.toggleWebPrefKey(self.prefKeyMarginResizers)" 
-                circle="self.state.marginResizersEnabled ? 'success' : 'neutral'", 
-                desc="'Allows for editor left and right margins to be resized'", 
-                faded='!self.state.marginResizersEnabled', 
+                action="self.selectedMenuItem(true); self.toggleWebPrefKey(self.prefKeyMarginResizers)"
+                circle="self.state.marginResizersEnabled ? 'success' : 'neutral'",
+                desc="'Allows for editor left and right margins to be resized'",
+                faded='!self.state.marginResizersEnabled',
                 label="'Margin Resizers'"
                 )
         .sk-app-bar-item(
           click-outside=`self.setMenuState('showEditorMenu', false)`
-          is-open='self.state.showEditorMenu', 
-          ng-class="{'selected' : self.state.showEditorMenu}", 
+          is-open='self.state.showEditorMenu',
+          ng-class="{'selected' : self.state.showEditorMenu}",
           ng-click="self.toggleMenu('showEditorMenu')"
           )
           .sk-label Editor
           editor-menu(
-            callback='self.editorMenuOnSelect', 
-            current-item='self.note', 
-            ng-if='self.state.showEditorMenu', 
+            callback='self.editorMenuOnSelect',
+            current-item='self.note',
+            ng-if='self.state.showEditorMenu',
             selected-editor-uuid='self.activeEditorComponent && self.activeEditorComponent.uuid',
             application='self.application'
             )
         .sk-app-bar-item(
-          click-outside=`self.setMenuState('showExtensions', false)`, 
-          is-open='self.state.showExtensions', 
-          ng-class="{'selected' : self.state.showExtensions}", 
+          click-outside=`self.setMenuState('showExtensions', false)`,
+          is-open='self.state.showExtensions',
+          ng-class="{'selected' : self.state.showExtensions}",
           ng-click="self.toggleMenu('showExtensions')"
           )
           .sk-label Actions
           actions-menu(
-            item='self.note', 
+            item='self.note',
             ng-if='self.state.showExtensions',
             application='self.application'
             )
         .sk-app-bar-item(
-          click-outside=`self.setMenuState('showSessionHistory', false)`, 
-          is-open='self.state.showSessionHistory', 
+          click-outside=`self.setMenuState('showSessionHistory', false)`,
+          is-open='self.state.showSessionHistory',
           ng-click="self.toggleMenu('showSessionHistory')"
           )
           .sk-label Session History
           session-history-menu(
-            item='self.note', 
+            item='self.note',
             ng-if='self.state.showSessionHistory',
             application='self.application'
             )
   #editor-content.editor-content(ng-if='!self.note.errorDecrypting')
     panel-resizer.left(
-      control='self.leftPanelPuppet', 
-      hoverable='true', 
-      min-width='300', 
-      ng-if='self.state.marginResizersEnabled', 
-      on-resize-finish='self.onPanelResizeFinish', 
-      panel-id="'editor-content'", 
+      control='self.leftPanelPuppet',
+      hoverable='true',
+      min-width='300',
+      ng-if='self.state.marginResizersEnabled',
+      on-resize-finish='self.onPanelResizeFinish',
+      panel-id="'editor-content'",
       property="'left'"
       )
     component-view.component-view(
-      component-uuid='self.activeEditorComponent.uuid', 
-      ng-if='self.activeEditorComponent && !self.state.editorComponentUnloading', 
+      component-uuid='self.activeEditorComponent.uuid',
+      ng-if='self.activeEditorComponent && !self.state.editorComponentUnloading',
       on-load='self.onEditorLoad',
       application='self.application'
       )
     textarea#note-text-editor.editable(
-      dir='auto', 
-      ng-attr-spellcheck='{{self.state.spellcheck}}', 
-      ng-change='self.contentChanged()', 
-      ng-click='self.clickedTextArea()', 
+      dir='auto',
+      ng-attr-spellcheck='{{self.state.spellcheck}}',
+      ng-change='self.contentChanged()',
+      ng-click='self.clickedTextArea()',
       ng-focus='self.onContentFocus()',
-      ng-if='!self.activeEditorComponent && !self.state.textareaUnloading', 
-      ng-model='self.editorValues.text', 
-      ng-model-options='{ debounce: self.state.editorDebounce}', 
-      ng-readonly='self.noteLocked', 
+      ng-if='!self.activeEditorComponent && !self.state.textareaUnloading',
+      ng-model='self.editorValues.text',
+      ng-model-options='{ debounce: self.state.editorDebounce}',
+      ng-readonly='self.noteLocked',
       ng-trim='false'
       )
       | {{self.onSystemEditorLoad()}}
     panel-resizer(
-      control='self.rightPanelPuppet', 
-      hoverable='true', min-width='300', 
-      ng-if='self.state.marginResizersEnabled', 
-      on-resize-finish='self.onPanelResizeFinish', 
-      panel-id="'editor-content'", 
+      control='self.rightPanelPuppet',
+      hoverable='true', min-width='300',
+      ng-if='self.state.marginResizersEnabled',
+      on-resize-finish='self.onPanelResizeFinish',
+      panel-id="'editor-content'",
       property="'right'"
       )
   .section(ng-show='self.note.errorDecrypting')
     p.medium-padding(style='padding-top: 0 !important;')
-      | There was an error decrypting this item. Ensure you are running the 
+      | There was an error decrypting this item. Ensure you are running the
       | latest version of this app, then sign out and sign back in to try again.
   #editor-pane-component-stack(ng-show='self.note')
     #component-stack-menu-bar.sk-app-bar.no-edges(ng-if='self.state.allStackComponents.length')
       .left
         .sk-app-bar-item(
           ng-repeat='component in self.state.allStackComponents track by component.uuid'
-          ng-click='self.toggleStackComponentForCurrentItem(component)', 
+          ng-click='self.toggleStackComponentForCurrentItem(component)',
           )
           .sk-app-bar-item-column
             .sk-circle.small(
@@ -249,9 +249,9 @@
             .sk-label {{component.name}}
     .sn-component
       component-view.component-view.component-stack-item(
-        ng-repeat='component in self.state.activeStackComponents track by component.uuid', 
-        component-uuid='component.uuid', 
-        manual-dealloc='true', 
+        ng-repeat='component in self.state.allStackComponents track by component.uuid',
+        component-uuid='component.uuid',
+        manual-dealloc='true',
         ng-show='!self.stackComponentHidden(component)',
         application='self.application'
-        )
+      )