Поддерживает ли TypeScript TouchEvent?

UPDATE

TypeScript 1.5.3 добавлены объявления для событий HTML Touch в lib.d.ts

Я вижу, что он поддерживает UIEvent, но у него нет интерфейсов для сенсорных событий.

Этот код указывает, что "TouchEvent не существует в текущей области".

class Touchy {
    private _element:Element;

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

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

Я могу использовать UIEvent, но не TouchEvent. Как обращаться с TouchEvent с помощью TypeScript? Спасибо.

Ответ 1

У вас есть несколько вариантов:

Первая опция: Расширьте UIEvent, чтобы иметь членов, которых вы ожидаете от TouchEvent (и используйте их только в прослушивающем событии):

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

Вторая опция: Определите свой собственный интерфейс TouchEvent и добавьте утверждение типа при привязке события

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

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

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

Ответ 2

Благодарю вас за совет. Я отправился на рабочий проект W3C для работы с сенсорными событиями 05 мая 2011 года и создал из него набор эмбиентных объявлений. Существует более новая рекомендация кандидата, но это то, что, на мой взгляд, фактически реализовано в большинстве браузеров. Кажется, что это хорошо работает.

PS: объявить var TouchEvent внизу не является частью проекта w3c. Это адаптация того же кода для UIEvent, который является частью стандартных интерфейсов, поставляемых с 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;
}

Ответ 3

Вот добавление. Этот код добавляет обработчики событий типа к элементу HTMLElement. Вы можете добавить это после кода, который определяет интерфейс 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;
}