(function() {
  var height, scale, sequence, svg, translation, width;

  svg = d3.select('svg');

  width = svg.node().getBoundingClientRect().width;

  height = svg.node().getBoundingClientRect().height;

  svg.attr({
    viewBox: "" + (-width / 2) + " " + (-height / 2) + " " + width + " " + height
  });

  sequence = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('').map(function(d) {
    return {
      label: d
    };
  });

  console.debug('Computing the Space-Filling Curve layout...');

  scale = 32;

  translation = sfc_layout.displace(sequence, sfc_layout.GOSPER, scale, scale, -Math.PI / 6);

  console.debug('Drawing...');

  svg.selectAll('.cell').data(sequence).enter().append('path').attr('class', 'cell').attr('d', jigsaw.hex_generate_svg_path(scale)).attr('transform', function(d) {
    return "translate(" + d.x + "," + d.y + ")";
  });

  svg.selectAll('.label').data(sequence).enter().append('text').text(function(d) {
    return d.label;
  }).attr('class', 'label').attr('transform', function(d) {
    return "translate(" + d.x + "," + d.y + ")";
  }).attr('dy', '.35em');

}).call(this);