diff --git a/src/main/scala/org/scalajs/dom/package.scala b/src/main/scala/org/scalajs/dom/package.scala index 817ab97d1..5b0cd222f 100644 --- a/src/main/scala/org/scalajs/dom/package.scala +++ b/src/main/scala/org/scalajs/dom/package.scala @@ -116,6 +116,8 @@ package object dom { type MessagePort = raw.MessagePort type ModifierKeyEvent = raw.ModifierKeyEvent type MouseEvent = raw.MouseEvent + type PointerEvent = raw.PointerEvent + type PointerEventInit = raw.PointerEventInit @deprecated("Obsolete.", "WHATWG DOM") type MutationEvent = raw.MutationEvent @deprecated("Obsolete.", "WHATWG DOM") diff --git a/src/main/scala/org/scalajs/dom/raw/Html.scala b/src/main/scala/org/scalajs/dom/raw/Html.scala index 358ee2480..8c95fb5a4 100644 --- a/src/main/scala/org/scalajs/dom/raw/Html.scala +++ b/src/main/scala/org/scalajs/dom/raw/Html.scala @@ -546,6 +546,84 @@ abstract class HTMLDocument extends Document { var oncanplaythrough: js.Function1[Event, _] = js.native var onstoragecommit: js.Function1[StorageEvent, _] = js.native + + /** + * fired when a pointing device is moved into an element's hit test boundaries. + * + * MDN + */ + var onpointerover: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointing device is moved into the hit test boundaries of an element + * or one of its descendants, including as a result of a pointerdown event + * from a device that does not support hover (see pointerdown). + * + * MDN + */ + var onpointerenter: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointer becomes active. + * + * MDN + */ + var onpointerdown: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointer changes coordinates. + * + * MDN + */ + var onpointermove: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointer is no longer active. + * + * MDN + */ + var onpointerup: js.Function1[PointerEvent, _] = js.native + + /** + * a browser fires this event if it concludes the pointer will no longer be able + * to generate events (for example the related device is deactived). + * + * MDN + */ + var onpointercancel: js.Function1[PointerEvent, _] = js.native + + /** + * fired for several reasons including: pointing device is moved out of + * the hit test boundaries of an element; + * firing the pointerup event for a device that does not support hover (see pointerup); + * after firing the pointercancel event (see pointercancel); + * when a pen stylus leaves the hover range detectable by the digitizer. + * + * MDN + */ + var onpointerout: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointing device is moved out of the hit test boundaries of an element. + * For pen devices, this event is fired when the stylus leaves the hover range detectable by the digitizer. + * + * MDN + */ + var onpointerleave: js.Function1[PointerEvent, _] = js.native + + /** + * fired when an element receives pointer capture. + * + * MDN + */ + var gotpointercapture: js.Function1[PointerEvent, _] = js.native + + /** + * Fired after pointer capture is released for a pointer. + * + * MDN + */ + var lostpointercapture: js.Function1[PointerEvent, _] = js.native } /** @@ -4117,6 +4195,84 @@ abstract class HTMLElement extends Element { * is an HTMLElement) that we are getting an HTMLDocument here. */ override def ownerDocument: HTMLDocument = js.native + + /** + * fired when a pointing device is moved into an element's hit test boundaries. + * + * MDN + */ + var onpointerover: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointing device is moved into the hit test boundaries of an element + * or one of its descendants, including as a result of a pointerdown event + * from a device that does not support hover (see pointerdown). + * + * MDN + */ + var onpointerenter: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointer becomes active. + * + * MDN + */ + var onpointerdown: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointer changes coordinates. + * + * MDN + */ + var onpointermove: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointer is no longer active. + * + * MDN + */ + var onpointerup: js.Function1[PointerEvent, _] = js.native + + /** + * a browser fires this event if it concludes the pointer will no longer be able + * to generate events (for example the related device is deactived). + * + * MDN + */ + var onpointercancel: js.Function1[PointerEvent, _] = js.native + + /** + * fired for several reasons including: pointing device is moved out of + * the hit test boundaries of an element; + * firing the pointerup event for a device that does not support hover (see pointerup); + * after firing the pointercancel event (see pointercancel); + * when a pen stylus leaves the hover range detectable by the digitizer. + * + * MDN + */ + var onpointerout: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointing device is moved out of the hit test boundaries of an element. + * For pen devices, this event is fired when the stylus leaves the hover range detectable by the digitizer. + * + * MDN + */ + var onpointerleave: js.Function1[PointerEvent, _] = js.native + + /** + * fired when an element receives pointer capture. + * + * MDN + */ + var gotpointercapture: js.Function1[PointerEvent, _] = js.native + + /** + * Fired after pointer capture is released for a pointer. + * + * MDN + */ + var lostpointercapture: js.Function1[PointerEvent, _] = js.native } /** diff --git a/src/main/scala/org/scalajs/dom/raw/lib.scala b/src/main/scala/org/scalajs/dom/raw/lib.scala index a9f32fa96..ec742aefc 100644 --- a/src/main/scala/org/scalajs/dom/raw/lib.scala +++ b/src/main/scala/org/scalajs/dom/raw/lib.scala @@ -1443,6 +1443,213 @@ class MouseEvent extends UIEvent with ModifierKeyEvent { def getModifierState(keyArg: String): Boolean = js.native } +/** + * Most of today's web content assumes the user's pointing device will be a mouse. + * However, since many devices support other types of pointing input devices, + * such as pen/stylus and touch surfaces, extensions to the existing pointing device event models + * are needed and pointer events address that need. + * + * Pointer events are DOM events that are fired for a pointing device. + * They are designed to create a single DOM event model to handle pointing input devices such as a mouse, + * pen/stylus or touch (such as one or more fingers). + * The pointer is a hardware-agnostic device that can target a specific set of screen coordinates. + * Having a single event model for pointers can simplify creating Web sites and applications + * and provide a good user experience regardless of the user's hardware. + * However, for scenarios when device-specific handling is desired, + * pointer events defines a property to inspect the device type which produced the event. + * + * The events needed to handle generic pointer input are analogous to mouse events + * (mousedown/pointerdown, mousemove/pointermove, etc.). + * Consequently, pointer event types are intentionally similar to mouse event types. + * Additionally, a pointer event contains the usual properties present in mouse events + * (client coordinates, target element, button states, etc.) + * in addition to new properties for other forms of input: pressure, contact geometry, tilt, etc. + * In fact, the PointerEvent interface inherits all of the MouseEvent's properties thus facilitating + * migrating content from mouse events to pointer events. + * + * MDN + */ +@js.native +@JSGlobal +class PointerEvent(typeArg: String, pointerEventInit: PointerEventInit) + extends MouseEvent { + + def this(typeArg: String) = this(typeArg, js.native) + + /** + * An identifier assigned to a pointer event that is unique from the identifiers + * of all active pointer events at the time. Authors cannot assume values convey + * any particular meaning other than an identifier for the pointer that is unique + * from all other active pointers. + * + * MDN + */ + def pointerId: Double = js.native + + /** + * The width read-only property of the PointerEvent interface represents the width of the pointer's + * contact geometry along the x-axis, measured in CSS pixels. Depending on the source of the pointer + * device (such as a finger), for a given pointer, each event may produce a different value. + * + * MDN + */ + def width: Double = js.native + + /** + * The height read-only property of the PointerEvent interface represents the height of the pointer's + * contact geometry, along the Y axis (in CSS pixels). Depending on the source of the pointer + * device (for example a finger), for a given pointer, each event may produce a different value. + * + * MDN + */ + def height: Double = js.native + + /** + * The normalized pressure of the pointer input in the range of 0 to 1, + * where 0 and 1 represent the minimum and maximum pressure the hardware is capable of detecting, respectively. + * + * For hardware that does not support pressure, including but not limited to mouse, + * the value MUST be 0.5 when the pointer is active and 0 otherwise. + * + * MDN + */ + def pressure: Double = js.native + + /** + * The tangentialPressure read-only property of the PointerEvent interface + * represents the normalized tangential pressure of the pointer input + * (also known as barrel pressure or cylinder stress) + * in the range -1 to 1, where 0 is the neutral position of the control. + * + * Note that some hardware may only support positive values in the range 0 to 1. + * For hardware that does not support tangential pressure, the value will be 0. + * + * MDN + */ + def tangentialPressure: Double = js.native + + /** + * This property is the angle (in degrees) between the Y-Z plane of the pointer and the screen. + * This property is typically only useful for a pen/stylus pointer type. + * The range of values is -90 to 90 degrees and a positive value means a tilt to the right. + * For devices that do not support this property, the value is 0. + * + * MDN + */ + def tiltX: Double = js.native + + /** + * This property is the angle (in degrees) between the X-Z plane of the pointer and the screen. + * This property is typically only useful for a pen/stylus pointer type. + * The range of values is -90 to 90 degrees and a positive value is a tilt toward the user. + * For devices that do not support this property, the value is 0. + * + * MDN + */ + def tiltY: Double = js.native + + /** + * The twist read-only property of the PointerEvent interface represents the clockwise + * rotation of the transducer (e.g. pen stylus) around its major axis in degrees, + * with a value in the range 0 to 359. + * + * For devices that do not report twist, the value MUST be 0. + * + * MDN + */ + def twist: Double = js.native + + /** + * The pointerType read-only property of the PointerEvent interface indicates the device type that caused the pointer event. The supported values are the following strings: + * + * mouse + * The event was generated by a mouse device. + * + * pen + * The event was generated by a pen or stylus device. + * + * touch + * The event was generated by a touch such as a finger. + * If the device type cannot be detected by the browser, the value can be an empty string (""). If the browser supports pointer device types other than those listed above, the value should be vendor prefixed to avoid conflicting names for different types of devices. + * + * MDN + */ + def pointerType: String = js.native + + /** + * Indicates if the pointer represents the primary pointer of this pointer type. + * + * In some scenarios there may be multiple pointers (for example a device with both a touchscreen and a mouse) + * or a pointer supports multiple contact points (for example a touchscreen that supports multiple finger touches). + * The application can use the isPrimary property to identify a master pointer + * among the set of active pointers for each pointer type. + * If an application only wants to support a primary pointer, + * it can ignore all pointer events that are not primary. + * + * For mouse there is only one pointer, so it will always be the primary pointer. + * For touch input, a pointer is considered primary if the user touched the screen + * when there were no other active touches. + * For pen and stylus input, a pointer is considered primary if the user's pen + * initially contacted the screenwhen there were no other active pens contacting the screen. + * + * MDN + */ + def isPrimary: Boolean = js.native +} + +trait PointerEventInit extends js.Object { + + /** + * Sets value of MouseEvent.pointerId. Defaults to 0. + */ + var pointerId: js.UndefOr[Double] = js.undefined + + /** + * Sets value of MouseEvent.width. Defaults to 1. + */ + var width: js.UndefOr[Double] = js.undefined + + /** + * Sets value of MouseEvent.height. Defaults to 0. + */ + var height: js.UndefOr[Double] = js.undefined + + /** + * Sets value of MouseEvent.pressure. Defaults to 0. + */ + var pressure: js.UndefOr[Double] = js.undefined + + /** + * Sets value of MouseEvent.tangentialPressure. Defaults to 0. + */ + var tangentialPressure: js.UndefOr[Double] = js.undefined + + /** + * Sets value of MouseEvent.tiltX. Defaults to 0. + */ + var tiltX: js.UndefOr[Double] = js.undefined + + /** + * Sets value of MouseEvent.tiltY. Defaults to 0. + */ + var tiltY: js.UndefOr[Double] = js.undefined + + /** + * Sets value of MouseEvent.twist. Defaults to 0. + */ + var twist: js.UndefOr[Double] = js.undefined + + /** + * Sets value of MouseEvent.pointerType. Defaults to 0. + */ + var pointerType: js.UndefOr[String] = js.undefined + + /** + * Sets value of MouseEvent.isPrimary. Defaults to 0. + */ + var isPrimary: js.UndefOr[Boolean] = js.undefined +} + /** * The TextMetrics interface represents the dimension of a text in the canvas, as * created by the CanvasRenderingContext2D.measureText() method. @@ -2374,6 +2581,84 @@ class Window * MDN */ def devicePixelRatio: Double = js.native + + /** + * fired when a pointing device is moved into an element's hit test boundaries. + * + * MDN + */ + var onpointerover: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointing device is moved into the hit test boundaries of an element + * or one of its descendants, including as a result of a pointerdown event + * from a device that does not support hover (see pointerdown). + * + * MDN + */ + var onpointerenter: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointer becomes active. + * + * MDN + */ + var onpointerdown: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointer changes coordinates. + * + * MDN + */ + var onpointermove: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointer is no longer active. + * + * MDN + */ + var onpointerup: js.Function1[PointerEvent, _] = js.native + + /** + * a browser fires this event if it concludes the pointer will no longer be able + * to generate events (for example the related device is deactived). + * + * MDN + */ + var onpointercancel: js.Function1[PointerEvent, _] = js.native + + /** + * fired for several reasons including: pointing device is moved out of + * the hit test boundaries of an element; + * firing the pointerup event for a device that does not support hover (see pointerup); + * after firing the pointercancel event (see pointercancel); + * when a pen stylus leaves the hover range detectable by the digitizer. + * + * MDN + */ + var onpointerout: js.Function1[PointerEvent, _] = js.native + + /** + * fired when a pointing device is moved out of the hit test boundaries of an element. + * For pen devices, this event is fired when the stylus leaves the hover range detectable by the digitizer. + * + * MDN + */ + var onpointerleave: js.Function1[PointerEvent, _] = js.native + + /** + * fired when an element receives pointer capture. + * + * MDN + */ + var gotpointercapture: js.Function1[PointerEvent, _] = js.native + + /** + * Fired after pointer capture is released for a pointer. + * + * MDN + */ + var lostpointercapture: js.Function1[PointerEvent, _] = js.native } /**