DEV: supports pointerover and pointerout (#31302)

This commit adds support these events in widgets.

Usage in a widget:

```javascript
pointerOver(event) {}
pointerOut(event) {}
```
This commit is contained in:
Joffrey JAFFEUX 2025-02-12 14:54:17 +01:00 committed by GitHub
parent 820c8cb119
commit 23e07fb076
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 42 additions and 0 deletions

View File

@ -19,6 +19,8 @@ const MOUSE_OUT_ATTRIBUTE_NAME = "_discourse_mouse_out_widget";
const TOUCH_START_ATTRIBUTE_NAME = "_discourse_touch_start_widget";
const TOUCH_END_ATTRIBUTE_NAME = "_discourse_touch_end_widget";
const TOUCH_MOVE_ATTRIBUTE_NAME = "_discourse_touch_move_widget";
const POINTER_OVER_ATTRIBUTE_NAME = "_discourse_pointer_over_widget";
const POINTER_OUT_ATTRIBUTE_NAME = "_discourse_pointer_out_widget";
class WidgetBaseHook {
constructor(widget) {
@ -64,6 +66,8 @@ export const WidgetMouseUpHook = buildHook(MOUSE_UP_ATTRIBUTE_NAME);
export const WidgetMouseDownHook = buildHook(MOUSE_DOWN_ATTRIBUTE_NAME);
export const WidgetMouseMoveHook = buildHook(MOUSE_MOVE_ATTRIBUTE_NAME);
export const WidgetMouseOverHook = buildHook(MOUSE_OVER_ATTRIBUTE_NAME);
export const WidgetPointerOverHook = buildHook(POINTER_OVER_ATTRIBUTE_NAME);
export const WidgetPointerOutHook = buildHook(POINTER_OUT_ATTRIBUTE_NAME);
export const WidgetMouseOutHook = buildHook(MOUSE_OUT_ATTRIBUTE_NAME);
export const WidgetTouchEndHook = buildHook(TOUCH_END_ATTRIBUTE_NAME);
@ -216,6 +220,20 @@ WidgetClickHook.setupDocumentCallback = function () {
})
);
$(document).on(
"pointerover.discourse-widget",
bind(this, (e) => {
nodeCallback(
e.target,
POINTER_OVER_ATTRIBUTE_NAME,
(w) => w.pointerOver(e),
{
rerender: false,
}
);
})
);
$(document).on(
"mouseout.discourse-widget",
bind(this, (e) => {
@ -225,6 +243,20 @@ WidgetClickHook.setupDocumentCallback = function () {
})
);
$(document).on(
"pointerout.discourse-widget",
bind(this, (e) => {
nodeCallback(
e.target,
POINTER_OUT_ATTRIBUTE_NAME,
(w) => w.pointerOut(e),
{
rerender: false,
}
);
})
);
$(document).on(
"dblclick.discourse-widget",
bind(this, (e) => {

View File

@ -22,6 +22,8 @@ import {
WidgetMouseOutHook,
WidgetMouseOverHook,
WidgetMouseUpHook,
WidgetPointerOutHook,
WidgetPointerOverHook,
WidgetTouchEndHook,
WidgetTouchMoveHook,
WidgetTouchStartHook,
@ -484,6 +486,14 @@ export default class Widget {
properties["widget-mouse-over"] = new WidgetMouseOverHook(this);
}
if (this.pointerOver) {
properties["widget-pointer-over"] = new WidgetPointerOverHook(this);
}
if (this.pointerOut) {
properties["widget-pointer-out"] = new WidgetPointerOutHook(this);
}
if (this.mouseOut) {
properties["widget-mouse-out"] = new WidgetMouseOutHook(this);
}