PDS-GridSys-DogsAndDemons

//references
//http://printingcode.runemadsen.com/examples/typography/font/
//http://runemadsen.github.io/rune.js/
//http://printingcode.runemadsen.com/examples/

var r = new Rune({
	container: "#canvas",
	width: 600,
	height: 900,
	debug: false
});


var f = new Rune.Font("Impact.ttf");

f.load(function(err) {


var width = r.width;
var height = r.height;
var gut = 5;
var x = 15;
var y = 15;
var japanSize = ((height/3)/2-(y*2))


//create grid
var grid = r.grid ({
  x:x,
  y:y,
  width: width - (x*2), 
  height: height - (y*2),
  gutter:5,
  columns:2,
  rows:3
});

r.rect (x,y, width-(x*2), height-(y*2))
.fill(false)

var modW = grid.state.moduleWidth;
var modH = grid.state.moduleHeight;
var textSize = modW*.25;
  var pathTitleA = f.toPath("DOGS AND DEMONS", x, textSize, textSize)
  .fill (false)
  .stroke(false)
  grid.add(pathTitleA, 1,1)
  var pathTitleB = f.toPath("the Fall of", x,textSize*2, textSize*.75)
  .fill(false)
  grid.add(pathTitleB, 1,1)
  var pathTitleC = f.toPath("Modern Japan", x,textSize*3, textSize*.75)
  .fill(240, 10,0)
  grid.add(pathTitleC, 1,1)
   var pathTitleD = f.toPath("Alex Kerr", modW-(textSize*.5*4),modH-modH*.05, textSize*.5)
  .fill(0, 0, 0)
  grid.add(pathTitleD, 2,3)

var titlePolys = pathTitleA.toPolygons({spacing:1});
pathTitleA.removeParent()
  // grid.add(titlePolys, 1,1)
for (var m =0; m<titlePolys.length; m++) {
  
  var titlePoly = titlePolys[m];
  titlePoly.move(x*2, textSize+y, false)
  for (var n =0; n< titlePoly.state.vectors.length; n++) {
  var vecTitleA = titlePoly.state.vectors[n];
  vecTitleA.x += Rune.random(-2,2);
  vecTitleA.y += Rune.random(-2,2);
  r.circle (titlePoly.state.x+vecTitleA.x, titlePoly.state.y+vecTitleA.y, 2,2)
  .fill (0,0,0)
  .stroke(false)
  }
  //grid.add(titlePoly, 1, 2)
}



//japan flag circle
var japanX = modW/2;
var japanY = modH/2;
var japan = r.circle(japanX,japanY, japanSize, japanSize).fill(240, 10,0).stroke(false);
grid.add (japan, 1, 3)

//cement holder
var cementMachineLeft = r.path (modW,0)
.lineTo(modW*-1, modH*.5)
.curveTo(modW*-.75, modH*1, modW*-.5, modH*.5)
.lineTo(0, modH*.25)
.fill ('hsv', 0, 0, 25)
.strokeWidth(4)
grid.add(cementMachineLeft, 2,2)
console.log(cementMachineLeft)


//cementMachineRight
var cementMachineRight = r.path(modW, modH*.25)
.lineTo(modW*-.5, modH*.25)
.curveTo (modW*-.55, modH*.4,modW*-.75, modH*.5+2)
.lineTo (0, modH*.15)
.fill ('hsv', 0, 0, 25)
.strokeWidth(4)

grid.add(cementMachineRight, 2, 2)

var cementPath = r.path(modW*.5, modH*.5+gut )
.curveTo(modW*-.5, modH*.1, modW*-.5, modH*.5, modW*-.60+gut, modH*.80+gut)
.curveTo(modW*-.5, modH*.75, modW*-.3, modH*.5, 0,0)
.fill ('hsv', 0,0,75)
.stroke (false)
var cementPolys = cementPath.toPolygons({spacing:10});
for (var i = 0; i<cementPolys.length; i++) {
  var cementPoly = cementPolys[i];
  cementPath.removeParent()
  for (var j=0; j<cementPoly.state.vectors.length; j++) {
    var cementVec = cementPoly.state.vectors[j];
    cementVec.x += Rune.random(-3,0);
    cementVec.y += Rune.random(-3,3);

  
  }
}
grid.add(cementPoly, 2, 2)



r.draw();

});