don't be a

_.md

[ Launch: don't be a ] 6338550 by enjalot

config.json

{"description":"don't be a","endpoint":"","display":"svg","public":true,"require":[{"name":"superformula","url":"http://d3js.org/d3.superformula.v0.min.js"}],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12},"style.css":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"fullscreen":false,"play":true,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"thumbnail":"http://i.imgur.com/qmH352P.png"}

inlet.js

//superformula by @d3visualization http://bl.ocks.org/mbostock/1020902

var size = 1098;

var svg = d3.select("svg");
var iw = 500;
var ih = 383;
svg.append("image")
.attr({
  "xlink:href": "http://imgur.com/kuU1DRC.png",
  width: iw,
  height: ih,
  x: tributary.sw/2  - iw/2,
  y: tributary.sh/2 - ih/2
})

var shape = d3.superformula()
  .type("rectangle")
  .size(size * 50)
  .segments(360);


var path = svg.append("path")
  .attr("class", "shape")
  .attr("transform", "translate(" + [tributary.sw/2, tributary.sh/2] + ")")
  .attr("d", shape)
.style({
  fill: "none",
  stroke: "#ffffff",
  "stroke-width":3.5,
  "stroke-dasharray": "5 4"
})

var count = 0;
tributary.run = function(g,t) {
  var n = d3.superformulaTypes.length;
  if(count >= n) count = 0;
  if(t*100 % 150 < 1) {
    shape.type(d3.superformulaTypes[count])
    count++;
    path
    .transition()
    .ease("bounce")
    .duration(800)
    .attr("d", shape)
  }
  
}

style.css

svg {
  background-color:#0E0E0E;
}

.time_controls {
  display:none;
}