Сенсорные события на iPhone

0

Я пытаюсь сделать меню без полотна, которое можно систематически открывать при событиях касания. Он отлично работает в моем браузере, когда я нажимаю на тело и перетаскиваю его, чтобы открыть меню.

Однако это не удается на iPhone. Ошибка, отображаемая на моей консоли,

TypeError: 'undefined' is not an object (evaluating 'event.touches[0]')

который находится на этой функции:

  getTouchCoordinates: function(event) {

    if ( s.touchSupported ) {
      var touchEvent = event.touches[0];
      return { x:touchEvent.pageX, y:touchEvent.pageY }
    }
    else {
      return { x:event.screenX, y:event.screenY };
    }

  },

Полный код меню выглядит следующим образом:

document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);

var s,
app = {

  settings: {

    touchSupported: ('ontouchstart' in window), 
    start_event: "", 
    move_event: "",
    end_event: "",
    main: $("#body"),
    sidebar: $("#sidebar"),
    gestureStarted: false,
    bodyOffset: 0,
    sidebarWidth: 250,
    gestureStartPosition: "",
    gestureS: "",
    target: ""

  },

  init: function() {

    s = this.settings;
    this.touchHandlers();
    this.bindUIActions();

  },

  bindUIActions: function() {

    s.main.bind(s.start_event, function(e){

          s.gestureStartPosition = app.getTouchCoordinates(e);
          s.gestureS = app.getTouchCoordinates(e);

          s.main.bind(s.move_event, function(e){

              var pos = app.getTouchCoordinates(e);

              var currentPosition = app.getTouchCoordinates( event );

              if ( s.gestureStarted ) {

                event.preventDefault();
                event.stopPropagation();
                app.updateBasedOnTouchPoints( currentPosition.x );
                return;

              }

              else {

                if ( Math.abs( currentPosition.y - s.gestureStartPosition.y ) > 50 ) {

                  //unbind events here
                  s.main.unbind(s.end_event); 
                  s.main.unbind(s.move_event); 
                  return;

                }

                else if ( Math.abs( currentPosition.x - s.gestureStartPosition.x ) > 0 ) {

                  s.gestureStarted = true;

                  event.preventDefault();
                  event.stopPropagation();
                  app.updateBasedOnTouchPoints( currentPosition.x );
                  return;
                }

              }

          });

          s.main.bind(s.end_event, function(e){

              var currentPosition = app.getTouchCoordinates( event );

              if ( s.gestureStarted ) {

                  s.main.css("left", "0px" );
                  //console.log(s.gestureS.x+" "+currentPosition.x);

                  var c = s.bodyOffset ; 
                  var t; 

                  // check if open or close 
                  if ( (s.gestureS.x - currentPosition.x) < 0 ) {

                      //console.log("open"); 
                      t = s.sidebarWidth; 

                  } else {

                      //console.log("close"); 
                      t = 0 ; 

                  }

                  if ( c != t ) {

                      s.main.stop(true, false).animate({
                          left:t,
                          avoidTransforms:false,
                          useTranslate3d: true
                      }, 100);

                      s.sidebar.trigger( "slidingViewProgress", { current:t, max:s.sidebarWidth } );

                  }


              }

              s.gestureStarted = false;


              //unbind events here
              s.main.unbind(s.end_event); 
              s.main.unbind(s.move_event); 

          });

    });

  }, 

  touchHandlers: function() {

    s.start_event = s.touchSupported ? 'touchstart' : 'mousedown';
    s.move_event = s.touchSupported ? 'touchmove' : 'mousemove';
    s.end_event = s.touchSupported ? 'touchend' : 'mouseup';


  },

  getTouchCoordinates: function(event) {

    if ( s.touchSupported ) {
      var touchEvent = event.touches[0];
      return { x:touchEvent.pageX, y:touchEvent.pageY }
    }
    else {
      return { x:event.screenX, y:event.screenY };
    }

  },

  updateBasedOnTouchPoints: function( currentPosition ) {


    var deltaX = (currentPosition - s.gestureStartPosition.x) ; 
    var targetX = (s.bodyOffset + deltaX);

    targetX = Math.max( targetX, 0 );
    targetX = Math.min( targetX, s.sidebarWidth );

    s.bodyOffset = targetX;

    s.target = targetX; 

    if ( s.main.css("left") != "0px" ) {
      s.main.css("left", "0px" );
    }

    s.main.css("-webkit-transform", "translate3d(" + targetX + "px,0,0)" );
    s.main.css("-moz-transform", "translate3d(" + targetX + "px,0,0)" );
    s.main.css("transform", "translate3d(" + targetX + "px,0,0)" );


    s.sidebar.trigger( "slidingViewProgress", { current: targetX, max:s.sidebarWidth } );
    s.gestureStartPosition.x = currentPosition;

  }

};

(function() {

    app.init();

})();
Теги:

1 ответ

0
Лучший ответ

Ты можешь попробовать:

 event.originalEvent.touches

Ещё вопросы

Сообщество Overcoder
Наверх
Меню