From 795c498fe9080161764b79e644619ee1e9124e33 Mon Sep 17 00:00:00 2001 From: Mo Bitar Date: Wed, 30 Jan 2019 20:17:03 -0600 Subject: [PATCH] Remove in template filtering of notes to controller, 3.0.4-beta1 --- .../javascripts/app/controllers/notes.js | 133 +++++++++++------- .../app/directives/views/componentView.js | 4 +- app/assets/templates/editor.html.haml | 2 +- app/assets/templates/notes.html.haml | 38 +++-- app/assets/templates/tags.html.haml | 10 +- package.json | 2 +- 6 files changed, 108 insertions(+), 81 deletions(-) diff --git a/app/assets/javascripts/app/controllers/notes.js b/app/assets/javascripts/app/controllers/notes.js index 5264c9fef..455e56ae5 100644 --- a/app/assets/javascripts/app/controllers/notes.js +++ b/app/assets/javascripts/app/controllers/notes.js @@ -43,12 +43,14 @@ angular.module('app') modelManager.addItemSyncObserver("note-list", "*", (allItems, validItems, deletedItems, source, sourceKey) => { // reload our notes - this.setNotes(this.tag.notes); + this.reloadNotes(); // Note has changed values, reset its flags let notes = allItems.filter((item) => item.content_type == "Note"); for(let note of notes) { - note.flags = null; + this.loadFlagsForNote(note); + note.cachedCreatedAtString = note.createdAtString(); + note.cachedUpdatedAtString = note.updatedAtString(); } // select first note if none is selected @@ -58,7 +60,18 @@ angular.module('app') }); this.setNotes = function(notes) { - this.notes = this.sortNotes(notes, this.sortBy, this.sortReverse); + notes = this.filterNotes(notes); + notes = this.sortNotes(notes, this.sortBy, this.sortReverse); + for(let note of notes) { + note.shouldShowTags = this.shouldShowTagsForNote(note); + } + this.notes = notes; + + this.reloadPanelTitle(); + } + + this.reloadNotes = function() { + this.setNotes(this.tag.notes); } this.reorderNotes = function() { @@ -157,11 +170,11 @@ angular.module('app') this.resetPagination(); - this.panelTitle = function() { + this.reloadPanelTitle = function() { if(this.isFiltering()) { - return `${this.notes.filter((i) => {return i.visible;}).length} search results`; + this.panelTitle = `${this.notes.filter((i) => {return i.visible;}).length} search results`; } else if(this.tag) { - return `${this.tag.title}`; + this.panelTitle = `${this.tag.title}`; } } @@ -185,11 +198,7 @@ angular.module('app') return base; } - this.getNoteFlags = (note) => { - if(note.flags) { - return note.flags; - } - + this.loadFlagsForNote = (note) => { let flags = []; if(note.pinned) { @@ -227,17 +236,25 @@ angular.module('app') }) } + if(note.conflict_of) { + flags.push({ + text: "Conflicted Copy", + class: "danger" + }) + } + + if(note.errorDecrypting) { + flags.push({ + text: "Missing Keys", + class: "danger" + }) + } + note.flags = flags; return flags; } - this.toggleKey = function(key) { - this[key] = !this[key]; - authManager.setUserPrefValue(key, this[key]); - authManager.syncUserPreferences(); - } - this.tagDidChange = function(tag, oldTag) { var scrollable = document.getElementById("notes-scrollable"); if(scrollable) { @@ -327,37 +344,6 @@ angular.module('app') this.noteFilter = {text : ''}; - this.filterNotes = function(note) { - let canShowArchived = this.showArchived, canShowPinned = !this.hidePinned; - let isTrash = this.tag.content.isTrashTag; - - if(!isTrash && note.content.trashed) { - note.visible = false; - return note.visible; - } - - var isSmartTag = this.tag.isSmartTag(); - if(isSmartTag) { - canShowArchived = canShowArchived || this.tag.content.isArchiveTag || isTrash; - } - - if((note.archived && !canShowArchived) || (note.pinned && !canShowPinned)) { - note.visible = false; - return note.visible; - } - - var filterText = this.noteFilter.text.toLowerCase(); - if(filterText.length == 0) { - note.visible = true; - } else { - var words = filterText.split(" "); - var matchesTitle = words.every(function(word) { return note.safeTitle().toLowerCase().indexOf(word) >= 0; }); - var matchesBody = words.every(function(word) { return note.safeText().toLowerCase().indexOf(word) >= 0; }); - note.visible = matchesTitle || matchesBody; - } - - return note.visible; - }.bind(this) this.onFilterEnter = function() { // For Desktop, performing a search right away causes input to lose focus. @@ -376,21 +362,30 @@ angular.module('app') } this.filterTextChanged = function() { - if (this.searchSubmitted) { + if(this.searchSubmitted) { this.searchSubmitted = false; } - $timeout(function(){ + this.reloadNotes(); + + $timeout(() => { if(!this.selectedNote.visible) { this.selectFirstNote(); } - }.bind(this), 100) + }, 100) } this.selectedMenuItem = function() { this.showMenu = false; } + this.togglePrefKey = function(key) { + this[key] = !this[key]; + authManager.setUserPrefValue(key, this[key]); + authManager.syncUserPreferences(); + this.reloadNotes(); + } + this.selectedSortByCreated = function() { this.setSortBy("created_at"); } @@ -418,7 +413,7 @@ angular.module('app') authManager.syncUserPreferences(); } - this.shouldShowTags = function(note) { + this.shouldShowTagsForNote = function(note) { if(this.hideTags || note.content.protected) { return false; } @@ -435,6 +430,40 @@ angular.module('app') return note.tags && note.tags.length > 1; } + this.filterNotes = function(notes) { + return notes.filter((note) => { + let canShowArchived = this.showArchived, canShowPinned = !this.hidePinned; + let isTrash = this.tag.content.isTrashTag; + + if(!isTrash && note.content.trashed) { + note.visible = false; + return note.visible; + } + + var isSmartTag = this.tag.isSmartTag(); + if(isSmartTag) { + canShowArchived = canShowArchived || this.tag.content.isArchiveTag || isTrash; + } + + if((note.archived && !canShowArchived) || (note.pinned && !canShowPinned)) { + note.visible = false; + return note.visible; + } + + var filterText = this.noteFilter.text.toLowerCase(); + if(filterText.length == 0) { + note.visible = true; + } else { + var words = filterText.split(" "); + var matchesTitle = words.every(function(word) { return note.safeTitle().toLowerCase().indexOf(word) >= 0; }); + var matchesBody = words.every(function(word) { return note.safeText().toLowerCase().indexOf(word) >= 0; }); + note.visible = matchesTitle || matchesBody; + } + + return note.visible; + }); + } + this.sortNotes = function(items, sortBy, reverse) { let sortValueFn = (a, b, pinCheck = false) => { if(!pinCheck) { diff --git a/app/assets/javascripts/app/directives/views/componentView.js b/app/assets/javascripts/app/directives/views/componentView.js index 03a06b6e9..ff84d847d 100644 --- a/app/assets/javascripts/app/directives/views/componentView.js +++ b/app/assets/javascripts/app/directives/views/componentView.js @@ -128,7 +128,7 @@ class ComponentView { if(component) { componentManager.activateComponent(component, true); - console.log("Loading", $scope.component.name, $scope.getUrl(), component.valid_until); + // console.log("Loading", $scope.component.name, $scope.getUrl(), component.valid_until); $scope.reloadStatus(); } @@ -139,7 +139,7 @@ class ComponentView { }) $scope.reloadComponent = function() { - console.log("Reloading component", $scope.component); + // console.log("Reloading component", $scope.component); // force iFrame to deinit, allows new one to be created $scope.componentValid = false; componentManager.reloadComponent($scope.component).then(() => { diff --git a/app/assets/templates/editor.html.haml b/app/assets/templates/editor.html.haml index f0e6cd73c..da8df3bea 100644 --- a/app/assets/templates/editor.html.haml +++ b/app/assets/templates/editor.html.haml @@ -85,7 +85,7 @@ %panel-resizer{"ng-if" => "ctrl.marginResizersEnabled", "panel-id" => "'editor-content'", "on-resize-finish" => "ctrl.onPanelResizeFinish", "control" => "ctrl.rightResizeControl", "min-width" => 300, "hoverable" => "true", "property" => "'right'"} - .section{"ng-if" => "ctrl.note.errorDecrypting"} + .section{"ng-show" => "ctrl.note.errorDecrypting"} %p.medium-padding{"style" => "padding-top: 0 !important;"} 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" => "ctrl.note"} diff --git a/app/assets/templates/notes.html.haml b/app/assets/templates/notes.html.haml index f3f0d8d4b..f5f6e2e0f 100644 --- a/app/assets/templates/notes.html.haml +++ b/app/assets/templates/notes.html.haml @@ -3,14 +3,14 @@ .section-title-bar#notes-title-bar .padded .section-title-bar-header - .title {{ctrl.panelTitle()}} + .title {{ctrl.panelTitle}} .sk-button.contrast.wide{"ng-click" => "ctrl.createNewNote()", "title" => "Create a new note in the selected tag"} .sk-label + .filter-section{"role" => "search"} %input.filter-bar#search-bar.mousetrap{"select-on-click" => "true", "ng-model" => "ctrl.noteFilter.text", "placeholder" => "Search", "ng-change" => "ctrl.filterTextChanged()", "lowercase" => "true", "ng-blur" => "ctrl.onFilterEnter()", "ng-keyup" => "$event.keyCode == 13 && ctrl.onFilterEnter();", "title" => "Searches notes in the currently selected tag"} - #search-clear-button{"ng-if" => "ctrl.noteFilter.text", "ng-click" => "ctrl.clearFilterText();"} ✕ + #search-clear-button{"ng-show" => "ctrl.noteFilter.text", "ng-click" => "ctrl.clearFilterText();"} ✕ .sn-component#notes-menu-bar .sk-app-bar.no-edges .left @@ -21,7 +21,7 @@ .sk-app-bar-item-column .sk-sublabel {{ctrl.optionsSubtitle()}} - .sk-menu-panel.dropdown-menu{"ng-if" => "ctrl.showMenu"} + .sk-menu-panel.dropdown-menu{"ng-show" => "ctrl.showMenu"} .sk-menu-panel-header .sk-menu-panel-header-title Sort By .sk-button.sk-secondary-contrast{"ng-click" => "ctrl.toggleReverseSort()"} @@ -36,37 +36,35 @@ .sk-menu-panel-header .sk-menu-panel-header-title Display - %menu-row{"label" => "'Archived Notes'", "circle" => "ctrl.showArchived ? 'success' : 'danger'", "faded" => "!ctrl.showArchived", "action" => "ctrl.selectedMenuItem(); ctrl.toggleKey('showArchived')", "desc" => "'Archived notes are usually hidden. You can explicitly show them with this option.'"} - %menu-row{"label" => "'Pinned Notes'", "circle" => "ctrl.hidePinned ? 'danger' : 'success'", "faded" => "ctrl.hidePinned", "action" => "ctrl.selectedMenuItem(); ctrl.toggleKey('hidePinned')", "desc" => "'Pinned notes always appear on top. You can hide them temporarily with this option so you can focus on other notes in the list.'"} + %menu-row{"label" => "'Archived Notes'", "circle" => "ctrl.showArchived ? 'success' : 'danger'", "faded" => "!ctrl.showArchived", "action" => "ctrl.selectedMenuItem(); ctrl.togglePrefKey('showArchived')", "desc" => "'Archived notes are usually hidden. You can explicitly show them with this option.'"} + %menu-row{"label" => "'Pinned Notes'", "circle" => "ctrl.hidePinned ? 'danger' : 'success'", "faded" => "ctrl.hidePinned", "action" => "ctrl.selectedMenuItem(); ctrl.togglePrefKey('hidePinned')", "desc" => "'Pinned notes always appear on top. You can hide them temporarily with this option so you can focus on other notes in the list.'"} - %menu-row{"label" => "'Note Preview'", "circle" => "ctrl.hideNotePreview ? 'danger' : 'success'", "faded" => "ctrl.hideNotePreview", "action" => "ctrl.selectedMenuItem(); ctrl.toggleKey('hideNotePreview')", "desc" => "'Hide the note preview for a more condensed list of notes'"} - %menu-row{"label" => "'Date'", "circle" => "ctrl.hideDate ? 'danger' : 'success'","faded" => "ctrl.hideDate", "action" => "ctrl.selectedMenuItem(); ctrl.toggleKey('hideDate')", "desc" => "'Hide the date displayed in each row'"} - %menu-row{"label" => "'Tags'", "circle" => "ctrl.hideTags ? 'danger' : 'success'","faded" => "ctrl.hideTags", "action" => "ctrl.selectedMenuItem(); ctrl.toggleKey('hideTags')", "desc" => "'Hide the list of tags associated with each note'"} + %menu-row{"label" => "'Note Preview'", "circle" => "ctrl.hideNotePreview ? 'danger' : 'success'", "faded" => "ctrl.hideNotePreview", "action" => "ctrl.selectedMenuItem(); ctrl.togglePrefKey('hideNotePreview')", "desc" => "'Hide the note preview for a more condensed list of notes'"} + %menu-row{"label" => "'Date'", "circle" => "ctrl.hideDate ? 'danger' : 'success'","faded" => "ctrl.hideDate", "action" => "ctrl.selectedMenuItem(); ctrl.togglePrefKey('hideDate')", "desc" => "'Hide the date displayed in each row'"} + %menu-row{"label" => "'Tags'", "circle" => "ctrl.hideTags ? 'danger' : 'success'","faded" => "ctrl.hideTags", "action" => "ctrl.selectedMenuItem(); ctrl.togglePrefKey('hideTags')", "desc" => "'Hide the list of tags associated with each note'"} .scrollable .infinite-scroll#notes-scrollable{"infinite-scroll" => "ctrl.paginate()", "can-load" => "true", "threshold" => "200"} - .note{"ng-repeat" => "note in (ctrl.renderedNotes = (ctrl.notes | filter: ctrl.filterNotes | limitTo:ctrl.notesToDisplay)) track by note.uuid", + .note{"ng-repeat" => "note in (ctrl.renderedNotes = (ctrl.notes | limitTo:ctrl.notesToDisplay)) track by note.uuid", "ng-click" => "ctrl.selectNote(note, true)", "ng-class" => "{'selected' : ctrl.selectedNote == note}"} - %strong.red.medium-text{"ng-if" => "note.conflict_of"} Conflicted copy - %strong.red.medium-text{"ng-if" => "note.errorDecrypting"} Unable to Decrypt - .note-flags{"ng-show" => "ctrl.getNoteFlags(note).length > 0"} - .flag{"ng-repeat" => "flag in ctrl.getNoteFlags(note)", "ng-class" => "flag.class"} + .note-flags{"ng-show" => "note.flags.length > 0"} + .flag{"ng-repeat" => "flag in note.flags", "ng-class" => "flag.class"} .label {{flag.text}} .name{"ng-show" => "note.title"} {{note.title}} - .note-preview{"ng-if" => "!ctrl.hideNotePreview && !note.content.hidePreview && !note.content.protected"} - .html-preview{"ng-if" => "note.content.preview_html", "ng-bind-html" => "note.content.preview_html"} - .plain-preview{"ng-if" => "!note.content.preview_html && note.content.preview_plain"} {{note.content.preview_plain}} - .default-preview{"ng-if" => "!note.content.preview_html && !note.content.preview_plain"} {{note.text}} + .note-preview{"ng-show" => "!ctrl.hideNotePreview && !note.content.hidePreview && !note.content.protected"} + .html-preview{"ng-show" => "note.content.preview_html", "ng-bind-html" => "note.content.preview_html"} + .plain-preview{"ng-show" => "!note.content.preview_html && note.content.preview_plain"} {{note.content.preview_plain}} + .default-preview{"ng-show" => "!note.content.preview_html && !note.content.preview_plain"} {{note.text}} .date.faded{"ng-show" => "!ctrl.hideDate"} - %span{"ng-show" => "ctrl.sortBy == 'client_updated_at'"} Modified {{note.updatedAtString() || 'Now'}} - %span{"ng-show" => "ctrl.sortBy != 'client_updated_at'"} {{note.createdAtString() || 'Now'}} + %span{"ng-show" => "ctrl.sortBy == 'client_updated_at'"} Modified {{note.cachedUpdatedAtString || 'Now'}} + %span{"ng-show" => "ctrl.sortBy != 'client_updated_at'"} {{note.cachedCreatedAtString || 'Now'}} - .tags-string{"ng-show" => "ctrl.shouldShowTags(note)"} + .tags-string{"ng-show" => "note.shouldShowTags"} .faded {{note.savedTagsString || note.tagsString()}} %panel-resizer{"panel-id" => "'notes-column'", "default-width" => 300, "on-resize-finish" => "ctrl.onPanelResize", "control" => "ctrl.panelController", "hoverable" => "true", "collapsable" => "true"} diff --git a/app/assets/templates/tags.html.haml b/app/assets/templates/tags.html.haml index 54afbcb03..68c9e72ea 100644 --- a/app/assets/templates/tags.html.haml +++ b/app/assets/templates/tags.html.haml @@ -30,12 +30,12 @@ "ng-change" => "ctrl.tagTitleDidChange(tag)", "ng-blur" => "ctrl.saveTag($event, tag)", "spellcheck" => "false"} .count {{tag.cachedNoteCount}} - .red.small-text.bold{"ng-if" => "tag.conflict_of"} Conflicted copy - .red.small-text.bold{"ng-if" => "tag.errorDecrypting"} Unable to Decrypt + .red.small-text.bold{"ng-show" => "tag.conflict_of"} Conflicted copy + .red.small-text.bold{"ng-show" => "tag.errorDecrypting"} Unable to Decrypt - .menu{"ng-if" => "ctrl.selectedTag == tag"} - %a.item{"ng-click" => "ctrl.selectedRenameTag($event, tag)", "ng-if" => "!ctrl.editingTag"} Rename - %a.item{"ng-click" => "ctrl.saveTag($event, tag)", "ng-if" => "ctrl.editingTag"} Save + .menu{"ng-show" => "ctrl.selectedTag == tag"} + %a.item{"ng-click" => "ctrl.selectedRenameTag($event, tag)", "ng-show" => "!ctrl.editingTag"} Rename + %a.item{"ng-click" => "ctrl.saveTag($event, tag)", "ng-show" => "ctrl.editingTag"} Save %a.item{"ng-click" => "ctrl.selectedDeleteTag(tag)"} Delete .no-tags-placeholder{"ng-show" => "ctrl.tags.length == 0"} diff --git a/package.json b/package.json index 630e3adc3..34a6fbc60 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "standard-notes-web", - "version": "3.0.3", + "version": "3.0.4-beta1", "license": "AGPL-3.0-or-later", "repository": { "type": "git",