vectorsize

// Returns the absolute offset from the top of the container
    function getCharacterOffsetWithin(sel, node) {
      var range = sel.getRangeAt(0);
      var selStr = sel.toString();

      // we sanitize linebreaks and white spaces
      selLen = selStr.replace(/[^A-Za-z0-9.-:\/$ ]/g, "").replace(/(\r\n|\n|\r|\s+)/gm, ' ').length;

      var treeWalker = document.createTreeWalker( node, NodeFilter.SHOW_TEXT, function(node) {

vectorsize

// This snippet is an example on how the detecting overlaping annotations
// was implemented inside the Substance Composer app.

function annotate(type) {
  // Check for existing annotation
  var sel = this.surface.selection();

  if (!sel) return;

  if (_.include(["em", "str"], type)) {

vectorsize

vendor(prop, args)
	-webkit-{prop} args
	   -moz-{prop} args
	    -ms-{prop} args
	     -o-{prop} args
	        {prop} args

border-radius()
	vendor('border-radius', arguments)

vectorsize

/* url sets the path */
font-url(file)
  return '/public/stylesheets/fonts/' + file

/* abstracts all the specifics*/
webfont(family, file, style, weight)
  @font-face
    font-family family
    font-weight weight
    font-style style

vectorsize

// based on https://github.com/processing/processing/blob/a6e0e227a948e7e2dc042c04504d6f5b8cf0c1a6/core/src/processing/core/PApplet.java#L5093

var scale = function(opts){
  var istart = opts.domain[0],
      istop  = opts.domain[1],
      ostart = opts.range[0],
      ostop  = opts.range[1];

  return function scale(value) {
    return ostart + (ostop - ostart) * ((value - istart) / (istop - istart));

vectorsize

{
  "caption": "Terminal",
  "id": "side-bar-files-open-with-terminal",

  "command": "side_bar_files_open_with",
  "args": {
    "paths": [],
    "application": "Terminal.app"
  }
}

vectorsize

Mouseover to draw circles!

This is a quick proof-of-concept example demonstrating how to create a canvas scenegraph in the DOM using document fragments. The scenegraph in this example consists of a simple container svg element and a number of child circle elements.

The content positions and sizes are calculated offline and the actual DOM tree doesn't even need to be aware of out svg. To render them, we use a timer that iterates over the child elements and draws them to a canvas element.

This is a modification of the original DOM-to-Canvas using D3 proof of conncept.

vectorsize

!function(e){"object"==typeof exports?module.exports=e():"function"==typeof define&&define.amd?define(e):"undefined"!=typeof window?window.domino=e():"undefined"!=typeof global?global.domino=e():"undefined"!=typeof self&&(self.domino=e())}(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);throw new Error("Cannot find module '"+o+"'")}var f=n[o]={exports:{}};t[o][0].call(f.exports,function(e){var n=t[o][1][e];return s(n?n:e)},f,f.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
var parserlib = require('./cssparser');

module.exports = CSSStyleDeclaration;

function CSSStyleDeclaration(elt) {
  this._element = elt;
}

// Utility function for parsing style declarations

vectorsize

{"nodes":[{"x":444,"y":275},{"x":378,"y":324},{"x":478,"y":278},{"x":471,"y":256},{"x":382,"y":269},{"x":371,"y":247},{"x":359,"y":276},{"x":364,"y":302},{"x":400,"y":330},{"x":388,"y":298},{"x":524,"y":296},{"x":570,"y":243},{"x":552,"y":159},{"x":502,"y":287},{"x":511,"y":313},{"x":513,"y":265},{"x":602,"y":132},{"x":610,"y":90},{"x":592,"y":91},{"x":575,"y":89},{"x":607,"y":73},{"x":591,"y":68},{"x":574,"y":73},{"x":589,"y":149},{"x":620,"y":205},{"x":621,"y":230},{"x":589,"y":234},{"x":602,"y":223},{"x":548,"y":188},{"x":532,"y":196},{"x":548,"y":114},{"x":575,"y":174},{"x":497,"y":250},{"x":576,"y":196},{"x":504,"y":201},{"x":494,"y":186},{"x":482,"y":199},{"x":505,"y":219},{"x":486,"y":216},{"x":590,"y":306},{"x":677,"y":169},{"x":657,"y":258},{"x":667,"y":205},{"x":552,"y":227},{"x":518,"y":173},{"x":473,"y":125},{"x":796,"y":260},{"x":731,"y":272},{"x":642,"y":288},{"x":576,"y":269},{"x":605,"y":187},{"x":559,"y":289},{"x":544,"y":356},{"x":505,"y":365},{"x":579,"y":289},{"x":619,"y":282},{"x":574,"y"

vectorsize

pbpaste | convert - bmp:- | potrace - -o - -b pdf | open -a /Applications/Preview.app -f