Backbone.jsでタッチイベント周りの処理

eventsの遅延評価で、イベント部分を分ける。対象メソッドは共通にしておく。メソッド内で必要になる位置関連のメソッドも用意しておいて、どちらであっても問題なく取得できるようにしておく。

タッチイベント周りと書いたけど、下記のコードはタッチで何らかの対象をドラッグできるようにする想定のコード。

class TouchView extends Backbone.View
  events: do ->
    # モバイル振り分けの処理を用意しておく
    if ( isMobile() )
      events = {
        'touchstart canvas' : '_onDragStart'
        'touchmove  canvas' : '_onDragMove'
        'touchend   canvas' : '_onDragEnd'
      }
    else
      events = {
        'mousedown  canvas' : '_onDragStart'
        'mousemove  canvas' : '_onDragMove'
        'mouseup    canvas' : '_onDragEnd'
      }

    # 共通のイベント
    return _.extend(events, {
      'click' : '_onClick'
    })

  initialize: ->
    @dragstart = false

  _getClientPos: (ev) ->
    ev = ev.originalEvent
    touches = ev.touches
    # タッチイベントの場合
    if ( touches )
      return {
        x: touches[0].clientX
        y: touches[0].clientY
      }
    # 通常のイベントの場合
    else
      return {
        x: ev.clientX
        y: ev.clientY
      }

  _onDragStart: (ev) ->
    ev.preventDefault()

    @dragStart = true
    @dragStartPos = {
      x: 0
      y: 0
    }
    @dragStartEv = @_getClientPos(ev)

  _onDragMove: (ev) ->
    ev.preventDefault()

    if ( not @dragStart )
      return

    dragEndPos = @_getClientPos(ev)

   # これが前回との差
    dragDiff = {
      x: dragEndPos.x - @dragStartEv.x
      y: dragEndPos.y - @dragStartEv.y
    }

    # dragDiffなどを使って何らかの処理をする

    @dragStartEv = dragEndPos

  _onDragEnd: (ev) ->
    ev.preventDefault()

    if ( not @dragStart )
      return

    @dragStart = false