Refactors most controllers and directives into classes for more organized and maintainable code
This commit is contained in:
Mo Bitar
@@ -3,53 +3,149 @@
|
||||
#notes-title-bar.section-title-bar
|
||||
.padded
|
||||
.section-title-bar-header
|
||||
.title {{ctrl.panelTitle}}
|
||||
.sk-button.contrast.wide(ng-click='ctrl.createNewNote()', title='Create a new note in the selected tag')
|
||||
.title {{self.state.panelTitle}}
|
||||
.sk-button.contrast.wide(
|
||||
ng-click='self.createNewNote()',
|
||||
title='Create a new note in the selected tag'
|
||||
)
|
||||
.sk-label
|
||||
i.icon.ion-plus.add-button
|
||||
.filter-section(role='search')
|
||||
input#search-bar.filter-bar(lowercase='true', ng-blur='ctrl.onFilterEnter()', ng-change='ctrl.filterTextChanged()', ng-keyup='$event.keyCode == 13 && ctrl.onFilterEnter();', ng-model='ctrl.noteFilter.text', placeholder='Search', select-on-click='true', title='Searches notes in the currently selected tag')
|
||||
#search-clear-button(ng-click='ctrl.clearFilterText();', ng-show='ctrl.noteFilter.text') ✕
|
||||
input#search-bar.filter-bar(
|
||||
lowercase='true',
|
||||
ng-blur='self.onFilterEnter()',
|
||||
ng-change='self.filterTextChanged()',
|
||||
ng-keyup='$event.keyCode == 13 && self.onFilterEnter();',
|
||||
ng-model='self.state.noteFilter.text',
|
||||
placeholder='Search',
|
||||
select-on-click='true',
|
||||
title='Searches notes in the currently selected tag'
|
||||
)
|
||||
#search-clear-button(
|
||||
ng-click='self.clearFilterText();',
|
||||
ng-show='self.state.noteFilter.text'
|
||||
) ✕
|
||||
#notes-menu-bar.sn-component
|
||||
.sk-app-bar.no-edges
|
||||
.left
|
||||
.sk-app-bar-item(ng-class="{'selected' : ctrl.showMenu}", ng-click='ctrl.showMenu = !ctrl.showMenu')
|
||||
.sk-app-bar-item(
|
||||
ng-class="{'selected' : self.state.mutable.showMenu}",
|
||||
ng-click='self.state.mutable.showMenu = !self.state.mutable.showMenu'
|
||||
)
|
||||
.sk-app-bar-item-column
|
||||
.sk-label
|
||||
| Options
|
||||
.sk-app-bar-item-column
|
||||
.sk-sublabel {{ctrl.optionsSubtitle()}}
|
||||
#notes-options-menu.sk-menu-panel.dropdown-menu(ng-show='ctrl.showMenu')
|
||||
.sk-sublabel {{self.optionsSubtitle()}}
|
||||
#notes-options-menu.sk-menu-panel.dropdown-menu(
|
||||
ng-show='self.state.mutable.showMenu'
|
||||
)
|
||||
.sk-menu-panel-header
|
||||
.sk-menu-panel-header-title Sort By
|
||||
a.info.sk-h5(ng-click='ctrl.toggleReverseSort()')
|
||||
| {{ctrl.sortReverse === true ? 'Disable Reverse Sort' : 'Enable Reverse Sort'}}
|
||||
menu-row(action="ctrl.selectedMenuItem(); ctrl.selectedSortByCreated()" circle="ctrl.sortBy == 'created_at' && 'success'" desc="'Sort notes by newest first'" label="'Date Added'")
|
||||
menu-row(action="ctrl.selectedMenuItem(); ctrl.selectedSortByUpdated()" circle="ctrl.sortBy == 'client_updated_at' && 'success'" desc="'Sort notes with the most recently updated first'" label="'Date Modified'")
|
||||
menu-row(action="ctrl.selectedMenuItem(); ctrl.selectedSortByTitle()" circle="ctrl.sortBy == 'title' && 'success'" desc="'Sort notes alphabetically by their title'" label="'Title'")
|
||||
a.info.sk-h5(ng-click='self.toggleReverseSort()')
|
||||
| {{self.state.sortReverse === true ? 'Disable Reverse Sort' : 'Enable Reverse Sort'}}
|
||||
menu-row(
|
||||
action="self.selectedMenuItem(); self.selectedSortByCreated()"
|
||||
circle="self.state.sortBy == 'created_at' && 'success'"
|
||||
desc="'Sort notes by newest first'"
|
||||
label="'Date Added'"
|
||||
)
|
||||
menu-row(
|
||||
action="self.selectedMenuItem(); self.selectedSortByUpdated()"
|
||||
circle="self.state.sortBy == 'client_updated_at' && 'success'"
|
||||
desc="'Sort notes with the most recently updated first'"
|
||||
label="'Date Modified'"
|
||||
)
|
||||
menu-row(
|
||||
action="self.selectedMenuItem(); self.selectedSortByTitle()"
|
||||
circle="self.state.sortBy == 'title' && 'success'"
|
||||
desc="'Sort notes alphabetically by their title'"
|
||||
label="'Title'"
|
||||
)
|
||||
.sk-menu-panel-section
|
||||
.sk-menu-panel-header
|
||||
.sk-menu-panel-header-title Display
|
||||
menu-row(action="ctrl.selectedMenuItem(); ctrl.togglePrefKey('showArchived')" circle="ctrl.showArchived ? 'success' : 'danger'" desc="'Archived notes are usually hidden. You can explicitly show them with this option.'" faded="!ctrl.showArchived" label="'Archived Notes'")
|
||||
menu-row(action="ctrl.selectedMenuItem(); ctrl.togglePrefKey('hidePinned')" circle="ctrl.hidePinned ? 'danger' : 'success'" 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.'" faded="ctrl.hidePinned" label="'Pinned Notes'")
|
||||
menu-row(action="ctrl.selectedMenuItem(); ctrl.togglePrefKey('hideNotePreview')" circle="ctrl.hideNotePreview ? 'danger' : 'success'" desc="'Hide the note preview for a more condensed list of notes'" faded="ctrl.hideNotePreview" label="'Note Preview'")
|
||||
menu-row(action="ctrl.selectedMenuItem(); ctrl.togglePrefKey('hideDate')" circle="ctrl.hideDate ? 'danger' : 'success'" desc="'Hide the date displayed in each row'" faded="ctrl.hideDate" label="'Date'")
|
||||
menu-row(action="ctrl.selectedMenuItem(); ctrl.togglePrefKey('hideTags')" circle="ctrl.hideTags ? 'danger' : 'success'" desc="'Hide the list of tags associated with each note'" faded="ctrl.hideTags" label="'Tags'")
|
||||
menu-row(
|
||||
action="self.selectedMenuItem(); self.togglePrefKey('showArchived')"
|
||||
circle="self.state.showArchived ? 'success' : 'danger'"
|
||||
desc=`'Archived notes are usually hidden.
|
||||
You can explicitly show them with this option.'`
|
||||
faded="!self.state.showArchived"
|
||||
label="'Archived Notes'"
|
||||
)
|
||||
menu-row(
|
||||
action="self.selectedMenuItem(); self.togglePrefKey('hidePinned')"
|
||||
circle="self.state.hidePinned ? 'danger' : 'success'"
|
||||
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.'`
|
||||
faded="self.state.hidePinned"
|
||||
label="'Pinned Notes'"
|
||||
)
|
||||
menu-row(
|
||||
action="self.selectedMenuItem(); self.togglePrefKey('hideNotePreview')"
|
||||
circle="self.state.hideNotePreview ? 'danger' : 'success'"
|
||||
desc="'Hide the note preview for a more condensed list of notes'"
|
||||
faded="self.state.hideNotePreview"
|
||||
label="'Note Preview'"
|
||||
)
|
||||
menu-row(
|
||||
action="self.selectedMenuItem(); self.togglePrefKey('hideDate')"
|
||||
circle="self.state.hideDate ? 'danger' : 'success'"
|
||||
desc="'Hide the date displayed in each row'"
|
||||
faded="self.state.hideDate"
|
||||
label="'Date'"
|
||||
)
|
||||
menu-row(
|
||||
action="self.selectedMenuItem(); self.togglePrefKey('hideTags')"
|
||||
circle="self.state.hideTags ? 'danger' : 'success'"
|
||||
desc="'Hide the list of tags associated with each note'"
|
||||
faded="self.state.hideTags"
|
||||
label="'Tags'"
|
||||
)
|
||||
.scrollable
|
||||
#notes-scrollable.infinite-scroll(can-load='true', infinite-scroll='ctrl.paginate()', threshold='200')
|
||||
.note(ng-class="{'selected' : ctrl.selectedNote == note}", ng-click='ctrl.selectNote(note, true)', ng-repeat='note in (ctrl.renderedNotes = (ctrl.notes | limitTo:ctrl.notesToDisplay)) track by note.uuid')
|
||||
#notes-scrollable.infinite-scroll(
|
||||
can-load='true',
|
||||
infinite-scroll='self.paginate()',
|
||||
threshold='200'
|
||||
)
|
||||
.note(
|
||||
ng-class="{'selected' : self.state.selectedNote == note}",
|
||||
ng-click='self.selectNote(note, true)',
|
||||
ng-repeat='note in self.state.renderedNotes track by note.uuid'
|
||||
)
|
||||
.note-flags(ng-show='note.flags.length > 0')
|
||||
.flag(ng-class='flag.class', ng-repeat='flag in note.flags')
|
||||
.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-bind-html='note.content.preview_html', ng-show='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.cachedUpdatedAtString || 'Now'}}
|
||||
span(ng-show="ctrl.sortBy != 'client_updated_at'") {{note.cachedCreatedAtString || 'Now'}}
|
||||
.note-preview(
|
||||
ng-if=`
|
||||
!self.state.hideNotePreview &&
|
||||
!note.content.hidePreview &&
|
||||
!note.content.protected`
|
||||
)
|
||||
.html-preview(
|
||||
ng-bind-html='note.content.preview_html',
|
||||
ng-show='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='!self.state.hideDate')
|
||||
span(ng-show="self.state.sortBy == 'client_updated_at'")
|
||||
| Modified {{note.cachedUpdatedAtString || 'Now'}}
|
||||
span(ng-show="self.state.sortBy != 'client_updated_at'")
|
||||
| {{note.cachedCreatedAtString || 'Now'}}
|
||||
.tags-string(ng-show='note.shouldShowTags')
|
||||
.faded {{note.savedTagsString || note.tagsString()}}
|
||||
panel-resizer(collapsable="true" control="ctrl.panelController" default-width="300" hoverable="true" on-resize-finish="ctrl.onPanelResize" panel-id="'notes-column'")
|
||||
panel-resizer(
|
||||
collapsable="true"
|
||||
control="self.panelController"
|
||||
default-width="300"
|
||||
hoverable="true"
|
||||
on-resize-finish="self.onPanelResize"
|
||||
panel-id="'notes-column'"
|
||||
)
|
||||
|
||||
Reference in New Issue
Block a user