panel-slide-jquery.mobile

gistfile1.js

	$( document ).on( "pageinit", "#demo-page" , function() {

    var wrap = $(".ui-panel-content-wrap"),
      panel = $(".ui-panel"),
      originalPosition = 272,
      position = "left",
      startX = 0;
    
    panel.on('panelbeforeopen', function(event){
      position = $(event.currentTarget).panel("option", "position");
      originalPosition = Math.abs(originalPosition);
      originalPosition = (position=="left") ? originalPosition : (originalPosition * -1);
      wrap.css("left", originalPosition);
      wrap.on("swipeleft swiperight", function(e){});
    });

    $.extend( $.event.special.swipe, {
      start: function(event) {
        var data = event.originalEvent.touches ? event.originalEvent.touches[0] : event;
        startX = data.pageX;
        return { coords: [data.pageX, data.pageY], origin: $(event.target) }
      },

      stop: function(event) {
        var data = event.originalEvent.touches ? event.originalEvent.touches[0] : event;
        var distX =  data.pageX - startX;
        var left = parseInt(wrap.css("left"));
        startX = data.pageX;
        if ((distX < 0 && position=="left" && left >=0) || (distX > 0 && position=="right" && left<=0)) 
          wrap.css("left", "+=" + distX);
        return { coords: [data.pageX, data.pageY] }
      },

      handleSwipe: function(start, stop) {
         if ( stop.time - start.time < $.event.special.swipe.durationThreshold &&
           Math.abs( start.coords[ 0 ] - stop.coords[ 0 ] ) > $.event.special.swipe.horizontalDistanceThreshold &&
           Math.abs( start.coords[ 1 ] - stop.coords[ 1 ] ) < $.event.special.swipe.verticalDistanceThreshold ) {
           start.origin.trigger( "swipe" )
            .trigger( start.coords[0] > stop.coords[ 0 ] ? "swipeleft" : "swiperight" );
          }
        var left = parseInt(wrap.css("left"));
        originalPosition = Math.abs(originalPosition);
        originalPosition = (position=="left") ? originalPosition : (originalPosition * -1);
        (Math.abs(left) < Math.abs(originalPosition / 2)) ? panel.panel("close") : wrap.css("left", originalPosition);
      }
    });

  });