Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[staging] Fix keyboard shortcuts on Edge and non-English layouts #2334

Merged
merged 2 commits into from
Sep 14, 2020

Conversation

codebykat
Copy link
Member

@codebykat codebykat commented Sep 14, 2020

Fix

Keyboard shortcuts are currently not working on legacy Edge, because it does not include a code value.

The docs recommend using key instead of code, anyhow:

Be aware, however, that you can't use the value reported by KeyboardEvent.code to determine the character generated by the keystroke, because the keycode's name may not match the actual character that's printed on the key or that's generated by the computer when the key is pressed.

For example, the code returned is "KeyQ" for the Q key on a QWERTY layout keyboard, but the same code value also represents the ' key on Dvorak keyboards and the A key on AZERTY keyboards. That makes it impossible to use the value of code to determine what the name of the key is to users if they're not using an anticipated keyboard layout.

To determine what character corresponds with the key event, use the KeyboardEvent.key property instead.

https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/code

I have NOT YET tested this very heavily so more testing would be appreciated!

Test

  1. Test all keyboard shortcuts on multiple browsers

@codebykat codebykat added this to the Rewrite/beta milestone Sep 14, 2020
@codebykat codebykat requested a review from a team September 14, 2020 06:57
@codebykat codebykat self-assigned this Sep 14, 2020
Copy link
Contributor

@belcherj belcherj left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm

@codebykat
Copy link
Member Author

Tested on OSX/Firefox, OSX/Chrome, OSX/Safari, Windows/Edge (legacy), Windows/Edge (Chromium), Windows/Firefox.

Found some regressions on Edge (Chromium) so I'm debugging that.

@codebykat
Copy link
Member Author

Edge (Chromium) should now be fixed

@codebykat codebykat merged commit adea08e into rewrite/no-races Sep 14, 2020
@codebykat codebykat deleted the fix/keyboard-shortcuts-on-edge branch September 14, 2020 18:48
dmsnell added a commit that referenced this pull request Sep 21, 2020
Trap account name when connecting
Type Simperium for real
Re-connect note editing to Simperium; bounce updated notes
Add sync indicators on note-level
remove pending ccid list; small cleanup
Fix or skip or delete failing tests
Bow to the linting gatekeepers
Bow to the linting gatekeepers
Try: remove arm builds to get electron-builder to go
Move all checkbox translation into the editor component
Adjust editor cursor/selection in response to remote updates
Fix edge cases with tasks and selection tracking
Track editor selection direction
Earmark selection tracking on undo/redo for later
Debounce search when receiving updates
Select first note that loads in app
Use search sort index instead of sorting on every search
Fix performance and display issues with note list previews
Allow syncing new notes
Add revision panel back in
Start making tag list sortable and editable
Inline checkbox/task font

I tried using a file-loader and things got complicated with Monaco's fonts
By inlining the font as a data-uri there's no complexity other than maintaining
the font, but it's trivial enough to recreate the font and convert it into
base64 that I felt it was sufficient to let this be.

Continue restoring functionality to tag list
Add some types to tag list interface
Connect to remote tag updates

Small cluterr
Start tracking tag changes
More tag tracking
Add back has-loaded
Allow tag reordering
Allow deleting tags
Fix title formatting/decorations
Remove syntax highlighting and set auto-indent
Support renaming tags; small font fix and type error fix
Allow escaping from preview mode if note un-markdownd
Fix revisions display issue
Reconnect settings to Electron
Add back "insert task" via hotkey
Extract generic bucket providers; sync tag renames
Synchronize preferences
Converge to a single ghost provider
Remove old noteChangeVersion reducer
Start introducing offline persistence
Load and persist revisions separately from the state
Disable revisions button if no revisions are avialable
Fix typo
Defer loading editor and fetching revisions for performance while switching notes
Fix Safari matchMedia bug

Fix Safari Monaco issue: advanced text-wrap crashes

Degrade gracefully in the absence of indexedDB (private mode)

Remove constraint on having indexedDB in platform support

Doubt relevance of test

Refactor code to avoid lint issue

Use published @types/simperium

Sync changes with bucket-queue worker

Use queue function not setTimeout for note sync

Create Note Doctor to find discrepancies with note sync

Warn when logging out with unconfirmed changes

Reconnect the rest of the menu options/settings

Fix Export (#2180)

Fix export on rewrite/no-races

Send notification on note update

Send message when note trashed

Limit notification length and provide default text

Allow logging out when no changes are unconfirmed

Move notifications code into new module

Separate local confirmations from remote updates

(dev) expose buckets to console

Add (un)publish notifications; skip some notification spam

restore tag icons, add overflow for scrolling (#2183)

Fix/search case sensitivity (#2182)

* search should be case insensitive

* fix missing search results due to column alignment

* lowercase term instead of regex

Rewrite tags

Confirm new tags on note creation; delete old tag on rename

Replace Monaco with textarea

Fix: Copy all html if nothing selected (#2184)

* first hack at this, broken

* pass state to useEffect and rename it

* this div is still not working and i am mad

* hook to promise chain, realize clipboard things are hard

* make it work in Safari too

Maintain consistency of login sessions across browser sessions

Fix notifications permissions requests: stop spamming

Fix tag-suggestion tests

Fix lint issues

More lint issues

Add beta warning

Allow exporiting unsyced notes on logout (Electron)

Add logout confirmation dialog

Warn before closing tab with synced changes

Marginally improve cursor when entering task item from hotkey

Stop resizing content editor

Linting issues

Use slightly-faster checkbox replacement

Style last synced indicator (#2203)

Update note list note status icons (#2204)

Add safety for broken/missing indexedDB props: @codebykat

Empty trash (#2209)

* got the basics, not working

* typos in comments

* make it go

Fix tag list CSS (#2210)

* move scrolling to child list

* add some right padding to avoid overlapping with scrollbar

* more small fixes

Reset some optimizations in the editor

Removes bottom border in the tag list (#2214)

Updates CSS for server connection (#2213)

Fix scroll bars on narrow line length (#2211)

When the narrow line length is set the scroll bar was not on the edge of the screen. This moves it back to the edge.

Update/offline badge (#2202)

Moves the offline badge from the bottom right to the note toolbar.

Filter collaboration (email) tags from tag list (#2205)

Updates unsynced notes log out dialog (#2206)

Display unknown in last updated when it is unknown (#2212)

Display unknown in the last synced indicator when we do not know when it was last synced.

Move all tasklist insertion into the editor itself

Use function-ref to boot editor; update text transform in reducer

Insert checkboxes through editor

Continue lists

Fix interaction of lists and tasks

Fix font issues

Add indent/outdent support

Stop indenting lines that follow blank lines

Show checkboxes in previews

Preserve some markdown settings

[rewrite branch] Change the unsynced notes icon to a less-scary one (#2218)

This changes the icon when a note has unsynced changes to the cloud sync icon.

Also changes it to blue and changes both this and the pin to simplenote-blue-20 in dark mode.

Fixes missing ids in note export (#2220)

Clear note list height cache when window width changes

Stop crashing when viewing a trashed note

Remove all text processing

make condensed actually condense (#2222)

[rewrite branch] update note list status icons (#2221)

* add smaller icons and restyle

* forgot to commit the style fix for the bottom border

* larger icons more padding

* clean up styles

Bring back Monaco

Spin sync indicator

only spin the sync icon, not the publish icon

Stop sync spinner when offline

Only load window-close-confirmation to browser

Update the editor width css to allow narrow/wide views (#2224)

Remove the add/confirm step which isn't necessary

Remove confirm step for tags

Fixes styling of offline badge (#2234)

Updates the color of the link in the logout confirm dialog (#2235)

Dont scroll editor past last line (#2238)

When you scroll a note it currently scrolls the note completely off the screen. This PR changes it so it does not scroll past the end of the note. I like the current behavior and think we should add this back as an option.

Allow scroll bar to be any height fixing it only scrolling partially to the bottom (#2239)

We had a fixed height on the scroll bar. This caused it to look like it hadn't scrolled all the way to the bottom. This removes that max height so that the scroll bar displays correctly.

Fixes editor width when narrow line length is selected (#2237)

My previous fix for the editor width only worked on the left margin. This fixes it so the editor width is constrained on both sides. It does however cause the scroll bar to be just inside the narrow view and not on the edge of the screen, see screenshot. I am not sure how to fix it to push it to the side.

This PR also fixes the jerkiness of the note when it opens. The padding applied to the content before the editor is ready is now the same as it is once Monaco renders.

Update height of note list item when condensed (#2246)

Clean up disable restore note button when is newset revision (#2248)

The disable on the restore note button when you are currently on the most recent revision is CSS and was not actually disabling the functionality. Additionally, the logic failed when you first opened the revisions panel. This gets everything into tip top.

Use distinct name for indexedDB persistence

Checks for Notification on window (#2225)

* Checks for Notification on window

* Use optional chaioning

* Dynamically load change announcer

Co-authored-by: Dennis Snell <dennis.snell@automattic.com>

Try for some easy wins on optimizing load

Hides last syncd message when it is unknown (#2236)

Hides the last syncd when it is unknown

Autolist behavior

Only use fast edit mode for long notes

Continue task lists too

Allow bullets at start of line, stop logging actions

Remove some pre-prod TODO items

Transform note content properly when clicking on tasks

Stop trying to fully-load an editor when it's gone

Updates to version 2.0.0-beta1 (#2252)

Disable note doctor for now; uncover bugs easier

Refactor some tag rename logic

[rewrite branch] Add analytics as middleware (#2223)

* centralize analytics again
 - not working attempt to convert to meta key
 - fixed addCollaborator args
 - add removeCollaborator reducer with withEvent
 - Add COLLABORATOR actions
 - remove invalid comments
 - remove unused setAccountName and some more comments
 - trying event queue to add application_opened before preferences are loaded
 - documented bugs :[

* Update analytics setting when bucket connects

* Set initial accountName in Redux init vs. dispatched action

* Send index request for preferences

* Persist account name properly

Co-authored-by: Dennis Snell <dennis.snell@automattic.com>

Remove tri-state analytics toggle

Sequence analytics updates

Fix analytics during import: use Redux action not direct function call

Revert "Add beta invitation banner (#2208)"

This reverts commit 2ea1d3d.

Take that out of there…

Fixes note underline in firefox (#2261)

Fixes the underline on detected links in Firefox.

Fixes the polyfill for Promise to make IE work (#2260)

The polyfils need to be moved up to boot so that they exist everywhere for Internet Explorer. We should look later at removing them when not necessary in browsers.

Stop removing Electron event listeners after adding the new ones

Add/sentry (#2262)

Adds Sentry to app so that we can track and fix errors

Harmonize menu bar and settings in sidebar (#2263)

The web app has settings/keyboard shortcuts/about items in the navigation bar but those are absent from Electron.
Electron already provides access to the settings through the OS menu but it's confusing to jump between the web and
the electron app to discover those items are missing in one place.

In this PR we stop hiding the settings and other items in the navigation sidebar when running in Electron.

The Electron OS menu has also been missing "Empty Trash" and "Sign Out" as the native apps have. "Sign Out" is particularly
convenient to have there and its absence makes logging-out particularly inconvenient.

As a result of the overall state refactor in the app we're adding those menu items to make it more convenient again.

Sync notes affected by a tag rename

Only select next note when trashing/deleting/restoring if opened note is affected note

Continue all tasks as unchecked

Remove Simplenote font from body fixing line height (#2274)

Support inter-note linking with Markdown syntax

Prefil full link syntax with note title when copying inter-note link

Drop lonely bullets on newline

create custom themes for Monaco (#2272)

[Rewrite Branch] Fixes undo redo selectall (#2181)

This fixes the undo, redo, and selectall in the Electron menu

add Tasks font back to preview wrapper (#2282)

[rewrite branch] Fix plain-text revision preview (#2281)

* always show plain-text note if we're showing revisions

* actually let's look at editMode so we can still preview rendered content

* move logic to mapStateToProps

disable bracket highlighting (#2283)

Fix task font by adding descent adjustment

Use wifi signal icons for server connection

[Rewrite Branch] Fix printing of notes (#2271)

This PR adds a display none div that contains the content of a note. When the user prints it displays that div and hides other content on the page.

Adding a display none div with the content allows us to do this purely with CSS rather than watching for print events and potentially running into race conditions with React rendering.

Clear React warnings in un-editable input components

(cherry picked from commit 5dd1cfbad1db305f6828193e0de5ec794d67e6a8)

Fix preview note view: grab proper note object and update with props

In #2281 we fixed the note preview so that it would only render a
Markdown-enabled note if the preview mode in the editor is set.

Unfortunately we missed a dependency in the `useEffect()` callback
and so the preview would only render the corresponding view to the
settings passed when it was first opened. This has been fixed by
adding the proper dependency.

Additionally we were only getting the Markdown setting for the passed
note, such as when viewing revisions from a note's history. For normal
preview views we missed examining the opened note. We have fixed this
by picking the appropriate note object to inspect when determining
which mode to render.

Remove test-account pre-filler: imlpement better later on

Stop updating note cell if it's no longer mounted

Reflow editor layout when changing line length

Pulled from #2247, props to @belcherj for the work

Delay re-running the editor resize to fix text-clipping after line-width change

Use updated connection icons: thanks @SylvesterWilmott!

Use updated sync icon so it spins clockwise

[rewrite branch] Fix keyboard shortcuts (#2284)

* disable keybindings Monaco is overriding

* also remove selectHighlights

* remove cursorUndo, jumpToBracket

* first hack at checkbox insertion

* change tag toggle back to a toggle

* Expand detection of tasks and bullets for various line contents

* fix cmd+A select all

* fix tag/editor toggle

* use a context key to always show keyboard hint in the context menu

* use editorCommand instead of appCommand for insertChecklist

* fix Electron menu items

Co-authored-by: Dennis Snell <dennis.snell@automattic.com>

[Rewrite Branch] Add debounce of 2 seconds to analytics for note edit (#2289)

* Add debounce of 2 seconds to analytics for note edit

* minor cleanup

Co-authored-by: Kat Hagan <kat@codebykat.com>

Audit note updates: update modification stamp; re-index note on changes

check for editor focus and fallback to native functionality (#2293)

Add missing style to fix react-virtualized autoSizing (#2294)

Adds highlighting in note for search query (#2292)

* Add document highlight provider to highglight search results

In this patch we're adding a new document highlight provider to highlight the
search results in a note. This may be a useful approach because it relies
entirely on Monaco's API to provide the functionality. Unfortunately in my
exploration it wasn't clear to me to how get this to highlight when the cursor
isn't on any word. The API appears to be designed to highlight related words to
the word under the cursor. If the cursor is on an empty line then nothing else
gets highlighted and the provider never gets called.

If we can force-trigger the highlighting to run this might be workable. We need
to do that and also be able to select an active highlight if we want to use
this for search.

We might have `editor.action.wordHighlight.trigger` as an action to call but I
gave up trying to figure out how to properly call it.

* Change highlight colors

* Use decorations

* Fix css class

* Remove uneeded highlighting styles

* Combine title and search decorators

* Make occurrencesHighlight false again

* Account for notes with no content

* Make highlight text white when in light mode

* Cleanup from code review

* Gate this to monaco so it doesnt run on fast view

Co-authored-by: Dennis Snell <dennis.snell@automattic.com>

Fixes line wrap in markdown view (#2296)

When you have a really really long word it can cause a horizontal scroll in markdown view. This will make words wrap.

Fixes the width of content in the editor (#2297)

Notes have a maximum width which is incorrect. This makes the max column width 400. Using the bounded strategy it will fill viewport till it hits 400 columns. By using advanced it fills in available space better.

[rewrite branch] Too many scrollbars (#2299)

I was testing on Windows/Edge and noticed we've got some scrollbars on note-detail and friends that are cluttering up the place.

The Monaco container is inside of .note-detail, and handles its own overflows and scrolling, so we don't need these.

Special-cased the Markdown preview; make sure you can scroll in preview if necessary!

[Rewrite Branch] Use Monaco context menu for editor actions (#2280)

Moves to the Monaco context menu. This enables undo/redo/select all/copy/cut from the context menu.

Disable Beta banner

Remove code that is causing continuous indexing events (#2304)

[rewrite branch] Fix various CSS issues (scrollbars, icons, font sizes) (#2303)

* tag list scrollbar auto

* keybindings scroll auto

* fix huge menu icon

* hide horizontal scroll on note detail

* first line should be relative correctly

* fix note list scrolling

Only request revisions when the revisions panel is opened (#2305)

Change how revisions are requested to not spam Simperium on every note switch.

only dispatch SET_ANALYTICS if the value is different from what we have in state (#2306)

Revert "only dispatch SET_ANALYTICS if the value is different from what we have in state (#2306)" (#2307)

This reverts commit e6ab711.

[rewrite branch] Only dispatch SET_ANALYTICS if it has changed, take 2 (#2308)

* check state not bucket

* remove random import

* coerce value

Relax preferences updates

Remove uneccesary divs (#2314)

[rewrite branch] Logout confirmation dialog: use color studio for all hex colors, fix typo (#2315)

* replace hex codes with color studio

* typo fix

Fixes the css so all pages print (#2319)

There were three issues with printing. The position relative shows more than the first page. The overflow auto allows all the pages to print. I have a note that should bee 22 pages but only 11 were printed without the overflow auto. The last issue is that display flex in Firefox causes only the first page to print. So added display: block to fix that.

Add persistent "preferences" bucket

Fixes the editor height in Safari (#2320)

Fixes safari height and Chrome editor width (#2321)

add a wrapper span so we can pass a disabled button (#2322)

Temporarily disconnect preferences bucket

(cherry picked from commit 5e954bb9c2cebc58d09b984df97f1b6c76fc51ac)

move span inside tooltip (#2324)

Dont find highlights if no search (#2323)

[Rewrite Branch] Adds the new search interface (#2313)

* Adds the new search interface

* Fix logic when note changes

* Revert selection highlight color

* Formalize logic for content and reduce

Co-authored-by: Dennis Snell <dennis.snell@automattic.com>

Version bump

Create persistent preferences bucket, adding logic fixes

Right align rtl languages (#2332)

When a line is a rtl language such as Arabic it should be aligned to the right. This PR floats it to the right.

Bump version to rc3

[rewrite branch] Align the scrollbar to the right (#2298)

* hack some padding

use normal left padding

remove decoration margin

special case markdown preview

refactor css

fix scrollbar highlights

moved this css change elsewhere

try this.contentDiv

move createDiv ref

* use decorator for padding, remove title size

* don't check checkboxes from the gutter

* helps to actually commit changes after rebasing

* refactor some stuff, thanks Dennis :)

fix editor padding with wide screen and gofast (#2333)

[staging] Fix keyboard shortcuts on Edge and non-English layouts (#2334)

* change all codes to keys

* lowercase key because Edge

fix search selection issues (#2335)

* fix search selection issues

* don't focus the editor on load

Various linting fixes (#2337)

This PR cleans up some lint warnings that have been introduced over time:

- Remove a console.log where it seemed unnecessary
- Changed a console.log to debug where it made sense to keep the logging
- Changed some variable names to distinguish from variables declared in an upper scope

Updates styling for rtl lanaguage lines (#2338)

Adds correct spacing to the right side of the editor for RTL languages.

Delete unused variables (#2329)

These two sass variables are unused. This removes them as they are not necessary.

Move last-sync indicator into note info panel

Bump release-candidate version

Small refactor
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants