DEV: adds mouse{Over,Out} and touch{Start,End} to widgets (#10003)

This commit is contained in:
Joffrey JAFFEUX 2020-06-09 19:36:28 +02:00 committed by GitHub
parent 415c1bb9e1
commit 23ed16339f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 53 additions and 1 deletions

View File

@ -13,6 +13,10 @@ const CHANGE_ATTRIBUTE_NAME = "_discourse_change_widget";
const MOUSE_DOWN_ATTRIBUTE_NAME = "_discourse_mouse_down_widget";
const MOUSE_UP_ATTRIBUTE_NAME = "_discourse_mouse_up_widget";
const MOUSE_MOVE_ATTRIBUTE_NAME = "_discourse_mouse_move_widget";
const MOUSE_OVER_ATTRIBUTE_NAME = "_discourse_mouse_over_widget";
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";
function buildHook(attributeName, setAttr) {
return class {
@ -54,6 +58,10 @@ export const WidgetChangeHook = buildHook(CHANGE_ATTRIBUTE_NAME);
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 WidgetMouseOutHook = buildHook(MOUSE_OUT_ATTRIBUTE_NAME);
export const WidgetTouchStartHook = buildHook(TOUCH_START_ATTRIBUTE_NAME);
export const WidgetTouchEndHook = buildHook(TOUCH_END_ATTRIBUTE_NAME);
function nodeCallback(node, attrName, cb, options = { rerender: true }) {
const { rerender } = options;
@ -112,6 +120,18 @@ WidgetClickHook.setupDocumentCallback = function() {
}
};
$(document).on("mouseover.discourse-widget", e => {
nodeCallback(e.target, MOUSE_OVER_ATTRIBUTE_NAME, w => w.mouseOver(e), {
rerender: false
});
});
$(document).on("mouseout.discourse-widget", e => {
nodeCallback(e.target, MOUSE_OUT_ATTRIBUTE_NAME, w => w.mouseOut(e), {
rerender: false
});
});
document.addEventListener("touchmove", onDrag, {
passive: false,
capture: true
@ -202,6 +222,18 @@ WidgetClickHook.setupDocumentCallback = function() {
});
});
$(document).on("touchstart.discourse-widget", e => {
nodeCallback(e.target, TOUCH_START_ATTRIBUTE_NAME, w => w.touchStart(e), {
rerender: false
});
});
$(document).on("touchend.discourse-widget", e => {
nodeCallback(e.target, TOUCH_END_ATTRIBUTE_NAME, w => w.touchEnd(e), {
rerender: false
});
});
$(document).on("mousedown.discourse-widget", e => {
nodeCallback(e.target, MOUSE_DOWN_ATTRIBUTE_NAME, w => {
w.mouseDown(e);

View File

@ -11,7 +11,11 @@ import {
WidgetChangeHook,
WidgetMouseUpHook,
WidgetMouseDownHook,
WidgetMouseMoveHook
WidgetMouseMoveHook,
WidgetMouseOverHook,
WidgetMouseOutHook,
WidgetTouchStartHook,
WidgetTouchEndHook
} from "discourse/widgets/hooks";
import { h } from "virtual-dom";
import DecoratorHelper from "discourse/widgets/decorator-helper";
@ -410,6 +414,22 @@ export default class Widget {
properties["widget-mouse-move"] = new WidgetMouseMoveHook(this);
}
if (this.mouseOver) {
properties["widget-mouse-over"] = new WidgetMouseOverHook(this);
}
if (this.mouseOut) {
properties["widget-mouse-out"] = new WidgetMouseOutHook(this);
}
if (this.touchStart) {
properties["widget-touch-start"] = new WidgetTouchStartHook(this);
}
if (this.touchEnd) {
properties["widget-touch-end"] = new WidgetTouchEndHook(this);
}
const attributes = properties["attributes"] || {};
properties.attributes = attributes;