type test 2

_.md

[ Launch: Pattern grid - tube2 ] 4653825 by roundrobin
[ Launch: Pattern grid - tube2 ] 4653799 by roundrobin
[ Launch: Pattern grid - tube ] 4653614 by roundrobin
[ Launch: Pattern grid - tube ] 4653610 by roundrobin
[ Launch: Pattern grid - snake ] 4653569 by roundrobin
[ Launch: Pattern grid - 70ies circles ] 4653560 by roundrobin
[ Launch: Pattern grid - cross ] 4646975 by roundrobin
[ Launch: Pattern grid - hash ] 4646958 by roundrobin
[ Launch: Pattern grid - hash ] 4646953 by roundrobin
[ Launch: Tributary inlet ] 4646912 by roundrobin

config.json

{"description":"type test 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}},"play":false,"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,"fullscreen":false,"thumbnail":"http://i.imgur.com/GhR1CqI.png"}

inlet.js

var pattern_size = 53;

var defs = d3.select('svg').append('defs')
var pattern = defs.append('pattern')
    .attr('id','pattern1')
    .attr('pattermTransform','')
    .attr('height',pattern_size)
    .attr('width',pattern_size)
    .attr('patternUnits','userSpaceOnUse')

var r = pattern_size/2;

var gr = pattern.append("svg:g")
    .attr("transform","translate("+[0,0]+")")
    .attr("class","group");


gr.append("svg:circle")
        .attr("r",r)
        .attr("cx",0)
        .attr("cy",0)
        .attr("fill","#3C63AF");


gr.append("svg:circle")
        .attr("r",r)
        .attr("cx",0)
        .attr("cy",51)
        .attr("fill","#044DCF");

gr.append("svg:circle")
        .attr("r",r)
        .attr("cx",pattern_size)
        .attr("cy",26)
        .attr("fill","#304E83");

var gr = pattern.append("svg:g")
    .attr("transform","translate("+[6,0]+")")
    .attr("class","group");





var col2 = '#15EE5A';
gr.append("svg:circle")
        .attr("r",r)
        .attr("cx",0)
        .attr("cy",0)
        .attr("fill",col2)
        .attr("fill-opacity",0.5);


gr.append("svg:circle")
        .attr("r",r)
        .attr("cx",0)
        .attr("cy",51)
        .attr("fill",col2)
        .attr("fill-opacity",0.5);

gr.append("svg:circle")
        .attr("r",r)
        .attr("cx",pattern_size)
        .attr("cy",26)
        .attr("fill",col2)
        .attr("fill-opacity",0.5);



var x = 272;
var col = '#5F005F';

d3.select('svg').append('rect')
        .attr('height',tributary.sh)
      .attr('width',tributary.sw)
  	  .attr('fill','url(#pattern1)')

g.append("svg:circle")
        .attr("r",201)
        .attr("cx",255)
        .attr("cy",301)
        .attr("fill","#FFF8FF")
        .attr("fill-opacity",0.5);


g.append("svg:circle")
        .attr("r",235)
        .attr("cx",255)
        .attr("cy",301)
        .attr("fill","#FFF8FF")
        .attr("fill-opacity",0.5);



g.append("svg:circle")
        .attr("r",71)
        .attr("cx",459)
        .attr("cy",109)
        .attr("fill","#313485")
        .attr("fill-opacity",0.76);


g.append('svg:text')
.text("1968")
.attr("fill", '#10B983')
.attr("x", 458)
.attr("y", 129)
.attr("font-size", 53)
.attr("font-family", "Homestead")
.attr("text-anchor", "middle")
.style('text-shadow','4px 0px 0px #FFFFFF');


var shad ='';
shad += '4px 0px 0px #FFFFFF';
shad += ',4px 4px 0px #2D72A0';

g.append('svg:text')
.text(function(d,i){ return "in Concert";})
.attr("fill", col)
.attr("x", x)
.attr("y", 321)
.attr("font-size", 115)
.attr("font-family", "Mission Script")
.attr("text-anchor", "middle")
.style('text-shadow',shad);

var startX  = 50
var startY  = 435

var curve     = 166
var amplitude = 222
    
var targetX   = 475
var targetY   = -27;    


defs.append('path')
  .attr('d','M '+startX+' '+startY+' q '+curve+' '+amplitude+' '+targetX+' '+targetY+'')
  .attr('stroke','blue')
  .attr('stroke-width',3)
  .attr('fill','none')
  .attr('id','bezierCurve')
  
                  
var text = g.append('text')
    			.attr('font-size',55)

g.append('use')
  .attr('xlink:href','#bezierCurve')

text.append('textPath')
  .attr('xlink:href','#bezierCurve')
  	.text('Star club - reeperbahn')
.attr("fill", col)
.attr("font-family", "Sofia")

g.append('svg:text')
.text("STONES")
.attr("fill", col)
.attr("x", x)
.attr("y", 235)
.attr("font-size", 115)
.attr("font-family", "Homestead")
.attr("text-anchor", "middle")
.style('text-shadow','4px 0px 0px #FFFFFF');

g.append('svg:text')
.text("Hamburg")
.attr("fill", col)
.attr("x", x)
.attr("y", 439)
.attr("font-size", 141)
.attr("font-family", "Ostrich SanS")
.attr("text-anchor", "middle")
.style('text-shadow','4px 0px 0px #FFFFFF');