¿Admite TypeScript TouchEvent?

Question

ACTUALIZACIÓN

TypeScript 1.5.3 added declarations for HTML Touch events to lib.d.ts

puedo ver que es compatible con UIEvent, pero no parecen tener interfaces para eventos táctiles.

Este código indica que "TouchEvent no existe en el ámbito actual".

class Touchy { 
    private _element:Element; 

    constructor(theElement:Element) { 
     this._element = theElement; 

     theElement.addEventListener("touchstart", (theTouchEvent:TouchEvent) => alert("touchy")); 
    } 
} 

puedo usar UIEvent, pero no TouchEvent. ¿Cómo manejaría TouchEvent con TypeScript? Gracias.

Answer 1

Usted tiene varias opciones aquí:

Primera opción: Extender UIEvent tener los miembros que cabe esperar en un TouchEvent (y sólo los utilizan en los detectores de eventos táctil):

interface UIEvent { 
    targetTouches: { pageX: number; pageY: number; }[]; 
    // etc... 
} 

La segunda opción : Defina su propia interfaz TouchEvent y agregue una aserción de tipo al vincular el evento

interface TouchEvent { 
    (event: TouchEventArgs): void; 
} 

interface TouchEventArgs { 
    targetTouches: { pageX: number; pageY: number; }[]; 
    // etc 
} 

theElement.addEventListener("touchstart", <UIEvent>((theTouchEvent:TouchEvent) => alert("touchy"))); 

Answer 2

gracias por el asesoramiento. Fui a la Especificación de eventos de Touch W3C Working Draft el 5 de mayo de 2011 y creé un conjunto de declaraciones ambientales a partir de eso. Hay una recomendación de candidato más reciente, pero esto es lo que creo que realmente se implementa en la mayoría de los navegadores. Esto parece funcionar bien.

PD: el declare var TouchEvent en la parte inferior no es parte del borrador de w3c. Es una adaptación del mismo código para UIEvent que forma parte de las interfaces estándar incluidas con TypeScript.

interface Touch { 
    identifier:number; 
    target:EventTarget; 
    screenX:number; 
    screenY:number; 
    clientX:number; 
    clientY:number; 
    pageX:number; 
    pageY:number; 
}; 

interface TouchList { 
    length:number; 
    item (index:number):Touch; 
    identifiedTouch(identifier:number):Touch; 
}; 

interface TouchEvent extends UIEvent { 
    touches:TouchList; 
    targetTouches:TouchList; 
    changedTouches:TouchList; 
    altKey:bool; 
    metaKey:bool; 
    ctrlKey:bool; 
    shiftKey:bool; 
    initTouchEvent (type:string, canBubble:bool, cancelable:bool, view:AbstractView, detail:number, ctrlKey:bool, altKey:bool, shiftKey:bool, metaKey:bool, touches:TouchList, targetTouches:TouchList, changedTouches:TouchList); 
}; 

declare var TouchEvent: { 
    prototype: TouchEvent; 
    new(): TouchEvent; 
} 

Answer 3

Aquí hay un apéndice. Este código agrega controladores de eventos tipo a HTMLElement. Puede agregar esto después del código que define la interfaz TouchEvent;

// 
// add touch events to HTMLElement 
// 
interface HTMLElement extends Element, MSHTMLElementRangeExtensions, ElementCSSInlineStyle, MSEventAttachmentTarget, MSHTMLElementExtensions, MSNodeExtensions { 
    ontouchstart: (ev: TouchEvent) => any; 
    ontouchmove: (ev: TouchEvent) => any; 
    ontouchend: (ev: TouchEvent) => any; 
    ontouchcancel: (ev: TouchEvent) => any; 
}