IchiGoIchiE

var r = new Rune({
	container: "#canvas",
	width: 800,
	height: 2800,
	debug: false
});
var width =r.width;
var height = r.height;
var randomColor = r.random(0,360)
// var groupX = width*.125; //100
// var groupY = 0;

var kanjiGroup = r.group (100, 250);
//create var for 一
var ichiPath = r.path (0,0, kanjiGroup) 
.lineTo(0,0)
.curveTo(130, -30, 405,10 , 595, -5)
.curveTo(620, 5, 620, 25)
.curveTo(620, 100, 555, 50)
.curveTo(545, 40,530, 40)
.curveTo(405, 40,130, 10, 0, 25)
.curveTo(-40, 30, 0,0)


.fill (false)
.stroke(false)



var ichiPolys = ichiPath.toPolygons({spacing:10});

 for (var i=0; i<ichiPolys.length; i++) {
 	var ichiPoly = ichiPolys[i];
 	ichiPoly.move (0,200, kanjiGroup)
 	for (var j = 0; j<ichiPoly.state.vectors.length; j++) {
 		
 		var vec = ichiPoly.state.vectors[j];
 		vec.x += 100;
 		vec.y += 100;
 		//ichiPoly.fill('hsv', randomColor, ichiPoly.state.vectors[j].x*.09,100)
 		r.ellipse(ichiPoly.state.x+vec.x, ichiPoly.state.y + vec.y, 30,25)
 		.stroke(false)
 		.fill('hsv', randomColor, ichiPoly.state.vectors[j].x*.09,100)
  	}

  	console.log(vec.x)
  	console.log(ichiPoly.state.x)
  	console.log (ichiPolys)
  	console.log (ichiPoly.state.vectors[j])
 ichiPath.removeParent()
 ichiPoly.move (0,1200, kanjiGroup)
 for (var j = 0; j<ichiPoly.state.vectors.length; j++) {
 		
 		var vec = ichiPoly.state.vectors[j];
 		vec.x -= 0;
 		vec.y += 0;
 		//ichiPoly.fill('hsv', randomColor, ichiPoly.state.vectors[j].x*.09,100)
 		r.ellipse(ichiPoly.state.x+vec.x, ichiPoly.state.y + vec.y, 30,25)
 		.stroke(false)
 		.fill('hsv', randomColor, ichiPoly.state.vectors[j].x*.09,100)
  	}
 }

var goPath = r.path(0,350,kanjiGroup)
.move(75, 350)
.lineTo (0,125)
.lineTo (-50, 125)
.lineTo (-50, 150)
.lineTo (0, 150)
.lineTo (0, 350)
.lineTo (-70, 350)
.lineTo (-70, 375)
//bottom of rect
.lineTo (0, 375)
//left base curve line
.curveTo (0,400 , -70, 475)
.curveTo (-63, 480 ,-50, 472)
.curveTo (25, 400, 25, 375)
//center bottom line
.lineTo (75, 375)
//Right curve
.curveTo (75, 410, 140, 450)
.curveTo (160, 455, 137, 430)
.curveTo (100, 395, 100, 375)
//right side from bottom
.lineTo (175, 375)
.lineTo (175, 350)
.lineTo (100, 350)
.lineTo (100, 150)
.lineTo (150, 150)
.lineTo (150, 125)
.lineTo (100, 125)
.lineTo (100, 0)
//top
.lineTo (75, 0)
.lineTo (75, 125)
.lineTo (25, 125)
.lineTo (25, 0)
.lineTo (0,0)
//center blocks
//block 1
.moveTo(25, 150)
.lineTo(75, 150)
.lineTo(75, 200)
.lineTo (25, 200)
.lineTo (25, 150)
//Block 2
.moveTo(25, 225)
.lineTo(75, 225)
.lineTo(75, 275)
.lineTo(25, 275)
.lineTo(25, 225)
//Block 3
.moveTo(25, 300)
.lineTo(75, 300)
.lineTo (75, 350)
.lineTo(25, 350)
.lineTo(25, 300)
.fill (false)

//月　part
.moveTo (275,0)
.curveTo(290, 375,230, 450)
.curveTo (250, 455,260,430)
.curveTo (290,375,300, 225)
.lineTo(425, 225)
//right curve
.curveTo(450, 480, 415, 500)
.curveTo(445, 505,450,475)
.curveTo(460, 450, 450, 225)
//right side
.lineTo (450, 0)
//top
.lineTo (275, 0)
//top box
.moveTo(300,25)
.lineTo(425, 25)
.lineTo(425, 100)
.lineTo(300,100)
.lineTo (300, 25)
//bottom box
.moveTo(300, 125)
.lineTo(425, 125)
.lineTo(425, 200)
.lineTo(300, 200)
.lineTo(300, 125)
.stroke(false)

//TURN GO to Poly
var goPolys = goPath.toPolygons({spacing:10});

 for (var i=0; i<goPolys.length; i++) {
 	var goPoly = goPolys[i];
 	goPoly.move (0,250, kanjiGroup)
 	for (var j = 0; j<goPoly.state.vectors.length; j++) {
 		
 		var vec = goPoly.state.vectors[j];
 		vec.x += 100;
 		vec.y += 100;
 		//ichiPoly.fill('hsv', randomColor, ichiPoly.state.vectors[j].x*.09,100)
 		r.ellipse(goPoly.state.x+vec.x, goPoly.state.y + vec.y, 37,40)
 		.stroke(false)
 		.fill('hsv', randomColor, goPoly.state.vectors[j].x*.12,100)
  	}

  	console.log(vec.x)
  	console.log(goPoly.state.x)
  	console.log (goPolys)
  	console.log (goPoly.state.vectors[j])
 goPath.removeParent()
 
 }

var ePath = r.path (0, 1630, kanjiGroup)
//left top
.moveTo(-75, 0)
.curveTo(-225,225 ,-350,300)
.curveTo (-325,325, -280,290)
.curveTo(-200,240,-25, 0)
.curveTo (-20, -35, -75, 0)
//.curveTo (-250,240, -50, 0)

//right top
.moveTo (-25,50)
.curveTo(width*.08, 150, width*.30,250)
.curveTo(width*.3,255,width*.35, 260)
.curveTo(width*.37,273,width*.35,300)
.curveTo(width*.03, 175,-45,80)
.curveTo(-30,45,-25,50)

//first inside line
.moveTo(-150,250)
.curveTo(-50, 210, 75, 250)
.curveTo (95,250,75,275)
.curveTo (-50, 260, -150,265)
.curveTo(-165,245,-150, 250)
//.moveTo(-150,225)
// .curveTo(-50, 210, 75, 225)
// .curveTo (95,250,75,275)
// .curveTo (-50, 260, -150,265)
// .curveTo(-165,245,-150, 225)
//second inside line
.moveTo(-220, 350)
.curveTo (-100, 300, width*.22, 350)
.curveTo (width*.24,345,width*.22, 375)
.curveTo( -120, 345,-220, 365)
.curveTo(-235, 360,-220,325)

// .moveTo(-220, 325)
// .curveTo (-100, 300, width*.22, 325)
// .curveTo (width*.24,345,width*.22, 375)
// .curveTo( -120, 345,-220, 365)
// .curveTo(-235, 345,-220,325)

//left bottom part
.moveTo(-125, 420)
.curveTo (-200, 490,-275,590)
.curveTo (-290, 630, -200, 620)
.curveTo(-125, 600, 40, 550)
.curveTo( 100, 600, 100, 600)
.curveTo(160,630,160, 610)
.curveTo(170, 600, 140, 590) 
.curveTo( 40, 540, 10,460)
.curveTo(-10, 490, 0,520)
.curveTo(-50, 610,-45,550)
.curveTo(-100, 560,-225, 590)
.curveTo(-180,550,-120,425)
// .curveTo(-130,500,-130, 410)
//.curveTo(-120, 380, -125, 420)
.fill(false)
.stroke(false)


var ePolys = ePath.toPolygons({spacing:10});

 for (var i=0; i<ePolys.length; i++) {
 	var ePoly = ePolys[i];
 	//ePoly.move (0,200, kanjiGroup)
 	for (var j = 0; j<ePoly.state.vectors.length; j++) {
 		
 		var vec = ePoly.state.vectors[j];
 		vec.x += 400;
 		vec.y += 250;
 		//ichiPoly.fill('hsv', randomColor, ichiPoly.state.vectors[j].x*.09,100)
 		r.ellipse(ePoly.state.x+vec.x, ePoly.state.y + vec.y, 60,40)
 		.stroke(false)
 		.fill('hsv', randomColor, ePoly.state.vectors[j].x*.09,100)
  	}

  	console.log(vec.x)
  	console.log(ePoly.state.x)
  	console.log (ePolys)
  	console.log (ePoly.state.vectors[j])
 	//ePath.removeParent()
}

r.draw();



// .lineTo (0,0)
// .lineTo (600, 0)
// .lineTo (600,25)
//.curveTo()
// .lineTo (90, 25)

// .lineTo (90, 50)
// .curveTo(15, 50, 0,0)
// .stroke(0,0,0)