Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fixed bug #1 support for checkboxes. #3

Open
wants to merge 6 commits into
base: master
Choose a base branch
from
Open

Fixed bug #1 support for checkboxes. #3

Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
43bbc90
Made Tappable work with checkboxes and labels
bobkarreman Jan 16, 2012
673909a
Make links work inside tappable
bobkarreman Jan 18, 2012
56d6b99
Make links behave like normal links when the href is filled
bobkarreman Jan 19, 2012
9debd12
Another small fix for <a> elements
clinct Jul 21, 2012
c00052b
unbinding tappables before binding them
clinct Dec 17, 2012
4fee6b6
Added compatibility with wysihtml5 v0.3.0 and other plugins that use …
clinct Feb 17, 2013
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
101 changes: 67 additions & 34 deletions jquery.tappable.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,94 +58,127 @@
*
*/

;(function($) {
var touchSupported = ('ontouchstart' in window)
(function($) {
var touchSupported = ('ontouchstart' in window);

$.fn.tappable = function(options) {
var cancelOnMove = true,
onlyIf = function() { return true },
onlyIf = function() { return true; },
touchDelay = 0,
callback
callback;

switch(typeof options) {
case 'function':
callback = options
callback = options;
break;
case 'object':
callback = options.callback
callback = options.callback;

if (typeof options.cancelOnMove != 'undefined') {
cancelOnMove = options.cancelOnMove
cancelOnMove = options.cancelOnMove;
}

if (typeof options.onlyIf != 'undefined') {
onlyIf = options.onlyIf
onlyIf = options.onlyIf;
}

if (typeof options.touchDelay != 'undefined') {
touchDelay = options.touchDelay
touchDelay = options.touchDelay;
}

break;
default:
break;
}

var fireCallback = function(el, event) {
if (typeof callback == 'function' && onlyIf(el)) {
callback.call(el, event)
callback.call(el, event);
}
}
};

if (touchSupported) {
this.unbind('touchstart');
this.bind('touchstart', function(event) {
var el = this
var el = this;

if (onlyIf(this)) {
$(el).addClass('touch-started')
$(el).addClass('touch-started');

window.setTimeout(function() {
if ($(el).hasClass('touch-started')) {
$(el).addClass('touched')
$(el).addClass('touched');
}
}, touchDelay)
}, touchDelay);
}

return true
})
return true;
});

this.unbind('touchend');
this.bind('touchend', function(event) {
var el = this
var el = this;

if ($(el).hasClass('touch-started')) {
$(el)
.removeClass('touched')
.removeClass('touch-started')
$(el).removeClass('touched').removeClass('touch-started');

if ( $(event.target).is('input[type="checkbox"]') ) {
$(event.target).attr('checked', !$(event.target).is(':checked') );
}

fireCallback(el, event)
if ( $(event.target).is('label') ) {
var forId = $(event.target).attr('for');
var forEl = $('#' + forId);
if (forEl.is(':checkbox')) {
forEl.attr('checked', !forEl.is(':checked') );
} else {
forEl.focus();
}
}

if ( $(event.target).is('a') ) {
var target = $(event.target);
var href = target.attr('href');

if (href !== '' && href !== 'javascript:;' && href.indexOf('#') < 0) {
if (target.attr('target') === '_blank') {
window.open(target.attr('href'));
} else {
window.location.href = target.attr('href');
}
return false;
}

}

fireCallback(el, event);
}

return true
})

return true;
});

this.unbind('click');
this.bind('click', function(event) {
event.preventDefault()
})
event.preventDefault();
});

if (cancelOnMove) {
this.unbind('touchmove');
this.bind('touchmove', function() {
$(this)
.removeClass('touched')
.removeClass('touch-started')
})
$(this).removeClass('touched').removeClass('touch-started');
});
}
} else if (typeof callback == 'function') {
this.unbind('click');
this.bind('click', function(event) {
if (onlyIf(this)) {
callback.call(this, event)
callback.call(this, event);
}
})
});
}

return this
}
return this;
};
})(jQuery);