Skip to content

Instantly share code, notes, and snippets.

@dirceu-jr
Created April 27, 2009 16:40
Show Gist options
  • Save dirceu-jr/102590 to your computer and use it in GitHub Desktop.
Save dirceu-jr/102590 to your computer and use it in GitHub Desktop.
/**
* touch for jQuery
*
* Copyright (c) 2008 Dirceu Pauka Jr. <dirceuu@gmail.com>
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* Based on Peter Schmalfeldt (ManifestInteractive.com) <manifestinteractive@gmail.com>
* @license http://www.gnu.org/licenses/gpl.html
* @project jquery.touch
*/
jQuery.fn.touch = function(settings) {
// DEFINE DEFAULT VARIABLES
var _target, _dragx, _dragy, _rotate, _resort;
var _dragging=false, _sizing=false, _animate=false;
var _rotating=0, _width=0, _height=0, _left=0, _top=0, _lastx=0, _lasty=0, _xspeed=0, _yspeed=0;
var _zindex=1000;
// DEFINE DEFAULT TOUCH SETTINGS
settings = jQuery.extend({
animate: true,
sticky: false,
dragx: true,
dragy: true,
rotate: false,
resort: true,
scale: false
}, settings);
var opts = [];
opts = $.extend({}, $.fn.touch.defaults, settings);
this.each(function(){
this.opts = opts;
this.ontouchstart = function(e) {
_target = $(this);
_dragx = this.opts.dragx;
_dragy = this.opts.dragy;
_resort = this.opts.resort;
_animate = this.opts.animate;
_xspeed = 0;
_yspeed = 0;
e.preventDefault();
$(e.changedTouches).each(function(){
_lastx = this.pageX;
_lasty = this.pageY;
if(!_sizing){
if(_resort){
_zindex = (_target.css("z-index") == _zindex) ? _zindex : _zindex+1;
_target.css({ zIndex: _zindex });
}
}
});
};
this.ontouchmove = function(e) {
$(e.changedTouches).each(function() {
_left = isNaN(parseInt(_target.css("left"))) ? 0 : (parseInt(_target.css("left")) - (_lastx-this.pageX));
_top = isNaN(parseInt(_target.css("top"))) ? 0 : (parseInt(_target.css("top")) - (_lasty-this.pageY));
if(!_sizing) {
if(_animate){
_xspeed = Math.round((_xspeed + Math.round( this.pageX-_lastx ))/2);
_yspeed = Math.round((_yspeed + Math.round( this.pageY-_lasty ))/2);
}
if(_dragx || _dragy) _target.css({ position: "absolute" });
if(_dragx) _target.css({ left: _left+"px" });
if(_dragy) _target.css({ top: _top+"px" });
}
_lastx = this.pageX;
_lasty = this.pageY;
});
};
this.ontouchend = function(e) {
$(e.changedTouches).each(function(){
if(!e.targetTouches.length){
_dragging = false;
if(_animate){
_left = (_target.css("left") == 'auto') ? this.pageX : parseInt(_target.css("left"));
_top = (_target.css("top") == 'auto') ? this.pageY : parseInt(_target.css("top"));
var animx = (_dragx) ? (_left+_xspeed)+"px" : _left+"px";
var animy = (_dragy) ? (_top+_yspeed)+"px" : _top+"px";
if(_dragx) _target.animate({ left: animx }, "fast");
if(_dragy) _target.animate({ top: animy }, "fast");
}
}
});
};
this.ongesturestart = function(e) {
_sizing = [$(this).css("width"), $(this).css("height")];
};
this.ongesturechange = function(e) {
if(_sizing){
_width = (this.opts.scale) ? Math.min(parseInt(_sizing[0])*e.scale, 300) : _sizing[0];
_height = (this.opts.scale) ? Math.min(parseInt(_sizing[1])*e.scale, 300) : _sizing[1];
_rotate = (this.opts.rotate) ? "rotate(" + ((_rotating + e.rotation) % 360) + "deg)" : "0deg";
$(this).css({ width: _width+"px", height: _height+"px", webkitTransform: _rotate });
}
};
this.ongestureend = function(e) {
_sizing = false;
_rotating = (_rotating + e.rotation) % 360;
};
});
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment