xxxxxxxxxx
//This work is a dynamic version of kinetic art project
// https://artsandculture.google.com/entity/m03g48h?categoryid=art-movement
var growFactor = 0.4
class Hanger{
constructor(args){
let def = {
p: createVector(0,0),
length: 100,
mid: 0.5,
mHeight: 30,
rotSpeed: 0.1,
angle: random(0,200),
angleSpeed: 0,
lMass: 0,
rMass: 0
}
Object.assign(def,args)
Object.assign(this,def)
}
update(){
this.angle+=this.angleSpeed
}
draw(dp){
dp = dp || 1
push()
translate(this.p.x,this.p.y)
let lLen = this.projLength*this.mid
let rLen = this.projLength-lLen
let lY = -this.projHeight*this.mid
let rY = this.projHeight*(1-this.mid)
strokeWeight(2)
//hang line
stroke(color(`rgba(255,255,255,${dp})`))
line(0,this.mHeight,0,0)
// main body
push()
translate(0,this.mHeight)
// stroke(color(60,60,60,dp*0.9))
line(-lLen,lY,0,0)
// stroke(color(60,60,60,dp*0.9))
line(0,0,rLen,rY)
//left child
push()
translate(-lLen,lY)
this.lChild && this.lChild.update()
this.lChild && this.lChild.draw(dp*0.8)
if (!this.lChild){
noStroke()
fill(255,0,0)
ellipse(0,0,15,15)
}
pop()
//right child
push()
translate(rLen,rY)
this.rChild && this.rChild.update()
this.rChild && this.rChild.draw(dp*0.8)
if (!this.rChild){
noStroke()
fill(255,255,0)
ellipse(0,0,15,15)
}
pop()
pop()
//circle
fill(255)
noStroke()
ellipse(0,0,10,10)
pop()
}
get lPoint(){
return createVector(this.p.x-this.projLength*this.mid,this.p.y+this.mHeight)
}
get rPoint(){
return createVector(this.p.x+this.projLength*(1-this.mid),this.p.y+this.mHeight)
}
get hangAngle(){
return Math.cos(this.angle)
}
get projLength(){
return cos(this.hangAngle)*this.length
}
get projHeight(){
return sin(this.hangAngle)*this.length/3
}
}
var hangers = []
var angleRan = 0.04
function addHang(h,dp){
// println(dp++)
console.log(h.lPoint,h.rPoint)
let ll = new Hanger({
length: 100+random()*200,
mHeight: 50+random()*100,
angleSpeed: random()*angleRan*2-angleRan,
mid: random(0.3,0.7)
})
h.lChild=ll
if (dp<5 && random()<growFactor){
addHang(ll,dp)
}
let rr = new Hanger({
length: 100+random()*200,
mHeight: 50+random()*100,
angleSpeed: random()*angleRan*2-angleRan,
mid: random(0.3,0.7)
})
h.rChild=rr
if (dp<5 && random()<growFactor){
addHang(rr,dp)
}
}
function setup(){
createCanvas(windowWidth,windowHeight)
hangers.push( new Hanger({
p: createVector(windowWidth/2,50),
angleSpeed: random()*0.02-0.01,
mid: random(0.3,0.7)
}))
addHang(hangers[0],0)
}
function draw(){
hangers.forEach(h=>h.update())
background(color('rgba(0,0,0,0.7)'))
hangers.forEach(h=>h.draw())
}
function mouseClicked(){
hangers=[]
hangers.push( new Hanger({
p: createVector(windowWidth/2,50),
angleSpeed: random()*0.02
}))
addHang(hangers[0],0)
}