sketch/build/build.js

Sketch canvas drawing component

/**
 * Require the given path.
 *
 * @param {String} path
 * @return {Object} exports
 * @api public
 */

function require(path, parent, orig) {
  var resolved = require.resolve(path);

  // lookup failed
  if (null == resolved) {
    orig = orig || path;
    parent = parent || 'root';
    var err = new Error('Failed to require "' + orig + '" from "' + parent + '"');
    err.path = orig;
    err.parent = parent;
    err.require = true;
    throw err;
  }

  var module = require.modules[resolved];

  // perform real require()
  // by invoking the module's
  // registered function
  if (!module.exports) {
    module.exports = {};
    module.client = module.component = true;
    module.call(this, module.exports, require.relative(resolved), module);
  }

  return module.exports;
}

/**
 * Registered modules.
 */

require.modules = {};

/**
 * Registered aliases.
 */

require.aliases = {};

/**
 * Resolve `path`.
 *
 * Lookup:
 *
 *   - PATH/index.js
 *   - PATH.js
 *   - PATH
 *
 * @param {String} path
 * @return {String} path or null
 * @api private
 */

require.resolve = function(path) {
  if (path.charAt(0) === '/') path = path.slice(1);

  var paths = [
    path,
    path + '.js',
    path + '.json',
    path + '/index.js',
    path + '/index.json'
  ];

  for (var i = 0; i < paths.length; i++) {
    var path = paths[i];
    if (require.modules.hasOwnProperty(path)) return path;
    if (require.aliases.hasOwnProperty(path)) return require.aliases[path];
  }
};

/**
 * Normalize `path` relative to the current path.
 *
 * @param {String} curr
 * @param {String} path
 * @return {String}
 * @api private
 */

require.normalize = function(curr, path) {
  var segs = [];

  if ('.' != path.charAt(0)) return path;

  curr = curr.split('/');
  path = path.split('/');

  for (var i = 0; i < path.length; ++i) {
    if ('..' == path[i]) {
      curr.pop();
    } else if ('.' != path[i] && '' != path[i]) {
      segs.push(path[i]);
    }
  }

  return curr.concat(segs).join('/');
};

/**
 * Register module at `path` with callback `definition`.
 *
 * @param {String} path
 * @param {Function} definition
 * @api private
 */

require.register = function(path, definition) {
  require.modules[path] = definition;
};

/**
 * Alias a module definition.
 *
 * @param {String} from
 * @param {String} to
 * @api private
 */

require.alias = function(from, to) {
  if (!require.modules.hasOwnProperty(from)) {
    throw new Error('Failed to alias "' + from + '", it does not exist');
  }
  require.aliases[to] = from;
};

/**
 * Return a require function relative to the `parent` path.
 *
 * @param {String} parent
 * @return {Function}
 * @api private
 */

require.relative = function(parent) {
  var p = require.normalize(parent, '..');

  /**
   * lastIndexOf helper.
   */

  function lastIndexOf(arr, obj) {
    var i = arr.length;
    while (i--) {
      if (arr[i] === obj) return i;
    }
    return -1;
  }

  /**
   * The relative require() itself.
   */

  function localRequire(path) {
    var resolved = localRequire.resolve(path);
    return require(resolved, parent, path);
  }

  /**
   * Resolve relative to the parent.
   */

  localRequire.resolve = function(path) {
    var c = path.charAt(0);
    if ('/' == c) return path.slice(1);
    if ('.' == c) return require.normalize(p, path);

    // resolve deps by returning
    // the dep in the nearest "deps"
    // directory
    var segs = parent.split('/');
    var i = lastIndexOf(segs, 'deps') + 1;
    if (!i) i = 0;
    path = segs.slice(0, i + 1).join('/') + '/deps/' + path;
    return path;
  };

  /**
   * Check if module is defined at `path`.
   */

  localRequire.exists = function(path) {
    return require.modules.hasOwnProperty(localRequire.resolve(path));
  };

  return localRequire;
};
require.register("component-indexof/index.js", Function("exports, require, module",
"\n\
var indexOf = [].indexOf;\n\
\n\
module.exports = function(arr, obj){\n\
  if (indexOf) return arr.indexOf(obj);\n\
  for (var i = 0; i < arr.length; ++i) {\n\
    if (arr[i] === obj) return i;\n\
  }\n\
  return -1;\n\
};//@ sourceURL=component-indexof/index.js"
));
require.register("component-classes/index.js", Function("exports, require, module",
"/**\n\
 * Module dependencies.\n\
 */\n\
\n\
var index = require('indexof');\n\
\n\
/**\n\
 * Whitespace regexp.\n\
 */\n\
\n\
var re = /\\s+/;\n\
\n\
/**\n\
 * toString reference.\n\
 */\n\
\n\
var toString = Object.prototype.toString;\n\
\n\
/**\n\
 * Wrap `el` in a `ClassList`.\n\
 *\n\
 * @param {Element} el\n\
 * @return {ClassList}\n\
 * @api public\n\
 */\n\
\n\
module.exports = function(el){\n\
  return new ClassList(el);\n\
};\n\
\n\
/**\n\
 * Initialize a new ClassList for `el`.\n\
 *\n\
 * @param {Element} el\n\
 * @api private\n\
 */\n\
\n\
function ClassList(el) {\n\
  if (!el) throw new Error('A DOM element reference is required');\n\
  this.el = el;\n\
  this.list = el.classList;\n\
}\n\
\n\
/**\n\
 * Add class `name` if not already present.\n\
 *\n\
 * @param {String} name\n\
 * @return {ClassList}\n\
 * @api public\n\
 */\n\
\n\
ClassList.prototype.add = function(name){\n\
  // classList\n\
  if (this.list) {\n\
    this.list.add(name);\n\
    return this;\n\
  }\n\
\n\
  // fallback\n\
  var arr = this.array();\n\
  var i = index(arr, name);\n\
  if (!~i) arr.push(name);\n\
  this.el.className = arr.join(' ');\n\
  return this;\n\
};\n\
\n\
/**\n\
 * Remove class `name` when present, or\n\
 * pass a regular expression to remove\n\
 * any which match.\n\
 *\n\
 * @param {String|RegExp} name\n\
 * @return {ClassList}\n\
 * @api public\n\
 */\n\
\n\
ClassList.prototype.remove = function(name){\n\
  if ('[object RegExp]' == toString.call(name)) {\n\
    return this.removeMatching(name);\n\
  }\n\
\n\
  // classList\n\
  if (this.list) {\n\
    this.list.remove(name);\n\
    return this;\n\
  }\n\
\n\
  // fallback\n\
  var arr = this.array();\n\
  var i = index(arr, name);\n\
  if (~i) arr.splice(i, 1);\n\
  this.el.className = arr.join(' ');\n\
  return this;\n\
};\n\
\n\
/**\n\
 * Remove all classes matching `re`.\n\
 *\n\
 * @param {RegExp} re\n\
 * @return {ClassList}\n\
 * @api private\n\
 */\n\
\n\
ClassList.prototype.removeMatching = function(re){\n\
  var arr = this.array();\n\
  for (var i = 0; i < arr.length; i++) {\n\
    if (re.test(arr[i])) {\n\
      this.remove(arr[i]);\n\
    }\n\
  }\n\
  return this;\n\
};\n\
\n\
/**\n\
 * Toggle class `name`.\n\
 *\n\
 * @param {String} name\n\
 * @return {ClassList}\n\
 * @api public\n\
 */\n\
\n\
ClassList.prototype.toggle = function(name){\n\
  // classList\n\
  if (this.list) {\n\
    this.list.toggle(name);\n\
    return this;\n\
  }\n\
\n\
  // fallback\n\
  if (this.has(name)) {\n\
    this.remove(name);\n\
  } else {\n\
    this.add(name);\n\
  }\n\
  return this;\n\
};\n\
\n\
/**\n\
 * Return an array of classes.\n\
 *\n\
 * @return {Array}\n\
 * @api public\n\
 */\n\
\n\
ClassList.prototype.array = function(){\n\
  var str = this.el.className.replace(/^\\s+|\\s+$/g, '');\n\
  var arr = str.split(re);\n\
  if ('' === arr[0]) arr.shift();\n\
  return arr;\n\
};\n\
\n\
/**\n\
 * Check if class `name` is present.\n\
 *\n\
 * @param {String} name\n\
 * @return {ClassList}\n\
 * @api public\n\
 */\n\
\n\
ClassList.prototype.has =\n\
ClassList.prototype.contains = function(name){\n\
  return this.list\n\
    ? this.list.contains(name)\n\
    : !! ~index(this.array(), name);\n\
};\n\
//@ sourceURL=component-classes/index.js"
));
require.register("component-raf/index.js", Function("exports, require, module",
"\n\
/**\n\
 * Expose `requestAnimationFrame()`.\n\
 */\n\
\n\
exports = module.exports = window.requestAnimationFrame\n\
  || window.webkitRequestAnimationFrame\n\
  || window.mozRequestAnimationFrame\n\
  || window.oRequestAnimationFrame\n\
  || window.msRequestAnimationFrame\n\
  || fallback;\n\
\n\
/**\n\
 * Fallback implementation.\n\
 */\n\
\n\
var prev = new Date().getTime();\n\
function fallback(fn) {\n\
  var curr = new Date().getTime();\n\
  var ms = Math.max(0, 16 - (curr - prev));\n\
  setTimeout(fn, ms);\n\
  prev = curr;\n\
}\n\
\n\
/**\n\
 * Cancel.\n\
 */\n\
\n\
var cancel = window.cancelAnimationFrame\n\
  || window.webkitCancelAnimationFrame\n\
  || window.mozCancelAnimationFrame\n\
  || window.oCancelAnimationFrame\n\
  || window.msCancelAnimationFrame;\n\
\n\
exports.cancel = function(id){\n\
  cancel.call(window, id);\n\
};\n\
//@ sourceURL=component-raf/index.js"
));
require.register("component-event/index.js", Function("exports, require, module",
"\n\
/**\n\
 * Bind `el` event `type` to `fn`.\n\
 *\n\
 * @param {Element} el\n\
 * @param {String} type\n\
 * @param {Function} fn\n\
 * @param {Boolean} capture\n\
 * @return {Function}\n\
 * @api public\n\
 */\n\
\n\
exports.bind = function(el, type, fn, capture){\n\
  if (el.addEventListener) {\n\
    el.addEventListener(type, fn, capture || false);\n\
  } else {\n\
    el.attachEvent('on' + type, fn);\n\
  }\n\
  return fn;\n\
};\n\
\n\
/**\n\
 * Unbind `el` event `type`'s callback `fn`.\n\
 *\n\
 * @param {Element} el\n\
 * @param {String} type\n\
 * @param {Function} fn\n\
 * @param {Boolean} capture\n\
 * @return {Function}\n\
 * @api public\n\
 */\n\
\n\
exports.unbind = function(el, type, fn, capture){\n\
  if (el.removeEventListener) {\n\
    el.removeEventListener(type, fn, capture || false);\n\
  } else {\n\
    el.detachEvent('on' + type, fn);\n\
  }\n\
  return fn;\n\
};\n\
//@ sourceURL=component-event/index.js"
));
require.register("component-query/index.js", Function("exports, require, module",
"\n\
function one(selector, el) {\n\
  return el.querySelector(selector);\n\
}\n\
\n\
exports = module.exports = function(selector, el){\n\
  el = el || document;\n\
  return one(selector, el);\n\
};\n\
\n\
exports.all = function(selector, el){\n\
  el = el || document;\n\
  return el.querySelectorAll(selector);\n\
};\n\
\n\
exports.engine = function(obj){\n\
  if (!obj.one) throw new Error('.one callback required');\n\
  if (!obj.all) throw new Error('.all callback required');\n\
  one = obj.one;\n\
  exports.all = obj.all;\n\
};\n\
//@ sourceURL=component-query/index.js"
));
require.register("component-matches-selector/index.js", Function("exports, require, module",
"/**\n\
 * Module dependencies.\n\
 */\n\
\n\
var query = require('query');\n\
\n\
/**\n\
 * Element prototype.\n\
 */\n\
\n\
var proto = Element.prototype;\n\
\n\
/**\n\
 * Vendor function.\n\
 */\n\
\n\
var vendor = proto.matchesSelector\n\
  || proto.webkitMatchesSelector\n\
  || proto.mozMatchesSelector\n\
  || proto.msMatchesSelector\n\
  || proto.oMatchesSelector;\n\
\n\
/**\n\
 * Expose `match()`.\n\
 */\n\
\n\
module.exports = match;\n\
\n\
/**\n\
 * Match `el` to `selector`.\n\
 *\n\
 * @param {Element} el\n\
 * @param {String} selector\n\
 * @return {Boolean}\n\
 * @api public\n\
 */\n\
\n\
function match(el, selector) {\n\
  if (vendor) return vendor.call(el, selector);\n\
  var nodes = query.all(selector, el.parentNode);\n\
  for (var i = 0; i < nodes.length; ++i) {\n\
    if (nodes[i] == el) return true;\n\
  }\n\
  return false;\n\
}\n\
//@ sourceURL=component-matches-selector/index.js"
));
require.register("component-delegate/index.js", Function("exports, require, module",
"\n\
/**\n\
 * Module dependencies.\n\
 */\n\
\n\
var matches = require('matches-selector')\n\
  , event = require('event');\n\
\n\
/**\n\
 * Delegate event `type` to `selector`\n\
 * and invoke `fn(e)`. A callback function\n\
 * is returned which may be passed to `.unbind()`.\n\
 *\n\
 * @param {Element} el\n\
 * @param {String} selector\n\
 * @param {String} type\n\
 * @param {Function} fn\n\
 * @param {Boolean} capture\n\
 * @return {Function}\n\
 * @api public\n\
 */\n\
\n\
exports.bind = function(el, selector, type, fn, capture){\n\
  return event.bind(el, type, function(e){\n\
    if (matches(e.target, selector)) fn(e);\n\
  }, capture);\n\
  return callback;\n\
};\n\
\n\
/**\n\
 * Unbind event `type`'s callback `fn`.\n\
 *\n\
 * @param {Element} el\n\
 * @param {String} type\n\
 * @param {Function} fn\n\
 * @param {Boolean} capture\n\
 * @api public\n\
 */\n\
\n\
exports.unbind = function(el, type, fn, capture){\n\
  event.unbind(el, type, fn, capture);\n\
};\n\
//@ sourceURL=component-delegate/index.js"
));
require.register("component-events/index.js", Function("exports, require, module",
"\n\
/**\n\
 * Module dependencies.\n\
 */\n\
\n\
var events = require('event');\n\
var delegate = require('delegate');\n\
\n\
/**\n\
 * Expose `Events`.\n\
 */\n\
\n\
module.exports = Events;\n\
\n\
/**\n\
 * Initialize an `Events` with the given\n\
 * `el` object which events will be bound to,\n\
 * and the `obj` which will receive method calls.\n\
 *\n\
 * @param {Object} el\n\
 * @param {Object} obj\n\
 * @api public\n\
 */\n\
\n\
function Events(el, obj) {\n\
  if (!(this instanceof Events)) return new Events(el, obj);\n\
  if (!el) throw new Error('element required');\n\
  if (!obj) throw new Error('object required');\n\
  this.el = el;\n\
  this.obj = obj;\n\
  this._events = {};\n\
}\n\
\n\
/**\n\
 * Subscription helper.\n\
 */\n\
\n\
Events.prototype.sub = function(event, method, cb){\n\
  this._events[event] = this._events[event] || {};\n\
  this._events[event][method] = cb;\n\
};\n\
\n\
/**\n\
 * Bind to `event` with optional `method` name.\n\
 * When `method` is undefined it becomes `event`\n\
 * with the \"on\" prefix.\n\
 *\n\
 * Examples:\n\
 *\n\
 *  Direct event handling:\n\
 *\n\
 *    events.bind('click') // implies \"onclick\"\n\
 *    events.bind('click', 'remove')\n\
 *    events.bind('click', 'sort', 'asc')\n\
 *\n\
 *  Delegated event handling:\n\
 *\n\
 *    events.bind('click li > a')\n\
 *    events.bind('click li > a', 'remove')\n\
 *    events.bind('click a.sort-ascending', 'sort', 'asc')\n\
 *    events.bind('click a.sort-descending', 'sort', 'desc')\n\
 *\n\
 * @param {String} event\n\
 * @param {String|function} [method]\n\
 * @return {Function} callback\n\
 * @api public\n\
 */\n\
\n\
Events.prototype.bind = function(event, method){\n\
  var e = parse(event);\n\
  var el = this.el;\n\
  var obj = this.obj;\n\
  var name = e.name;\n\
  var method = method || 'on' + name;\n\
  var args = [].slice.call(arguments, 2);\n\
\n\
  // callback\n\
  function cb(){\n\
    var a = [].slice.call(arguments).concat(args);\n\
    obj[method].apply(obj, a);\n\
  }\n\
\n\
  // bind\n\
  if (e.selector) {\n\
    cb = delegate.bind(el, e.selector, name, cb);\n\
  } else {\n\
    events.bind(el, name, cb);\n\
  }\n\
\n\
  // subscription for unbinding\n\
  this.sub(name, method, cb);\n\
\n\
  return cb;\n\
};\n\
\n\
/**\n\
 * Unbind a single binding, all bindings for `event`,\n\
 * or all bindings within the manager.\n\
 *\n\
 * Examples:\n\
 *\n\
 *  Unbind direct handlers:\n\
 *\n\
 *     events.unbind('click', 'remove')\n\
 *     events.unbind('click')\n\
 *     events.unbind()\n\
 *\n\
 * Unbind delegate handlers:\n\
 *\n\
 *     events.unbind('click', 'remove')\n\
 *     events.unbind('click')\n\
 *     events.unbind()\n\
 *\n\
 * @param {String|Function} [event]\n\
 * @param {String|Function} [method]\n\
 * @api public\n\
 */\n\
\n\
Events.prototype.unbind = function(event, method){\n\
  if (0 == arguments.length) return this.unbindAll();\n\
  if (1 == arguments.length) return this.unbindAllOf(event);\n\
\n\
  // no bindings for this event\n\
  var bindings = this._events[event];\n\
  if (!bindings) return;\n\
\n\
  // no bindings for this method\n\
  var cb = bindings[method];\n\
  if (!cb) return;\n\
\n\
  events.unbind(this.el, event, cb);\n\
};\n\
\n\
/**\n\
 * Unbind all events.\n\
 *\n\
 * @api private\n\
 */\n\
\n\
Events.prototype.unbindAll = function(){\n\
  for (var event in this._events) {\n\
    this.unbindAllOf(event);\n\
  }\n\
};\n\
\n\
/**\n\
 * Unbind all events for `event`.\n\
 *\n\
 * @param {String} event\n\
 * @api private\n\
 */\n\
\n\
Events.prototype.unbindAllOf = function(event){\n\
  var bindings = this._events[event];\n\
  if (!bindings) return;\n\
\n\
  for (var method in bindings) {\n\
    this.unbind(event, method);\n\
  }\n\
};\n\
\n\
/**\n\
 * Parse `event`.\n\
 *\n\
 * @param {String} event\n\
 * @return {Object}\n\
 * @api private\n\
 */\n\
\n\
function parse(event) {\n\
  var parts = event.split(/ +/);\n\
  return {\n\
    name: parts.shift(),\n\
    selector: parts.join(' ')\n\
  }\n\
}\n\
//@ sourceURL=component-events/index.js"
));
require.register("component-autoscale-canvas/index.js", Function("exports, require, module",
"\n\
/**\n\
 * Retina-enable the given `canvas`.\n\
 *\n\
 * @param {Canvas} canvas\n\
 * @return {Canvas}\n\
 * @api public\n\
 */\n\
\n\
module.exports = function(canvas){\n\
  var ctx = canvas.getContext('2d');\n\
  var ratio = window.devicePixelRatio || 1;\n\
  if (1 != ratio) {\n\
    canvas.style.width = canvas.width + 'px';\n\
    canvas.style.height = canvas.height + 'px';\n\
    canvas.width *= ratio;\n\
    canvas.height *= ratio;\n\
    ctx.scale(ratio, ratio);\n\
  }\n\
  return canvas;\n\
};//@ sourceURL=component-autoscale-canvas/index.js"
));
require.register("sketch/index.js", Function("exports, require, module",
"\n\
/**\n\
 * Module dependencies.\n\
 */\n\
\n\
var classes = require('classes');\n\
var events = require('events');\n\
var Path = require('./path');\n\
var raf = require('raf');\n\
\n\
/**\n\
 * Create a new `Sketch` for the given `canvas`.\n\
 *\n\
 * @param {Canvas} canvas\n\
 * @return {Sketch}\n\
 * @api public\n\
 */\n\
\n\
module.exports = function(canvas){\n\
  return new Sketch(canvas);\n\
};\n\
\n\
/**\n\
 * Initialize a new `Sketch` with the given `canvas`.\n\
 *\n\
 * @param {Canvas} canvas\n\
 * @api public\n\
 */\n\
\n\
function Sketch(canvas) {\n\
  this.canvas = canvas;\n\
  this.bounds = null;\n\
  this.ctx = canvas.getContext('2d');\n\
  this.bind();\n\
  this.objs = [];\n\
  this.size(1.5);\n\
  this.background('white');\n\
  this.color('black');\n\
  classes(canvas).add('sketch');\n\
  this.draw();\n\
}\n\
\n\
/**\n\
 * Add drawable `obj`, which must\n\
 * provide a `.draw(ctx)` method.\n\
 *\n\
 * @param {Object} obj\n\
 * @return {Sketch}\n\
 * @api public\n\
 */\n\
\n\
Sketch.prototype.add = function(obj){\n\
  this.objs.push(obj);\n\
  return this;\n\
};\n\
\n\
/**\n\
 * Reset the sketch defaults and clear the canvas.\n\
 *\n\
 * @api public\n\
 */\n\
\n\
Sketch.prototype.reset = function(){\n\
  this.clear();\n\
  this.size(1.5);\n\
  this.color('black');\n\
};\n\
\n\
/**\n\
 * Clear the objects and re-draw.\n\
 *\n\
 * @api public\n\
 */\n\
\n\
Sketch.prototype.clear = function(){\n\
  this.objs = [];\n\
  this.draw();\n\
};\n\
\n\
/**\n\
 * Set pen `size`.\n\
 *\n\
 * @param {Number} size\n\
 * @return {Sketch}\n\
 * @api public\n\
 */\n\
\n\
Sketch.prototype.size = function(size){\n\
  this._size = size;\n\
  return this;\n\
};\n\
\n\
/**\n\
 * Set pen `color`.\n\
 *\n\
 * @param {String} color\n\
 * @return {Sketch}\n\
 * @api public\n\
 */\n\
\n\
Sketch.prototype.color = function(color){\n\
  this._color = color;\n\
  return this;\n\
};\n\
\n\
/**\n\
 * Set background `color`.\n\
 *\n\
 * @param {String} color\n\
 * @return {Sketch}\n\
 * @api public\n\
 */\n\
\n\
Sketch.prototype.background = function(color){\n\
  this._background = color;\n\
  return this;\n\
};\n\
\n\
/**\n\
 * Set pen `opacity`.\n\
 *\n\
 * @param {String} opacity\n\
 * @return {Sketch}\n\
 * @api public\n\
 */\n\
\n\
Sketch.prototype.opacity = function(opacity){\n\
  this._opacity = opacity;\n\
  return this;\n\
};\n\
\n\
/**\n\
 * Bind event handlers.\n\
 *\n\
 * @api public\n\
 */\n\
\n\
Sketch.prototype.bind = function(){\n\
  this.events = events(this.canvas, this);\n\
  this.events.bind('mousedown');\n\
  this.events.bind('mousemove');\n\
  this.events.bind('mouseup');\n\
  this.events.bind('touchstart', 'onmousedown');\n\
  this.events.bind('touchmove', 'onmousemove');\n\
  this.events.bind('touchend', 'onmouseup');\n\
};\n\
\n\
/**\n\
 * Unbind event handlers.\n\
 *\n\
 * @api public\n\
 */\n\
\n\
Sketch.prototype.unbind = function(){\n\
  this.events.unbind();\n\
};\n\
\n\
/**\n\
 * Animate via RAF.\n\
 *\n\
 * @api private\n\
 */\n\
\n\
Sketch.prototype.animate = function(){\n\
  var self = this;\n\
  if (!this.down) return;\n\
  raf(function(){ self.animate() });\n\
  this.draw();\n\
};\n\
\n\
/**\n\
 * Handle mousedown:\n\
 *\n\
 *   - add a new path\n\
 *   - add initial point\n\
 *   - redraw\n\
 *\n\
 * @api private\n\
 */\n\
\n\
Sketch.prototype.onmousedown = function(e){\n\
  this.bounds = this.bounds || this.canvas.getBoundingClientRect();\n\
  e.preventDefault();\n\
  if (e.targetTouches) e = e.targetTouches[0];\n\
  this.down = e;\n\
  var x = e.pageX - this.bounds.left;\n\
  var y = e.pageY - this.bounds.top;\n\
  var path = this.path = new Path;\n\
  path.opacity = 0.8;\n\
  path.color = this._color;\n\
  path.size = this._size;\n\
  path.addPoint(x, y);\n\
  path.addPoint(x + .1, y + .1);\n\
  this.objs.push(path);\n\
  this.animate();\n\
};\n\
\n\
/**\n\
 * Handle mousemove:\n\
 *\n\
 *   - add new point\n\
 *   - redraw\n\
 *\n\
 * @api private\n\
 */\n\
\n\
Sketch.prototype.onmousemove = function(e){\n\
  if (!this.down) return;\n\
  e.preventDefault();\n\
  if (e.targetTouches) e = e.targetTouches[0];\n\
  var x = e.pageX - this.bounds.left;\n\
  var y = e.pageY - this.bounds.top;\n\
  this.path.addPoint(x, y);\n\
};\n\
\n\
/**\n\
 * Handle mouseup:\n\
 *\n\
 *   - reset state\n\
 *\n\
 * @api private\n\
 */\n\
\n\
Sketch.prototype.onmouseup = function(e){\n\
  this.down = null;\n\
  this.draw();\n\
};\n\
\n\
/**\n\
 * Re-draw the sketch.\n\
 *\n\
 * @api private\n\
 */\n\
\n\
Sketch.prototype.draw = function(){\n\
  var ctx = this.ctx;\n\
  ctx.fillStyle = this._background;\n\
  ctx.fillRect(0, 0, this.canvas.width, this.canvas.height);\n\
  for (var i = 0; i < this.objs.length; ++i) {\n\
    this.objs[i].draw(this.ctx);\n\
  }\n\
};\n\
//@ sourceURL=sketch/index.js"
));
require.register("sketch/point.js", Function("exports, require, module",
"\n\
/**\n\
 * Expose `Point`.\n\
 */\n\
\n\
module.exports = Point;\n\
\n\
/**\n\
 * Initialize a new point.\n\
 *\n\
 * @param {Number} x\n\
 * @param {Number} y\n\
 * @api public\n\
 */\n\
\n\
function Point(x, y) {\n\
  this.x = x;\n\
  this.y = y;\n\
}//@ sourceURL=sketch/point.js"
));
require.register("sketch/path.js", Function("exports, require, module",
"\n\
/**\n\
 * Module dependencies.\n\
 */\n\
\n\
var Point = require('./point');\n\
\n\
/**\n\
 * Expose `Path`.\n\
 */\n\
\n\
module.exports = Path;\n\
\n\
/**\n\
 * Initialize a new `Path`.\n\
 *\n\
 * @api private\n\
 */\n\
\n\
function Path() {\n\
  this.points = [];\n\
  this.size = 5;\n\
}\n\
\n\
/**\n\
 * Path opacity.\n\
 */\n\
\n\
Path.prototype.opacity = 1;\n\
\n\
/**\n\
 * Add the given point.\n\
 *\n\
 * @param {Number} x\n\
 * @param {Number} y\n\
 * @api private\n\
 */\n\
\n\
Path.prototype.addPoint = function(x, y){\n\
  this.points.push(new Point(x, y));\n\
};\n\
\n\
/**\n\
 * Draw the object.\n\
 *\n\
 * @param {CanvasRenderingContext2d} ctx\n\
 * @api private\n\
 */\n\
\n\
Path.prototype.draw = function(ctx){\n\
  var points = this.points\n\
    , len = points.length\n\
    , a, b\n\
    , call;\n\
\n\
  ctx.save();\n\
\n\
  ctx.beginPath();\n\
  ctx.globalAlpha = this.opacity;\n\
  ctx.lineJoin = 'round';\n\
  ctx.lineCap = 'round';\n\
  ctx.lineWidth = this.size;\n\
  ctx.strokeStyle = this.color;\n\
\n\
  a = points[0];\n\
  ctx.moveTo(a.x, a.y);\n\
\n\
  for (var i = 0; i < len - 1; ++i) {\n\
    a = points[i];\n\
    b = points[i + 1];\n\
    ctx.quadraticCurveTo(\n\
        a.x\n\
      , a.y\n\
      , a.x + (b.x - a.x) / 2\n\
      , a.y + (b.y - a.y) / 2)\n\
  }\n\
\n\
  ctx.lineTo(b.x, b.y);\n\
  ctx.stroke();\n\
\n\
  ctx.restore();\n\
};//@ sourceURL=sketch/path.js"
));





require.alias("component-classes/index.js", "sketch/deps/classes/index.js");
require.alias("component-classes/index.js", "classes/index.js");
require.alias("component-indexof/index.js", "component-classes/deps/indexof/index.js");

require.alias("component-raf/index.js", "sketch/deps/raf/index.js");
require.alias("component-raf/index.js", "raf/index.js");

require.alias("component-events/index.js", "sketch/deps/events/index.js");
require.alias("component-events/index.js", "events/index.js");
require.alias("component-event/index.js", "component-events/deps/event/index.js");

require.alias("component-delegate/index.js", "component-events/deps/delegate/index.js");
require.alias("component-matches-selector/index.js", "component-delegate/deps/matches-selector/index.js");
require.alias("component-query/index.js", "component-matches-selector/deps/query/index.js");

require.alias("component-event/index.js", "component-delegate/deps/event/index.js");

require.alias("component-autoscale-canvas/index.js", "sketch/deps/autoscale-canvas/index.js");
require.alias("component-autoscale-canvas/index.js", "autoscale-canvas/index.js");