Commit graph

69 commits

Author SHA1 Message Date
Arthur Milchior
efaaae8ce4
Cloze button get disabled outside of cloze field (#3879)
* NF: replace `disabled` by `enabled`

This allows to remove the negations and, in my opinion, make the code
easier to understand and edit.

* Cloze button get disabled outside of cloze field

More specifically, if the user focus in a field that is not a cloze
field, the button are still there but appear as disabled. The shortcut
instead of adding the cloze context shows an alert explaining why this
can't be done.

While this message is already displayed when the user tries to add a
note with cloze in non-cloze field, I suspect it will save time to
stop the user as soon as possible from making mistake. This should
make very clear what is authorized and what is not.

It'll also be a reminder of whether the current field is a cloze or
not.

In order to do this, I added a back-end method (that I expect we may
reuse in ankidroid) to get the index of the fields used in cloze. This
set is sent to the note editor, which propagates it where needed.

In mathjax, the cloze symbol is removed when the selected field is not
a cloze field.
2025-04-24 18:37:41 +10:00
Damien Elmes
1e74e8e86e
Fix add-on buttons not working in the editor (#3941)
* Fix add-on buttons not working in the editor

* Ensure old listeners are cleaned up

Thanks to iamllama: https://github.com/ankitects/anki/pull/3941#discussion_r2057066283
2025-04-24 15:26:46 +10:00
llama
9d167feb8f
Remove use of createClassComponent in mathjax-element.ts (#3919)
* replace use of deprecated createClassComponent with mount

* bump esbuild-svelte from 0.8.1 to 0.9.2

* mathjax-element.ts -> mathjax-element.svelte.ts

* move caret after tick
2025-04-13 16:21:22 +10:00
Cy Pokhrel
8f4cab6a1a
Fix editor loses focus when toggling list if list item empty (#3483)
* fix editor loses focus when toggling list if list item empty

* fix CONTRIBUTORS
2024-10-16 00:38:35 +10:00
Damien Elmes
b3a85a6515 Revert "Decide if element is bold by getComputedStyle (#2453) (#2579)"
This reverts commit 9ced6be03e.

Caused a regression:
https://forums.ankiweb.net/t/anki-24-10-beta/49989/150
2024-10-11 23:34:50 +10:00
mmjang
9ced6be03e
Decide if element is bold by getComputedStyle (#2453) (#2579)
* Decide if element is bold by getComputedStyle (#2453)

* Use getComputedStyle() for italics too (dae)
2024-10-02 19:37:40 +10:00
Damien Elmes
f639c3660a Revert "Revert "Revert "Preserve HTML formatting inside clozes (#3038)"""
This reverts commit 9c733848b8.
2024-05-17 11:51:09 +07:00
Pedro Schreiber
074becc0ce
Add keyboard shortcuts for empty cards and toggle mask on image occlusion (#3136)
* Add keyboard shortcuts for empty cards and toggle mask on image occlusion

- add shortcut for empty cards
- add shortcut for toggle mask
- set tooltips with shortcuts

use unused shortcut for empty cards

* remove unnecessary shortcut added in main.py

* change empty cards shortcut and try to fix CI error in CONTRIBUTORS

* change shortcut for empty cards for universal support
2024-04-25 17:19:38 +10:00
RumovZ
790c52f012
Svg icon (#3135)
* Add sveltekit-svg plugin to fix svg icon styling

Closes #3127.

* Unify svg icon usage

Moves all icons into ts/lib/components/icons.ts and uses a single component to render
them both with eslint and svelte-kit.

* Fix spinning revert icon not being centered

* Use svg earth icon for global label

* Add tooltip to global label icon

* Remove eslint-plugin-simple-import-sort

Imports are already sorted by dprint with conflicting rules.
2024-04-24 02:37:31 +01:00
Damien Elmes
9c733848b8 Revert "Revert "Preserve HTML formatting inside clozes (#3038)""
This reverts commit e911b4b69a.

Trying again now that 24.04 is out.
2024-03-31 15:55:30 +07:00
Damien Elmes
9f55cf26fc
Switch to SvelteKit (#3077)
* Update to latest Node LTS

* Add sveltekit

* Split tslib into separate @generated and @tslib components

SvelteKit's path aliases don't support multiple locations, so our old
approach of using @tslib to refer to both ts/lib and out/ts/lib will no
longer work. Instead, all generated sources and their includes are
placed in a separate out/ts/generated folder, and imported via @generated
instead. This also allows us to generate .ts files, instead of needing
to output separate .d.ts and .js files.

* Switch package.json to module type

* Avoid usage of baseUrl

Incompatible with SvelteKit

* Move sass into ts; use relative links

SvelteKit's default sass support doesn't allow overriding loadPaths

* jest->vitest, graphs example working with yarn dev

* most pages working in dev mode

* Some fixes after rebasing

* Fix/silence some svelte-check errors

* Get image-occlusion working with Fabric types

* Post-rebase lock changes

* Editor is now checked

* SvelteKit build integrated into ninja

* Use the new SvelteKit entrypoint for pages like congrats/deck options/etc

* Run eslint once for ts/**; fix some tests

* Fix a bunch of issues introduced when rebasing over latest main

* Run eslint fix

* Fix remaining eslint+pylint issues; tests now all pass

* Fix some issues with a clean build

* Latest bufbuild no longer requires @__PURE__ hack

* Add a few missed dependencies

* Add yarn.bat to fix Windows build

* Fix pages failing to show when ANKI_API_PORT not defined

* Fix svelte-check and vitest on Windows

* Set node path in ./yarn

* Move svelte-kit output to ts/.svelte-kit

Sadly, I couldn't figure out a way to store it in out/ if out/ is
a symlink, as it breaks module resolution when SvelteKit is run.

* Allow HMR inside Anki

* Skip SvelteKit build when HMR is defined

* Fix some post-rebase issues

I should have done a normal merge instead.
2024-03-31 09:16:31 +01:00
Damien Elmes
e911b4b69a Revert "Preserve HTML formatting inside clozes (#3038)"
This reverts commit 58b2475f42.

Rolling this back for now, as it may cause regressions. We can give it
another try at the start of the next beta-testing period.
2024-03-25 16:47:54 +07:00
Abdo
58b2475f42
Preserve HTML formatting inside clozes (#3038)
* Preserve HTML formatting inside clozes

* Place caret after/inside cloze

To match the old behavior

* Fix clozing in mathjax

* Formatting

* Avoid .extractContents() and handle partially covered tags

* Exclude range end if endOffset == 0

* Remove unnecessary branches

* Use nodeIsElement

* Let extractContents() handle partially selected nodes
2024-03-18 13:44:19 +00:00
Lucas Scharenbroch
97dcb776de
Refactor text attribute button components (#3012)
* Factor out common code in bold/italic/underline/sub/sup buttons

* Update exclusiveNames' states on click

* Update exclusiveNames' states on keyboard shortcut
2024-02-18 13:09:05 +07:00
Lucas Scharenbroch
b80057440e
Fix visual behavior of modal buttons in editor (#3009)
* Fix behavior of justification buttons

* Make list buttons update each other when clicked
2024-02-14 20:35:37 +10:00
Lucas Scharenbroch
146a3d936e
Fix corner rounding of alignment buttons in editor (#2989)
* Fix corner rounding of alignment buttons in editor

* Fix formatting

* Fix cascading button-rounding issues
2024-02-07 13:11:14 +10:00
Abdo
5d1fc9a591
Flip indent/outdent buttons for RTL (#2930) 2024-01-09 11:09:53 +10:00
Mani
be1f889211
fixes: remove unfinished shapes, remove selectable and make shapes remain inside canvas (#2809)
* remove unfinished polygon and remove selectable for shapes in polygon mode

* make group and polygon position remain inside canvas area

* click through transparent area in grouped object

* add some shortcuts for basic usages

* tools button icon in center & switch mode border

* fix load svg image

* basic rtl support, panzoom have issues in rtl mode

* better zoom option both in ltr and rtl

* handle zoom event in mask editor

* add h button to handle toggle mask

* add more mime type

* use capital M (shift+m) for toggle mask

* allow io shortcuts in mask editor only

* make other shapes also remain in canvas bound area

* better zoom implementation, zoom from center
add zoom to resize event listener

* add a border to corner to handle blend of control

* add refresh button to go to  selection menu

* add tooltip to shortcuts and also add shortcut for other tools

* make opacity remain in same state when toggled on

* opacity for group/ungroup objects

* update shortcuts implementation
2023-11-24 14:06:40 +10:00
Damien Elmes
d744a7cceb Add tooltip to mask editor button 2023-11-03 21:55:38 +10:00
Mani
135de7f9ed
image occlusion button in note editor (#2485)
* setup mask editor in note editor
- add image on mask button click (only one time)
- show hide add button for io on notetype change
- hide field in io notetype
- icon for toggle
and replace image

* add update io notes

* Tidy up i/o notetype check and fix error

- Make it a method on editor
- Use .get(), because the setting doesn't exist on older notetypes
- Pass the bool value into the ts code, instead of the enum

* reset io page after adding

* remove adjust function & add target for mask editor

* handle browse mode & merged sidetoolbar and toptoolbar to toolbar

* fix: shape, button click in browse, dropdown menu

* add arrow to add button

* store for handling visiblity of maskeditor
- remove update  button in edit mode, implement autoupdate

* update var name

* simplify store
2023-07-27 22:45:49 +10:00
Damien Elmes
754fcc2b3a Update bold check to font weight 700
https://github.com/ankitects/anki/issues/2453
2023-07-17 14:20:31 +10:00
Damien Elmes
e63b4b9927 Experiment with disabling prettier whitespace sensitivity
Prettier by default tries to preserve whitespace around inline tags,
which can prevent problems such as a space before the period in
'<a>text</a>.':

https://prettier.io/blog/2018/11/07/1.15.0.html#whitespace-sensitive-formatting

Unfortunately only standard HTML block elements are excluded from this
behaviour, so all of our Svelte components are treated the same way, even
if they are block-based, or used in a way where the extra whitespace
doesn't matter. This makes the code somewhat harder to read.

Changing this option does carry the risk that rogue spaces will creep
into our UI in the future as code is formatted, but as there don't appear
to be any such issues with this initial reformat, I think the improved
readability may justify the relatively small risk.
2023-06-01 11:11:26 +10:00
Damien Elmes
61555fef7d Hack around color setting failure in Qt6.5
Closes #2505
2023-05-18 16:36:16 +10:00
Damien Elmes
6f650dd7df Add some missing tooltips
https://forums.ankiweb.net/t/two-editor-buttons-do-not-have-tooltips/30203
2023-05-11 15:10:27 +10:00
Hikaru Y
f51d1590a1
Fix possible unexpected flash of pop-up menu (#2274)
When a pop-up menu was closed by clicking on an empty space
outside the fields, the variable controlling the display state
was not changed, causing the pop-up menu to flash momentarily
the next time a field was focused.
2022-12-19 12:07:47 +10:00
Hikaru Y
7144949dd5
Fix MathJax popup fails to appear (#2268)
* Fix MathJax popup fails to appear when adding MathJax via Fx button

* Revert "Fix MathJax popup fails to appear when adding MathJax via Fx button"

This reverts commit 11115f59bc.

* Fix MathJax popup fails to appear when adding MathJax via Fx button

Use setTimeout() according to the PR review
2022-12-14 14:10:23 +10:00
Damien Elmes
8d34ba93b0 Fix color defaulting to black
Closes #2261
2022-12-11 11:58:21 +10:00
Henrik Giesel
6d0a242a1b
Fix overwrite surround (#2247)
* Revert "Revert to setFormat() to fix color setting"

This reverts commit 613b5c1034.

* Fix overwrite-surround
2022-12-09 10:10:58 +10:00
Damien Elmes
613b5c1034 Revert to setFormat() to fix color setting
The surrounder code is somewhat complicated, and it could do with either
more documentation, or a simplification.

Closes #2121
2022-12-05 17:00:47 +10:00
Damien Elmes
ea5153e7a4 Re-enable formatting for .svelte files 2022-11-28 09:17:39 +10:00
Damien Elmes
5e0a761b87
Move away from Bazel (#2202)
(for upgrading users, please see the notes at the bottom)

Bazel brought a lot of nice things to the table, such as rebuilds based on
content changes instead of modification times, caching of build products,
detection of incorrect build rules via a sandbox, and so on. Rewriting the build
in Bazel was also an opportunity to improve on the Makefile-based build we had
prior, which was pretty poor: most dependencies were external or not pinned, and
the build graph was poorly defined and mostly serialized. It was not uncommon
for fresh checkouts to fail due to floating dependencies, or for things to break
when trying to switch to an older commit.

For day-to-day development, I think Bazel served us reasonably well - we could
generally switch between branches while being confident that builds would be
correct and reasonably fast, and not require full rebuilds (except on Windows,
where the lack of a sandbox and the TS rules would cause build breakages when TS
files were renamed/removed).

Bazel achieves that reliability by defining rules for each programming language
that define how source files should be turned into outputs. For the rules to
work with Bazel's sandboxing approach, they often have to reimplement or
partially bypass the standard tools that each programming language provides. The
Rust rules call Rust's compiler directly for example, instead of using Cargo,
and the Python rules extract each PyPi package into a separate folder that gets
added to sys.path.

These separate language rules allow proper declaration of inputs and outputs,
and offer some advantages such as caching of build products and fine-grained
dependency installation. But they also bring some downsides:

- The rules don't always support use-cases/platforms that the standard language
tools do, meaning they need to be patched to be used. I've had to contribute a
number of patches to the Rust, Python and JS rules to unblock various issues.
- The dependencies we use with each language sometimes make assumptions that do
not hold in Bazel, meaning they either need to be pinned or patched, or the
language rules need to be adjusted to accommodate them.

I was hopeful that after the initial setup work, things would be relatively
smooth-sailing. Unfortunately, that has not proved to be the case. Things
frequently broke when dependencies or the language rules were updated, and I
began to get frustrated at the amount of Anki development time I was instead
spending on build system upkeep. It's now about 2 years since switching to
Bazel, and I think it's time to cut losses, and switch to something else that's
a better fit.

The new build system is based on a small build tool called Ninja, and some
custom Rust code in build/. This means that to build Anki, Bazel is no longer
required, but Ninja and Rust need to be installed on your system. Python and
Node toolchains are automatically downloaded like in Bazel.

This new build system should result in faster builds in some cases:

- Because we're using cargo to build now, Rust builds are able to take advantage
of pipelining and incremental debug builds, which we didn't have with Bazel.
It's also easier to override the default linker on Linux/macOS, which can
further improve speeds.
- External Rust crates are now built with opt=1, which improves performance
of debug builds.
- Esbuild is now used to transpile TypeScript, instead of invoking the TypeScript
compiler. This results in faster builds, by deferring typechecking to test/check
time, and by allowing more work to happen in parallel.

As an example of the differences, when testing with the mold linker on Linux,
adding a new message to tags.proto (which triggers a recompile of the bulk of
the Rust and TypeScript code) results in a compile that goes from about 22s on
Bazel to about 7s in the new system. With the standard linker, it's about 9s.

Some other changes of note:

- Our Rust workspace now uses cargo-hakari to ensure all packages agree on
available features, preventing unnecessary rebuilds.
- pylib/anki is now a PEP420 implicit namespace, avoiding the need to merge
source files and generated files into a single folder for running. By telling
VSCode about the extra search path, code completion now works with generated
files without needing to symlink them into the source folder.
- qt/aqt can't use PEP420 as it's difficult to get rid of aqt/__init__.py.
Instead, the generated files are now placed in a separate _aqt package that's
added to the path.
- ts/lib is now exposed as @tslib, so the source code and generated code can be
provided under the same namespace without a merging step.
- MyPy and PyLint are now invoked once for the entire codebase.
- dprint will be used to format TypeScript/json files in the future instead of
the slower prettier (currently turned off to avoid causing conflicts). It can
automatically defer to prettier when formatting Svelte files.
- svelte-check is now used for typechecking our Svelte code, which revealed a
few typing issues that went undetected with the old system.
- The Jest unit tests now work on Windows as well.

If you're upgrading from Bazel, updated usage instructions are in docs/development.md and docs/build.md. A summary of the changes:

- please remove node_modules and .bazel
- install rustup (https://rustup.rs/)
- install rsync if not already installed  (on windows, use pacman - see docs/windows.md)
- install Ninja (unzip from https://github.com/ninja-build/ninja/releases/tag/v1.11.1 and
  place on your path, or from your distro/homebrew if it's 1.10+)
- update .vscode/settings.json from .vscode.dist
2022-11-27 15:24:20 +10:00
Matthias Metelka
e9430fde3b
Give OptionsButton its own ButtonGroup and move it to more prominent position (#2207)
and give it some padding
2022-11-23 16:18:29 +10:00
Matthias Metelka
fba46e9815
Fix Floating Ui error causing freezes on image resize (#2206)
* Replace autoPlacement with flip

* Remove logic made redundant by use of flip()

* Edit preferred placement on components using WithFloating

* Rename placement to preferredPlacement

* Set "bottom" as default placement and remove redundant declarations
2022-11-23 16:16:09 +10:00
Matthias Metelka
68fa661b53
Finish #2070: Single overlay instead of per field (#2144)
* Move up MathjaxOverlay to be initialized only once

* Move ImageOverlay to NoteEditor root

* Move Symbols Overlay to NoteEditor root

* Refactor image overlay to not require second mutation observer

* Use elevation + overflow:hidden  in Editorfield

* Make it possible to show input next to each other again

* Set handle background color to code bg

* Make Collapsible unmount the component

* Simplify how decorated elements are mounted

* Set RichTextInput background to frame-bg again

* Strip out FocusTrap code

* Revert "Make Collapsible unmount the component"

This reverts commit 52722065ea.

* Allow clicking on label container to unfocus field

* Fix mathjax overlay resetting too its api too soon

* Allow scrolling on overlays

* Set focus-border border-color in focused field

* Fix background color of fields

* Add back grid-gap

removed it during merge to see if margin-top would behave any differently - which is not the case.

* Fix double border issue within Collapsible.svelte

* Format

* Edit appearance of focused fields a bit

* Remove unused properties

* Include elevation in button_mixins_lib

* Give label-container a background color

Co-authored-by: Henrik Giesel <hengiesel@gmail.com>
2022-10-27 09:11:36 +10:00
Damien Elmes
ab6877c714 Fix indent/outdent shortcuts not working
https://forums.ankiweb.net/t/keyboard-shortcut-for-indent-not-working/24114/6
2022-10-26 12:38:13 +10:00
Matthias Metelka
d7deb5fafc
Move MathJax toggle to OptionsButton and fix two bugs (#2126)
* Rename MathJax toggle and move it to OptionsButton

* Apply MathJax setting to newly added blocks

* Actually remove MathJax element on delete
2022-10-12 14:34:25 +10:00
Matthias Metelka
9b878a2229
Make auto-closing of HTML tags default but optional (#2101) 2022-10-03 13:14:57 +10:00
Matthias Metelka
de4d69454a
Set line-height = 1 on inline floating-reference (#2096) 2022-09-30 11:43:08 +10:00
Matthias Metelka
f72570c604
Make tags editor resizable using Henrik's components (#2046)
* Make tags editor resizable using Henrik's components

All credit for the components goes to Henrik. I just tweaked the design a bit and implemented them in NoteEditor.

Co-Authored-By: Henrik Giesel <hengiesel@gmail.com>

* Remove PaneContent padding

Co-Authored-By: Henrik Giesel <hengiesel@gmail.com>

* Add responsive box-shadows on scroll/resize

only shown when content overflows in the respective direction.

* Remove comment

* Fix overflow calculations and shadow mix-up

This happened when I switched from using scrolledToX to overflowX booleans.

* Simplify overflow calculations

* Make drag handles 0 height/width

The remaining height requirement comes from a margin set on NoteEditor.

* Run eslint on components

* Split editor into three panes: Toolbar, Fields, Tags

* Remove upper split for now

to unblock 2.1.55 beta

* Move panes.scss to sass folder

* Use single type for resizable panes

* Implement collapsed state toggled with click on resizer

* Add button to uncollapse tags pane and focus input

* Add indicator for # of tags

* Use dbclick to prevent interference with resize state

* Add utility functions for expand/collapse

* Meddle around with types and formatting

* Fix collapsed state being forgotten on second browser open (dae)

* Fix typecheck (dae)

Our tooling generates .d.ts files from the Svelte files, but it doesn't
expect variables to be exported. By changing them into functions, they
get included in .bazel/bin/ts/components/Pane.svelte.d.ts

* Remove an unnecessary bridgeCommand (dae)

* Fix the bottom of tags getting cut off (dae)

Not sure why offsetHeight is inaccurate in this case.

* Add missing header (dae)

Co-authored-by: Henrik Giesel <hengiesel@gmail.com>
2022-09-28 14:02:32 +10:00
Damien Elmes
dd939beafe Simplify asReference 2022-09-26 10:04:08 +10:00
Damien Elmes
4089e76800
Add option to shrink editor images by default (#2071)
+ Don't persist shrinking toggle

Closes #1894
2022-09-26 09:47:50 +10:00
Matthias Metelka
8142176f84
Introduce new color palette using Sass maps (#2016)
* Remove --medium-border variable

* Implement color palette using Sass maps

I hand-picked the gray tones, the other colors are from the Tailwind CSS v3 palette.

Significant changes:
- light theme is brighter
- dark theme is darker
- borders are softer

I also deleted some platform- and night-mode-specific code.

* Use custom colors for note view switch

* Use same placeholder color for all inputs

* Skew color palette for more dark values

by removing gray[3], which wasn't used anywhere. Slight adjustments were made to the darker tones.

* Adjust frame- window- and border colors

* Give deck browser entries --frame-bg as background color

* Define styling for QComboBox and QLineEdit globally

* Experiment with CSS filter for inline-colors

Inside darker inputs, some colors like dark blue will be hard to read, so we could try to improve text-color contrast with global adjustments depending on the theme.

* Use different map structure for _vars.scss

after @hgiesel's idea: https://github.com/ankitects/anki/pull/2016#discussion_r947087871

* Move custom QLineEdit styles out of searchbar.py

* Merge branch 'main' into color-palette

* Revert QComboBox stylesheet override

* Align gray color palette more with macOS

* Adjust light theme

* Use --slightly-grey-text for options tab color

* Replace gray tones with more neutral values

* Improve categorization of global colors

by renaming almost all of them and sorting them into separate maps.

* Saturate highlight-bg in light theme

* Tweak gray tones

* Adjust box-shadow of EditingArea to make fields look inset

* Add Sass functions to access color palette and semantic variables

in response to https://github.com/ankitects/anki/pull/2016#issuecomment-1220571076

* Showcase use of access functions in several locations

@hgiesel in buttons.scss I access the color palette directly. Is this what you meant by "... keep it local to the component, and possibly make it global at a later time ..."?

* Fix focus box shadow transition and remove default shadow for a cleaner look

I couldn't quite get the inset look the way I wanted, because inset box-shadows do not respect the border radius, therefore causing aliasing.

* Tweak light theme border and shadow colors

* Add functions and colors to base_lib

* Add vars_lib as dependency to base_lib and button_mixins_lib

* Improve uses of default-themed variables

* Use old --frame-bg color and use darker tone for canvas-default

* Return CSS var by default and add palette-of function for raw value

* Showcase use of palette-of function

The #{...} syntax is required only because the use cases are CSS var definitions. In other cases a simple palette-of(keyword, theme) would suffice.

* Light theme: decrease brightness of canvas-default and adjust fg-default

* Use canvas-inset variable for switch knob

* Adjust light theme

* Add back box-shadow to EditingArea

* Light theme: darken background and flatten transition

also set hue and saturation of gray-8 to 0 (like all the other grays).

* Reduce flag colors to single default value

* Tweak card/note accent colors

* Experiment with inset look for fields again

Is this too dark in night mode? It's the same color used for all other text inputs.

* Dark theme: make border-default one shade darker

* Tweak inset shadow color

* Dark theme: make border-faint darker than canvas-default

meaning two shades darker than it currently was.

* Fix PlainTextInput not expanding

* Dark theme: use less saturated flag colors

* Adjust gray tones

* Fix nested variables not getting extracted correctly

* Rename canvas-outset to canvas-elevated

* Light theme: darken canvas-default

* Make canvas-elevated a bit darker

* Rename variables and use them in various components

* Refactor button mixins

* Remove fusion vars from Anki

* Adjust button gradients

* Refactor button mixins

* Fix deck browser table td background color

* Use color function in buttons.scss

* Rework QTabWidget stylesheet

* Fix crash on browser open

* Perfect QTableView header

* Fix bottom toolbar button gradient

* Fix focus outline of bottom toolbar buttons

* Fix custom webview scrollbar

* Fix uses of vars in various webviews

The command @use vars as * lead to repeated inclusion of the CSS vars.

* Enable primary button color with mixin

* Run prettier

* Fix Python code style issues

* Tweak colors

* Lighten scrollbar shades in light theme

* Fix code style issues caused by merge

* Fix harsh border color in editor

caused by leftover --medium-border variables, probably introduced with a merge commit.

* Compile Sass before extracting Python colors/props

This means the Python side doesn't need to worry about the map structure and Sass functions, just copy the output CSS values.

* Desaturate primary button colors by 10%

* Convert accidentally capitalized variable names to lowercase

* Simplify color definitions with qcolor function

* Remove default border-focus variable

* Remove redundant colon

* Apply custom scrollbar CSS only on Windows and Linux

* Make border-subtle color brighter than background in dark theme

* Make border-subtle color a shade brighter in light theme

* Use border-subtle for NoteEditor and EditorToolbar border

* Small patches
2022-09-16 14:11:18 +10:00
Henrik Giesel
a87d877082
Fuzzy search in symbol insertion overlay (#2059)
* Add flag for enabling insert symbols feature

* Add symbols overlay directory

* Detect if :xy is inserted into editable

* Allow naive updating of overlay, and special handling of ':'

* First step towards better Virtual Element support

* Update floating to reference range on insert text

* Position SymbolsOverlay always on top or bottom

* Add a data-provider to emulate API

* Show correct suggestions in symbols overlay

* Rename to replacementLength

* Allow replacing via clicking in menu

* Optionally remove inline padding of Popover

* Hide Symbols overlay on blur of content editable

* Add specialKey to inputHandler and generalize how arrow movement is detected

- This way macOS users can use Ctrl-N to mean down, etc.

* Detect special key from within SymbolsOverlay

* Implement full backwards search while typing

* Allow navigating symbol menu and accepting with enter

* Add some entries to data-provider

* Satisfy eslint

* Generate symbolsTable from sources

* Use other github source, allow multiple names

In return, symbol must be unique

* Automatically scroll in symbols dropdown

* Use from npm packages rather than downloading from URL

* Remove console.log

* Remove print

Co-authored-by: Damien Elmes <dae@users.noreply.github.com>

* Add pointerDown event to input-handler

- so that SymbolsOverlay can reset on field click

* Make tab do the same as enter

* Make font a bit smaller but increase relative icon size

* Satisfy type requirement of handlerlist

* Revert changing default size of DropdownItems

* Remove some now unused code for bootstrap dropdowns

* Use fuse to allow fuzzy searching of symbols

* Remove unnecessary async handling in data-provider

I did that because at first I was still expecting to fetch the symbols
from the backend

* Apply field font family in symbol preview

* Remove inline padding from latex popover

* Rename data-provier to symbols-table

* Add some explaining comments to interface

* Allow for auto insertion symbols

* Use deleteData and after instead of replaceData

* Allow using html in symbols

* Show html symbols as html

* Add SymbolsEntry component

* Also include containshtml at low search precedence

* Put character entities and gemoji into their own files

* Factor out prepareInsertion method

* Allow deletion while searching for correct symbol

* Respect insertCompositionText

* Delete data-provider

* Restrict auto insert queries to max 5 characters

* Satisfy svelte check

* Fix the overlay sometimes not showing

This will make sure to always normalize text nodes before searching.
However it adjacent text is partially formatted, this will still not
find the whole query.

For example, currently, entering `<b>:for</b>al` and then inputting `l`,
will not trigger a search for `forall`, because of the <b> formatting

* Add empty line

* Do not trigger overlay, when last character is whitespace or colon

* Add missing fuse license
2022-09-13 14:19:19 +10:00
Henrik Giesel
1a87937973
Fix sticky field labels - Make editor toolbar+tag editor non sticky in editor (#2058)
* Add back overflow:hidden to field descriptions

* Add explaining comment

* Put back overflow:hidden in FieldsEditor

* Move inline padding from Fields component but EditorField+LabelContainer

* Simplify editor design by making editor toolbar not sticky

* Make tag editor in note editor non-sticky as well

* Fix merge mess

* The floating elements were portaled because I passed in undefined and they have a default argument

- Fix unrelated to PR
2022-09-12 19:22:22 +10:00
Henrik Giesel
8f8f3bd465
Insert symbols overlay (#2051)
* Add flag for enabling insert symbols feature

* Add symbols overlay directory

* Detect if :xy is inserted into editable

* Allow naive updating of overlay, and special handling of ':'

* First step towards better Virtual Element support

* Update floating to reference range on insert text

* Position SymbolsOverlay always on top or bottom

* Add a data-provider to emulate API

* Show correct suggestions in symbols overlay

* Rename to replacementLength

* Allow replacing via clicking in menu

* Optionally remove inline padding of Popover

* Hide Symbols overlay on blur of content editable

* Add specialKey to inputHandler and generalize how arrow movement is detected

- This way macOS users can use Ctrl-N to mean down, etc.

* Detect special key from within SymbolsOverlay

* Implement full backwards search while typing

* Allow navigating symbol menu and accepting with enter

* Add some entries to data-provider

* Satisfy eslint

* Generate symbolsTable from sources

* Use other github source, allow multiple names

In return, symbol must be unique

* Automatically scroll in symbols dropdown

* Use from npm packages rather than downloading from URL

* Remove console.log

* Remove print

* Add pointerDown event to input-handler

- so that SymbolsOverlay can reset on field click

* Make tab do the same as enter

* Make font a bit smaller but increase relative icon size

* Satisfy type requirement of handlerlist

* Revert changing default size of DropdownItems

* Remove some now unused code for bootstrap dropdowns
2022-09-10 18:46:59 +10:00
Henrik Giesel
3642dc6245
Use WithFloating for MathjaxOverlay (#2011)
* Allow passing in reference into WithFloating as prop

* Fix WithAutocomplete

* Fix WithFloating for MathjaxOverlay

* Add resize-store

* Allow passing debug=True to jest_test for debugger support (#2013)

* Disable auto-closing of HTML tags

https://forums.ankiweb.net/t/set-html-editor-as-a-default-editor-instead-of-visual-editor/20988/3

Closes #1963

* Add slight margin to MathjaxEditor

* Enable passing offset and shift to WithFloating

* Hide overflow of mathjax editor

* Add automatic hide functionality to sveltelib/position

* Last polishes for Surrounder class (#2017)

* Make private properties in Surrounder truly private

* Fix remove logic of Surrounder

* No reason for toggleTriggerRemove to be async

* Allow using alt-shift to set all remove formats but this one

* modifyFormat => updateFormat

* Fix formatting

* Fix field descriptions blocking cursor from being set (#2018)

- happens when focus is in HTML editor

* Remove hiding functionality again until it's really useful

* Add support for autoPlacement

* Implement new WithFloating that supports manually calling position()

* Implement hide mechanisms

* Add option in math dropdown to toggle MathJax rendering (#2014)

* Add option in math dropdown to toggle MathJax rendering

Closes #1942

* Hackily redraw the page when toggling MathJax

* Add Fluent string

* Default input setting in fields dialog (#1987) (kleinerpirat)

* Introduce field setting to use plain text editor by default (kleinerpirat)

* Remove leftover function from #1476

* Use boolean instead of string

* Simplify clear_other_field_duplicates

* Convert plain text key to camelCase

* Move HTML item below the existing checkbox, instead of to the right (dae)

Showing it on the right is more space efficient, but feels a bit
cluttered IMHO.

* Fix not being able to scroll when mouse hovers PlainTextInput (#2019)

* Remove overscroll-behavior: none for * (all elements)

* Revert "Remove overscroll-behavior: none for * (all elements)"

This reverts commit 189358908c.

* Use body instead of *, but keep CSS rule

* Unify two CSS rules

* Remove console.logs

* Reposition mathjax menu on switching between inline/block

* Implement WithOverlay

* Implement FloatingArrow

* Display overlay with padding and brighter background

* Rename to MathjaxOverlay

* Simplify MathjaxOverlay component overall

* Rename ImageHandle to image overlay

* Generally fix ImageOverlay again

* Increase z-index of StickyContainer

* Fix setting block or inline on mathjax

* Add reasons in closing-{click,keyup}

* Have both WithFloating and WithOverlay use a simple show flag instead of a store

* Remove subscribe-trigger

* Fix clicking from one mathjax element to another

* Check before executing cleanup

* Do not wait for elements to mount before slotting in With{Floating,Overlay}

* Allow using reference slot for WithFloating and WithOveray

* Add inline argument to options

* Add support for inline slot in WithOvelay

* Use WithFloating for RemoveFormatButton

* Remove last uses of DropdownMenu and WithDropdown

* Remove all of the bootstrap dropdown components

* Fix closing behavior of several buttons and ImageOverlay

* Increase popover padding to 6px

* Find a different way to create some padding at the bottom of the fields

...before the tag editor

@kleinerpirat I think is what this css what trying to achieve?

* Satisfy tests

* Use removeStyleProperties in ImageOverlay

* Use notify function in WithOverlay and WithFloating

* Do not use portal for WithFloating and WithOverlay

Allows for scrolling

* Set hidden to default false in Rich/Plain TextInput

* Reset handle when changing mathjax elements via click

* Restrict size of empty mathjax image

* Prevent sticky labels from obscuring menus

* Remove several overflow-hidden

* Fix empty string being falsy bug when editing mathjax

* Do not import portal anymore

* Use { reason, originalEvent } instead of symbol as update to modified event store

* Fix closing behavior of image overlay (do not close after resize)

* Simplify Collapsible

* Use removeStyleProperties in Collapsible

* Satisfy eslint

* Fix latex shortcuts being mounted

* Fix mathjax overlay not focusable in first field

* Neither hide image overlay on escaped

* Fix Block ButtonDropdown wrapping

* Bring back portal to fix tag editor
2022-09-05 17:20:00 +10:00
Damien Elmes
75723d7c9c
Add option in math dropdown to toggle MathJax rendering (#2014)
* Add option in math dropdown to toggle MathJax rendering

Closes #1942

* Hackily redraw the page when toggling MathJax

* Add Fluent string
2022-08-18 12:06:06 +10:00
Henrik Giesel
c7f3bae738
Last polishes for Surrounder class (#2017)
* Make private properties in Surrounder truly private

* Fix remove logic of Surrounder

* No reason for toggleTriggerRemove to be async

* Allow using alt-shift to set all remove formats but this one

* modifyFormat => updateFormat

* Fix formatting
2022-08-17 16:00:37 +10:00
Henrik Giesel
9ca13ca3bc
Refactor how toolbar buttons get to surround within editor fields (#1931)
* Export surrounder directly from RichTextInput

* Change wording in editor/surround

* Remove empty line

* Change wording

* Fix interfaces

* Add field description directly in NoteEditor

* Strip description logic from ContentEditable

* Make RichTextInput position: relative

* Make attachToShadow an async function

* Apply field styling to field description

* Show FieldDescription only if content empty

* Remove descriptionStore and descriptionKey

* Revert "Make attachToShadow an async function"

This reverts commit b62705eadf.

SvelteActionReturnType does not accept Promise<void>

* Fix mess after merge commit

* Require registering surround formats
2022-08-15 13:34:16 +10:00
RumovZ
42cbe42f06
Plaintext import/export (#1850)
* Add crate csv

* Add start of csv importing on backend

* Add Menomosyne serializer

* Add csv and json importing on backend

* Add plaintext importing on frontend

* Add csv metadata extraction on backend

* Add csv importing with GUI

* Fix missing dfa file in build

Added compile_data_attr, then re-ran cargo/update.py.

* Don't use doubly buffered reader in csv

* Escape HTML entities if CSV is not HTML

Also use name 'is_html' consistently.

* Use decimal number as foreign ease (like '2.5')

* ForeignCard.ivl → ForeignCard.interval

* Only allow fixed set of CSV delimiters

* Map timestamp of ForeignCard to native due time

* Don't trim CSV records

* Document use of empty strings for defaults

* Avoid creating CardGenContexts for every note

This requires CardGenContext to be generic, so it works both with an
owned and borrowed notetype.

* Show all accepted file types  in import file picker

* Add import_json_file()

* factor → ease_factor

* delimter_from_value → delimiter_from_value

* Map columns to fields, not the other way around

* Fallback to current config for csv metadata

* Add start of new import csv screen

* Temporary fix for compilation issue on Linux/Mac

* Disable jest bazel action for import-csv

Jest fails with an error code if no tests are available, but this would
not be noticable on Windows as Jest is not run there.

* Fix field mapping issue

* Revert "Temporary fix for compilation issue on Linux/Mac"

This reverts commit 21f8a26140.

* Add HtmlSwitch and move Switch to components

* Fix spacing and make selectors consistent

* Fix shortcut tooltip

* Place import button at the top with path

* Fix meta column indices

* Remove NotetypeForString

* Fix queue and type of foreign cards

* Support different dupe resolution strategies

* Allow dupe resolution selection when importing CSV

* Test import of unnormalized text

Close  #1863.

* Fix logging of foreign notes

* Implement CSV exports

* Use db_scalar() in notes_table_len()

* Rework CSV metadata

- Notetypes and decks are either defined by a global id or by a column.
- If a notetype id is provided, its field map must also be specified.
- If a notetype column is provided, fields are now mapped by index
instead of name at import time. So the first non-meta column is used for
the first field of every note, regardless of notetype. This makes
importing easier and should improve compatiblity with files without a
notetype column.
- Ensure first field can be mapped to a column.
- Meta columns must be defined as `#[meta name]:[column index]` instead
of in the `#columns` tag.
- Column labels contain the raw names defined by the file and must be
prettified by the frontend.

* Adjust frontend to new backend column mapping

* Add force flags for is_html and delimiter

* Detect if CSV is HTML by field content

* Update dupe resolution labels

* Simplify selectors

* Fix coalescence of oneofs in TS

* Disable meta columns from selection

Plus a lot of refactoring.

* Make import button stick to the bottom

* Write delimiter and html flag into csv

* Refetch field map after notetype change

* Fix log labels for csv import

* Log notes whose deck/notetype was missing

* Fix hiding of empty log queues

* Implement adding tags to all notes of a csv

* Fix dupe resolution not being set in log

* Implement adding tags to updated notes of a csv

* Check first note field is not empty

* Temporary fix for build on Linux/Mac

* Fix inverted html check (dae)

* Remove unused ftl string

* Delimiter → Separator

* Remove commented-out line

* Don't accept .json files

* Tweak tag ftl strings

* Remove redundant blur call

* Strip sound and add spaces in csv export

* Export HTML by default

* Fix unset deck in Mnemosyne import

Also accept both numbers and strings for notetypes and decks in JSON.

* Make DupeResolution::Update the default

* Fix missing dot in extension

* Make column indices 1-based

* Remove StickContainer from TagEditor

Fixes line breaking, border and z index on ImportCsvPage.

* Assign different key combos to tag editors

* Log all updated duplicates

Add a log field for the true number of found notes.

* Show identical notes as skipped

* Split tag-editor into separate ts module (dae)

* Add progress for CSV export

* Add progress for text import

* Tidy-ups after tag-editor split (dae)

- import-csv no longer depends on editor
- remove some commented lines
2022-06-01 20:26:16 +10:00