import Bilza, { Ui,hsl} from "../../src/bilza.js";

let bil = new Bilza("bilza", 70);
bil.resizeCanvas(640 , 360);

const grid = bil.alwaysOn().grid(10,10,"grey");

const comp = bil.add(0,65).circle(10,hsl(240));
//---most important line should be applied immediately after creation
comp.setRespDims(false);
//--Padding By default is Non-Responsive
comp.setPaddings(10);

comp.showBackground.set(true);
comp.colorBackground.set(hsl(60,80));
comp.border.set(2);
comp.colorBorder.set(hsl(0))


comp.align(1,1);
comp.alignRotate(1,1);
comp.x.set(50);
comp.y.set(50);

comp.width.set(10);
comp.height.set(10);
//--if the width and height were responsive the comp will grow larger than the canvas at value 100
comp.width.oscillate(1,60,10,300,5);
comp.height.oscillate(1,60,10,300,5);

const ui = new Ui(bil);
bil.draw();