1
0
mirror of https://github.com/laurent22/joplin.git synced 2025-01-11 18:24:43 +02:00

Desktop: Resolves #6172: Checkbox don't function while checkbox format button hidden from toolbar (#6567)

This commit is contained in:
SFulpius 2022-06-20 15:29:32 +02:00 committed by GitHub
parent c0bc4c38c3
commit c8b6122a65
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 42 additions and 41 deletions

View File

@ -9,11 +9,13 @@ import PluginManager from 'tinymce/core/api/PluginManager';
import * as Api from './api/Api';
import * as Commands from './api/Commands';
import * as Keyboard from './core/Keyboard';
import * as Mouse from './core/Mouse'
import * as Buttons from './ui/Buttons';
export default function () {
PluginManager.add('joplinLists', function (editor) {
Keyboard.setup(editor);
Mouse.setup(editor);
Buttons.register(editor);
Commands.register(editor);

View File

@ -0,0 +1,26 @@
import { isJoplinChecklistItem } from '../listModel/JoplinListUtil';
const setup = function (editor) {
const editorClickHandler = (event) => {
if (!isJoplinChecklistItem(event.target)) return;
// We only process the click if it's within the checkbox itself (and not the label).
// That checkbox, based on
// the current styling is in the negative margin, so offsetX is negative when clicking
// on the checkbox itself, and positive when clicking on the label. This is strongly
// dependent on how the checkbox is styled, so if the style is changed, this might need
// to be updated too.
// For the styling, see:
// packages/renderer/MdToHtml/rules/checkbox.ts
//
// The previous solution was to use "pointer-event: none", which mostly work, however
// it means that links are no longer clickable when they are within the checkbox label.
if (event.offsetX >= 0) return;
editor.execCommand('ToggleJoplinChecklistItem', false, { element: event.target });
}
editor.on('click', editorClickHandler);
};
export { setup };

View File

@ -10,7 +10,7 @@ import * as Settings from '../api/Settings';
import * as NodeType from '../core/NodeType';
import Editor from 'tinymce/core/api/Editor';
import { isCustomList } from '../core/Util';
import { findContainerListTypeFromEvent, isJoplinChecklistItem } from '../listModel/JoplinListUtil';
import { findContainerListTypeFromEvent } from '../listModel/JoplinListUtil';
const findIndex = function (list, predicate) {
for (let index = 0; index < list.length; index++) {
@ -38,37 +38,11 @@ const listState = function (editor: Editor, listName, options:any = {}) {
buttonApi.setActive(listType === options.listType && lists.length > 0 && lists[0].nodeName === listName && !isCustomList(lists[0]));
};
const editorClickHandler = (event) => {
if (!isJoplinChecklistItem(event.target)) return;
// We only process the click if it's within the checkbox itself (and not the label).
// That checkbox, based on
// the current styling is in the negative margin, so offsetX is negative when clicking
// on the checkbox itself, and positive when clicking on the label. This is strongly
// dependent on how the checkbox is styled, so if the style is changed, this might need
// to be updated too.
// For the styling, see:
// packages/renderer/MdToHtml/rules/checkbox.ts
//
// The previous solution was to use "pointer-event: none", which mostly work, however
// it means that links are no longer clickable when they are within the checkbox label.
if (event.offsetX >= 0) return;
editor.execCommand('ToggleJoplinChecklistItem', false, { element: event.target });
}
if (options.listType === 'joplinChecklist') {
editor.on('click', editorClickHandler);
}
editor.on('NodeChange', nodeChangeHandler);
return () => {
if (options.listType === 'joplinChecklist') {
editor.off('click', editorClickHandler);
}
editor.off('NodeChange', nodeChangeHandler);
}
}
};
};

View File

@ -2078,6 +2078,17 @@
setup(editor);
};
var setup$2 = function (editor) {
var editorClickHandler = function (event) {
if (!isJoplinChecklistItem(event.target))
return;
if (event.offsetX >= 0)
return;
editor.execCommand('ToggleJoplinChecklistItem', false, { element: event.target });
};
editor.on('click', editorClickHandler);
};
var findIndex = function (list, predicate) {
for (var index = 0; index < list.length; index++) {
var element = list[index];
@ -2100,21 +2111,8 @@
var listType = findContainerListTypeFromEvent(e);
buttonApi.setActive(listType === options.listType && lists.length > 0 && lists[0].nodeName === listName && !isCustomList(lists[0]));
};
var editorClickHandler = function (event) {
if (!isJoplinChecklistItem(event.target))
return;
if (event.offsetX >= 0)
return;
editor.execCommand('ToggleJoplinChecklistItem', false, { element: event.target });
};
if (options.listType === 'joplinChecklist') {
editor.on('click', editorClickHandler);
}
editor.on('NodeChange', nodeChangeHandler);
return function () {
if (options.listType === 'joplinChecklist') {
editor.off('click', editorClickHandler);
}
editor.off('NodeChange', nodeChangeHandler);
};
};
@ -2158,6 +2156,7 @@
function Plugin () {
PluginManager.add('joplinLists', function (editor) {
setup$1(editor);
setup$2(editor);
register$1(editor);
register(editor);
return get(editor);