* Add "Show duplicates" to LabelContainer
* Avoid bubbling down the duplicate logic into EditorField
* Move duplicate link into its own slot
to center it between name/description and field-state.
* Revert "Move duplicate link into its own slot"
This reverts commit 3a4511042d.
* Justify dupes within FieldState
to achieve the same result as before while avoiding additional logic within EditorField.
Co-Authored-By: Henrik Giesel <hengiesel@gmail.com>
* Flip arrows of Bootstrap-styled <select>s for RTL langs
* Use the dir attribute to set document direction
* Remove unused variable and fix use of CSS var
* Remove background and border from scrollArea
* Fix 1px of background text showing above template header on scroll
I couldn't figure out the reason for this "clipping" issue. What I tried:
- check HTML structure for any elements that might add extra padding/margin
- remove the 1px border of the header
* Adjust spacing to be more in line with rest of UI
* Show downwards arrow on SelectButton
The arrow wasn't showing because the button linear-gradient background overrides the background-image for the arrow.
Select can't have pseudo-elements, so I had to add an extra div.
* Remove height definition
to fix text cutting off on Windows.
* Hide default arrow in light theme
to keep consistency with dark theme, where the arrow has to be custom due to the button gradient.
* Use alternative approach to prevent text getting cropped
and add height definition back again.
Co-Authored-By: Hikaru Y. <47855854+hikaru-y@users.noreply.github.com>
* Adjust arrow position for rtl
Co-authored-by: Hikaru Y. <47855854+hikaru-y@users.noreply.github.com>
* Allow theme change at runtime and add hook
* Save or restore default palette on theme change
* Update aqt widget styles on theme change
* styling fixes
- drop _light_palette, as default_palette serves the same purpose
- save default platform theme, and restore it when switching away
from nightmode
- update macOS light/dark mode on theme switch
- fix unreadable menus on Windows
* update night-mode classes on theme change
This is the easy part - CSS styling that uses standard_css or our
css variables should update automatically. The main remaining issue
is JS code that sets colors based on the theme at the time it's run -
eg the graph code, and the editor.
* switch night mode value on toggle
* expose current theme via a store; switch graphs to use it
https://github.com/ankitects/anki/issues/1471#issuecomment-972402492
* start using currentTheme in editor/components
This fixes basic editing - there are still components that need updating.
* add simple xcodeproj for code completion
* add helper to get currently-active system theme on macOS
* fix setCurrentTheme not being immediately available
* live update tag color
* style().name() doesn't work on Qt5
* automatic theme switching on Windows/Mac
* currentTheme -> pageTheme
* Replace `nightModeKey` with `pageTheme`
Co-authored-by: Damien Elmes <gpg@ankiweb.net>
* Enable access to old notetype name
* Set minimum height for ChangeNotetypeDialog
* Add bootstrap icons to change-notetype
* Move alert up and make it collapsible
* Tweak some CSS
- Add variables --sticky-bg and --sticky-border to StickyContainer
- Tweak base.css
* Add translatable string "(Nothing)"
* Rework ChangeNotetype screen
* Initially load option at newIndex and remaining options on focus
Optimization for big notetypes:
Should increase efficiency from O(n²) to O(n). Test on notetype with 500 templates shows significant improvement in load time (~10s down to ~1s).
* Try to satisfy rust test
* Change arrow direction depending on reading direction
+ add 0.5em top padding to main
* Create Alert.svelte
* Introduce CSS variable --pane-bg
* Revert "Initially load option at newIndex and remaining options on focus"
This reverts commit f42beee45c.
* Final cleanup
* Refine padding/gutter
* Add a store to indicate whether input trigger is active
Button state is then indicated by: caretIsInBold XOR boldTriggerActive
* Fix surrounding where normalization is tripped up by empty text nodes
* Add failing test for unsurrounding
* Fix failing test
* prohibitOverlapse does not need to be active, if aboveEnd is null
* Reinsert Italic and Underline button
* Refactor find-adjacent to use sum types
* Simplify return value of normalizeAdjacent
* Remove unnecessary stopPropagation of mathjax-overlay events
* Use CodeMirror component for MathjaxHandle
* Refactor ResizeObserver code in MathjaxHandle
* Wrap setRange in CodeMirror in try/catch
* Add Mathjax Editor bottom margin
* Add custom Enter and Shift+Enter shortcuts for the MathjaxHandle
* Format
* Move placeCaretAfter to domlib
* Move focus back to field after editing Mathjax
* Put Cursor after Mathjax after accepting
* Add delete button for Mathjax
* Change border color of mathjax menu
* Refactor into MathjaxMenu
* Put caretKeyword in variable
* Use one ResizeObserver for all Mathjax images
* Add minmimum width for Mathjax editor
* is still smaller than minimal window width
* Add bazel directories to .prettierignore and format from root
* exclude ftl/usage (dae)
the json files that live there are output from our tooling, and
formatting them means an extra step each time we want to update them
also exclude .mypy_cache, which is output by scripts/mypy*
* minor ftl tweak: newline -> new line (dae)
* Add utility functions for saving and restoring the caret location
Implement surroundNoSplitting
Clarify surroundNoSplitting comments
Start implementing surroundSplitting and triggerIfSimpleInput
Fix after rebase
Implement findBefore / findAfter in lib/surround
* to merge adjacent nodes into the surrounding nodes
Use new prettier settings with lib/{location,surround}
Fix imports that I missed to rename
Add some tests for find-adjacent
Split find-within from find-adjacent
Normalize nodes after insertion in surroundNoSplitting
Do not deep clone surroundNode
-> no intention of supporting deep nodes, as normalization would be impossible
Add some tests concerning nested surrounding nested nodes
Select surroundedRange after surrounding
Fix ascendWhileSingleInline
A flawed first surround/trigger implementation
Move trigger out of lib/surround
Implement Input Manager as a way to handle bold on empty selection
Switch bold button away from execCommand
Pass in Matcher instead of selector to find-adjacent and surroundNoSplitting
* Also adds a failing test for no-splitting
Refactor find-adjacent
* add failing test when findBefore's nodes have different amounts of
child nodes
Change type signature of find-adjacent methods to more single-concern
Add test for surrounding where adjacent block becomes three Text elements
Make nodes found within surrounded range extend the ranges endOffset
Add base parameter to surroundNoSplitting to stop ascending beyond container
Stop surrounding from bubbling beyond base in merge-match
Make all tests pass
Add some failing tests to point to future development
Add empty elements as constant
Implement a broken version of unsurround
Even split text if it creates zero-length texts
-> they are still valid, despite what Chromium says
Rename {start,end} to {start,end}Container
Add more unit tests with surround after a nested element
Set endOffset after split-off possibly zero length text nodes
Deal with empty elements when surrounding
Only include split off end text if zero length
Use range anchors instead off calcluating surroundedRange from offsets
* this approach allows for removal of base elements when unsurrounding
Comment out test which fail because of jsdom bugs
We'll be able to enable them again after Jest 28
Make the first unsurround tests pass
Add new failing test for unsurround text within tag
Fix unsurround
Test is deactivated until Jest 28
Rewrite input-manager and trigger callback after insertion
Avoid creating zero length text nodes by using insertBefore when appropriate
Implement matches vs keepMatches
Make shadow root and editable element available on component tree
Make WithState work with asynchronous updater functions
Add new Bold/Italic/UnderlineButton using our logic
Add failing test for unsurrounding
* Move surround/ to domlib
* Add jest dependency
* Make find-within return a sum type array rather than two arrays
* Use FoundMatch sum-type for find-above (and find-within)
* Fix issue where elements could be cleared twice
* if they are IN the range.endContainer
* Pass remaining test
* Add another failing test
* Fix empty text nodes being considered for surrounding
* Satisfy svelte check
* Make on more type correct
* Satisfy remaining tests
* Add missing copyright header
* Refactor out Placeholder from CardInfo.svelte
* Add breakpoint parameter for Container
- Use `Container` component inside `TitledContainer`
* Build Item into Row
- Use Row in DeckOptionsPage instead of just Item
* Reengineer Container/Row/Col CSS
* Inline Badges next to Labels when Lable spans multiple rows
* Adjust margins for mobile
* Implement Col component breakpoints
* Move card-info to use new Container and Row components
* Join StickyHeader and StickyFooter to StickyContainer
* Remove default middle vertical-alignment for Badges again
* Satisfy tests
* Restore inline gutters in change-notetype Mapper
* Add some comment to Col and Container
* Fix breaking behavior in DeckOptionsPage when multi-column
* Add back toolbar left padding to counter-act buttongroup right margins
* Make Label in SwitchRow take more of available space
* Canonify import of i18n module
Should always be imported as `tr`, or `tr2` if there is a name collision
(Svelte).
* Add helper for garbage collecting ftl strings
Also add a serializer for ftl asts.
* Add helper for filter-mapping `DirEntry`s
* Fix `i18n_helpers/BUILD.bazel`
* run cargo-raze
* Refactor `garbage_collection.rs`
- Improve helper for file iterating
- Remove unused terms as well
- Fix issue with checking for nested messages by switching to a regex-
based approach (which runs before deleting)
- Some more refactorings and lint fixes
* Fix lints in `serialize.rs`
* Write json pretty and sorted
* Update `serialize.rs` and fix header
* Fix doc and remove `dbg!`
* Add binaries for ftl garbage collection
Also relax type constraints and strip debug tests.
* add rust_binary targets for i18n helpers (dae)
* add scripts to update desktop usage/garbage collect (dae)
Since we've already diverged from 2.1.49, we won't gain anything
from generating a stable json just yet. But once 2.1.50 is released,
we should run 'ftl/update-desktop-usage.sh stable'.
* add keys from AnkiMobile (dae)
* Mention caveats in `remove-unused.sh`
* Add utility functions for saving and restoring the caret location
* Implement cross-browser.getSelection
* Save and restore location on ContentEditable
* Fix refocus by clicking on a field that had a non-collapsed selection
* Add description input to fields dialog
QLineEdit seems like the best option, as it saves space and motivates users to keep their descriptions concise.
* Add setDescriptions to note initialization script
Went for the extra function instead of including it in setFields to prevent potential add-on breakages.
* Add tooltip next to field name if description is set
* Refactor code according to suggestions
Set default tooltip placement to right instead of bottom
Use .get() for fld["description"]
Fix tab order in fields dialog
Swap out abbreviation "desc" for full length name to keep consistency
* Update Protobuf and Rust for description
Add description to notetypes.proto and schema11
Co-authored-by: RumovZ <RumovZ@users.noreply.github.com>
* Fix tooltips not updating with description
Remove redundant variable tooltipOptions
Update previousTooltip within reactive function
* Move LabelDescription out of LabelName
Co-authored-by: Henrik Giesel <hgiesel@users.noreply.github.com>
* Decrease icon size and fix alignment
Co-Authored-By: Henrik Giesel <hengiesel@gmail.com>
* the new key needs to be cleared from fields, not the notetype itself
Co-authored-by: RumovZ <RumovZ@users.noreply.github.com>
Co-authored-by: Henrik Giesel <hengiesel@gmail.com>
Co-authored-by: Damien Elmes <gpg@ankiweb.net>
* Declare toolbar api via modifiable property
* Fix addon buttons
* Assign editing areas in a synchronous way
* Restore the Tab shortcut that moves the caret to end
- moveCaretToEnd is called twice now: The moveCaretToEnd calls in
*TextInput causes the caret to be moved to the end when switching back
from the window and back.
- To fix this, I will need the code for saving and restoring locations
from #1377
* Restore selections in the PlainTextInput
* Improve type safety of destroyable
- clearable-array was renamed to destroyable
* Refactor editor css, fix editor button highlight
- Avoid using webview.css
- Move more buttons css into button_mixins
* Fix DropdownItem appearance
* Fix the visuals of tags
* Make dropdown font slightly smaller
* Give SelectOption a background color
* Move some css from deck-options-base to CardStateCustomizer
* Avoid using core.scss for CardStats
* Avoid using sass/core in congrats package
* Inline core.scss into webview.scss
* Include fusion-vars for base.scss
* need to keep core.scss around for now (dae)
It's a tiny library that has not been updated in years, and it was
leading to a warning on startup:
DeprecationWarning: invalid escape sequence \W
return re.sub("\W+", "", string)
* Translate editor to Svelte
Make editor fields grid rather than flexbox
Refactor ButtonToolbar margins
Remove remaining svelte.d.ts symlinks
Implement saveNow
Fix text surrounding
Remove HTML editor button
Clean up some empty files
Add visual for new field state badges
* Adds new IconConstrain.svelte to generalize the icon handling for
IconButton and Badge
Implement sticky functionality again
Enable Editable and Codable field state badges
Add shortcuts to FieldState badges
Add Shift+F9 shortcut back
Add inline padding back to editor fields, tag editor and toolbar
Make Editable and Codable only "visually hidden"
This way they are still updated in the background
Otherwise reshowing them will always start them up empty
Make empty editing area focusable
Start with moving fieldsKey and currentFieldKey to context.ts
Fix Codable being wrong size when opening for first time
Add back drag'n'drop
Make ButtonItem display: contents again
* This will break the gap between ButtonGroup items, however once we
have a newer Chromium version we should use CSS gap property anyway
Fix most of typing issues
Use --label-color background color LabelContainer
Add back red color for dupes
Generalize the editor toolbar in the multiroot editor to widgets
Implement Notification.svelte for showing cloze hints
Add colorful icon to notification
Hook up Editable to EditingArea
Move EditingArea into EditorField
Include editorField in editor/context
Fix rebasing issues
Uniformly use SvelteComponentTyped
Take LabelContainer out of EditingArea
Use mirror-dom and node-store to export editable content
Fix editable update mechanism
Prepare passing the editing inputs as slots
Pass in editing inputs as slots
Use codable options again in codemirror
Delete editor/lib.ts
Remove CodableAdapter, Use more generic CodeMirror component
Fix clicking LabelContainer to focus
Use prettier
Rename Editable to ContentEditable
Fix writing Mathjax from Codable to Editable
Correctly adjust output HTML from editable
Refactor EditableStyles out of EditableContainer
Pass Image and Mathjax Handle via slots to Editable
Make Editable add its editingInputApi
Make Editable hideable
Fix font size not being set correctly
Refactor both fieldFocused and focusInCodable to focusInEditable
Fix focusIfField
Bring back $activeInput
Fix ClozeButton
Remove signifyCustomInput
Refactor MathjaxHandle
Refactor out some logic into store-subscribe
Fix Mathjax editor
Use focusTrap instead of focusing div
Delegate focus back to editingInput when refocusing focusTrap
Elegantly move focus between editing inputs when closing/opening
Make Codable tabbable
Automatically move caret to end on editable and codable
+ remove from editingInput api
Fix ButtonDropdown having two rows and missing button margins
Make svelte_check and eslint pass
Satisfy editor svelte_check
Save field updates to db again
Await editable styles before mounting content editable
Remove unused import from OldEditorAdapter
Add copyright header to OldEditorAdapter
Update button active state from contenteditable
* Use activateStickyShortcuts after waiting for noteEditorPromise
* Set fields via stores, make tags correctly set
* Add explaining comment to setFields
* Fix ClozeButton
* Send focus and blur events again
* Fix Codable not correctly updating on blur with invalid HTML
* Remove old code for special Enter behavior in tags
* Do not use logical properties for ButtonToolbar margins
* Remove getCurrentField
Instead use noteEditor->currentField or noteEditor->activeInput
* Remove Extensible type
* Use context-property for NoteEditor, EditorField and EditingArea
* Rename parameter in mirror-dom.allowResubscription
* Fix cutOrCopy
* Refactor context.ts into the individual components
* Move focusing of editingArea up to editorField
* Rename promiseResolve -> promiseWithResolver
* Rename Editable->RichTextInput and Codable->PlainTextInput
* Remove now unnecessary type assertion for `getNoteEditor` and `getEditingArea`
* Refocus field after adding, so subscription to editing area is refreshed
You can then do './scripts/python -m venv /path/to/venv' to create
a virtual env based on the bundled Python, which can be handy if
you don't happen to have the appropriate version of Python installed
separately.
1. All Svelte files in a package are compiled in one step now, which
ensures that properties that use types from a different Svelte file in the
same package are typed correctly. The single-file svelte() has been removed,
and compile_svelte() may be renamed to svelte() in the future.
2. The .ts files in the same package are included as part of the Svelte
compilation, so that types imported imported from .ts files in the
same package work.
3. Dependencies passed into the rule are now loaded into the TypeScript
compiler, so that properties referencing types from different packages
work. We'll need to update our compile_svelte() lines to list the
dependencies. For example, before this change:
% cat bazel-bin/ts/congrats/CongratsPage.svelte.d.ts
import { SvelteComponentTyped } from "svelte";
declare const __propDef: {
props: {
info: any;
};
...
After adding //ts/lib to the deps of compile_svelte() in ts/congrats:
% cat bazel-bin/ts/congrats/CongratsPage.svelte.d.ts
import { SvelteComponentTyped } from "svelte";
import type { Scheduler } from "../lib/proto";
declare const __propDef: {
props: {
info: Scheduler.CongratsInfoResponse;
};
...
- negative margins result in truncated text when the window size
is reduced, so avoid them
- having a 100% table inside a flexbox is not responsive - the table
does not adjust its size as the width is increased or decreased
- in order to look decent on narrow screens (eg phones), we allow
margin collapsing
- in order to look decent on wide screens, we limit the maximum
width to something that is readable
- hide some columns in portrait mode on narrow screens
I tried preserving the centering with margin-left/right: auto, but
could not get it looking right, so have had to move things back to
left alignment.
* Only collect card stats on the backend ...
... instead of rendering an HTML string using askama.
* Add ts page Card Info
* Update test for new `col.card_stats()`
* Remove obsolete CardStats code
* Use new ts page in `CardInfoDialog`
* Align start and end instead of left and right
Curiously, `text-align: start` does not work for `th` tags if assigned
via classes.
* Adopt ts refactorings after rebase
#1405 and #1409
* Clean up `ts/card-info/BUILD.bazel`
* Port card info logic from Rust to TS
* Move repeated field to the top
https://github.com/ankitects/anki/pull/1414#discussion_r725402730
* Convert pseudo classes to interfaces
* CardInfoPage -> CardInfo
* Make revlog in card info optional
* Add legacy support for old card stats
* Check for undefined instead of falsy
* Make Revlog separate component
* drop askama dependency (dae)
* Fix nightmode for legacy card stats
Merging note: the typing changes were fixed in a separate PR.
* Put rootDirs into subprojects
- typings do not work for any ts or svelte files
- if we set the 'rootDirs' in ts/tsconfig.json to '../bazel-bin/ts' and then inherit
them from e.g. editor, the root will be changed to '../../bazel-bin/ts',
however editor needs look in '../../bazel-bin/ts/editor' instead.
* Rename i18n and i18n_helpers to i18n-generated and i18n
- This way, we can restrict the awkwardness of importing files outside
the ts directory within lib
* Fix missing typing of i18n and backend_proto by adding back symlinks
* Split up i18n-generated into i18n-{translate,modules}
* Change i18n from singleton to functions
* Revert "Put rootDirs into subprojects"
This partially reverts commit e1d4292ce3.
It seems like this might not be necessary after all.
However some other change made on this branch seems to have fixed
the .svelte.d.ts imports
* Introduce i18n-bundles to remove circular import
There was a circular import i18n.ts <-> i18n-translate.ts
* Create own directory for i18n
* Move lib/i18n/translate to lib/translate
* This restores tree shaking
* Update tsconfig libs and module
* es2018-2020 have wide support on all modern browsers including
* Switch bundles and langs inside i18n to variables again
* Add missing copyright header
* Rename translate.ts to ftl.ts
* Remove the symlinks again
I added them to fix to have completion for tr, however this would have
also have meant to abandon the tree shaking.
As we want to have tree shaking, it's also not necessary to have the
symlinks anymore
* Revert "Update tsconfig libs and module"
This reverts commit 0a96776a47.
* move withCollapsedWhitespace back to i18n/utils
* Add back /ts as in rootDirs
Recommend removing ts/node_modules folder before attempting to
build after this update.
This moves ts/node_modules into the root of the project to work around
https://github.com/ankitects/anki/pull/1405#issuecomment-936213861
Also fixes the sass errors shown when running scripts/svelte-check
The nice thing about the symlink approach is that it allowed tsc -b
to function without any changes to the tsconfig.json file, but it meant
there were extra links we had to maintain. So instead, we just add an
extra rootDirs entry, and add two commented-out lines that can be
uncommented when wanting to build with tsc directly.
ts_library() is deprecated and will presumably be dropped from a
future rules_nodejs, and it wasn't working with the jest tests
after updating, so we switch over to ts_project().
There are some downsides:
- It's a bit slower, as the worker mode doesn't appear to function
at the moment.
- Getting it working with a mix of source files and generated files
was quite tricky, especially as things behave differently on Windows,
and differently when editing with VS Code. Solved with a small patch
to the rules, and a wrapper script that copies everything into the
bin folder first. To keep VS Code working correctly as well, the built
files are symlinked into the source folder.
- TS libraries are not implicitly linked to node_modules, so they
can't be imported with an absolute name like "lib/proto" - we need
to use relative paths like "../lib/proto" instead. Adjusting "paths"
in tsconfig.json makes it work for TS compilation, but then it fails
at the esbuild stage. We could resolve it by wrapping the TS
libraries in a subsequent js_library() call, but that has the downside
of losing the transient dependencies, meaning they need to be listed
again. Alternatively we might be able to solve it in the future by
adjusting esbuild, but for now the paths have been made relative to
keep things simple.
Upsides:
- Along with updates to the Svelte tooling, Svelte typing has improved.
All exports made in a Svelte file are now visible to other files that
import them, and we no longer rebuild the Svelte files when TS files
are updated, as the Svelte files do no type checking themselves, and
are just a simple transpilation. Svelte-check now works on Windows again,
and there should be no errors when editing in VS Code after you've
built the project. The only downside seems to be that cmd+clicking
on a Svelte imports jumps to the .d.ts file instead of the original now;
presumably they'll fix that in a future plugin update.
- Each subfolder now has its own tsconfig.json, and tsc can be called
directly for testing purposes (but beware it will place build products
in the source tree): ts/node_modules/.bin/tsc -b ts
- We can drop the custom esbuild_toolchain, as it's included in the
latest rules_nodejs.
Other changes:
- "image_module_support" is moved into lib/, and imported with
<reference types=...>
- Images are now imported directly from their npm package; the
extra copy step has been removed.
Windows users may need to use "bazel clean" before building this,
due to old files lying around in the build folder.
The latest svelte-check has revealed we were not passing 'for' in
when we should have been. This is a quick hack to get the tests passing
again, but a better approach that actually makes this accessible again
would be good in the future.
typescript and bootstrap have been pinned for now:
https://github.com/ankitects/anki/issues/1386https://github.com/ankitects/anki/issues/1385
hint failures for svelte-check have also been temporarily turned
off, due to it now complaining about document.execCommand():
Hint: The signature '(commandId: string, showUI?: boolean, value?: string): boolean' of 'document.execCommand' is deprecated. (ts)
const wrapWithForecolor = (color: string) => () => {
document.execCommand("forecolor", false, color);
};
Will follow up in #1377
Matches should arrive in alphabetical order. Currently results are not
capped (JS should be able to handle ~1k tags without too much hassle),
and no reordering based on match location is done. Matches are substring
based, and multiple can be provided, eg "foo::bar" will match
"foof::baz::abbar".
This is not hooked up properly on the frontend at the moment -
updateSuggestions() seems to be missing the most recently typed character,
and is not updating the list of completions half the time.
