drag.js - a blatantly minimal drag library for webkit based browsers

drag.js

/*
  drag.js - a blatantly minimal drag library for webkit based browsers

  Licensed under the MIT -- copyright 2012 Elijah Insua <[email protected]>
*/
(function() {
  var
    element  = null,
    mapEntries = [],
    mapping  = {};

  var on = function(name, handler) {
    name.split(' ').forEach(function(e) {
      document.addEventListener(e, handler, true);
    });

    // immediately update the cache
    element && cacheMapping(element);
  };

  var cacheMapping = function(el) {
    mapEntries = [];
    Object.keys(mapping).forEach(function(selector) {
      el.webkitMatchesSelector(selector) && mapEntries.push(mapping[selector]);
    });
  };

  var emit = function(name, ev) {
    if (!ev.clientX) {
      ev.clientX = ev.targetTouches[0].clientX;
      ev.clientY = ev.targetTouches[0].clientY;
    }

    mapEntries.forEach(function(options) {
      options[name] && options[name](element, ev);
    });
  };

  on('mousedown touchstart', function(ev) {
    element = ev.target;

    cacheMapping(element);

    if (!mapEntries.length) {
      element = null;
    } else {
      emit('start', ev);
    }
  });

  on('mouseup touchend', function(ev) {
    emit('end', ev);
    element = null;
  });

  on('mousemove touchmove', function(ev) {
    ev.preventDefault();

    if (element) {
      emit('move', ev);
    }
  });

  window.drag = function(selector, options) {
    mapping[selector] = options;
  };
})();

drag.min.js

(function(){var e=null,t=[],n={},r=function(t,n){t.split(" ").forEach(function(e){document.addEventListener(e,n,!0)}),e&&i(e)},i=function(e){t=[],Object.keys(n).forEach(function(r){e.webkitMatchesSelector(r)&&t.push(n[r])})},s=function(n,r){r.clientX||(r.clientX=r.targetTouches[0].clientX,r.clientY=r.targetTouches[0].clientY),t.forEach(function(t){t[n]&&t[n](e,r)})};r("mousedown touchstart",function(n){e=n.target,i(e),t.length?s("start",n):e=null}),r("mouseup touchend",function(t){s("end",t),e=null}),r("mousemove touchmove",function(t){t.preventDefault(),e&&s("move",t)}),window.drag=function(e,t){n[e]=t}})()

example.js

drag('.node', {
  start : function(el, ev) {
    console.log('started drag of', el, 'at coords (' + ev.clientX + ',' + ev.clientY + ')');
  }
  move : function(el, ev) {
    console.log('dragging', el, 'at coords (' + ev.clientX + ',' + ev.clientY + ')');
  }
  end : function(el, ev) {
    console.log('finished dragging', el, 'at coords (' + ev.clientX + ',' + ev.clientY + ')');
  }
});