GitHub/Anki
1
0
Fork 0
mirror of https://github.com/ankitects/anki.git synced 2025-09-19 14:32:22 -04:00
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Merge pull request #1357 from hgiesel/preventstickybubble

Browse source 
Prevent sticky bubble
This commit is contained in:
Damien Elmes 2021-09-08 19:02:00 +10:00 committed by GitHub
commit 4ba30279ac
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 25 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
ts/editor/editor-field.ts
View file

@ -41,11 +41,11 @@ export class EditorField extends HTMLDivElement {
} }
connectedCallback(): void { connectedCallback(): void {
this.labelContainer.addEventListener("mousedown", this.focusIfNotFocused); this.addEventListener("mousedown", this.focusIfNotFocused);
} }
disconnectedCallback(): void { disconnectedCallback(): void {
this.labelContainer.removeEventListener("mousedown", this.focusIfNotFocused); this.removeEventListener("mousedown", this.focusIfNotFocused);
} }
attributeChangedCallback(name: string, _oldValue: string, newValue: string): void { attributeChangedCallback(name: string, _oldValue: string, newValue: string): void {

29
ts/editor/label-container.ts
View file

@ -7,6 +7,7 @@ import * as tr from "lib/i18n";
import { registerShortcut } from "lib/shortcuts"; import { registerShortcut } from "lib/shortcuts";
import { bridgeCommand } from "./lib"; import { bridgeCommand } from "./lib";
import { appendInParentheses } from "./helpers"; import { appendInParentheses } from "./helpers";
import { saveField } from "./change-timer";
import { getCurrentField, forEditorField, i18n } from "."; import { getCurrentField, forEditorField, i18n } from ".";
import pinIcon from "./pin-angle.svg"; import pinIcon from "./pin-angle.svg";
@ -41,10 +42,6 @@ export class LabelContainer extends HTMLDivElement {
super(); super();
this.className = "fname d-flex justify-content-between"; this.className = "fname d-flex justify-content-between";
i18n.then(() => {
this.title = appendInParentheses(tr.editingToggleSticky(), "F9");
});
this.label = document.createElement("span"); this.label = document.createElement("span");
this.label.className = "fieldname"; this.label.className = "fieldname";
this.appendChild(this.label); this.appendChild(this.label);
@ -57,29 +54,43 @@ export class LabelContainer extends HTMLDivElement {
this.sticky.className = "icon pin-icon"; this.sticky.className = "icon pin-icon";
this.sticky.innerHTML = pinIcon; this.sticky.innerHTML = pinIcon;
this.sticky.hidden = true; this.sticky.hidden = true;
i18n.then(() => {
this.sticky.title = appendInParentheses(tr.editingToggleSticky(), "F9");
});
this.fieldState.appendChild(this.sticky); this.fieldState.appendChild(this.sticky);
this.setSticky = this.setSticky.bind(this); this.setSticky = this.setSticky.bind(this);
this.hoverIcon = this.hoverIcon.bind(this); this.hoverIcon = this.hoverIcon.bind(this);
this.removeHoverIcon = this.removeHoverIcon.bind(this); this.removeHoverIcon = this.removeHoverIcon.bind(this);
this.toggleSticky = this.toggleSticky.bind(this); this.toggleSticky = this.toggleSticky.bind(this);
this.toggleStickyEvent = this.toggleStickyEvent.bind(this);
this.keepFocus = this.keepFocus.bind(this); this.keepFocus = this.keepFocus.bind(this);
this.stopPropagation = this.stopPropagation.bind(this);
} }
keepFocus(event: Event): void { keepFocus(event: Event): void {
event.preventDefault(); event.preventDefault();
} }
stopPropagation(event: Event): void {
this.keepFocus(event);
event.stopPropagation();
}
connectedCallback(): void { connectedCallback(): void {
this.addEventListener("mousedown", this.keepFocus); this.addEventListener("mousedown", this.keepFocus);
this.sticky.addEventListener("click", this.toggleSticky); this.sticky.addEventListener("mousedown", this.stopPropagation);
this.sticky.addEventListener("click", this.toggleStickyEvent);
this.sticky.addEventListener("mouseenter", this.hoverIcon); this.sticky.addEventListener("mouseenter", this.hoverIcon);
this.sticky.addEventListener("mouseleave", this.removeHoverIcon); this.sticky.addEventListener("mouseleave", this.removeHoverIcon);
} }
disconnectedCallback(): void { disconnectedCallback(): void {
this.removeEventListener("mousedown", this.keepFocus); this.removeEventListener("mousedown", this.keepFocus);
this.sticky.removeEventListener("click", this.toggleSticky); this.sticky.removeEventListener("mousedown", this.stopPropagation);
this.sticky.removeEventListener("click", this.toggleStickyEvent);
this.sticky.removeEventListener("mouseenter", this.hoverIcon); this.sticky.removeEventListener("mouseenter", this.hoverIcon);
this.sticky.removeEventListener("mouseleave", this.removeHoverIcon); this.sticky.removeEventListener("mouseleave", this.removeHoverIcon);
} }
@ -106,7 +117,13 @@ export class LabelContainer extends HTMLDivElement {
} }
toggleSticky(): void { toggleSticky(): void {
saveField((this.parentElement as EditorField).editingArea, "key");
bridgeCommand(`toggleSticky:${this.getAttribute("ord")}`, this.setSticky); bridgeCommand(`toggleSticky:${this.getAttribute("ord")}`, this.setSticky);
this.removeHoverIcon(); this.removeHoverIcon();
} }
toggleStickyEvent(event: Event): void {
event.stopPropagation();
this.toggleSticky();
}
} }