Resizable panels and user prefs

This commit is contained in:
Mo Bitar
2017-12-27 12:17:29 -06:00
parent 38f2e345d9
commit 8c15438d00
16 changed files with 603 additions and 163 deletions

View File

@@ -1,8 +1,8 @@
.section.editor{"ng-class" => "{'fullscreen' : ctrl.fullscreen}"}
#editor-title-bar.section-title-bar{"ng-show" => "ctrl.note && !ctrl.note.errorDecrypting", "ng-class" => "{'fullscreen' : ctrl.fullscreen }"}
.section.editor#editor-column
#editor-title-bar.section-title-bar{"ng-show" => "ctrl.note && !ctrl.note.errorDecrypting"}
.title
%input.input#note-title-editor{"ng-model" => "ctrl.note.title", "ng-keyup" => "$event.keyCode == 13 && ctrl.saveTitle($event)",
"ng-change" => "ctrl.nameChanged()", "ng-focus" => "ctrl.onNameFocus()",
"ng-change" => "ctrl.nameChanged()", "ng-focus" => "ctrl.onNameFocus()", "ng-blur" => "ctrl.onNameBlur()",
"select-on-click" => "true"}
#save-status{"ng-class" => "{'red bold': ctrl.saveError, 'orange bold': ctrl.syncTakingTooLong}", "ng-bind-html" => "ctrl.noteStatus"}
@@ -16,26 +16,31 @@
%li{"ng-class" => "{'selected' : ctrl.showMenu}", "click-outside" => "ctrl.showMenu = false;", "is-open" => "ctrl.showMenu"}
%label{"ng-click" => "ctrl.showMenu = !ctrl.showMenu; ctrl.showExtensions = false; ctrl.showEditorMenu = false;"} Menu
%ul.dropdown-menu.sectioned-menu{"ng-if" => "ctrl.showMenu"}
%li
%label{"ng-click" => "ctrl.selectedMenuItem($event); ctrl.togglePin()"}
%i.icon.ion-ios-flag
{{ctrl.note.pinned ? "Unpin" : "Pin"}}
%li
%label{"ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleArchiveNote()"}
%i.icon.ion-ios-box
{{ctrl.note.archived ? "Unarchive" : "Archive"}}
%li
%label{"ng-click" => "ctrl.selectedMenuItem($event); ctrl.deleteNote()"}
%i.icon.ion-trash-b
Delete
%li
%label{"ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleFullScreen()"}
%i.icon.ion-arrow-expand
Toggle Fullscreen
%li{"ng-if" => "ctrl.hasDisabledStackComponents()"}
%label{"ng-click" => "ctrl.selectedMenuItem($event); ctrl.restoreDisabledStackComponents()"} Restore Disabled Components
.dropdown-menu.sectioned-menu{"ng-if" => "ctrl.showMenu"}
%ul
.header
.title Note
%li{"ng-click" => "ctrl.selectedMenuItem($event); ctrl.togglePin()"}
%label
%i.icon.ion-ios-flag
{{ctrl.note.pinned ? "Unpin" : "Pin"}}
%li{"ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleArchiveNote()"}
%label
%i.icon.ion-ios-box
{{ctrl.note.archived ? "Unarchive" : "Archive"}}
%li{"ng-click" => "ctrl.selectedMenuItem($event); ctrl.deleteNote()"}
%label
%i.icon.ion-trash-b
Delete
%li{"ng-if" => "ctrl.hasDisabledComponents()"}
%label{"ng-click" => "ctrl.selectedMenuItem($event); ctrl.restoreDisabledComponents()"} Restore Disabled Components
%ul{"ng-if" => "!ctrl.editor"}
.header
.title Display
%li{"ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleKey('monospaceFont')"}
%label
%span.top.mt-5.mr-5{"ng-if" => "ctrl.monospaceFont == true"} ✓
Monospace Font
%li{"ng-class" => "{'selected' : ctrl.showEditorMenu}", "click-outside" => "ctrl.showEditorMenu = false;", "is-open" => "ctrl.showEditorMenu"}
%label{"ng-click" => "ctrl.showEditorMenu = !ctrl.showEditorMenu; ctrl.showMenu = false; ctrl.showExtensions = false;"} Editor
@@ -45,12 +50,14 @@
%label{"ng-click" => "ctrl.showExtensions = !ctrl.showExtensions; ctrl.showMenu = false; ctrl.showEditorMenu = false;"} Actions
%contextual-extensions-menu{"ng-if" => "ctrl.showExtensions", "item" => "ctrl.note"}
.editor-content{"ng-if" => "ctrl.noteReady && !ctrl.note.errorDecrypting", "ng-class" => "{'fullscreen' : ctrl.fullscreen }"}
.editor-content#editor-content{"ng-if" => "ctrl.noteReady && !ctrl.note.errorDecrypting"}
%panel-resizer.left{"panel-id" => "'editor-content'", "on-resize-finish" => "ctrl.onPanelResizeFinish","control" => "ctrl.resizeControl", "min-width" => 300, "property" => "'left'", "hoverable" => "true"}
%iframe#editor-iframe{"ng-if" => "ctrl.editorComponent && ctrl.editorComponent.active", "ng-src" => "{{ctrl.componentManager.urlForComponent(ctrl.editorComponent) | trusted}}", "data-component-id" => "{{ctrl.editorComponent.uuid}}", "frameBorder" => "0", "style" => "width: 100%;"}
Loading
%textarea.editable#note-text-editor{"ng-if" => "!ctrl.editorComponent", "ng-class" => "{'fullscreen' : ctrl.fullscreen }", "ng-model" => "ctrl.note.text",
%textarea.editable#note-text-editor{"ng-if" => "!ctrl.editorComponent", "ng-model" => "ctrl.note.text",
"ng-change" => "ctrl.contentChanged()", "ng-click" => "ctrl.clickedTextArea()", "ng-focus" => "ctrl.onContentFocus()", "dir" => "auto"}
{{ctrl.onSystemEditorLoad()}}
%panel-resizer{"panel-id" => "'editor-content'", "on-resize-finish" => "ctrl.onPanelResizeFinish","control" => "ctrl.resizeControl", "min-width" => 300, "hoverable" => "true"}
%section.section{"ng-if" => "ctrl.note.errorDecrypting"}