rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat: Add new "Change Editor" option to note context menu (#823)

Browse Source 
* feat: add editor icon

* refactor: remove 'any' type and format

* refactor: move NotesOptions and add ChangeEditorOption

* refactor: fix type for using regular RefObject<T>

* feat: add hide-if-last-child util class

* feat: add Change Editor option

* feat: make radio btn gray if not checked

* fix: accordion menu header and item sizing/spacing

* feat: add Escape key to KeyboardKey enum

* refactor: Remove Editor Menu

* feat: add editor select functionality

* refactor: move plain editor name to constant

* feat: add premium editors with modal if no subscription

refactor: simplify menu group creation

* feat: show alert when switching to non-interchangeable editor

* fix: change editor menu going out of bounds

* feat: increase group header & editor item size

* fix: change editor menu close on blur

* refactor: Use KeyboardKey enum & remove else statement

* feat: add keyboard navigation to change editor menu

* fix: editor menu separators

* feat: improve change editor menu sizing & spacing

* feat: show alert only if editor is not interchangeable

* feat: don't show alert when switching to/from plain editor

* chore: bump snjs version

* feat: temporarily remove change editor alert

* feat: dynamically get footer height

* refactor: move magic number to const

* refactor: move constants to constants file

* feat: use const instead of magic number
This commit is contained in:
Aman Harwara
2022-01-29 01:53:39 +05:30
committed by GitHub
parent 6aa926c2b0
commit b932e2a45e
21 changed files with 932 additions and 384 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
app/assets/javascripts/ui_models/app_state/notes_state.ts
View File

@@ -1,6 +1,7 @@
import { confirmDialog } from '@/services/alertService';
import { KeyboardModifier } from '@/services/ioService';
import { StringEmptyTrash, Strings, StringUtils } from '@/strings';
import { MENU_MARGIN_FROM_APP_BORDER } from '@/views/constants';
import {
UuidString,
SNNote,
@@ -205,32 +206,39 @@ export class NotesState {
document.documentElement
).fontSize;
const maxContextMenuHeight = parseFloat(defaultFontSize) * 30;
const footerHeight = 32;
const footerElementRect = document
.getElementById('footer-bar')
?.getBoundingClientRect();
const footerHeightInPx = footerElementRect?.height;
// Open up-bottom is default behavior
let openUpBottom = true;
const bottomSpace =
clientHeight - footerHeight - this.contextMenuClickLocation.y;
const upSpace = this.contextMenuClickLocation.y;
if (footerHeightInPx) {
const bottomSpace =
clientHeight - footerHeightInPx - this.contextMenuClickLocation.y;
const upSpace = this.contextMenuClickLocation.y;
// If not enough space to open up-bottom
if (maxContextMenuHeight > bottomSpace) {
// If there's enough space, open bottom-up
if (upSpace > maxContextMenuHeight) {
openUpBottom = false;
this.setContextMenuMaxHeight('auto');
// Else, reduce max height (menu will be scrollable) and open in whichever direction there's more space
} else {
if (upSpace > bottomSpace) {
this.setContextMenuMaxHeight(upSpace - 2);
// If not enough space to open up-bottom
if (maxContextMenuHeight > bottomSpace) {
// If there's enough space, open bottom-up
if (upSpace > maxContextMenuHeight) {
openUpBottom = false;
this.setContextMenuMaxHeight('auto');
// Else, reduce max height (menu will be scrollable) and open in whichever direction there's more space
} else {
this.setContextMenuMaxHeight(bottomSpace - 2);
if (upSpace > bottomSpace) {
this.setContextMenuMaxHeight(upSpace - MENU_MARGIN_FROM_APP_BORDER);
openUpBottom = false;
} else {
this.setContextMenuMaxHeight(
bottomSpace - MENU_MARGIN_FROM_APP_BORDER
);
}
}
} else {
this.setContextMenuMaxHeight('auto');
}
} else {
this.setContextMenuMaxHeight('auto');
}
if (openUpBottom) {