diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index 219ded23..c05b4474 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -19,19 +19,7 @@ //= require_self //= require ordering //= require stupidtable - -// allow touch devices to work on click events -// http://stackoverflow.com/a/16221066 -$.fn.extend({ _on: (function(){ return $.fn.on; })() }); -$.fn.extend({ - on: (function(){ - var isTouchSupported = 'ontouchstart' in window || window.DocumentTouch && document instanceof DocumentTouch; - return function( types, selector, data, fn, one ) { - if (typeof types == 'string' && isTouchSupported && !(types.match(/touch/gi))) types = types.replace(/click/gi, 'touchstart'); - return this._on( types, selector, data, fn, one ); - }; - }()), -}); +//= require touchclick // Load following statements, when DOM is ready $(function() { diff --git a/app/assets/javascripts/ordering.js b/app/assets/javascripts/ordering.js index 9c9a3d99..38874299 100644 --- a/app/assets/javascripts/ordering.js +++ b/app/assets/javascripts/ordering.js @@ -164,20 +164,20 @@ function updateBalance() { } $(function() { - $('input[data-increase_quantity]').click(function() { + $('input[data-increase_quantity]').on('touchclick', function() { increaseQuantity($(this).data('increase_quantity')); }); - $('input[data-decrease_quantity]').click(function() { + $('input[data-decrease_quantity]').on('touchclick', function() { decreaseQuantity($(this).data('decrease_quantity')); }); - $('input[data-increase_tolerance]').click(function() { + $('input[data-increase_tolerance]').on('touchclick', function() { increaseTolerance($(this).data('increase_tolerance')); }); - $('input[data-decrease_tolerance]').click(function() { + $('input[data-decrease_tolerance]').on('touchclick', function() { decreaseTolerance($(this).data('decrease_tolerance')); }); - $('a[data-confirm_switch_order]').click(function() { + $('a[data-confirm_switch_order]').on('touchclick', function() { return (!modified || confirm(I18n.t('js.ordering.confirm_change'))); }); }); diff --git a/app/views/deliveries/_form.html.haml b/app/views/deliveries/_form.html.haml index 8e2d7f75..d9433acc 100644 --- a/app/views/deliveries/_form.html.haml +++ b/app/views/deliveries/_form.html.haml @@ -1,7 +1,7 @@ - content_for :javascript do :javascript $(function() { - $('#stock_changes').on('click', '.destroy_stock_change', function() { + $('#stock_changes').on('touchclick', '.destroy_stock_change', function() { $(this).prev('input').val('1'); // check for destruction var stock_change = $(this).closest('tr'); @@ -11,7 +11,7 @@ return false; }); - $('#stock_changes').on('click', '.remove_new_stock_change', function() { + $('#stock_changes').on('touchclick', '.remove_new_stock_change', function() { var stock_change = $(this).closest('tr'); stock_change.remove(); mark_article_for_delivery( stock_change.data('id') ); diff --git a/app/views/finance/financial_transactions/new_collection.html.haml b/app/views/finance/financial_transactions/new_collection.html.haml index 7fdc99b0..0c7bd0a9 100644 --- a/app/views/finance/financial_transactions/new_collection.html.haml +++ b/app/views/finance/financial_transactions/new_collection.html.haml @@ -5,12 +5,12 @@ var ordergroup = "#{escape_javascript(render('ordergroup'))}" $(function() { - $(document).on('click', 'a[data-remove-transaction]', function() { + $(document).on('touchclick', 'a[data-remove-transaction]', function() { $(this).parents('tr').remove(); return false; }); - $(document).on('click', 'a[data-add-transaction]', function() { + $(document).on('touchclick', 'a[data-add-transaction]', function() { $('#ordergroups').append(ordergroup); return false; }); diff --git a/app/views/messages/new.haml b/app/views/messages/new.haml index 577eef16..9842e690 100644 --- a/app/views/messages/new.haml +++ b/app/views/messages/new.haml @@ -10,7 +10,7 @@ theme: 'facebook' }); - $('#message_sent_to_all').click(function() { + $('#message_sent_to_all').on('touchclick', function() { if ($(this).is(':checked')) { $('#recipients').slideUp(); } else { diff --git a/app/views/orders/_edit_amounts.html.haml b/app/views/orders/_edit_amounts.html.haml index 3a62609f..1b10cdb8 100644 --- a/app/views/orders/_edit_amounts.html.haml +++ b/app/views/orders/_edit_amounts.html.haml @@ -36,7 +36,7 @@ update_delta(this); }); - $(document).on('click', '#order_articles .unlocker', unlock_receive_input_field); + $(document).on('touchclick', '#order_articles .unlocker', unlock_receive_input_field); $(function() { $('input[data-units-expected]').each(function() { diff --git a/vendor/assets/javascripts/touchclick.js.coffee b/vendor/assets/javascripts/touchclick.js.coffee new file mode 100644 index 00000000..941dd300 --- /dev/null +++ b/vendor/assets/javascripts/touchclick.js.coffee @@ -0,0 +1,72 @@ +###! +Copyright (c) 2013 Derek Petersen https://github.com/tuxracer/touchclick MIT License +https://raw2.github.com/tuxracer/touchclick/3.0.1/src/touchclick.coffee +### + +$ = if typeof jQuery is 'function' then jQuery else require 'jquery' + +activeClass = 'touchactive' +preventDefaultClick = false + +# Store a timestamp of when the last touch event occurred +lastTouched = 0 + +# Support devices with both touch and mouse (e.g. Windows 8, Chromebook Pixel) +ignoreEvent = (e) -> + currentTimestamp = Math.round (new Date()).getTime() / 1000 + secondsSinceTouch = currentTimestamp - lastTouched + + if e.type.match 'touchstart|touchmove|touchend' + lastTouched = currentTimestamp + + secondsSinceTouch < 3 and e.type.match 'mouse' + +getTouchclickEl = (target) -> + $targetEl = $ target + # For delegated events you can optionally provide an element + # that will have the active style added when touch is active + # by adding data-touchclick="true" + $touchclickEl = $targetEl.closest '*[data-touchclick="true"]' + + if $touchclickEl.length + $touchclickEl + else + $targetEl + +touchstart = (e) -> + getTouchclickEl(e.target).addClass(activeClass) unless ignoreEvent e + +touchmove = (e) -> + getTouchclickEl(e.target).removeClass(activeClass) + +touchend = (e) -> + $touchclickEl = getTouchclickEl e.target + + if $touchclickEl.hasClass(activeClass) and not ignoreEvent e + e.type = 'touchclick' + + $touchclickEl + .trigger(e) + .removeClass(activeClass) + +events = (type) -> + $el = $ this + + if preventDefaultClick + $el[type] 'click', (e) -> + e.preventDefault() + + if window.navigator.msPointerEnabled + $el[type] 'MSPointerDown', touchstart + $el[type] 'MSPointerUp', touchend + else + $el[type] 'touchstart mousedown', touchstart + $el[type] 'touchmove mouseout', touchmove + $el[type] 'touchend mouseup', touchend + +$.event.special.touchclick = + setup: -> + events.call this, 'on' + + teardown: -> + events.call this, 'off'