From 357a6c5cc6e2a90b860315e082b97f6b8a651f44 Mon Sep 17 00:00:00 2001 From: Henrik Giesel Date: Tue, 3 Aug 2021 05:52:07 +0200 Subject: [PATCH 1/4] Add toggle sticky shortcuts F9 and Shift+F9 --- qt/aqt/addcards.py | 1 + qt/aqt/editor.py | 16 +++++++++ ts/editor/index.ts | 1 + ts/editor/label-container.ts | 65 ++++++++++++++++++++++++------------ 4 files changed, 61 insertions(+), 22 deletions(-) diff --git a/qt/aqt/addcards.py b/qt/aqt/addcards.py index b833fd1bb..ae76e8259 100644 --- a/qt/aqt/addcards.py +++ b/qt/aqt/addcards.py @@ -58,6 +58,7 @@ class AddCards(QDialog): def setupEditor(self) -> None: self.editor = aqt.editor.Editor(self.mw, self.form.fieldsArea, self, True) + self.editor.web.eval("activateStickyShortcuts();") def setup_choosers(self) -> None: defaults = self.col.defaults_for_adding( diff --git a/qt/aqt/editor.py b/qt/aqt/editor.py index 8b7a6406a..6f182d890 100644 --- a/qt/aqt/editor.py +++ b/qt/aqt/editor.py @@ -389,6 +389,22 @@ $editorToolbar.then(({{ toolbar }}) => toolbar.appendGroup({{ self.currentField = int(num) gui_hooks.editor_did_focus_field(self.note, self.currentField) + elif cmd.startswith("toggleStickyAll"): + model = self.note.note_type() + flds = model["flds"] + + any_sticky = any([fld["sticky"] for fld in flds]) + result = [] + for fld in flds: + if not any_sticky or fld["sticky"]: + fld["sticky"] = not fld["sticky"] + + result.append(fld["sticky"]) + + update_notetype_legacy(parent=self.mw, notetype=model).run_in_background() + + return result + elif cmd.startswith("toggleSticky"): (type, num) = cmd.split(":", 1) ord = int(num) diff --git a/ts/editor/index.ts b/ts/editor/index.ts index d304b228e..8596939d5 100644 --- a/ts/editor/index.ts +++ b/ts/editor/index.ts @@ -28,6 +28,7 @@ export { setNoteId, getNoteId } from "./note-id"; export { saveNow } from "./change-timer"; export { wrap, wrapIntoText } from "./wrap"; export { editorToolbar } from "./toolbar"; +export { activateStickyShortcuts } from "./label-container"; export { components } from "./Components.svelte"; declare global { diff --git a/ts/editor/label-container.ts b/ts/editor/label-container.ts index 7f9b2a02e..96a489e5c 100644 --- a/ts/editor/label-container.ts +++ b/ts/editor/label-container.ts @@ -1,17 +1,32 @@ // Copyright: Ankitects Pty Ltd and contributors // License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html +import type { EditorField } from "./editor-field"; + +import { registerShortcut } from "lib/shortcuts"; import { bridgeCommand } from "./lib"; +import { getCurrentField, forEditorField } from "."; import pinIcon from "./pin-angle.svg"; -function removeHoverIcon(evt: Event): void { - const icon = evt.currentTarget as HTMLElement; - icon.classList.remove("icon--hover"); +function toggleStickyCurrentField() { + const currentField = getCurrentField(); + + if (currentField) { + const labelContainer = (currentField.parentElement as EditorField) + .labelContainer; + labelContainer.toggleSticky(); + } } -function hoverIcon(evt: Event): void { - const icon = evt.currentTarget as HTMLElement; - icon.classList.add("icon--hover"); +function toggleStickyAll() { + bridgeCommand("toggleStickyAll", (values: boolean[]) => + forEditorField(values, (field, value) => field.labelContainer.setSticky(value)) + ); +} + +export function activateStickyShortcuts() { + registerShortcut(toggleStickyCurrentField, "F9"); + registerShortcut(toggleStickyAll, "Shift+F9"); } export class LabelContainer extends HTMLDivElement { @@ -32,41 +47,47 @@ export class LabelContainer extends HTMLDivElement { this.sticky.hidden = true; this.appendChild(this.sticky); + this.setSticky = this.setSticky.bind(this); + this.hoverIcon = this.hoverIcon.bind(this); + this.removeHoverIcon = this.removeHoverIcon.bind(this); this.toggleSticky = this.toggleSticky.bind(this); } connectedCallback(): void { this.sticky.addEventListener("click", this.toggleSticky); - this.sticky.addEventListener("mouseenter", hoverIcon); - this.sticky.addEventListener("mouseleave", removeHoverIcon); + this.sticky.addEventListener("mouseenter", this.hoverIcon); + this.sticky.addEventListener("mouseleave", this.removeHoverIcon); } disconnectedCallback(): void { this.sticky.removeEventListener("click", this.toggleSticky); - this.sticky.removeEventListener("mouseenter", hoverIcon); - this.sticky.removeEventListener("mouseleave", removeHoverIcon); + this.sticky.removeEventListener("mouseenter", this.hoverIcon); + this.sticky.removeEventListener("mouseleave", this.removeHoverIcon); } initialize(labelName: string): void { this.label.innerText = labelName; } - setSticky(state: boolean): void { - this.sticky.classList.toggle("is-inactive", !state); - } - activateSticky(initialState: boolean): void { this.setSticky(initialState); this.sticky.hidden = false; } - toggleSticky(evt: Event): void { - bridgeCommand( - `toggleSticky:${this.getAttribute("ord")}`, - (newState: boolean): void => { - this.setSticky(newState); - } - ); - removeHoverIcon(evt); + setSticky(state: boolean): void { + this.sticky.classList.toggle("is-inactive", !state); + } + + hoverIcon(): void { + this.sticky.classList.add("icon--hover"); + } + + removeHoverIcon(): void { + this.sticky.classList.remove("icon--hover"); + } + + toggleSticky(): void { + bridgeCommand(`toggleSticky:${this.getAttribute("ord")}`, this.setSticky); + this.removeHoverIcon(); } } From d7232212a8955d11d202cb6abc479628f99e7560 Mon Sep 17 00:00:00 2001 From: Henrik Giesel Date: Tue, 3 Aug 2021 05:52:57 +0200 Subject: [PATCH 2/4] Increase inactive opacity a little for better discoverability --- ts/editor/fields.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ts/editor/fields.scss b/ts/editor/fields.scss index 756903187..141af04f6 100644 --- a/ts/editor/fields.scss +++ b/ts/editor/fields.scss @@ -55,7 +55,7 @@ cursor: pointer; &.is-inactive { - opacity: 0.1; + opacity: 0.2; } &.icon--hover { From b6aa59f2c73b1714e9342c5957e83f2c2f6ce5f4 Mon Sep 17 00:00:00 2001 From: Henrik Giesel Date: Tue, 3 Aug 2021 06:02:29 +0200 Subject: [PATCH 3/4] Add tooltip for Toggly sticky icon --- ftl/core/editing.ftl | 1 + ts/editor/index.ts | 2 +- ts/editor/label-container.ts | 8 +++++++- 3 files changed, 9 insertions(+), 2 deletions(-) diff --git a/ftl/core/editing.ftl b/ftl/core/editing.ftl index 92a1f7bca..89e876b98 100644 --- a/ftl/core/editing.ftl +++ b/ftl/core/editing.ftl @@ -39,6 +39,7 @@ editing-subscript = Subscript editing-superscript = Superscript editing-tags = Tags editing-to-make-a-cloze-deletion-on = To make a cloze deletion on an existing note, you need to change it to a cloze type first, via 'Notes>Change Note Type' +editing-toggle-sticky = Toggle sticky editing-underline-text = Underline text editing-unordered-list = Unordered list editing-warning-cloze-deletions-will-not-work = Warning, cloze deletions will not work until you switch the type at the top to Cloze. diff --git a/ts/editor/index.ts b/ts/editor/index.ts index 8596939d5..57671daac 100644 --- a/ts/editor/index.ts +++ b/ts/editor/index.ts @@ -191,7 +191,7 @@ export function setFormat(cmd: string, arg?: string, nosave = false): void { } } -const i18n = setupI18n({ +export const i18n = setupI18n({ modules: [ ModuleName.EDITING, ModuleName.KEYBOARD, diff --git a/ts/editor/label-container.ts b/ts/editor/label-container.ts index 96a489e5c..6b657fbe6 100644 --- a/ts/editor/label-container.ts +++ b/ts/editor/label-container.ts @@ -2,10 +2,12 @@ // License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html import type { EditorField } from "./editor-field"; +import * as tr from "lib/i18n"; import { registerShortcut } from "lib/shortcuts"; import { bridgeCommand } from "./lib"; -import { getCurrentField, forEditorField } from "."; +import { appendInParentheses } from "./helpers"; +import { getCurrentField, forEditorField, i18n } from "."; import pinIcon from "./pin-angle.svg"; function toggleStickyCurrentField() { @@ -37,6 +39,10 @@ export class LabelContainer extends HTMLDivElement { super(); this.className = "d-flex justify-content-between"; + i18n.then(() => { + this.title = appendInParentheses(tr.editingToggleSticky(), "F9"); + }); + this.label = document.createElement("span"); this.label.className = "fieldname"; this.appendChild(this.label); From 73a6d2bd40153d4500764681cfd2d9f295c1c41d Mon Sep 17 00:00:00 2001 From: Henrik Giesel Date: Tue, 3 Aug 2021 06:12:04 +0200 Subject: [PATCH 4/4] Satisfy eslint --- ts/editor/label-container.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/ts/editor/label-container.ts b/ts/editor/label-container.ts index 6b657fbe6..bc6816e54 100644 --- a/ts/editor/label-container.ts +++ b/ts/editor/label-container.ts @@ -10,7 +10,7 @@ import { appendInParentheses } from "./helpers"; import { getCurrentField, forEditorField, i18n } from "."; import pinIcon from "./pin-angle.svg"; -function toggleStickyCurrentField() { +function toggleStickyCurrentField(): void { const currentField = getCurrentField(); if (currentField) { @@ -20,13 +20,13 @@ function toggleStickyCurrentField() { } } -function toggleStickyAll() { +function toggleStickyAll(): void { bridgeCommand("toggleStickyAll", (values: boolean[]) => forEditorField(values, (field, value) => field.labelContainer.setSticky(value)) ); } -export function activateStickyShortcuts() { +export function activateStickyShortcuts(): void { registerShortcut(toggleStickyCurrentField, "F9"); registerShortcut(toggleStickyAll, "Shift+F9"); }