Spinner 2

_.md

[ Launch: Spinner 2 ] 9606196 by roundrobin

config.json

{"description":"Spinner 2","endpoint":"","display":"svg","public":true,"require":[],"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}},"fullscreen":false,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"pingpong","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"ajax-caching":true,"thumbnail":"http://i.imgur.com/YX0xDgg.png"}

inlet.js

function loader(config) {
  return function() {
    var radius = Math.min(config.width, config.height) / 2.5;
    var tau = 2 * Math.PI;

    var arc = d3.svg.arc()
            .innerRadius(radius*1)
            .outerRadius(radius*1.1)
            .startAngle(0);

    var svg = d3.select(config.container).append("svg")
        .attr("id", config.id)
        .attr("width", config.width)
        .attr("height", config.height)
      .append("g")
        .attr("transform", "translate(" + config.width / 2 + "," + config.height / 2 + ")")

    var background = svg.append("path")
            .datum({endAngle: 0.33*tau})
            .style("fill", "#4D4D4D")
            .attr("d", arc)
            .call(spin, 3557)

    function spin(selection, duration) {
        selection.transition()
            .ease("linear")
            .duration(duration)
            .attrTween("transform", function() {
                return d3.interpolateString("rotate(0)", "rotate(360)");
            });
	        //console.log("-----------", Date.now())
        var id = setTimeout(function() { spin(selection, duration); }, duration);
        console.log(id)
    }

    

  };
}


var myLoader = loader({width: 217, height: 103, container: "svg", id: "loader"});
myLoader();