Skip to content

Instantly share code, notes, and snippets.

@Termina1
Created April 24, 2012 21:45
Show Gist options
  • Save Termina1/2484132 to your computer and use it in GitHub Desktop.
Save Termina1/2484132 to your computer and use it in GitHub Desktop.
js1k entry http://js1k.com/2011-dysentery/demo/994 with my comments in russian
w = 700;//b.clientWidth;//
h = 250;
o = 0;
b.style.background = "#000";
a.canvas.width = w;
a.canvas.height = h;
q = [];
m = Math;
random = m.random;
u = m.floor;
p = Math.PI*2;
f = 20;
v = 0;
function k(a, b){ // cортировка по y
if( a.y < b.y )return -1;
return a.y > b.y;
}
function t(x,y){a.lineTo(x,y)} // функция рисования линии до точки (x, y)
function l(c){a.fillStyle=c} // установка цвета заполнения
function z(x,y,r){
this.x=x;
this.y=y; // устанавливаем переменные объекты
var xx=0;
var lc = "rgb("+(233+u(random()*20))+"," + (197+u(random()*50)) + ",18)";//"#FAD934";//
// выбираем случайный оттенок жёлтого
var rands = Array();
for( var i = 0; i < 15; i++ ){rands.push( random() );} // гененерируем случайные числа для отрисовки кроны
this.d=function(){
xx=x-o; // двигаем дерево левее относительно предыдущего положения
xx+=xx/w*y/h*999; // создание эффекта удалённости объектов,
//дальние (те, которые выше по y) движутся медленее, чем ближние
l("#a56007");//l("#b17322");
// рисуем тень дерева
a.beginPath();
t(xx,y+28);
t(xx+25,y+35);
t(xx,y+32);
//a.closePath();
a.fill();
//рисуем ствол
l("#000");//l("#1c1513");
a.beginPath();
t(xx,y);
t(xx+r/4,y+30); // ствол зависит от сгенерированного случайным образом "радиуса" r
t(xx,y+32);
t(xx-r/4,y+30);
//a.closePath();
a.fill();
//рисуем крону
l(lc);//l("#fddc38");//lc;
for( var i = 0; i < 15; i++ ){ // крона состоит из 15 маленьких окружностей
var rd = rands[i] * r / 2; // берём заранее сгенерированный радиус
var ag = i/15 * p; // делим круг на 15 частей
var xl = xx + m.cos(ag)*r; // мы хотим нарисовать круг где-то на радиусе самого дерева
var yl = y + m.sin(ag)*r;
if( i<1 ){xl = xx; yl = y; rd = r;} // тут заполняем центр кроны, чтобы там не была пустоты
a.beginPath();
a.arc( xl,yl,rd,0,p,1 ); // x1, y1 начальные координаты, rd - радиус, 0-pi*2 рисуем окружность
a.fill();
}
};
}
e=0;
function r(){
if( random() < .3 ){ // генерируем случайное число и используем его,
//как регулятор плотности кол-ва деревьев по x, чем оно меньше - тем меньше деревев будет отрисовано
q.push( new z(w+o+f, random() * h, random()*16+4 )); //запускаем создание одного дерева,
//x - текущий такт o + ширина экрана + отступ, h - рандомная высота, и рандомный радиус
}
o++; //такт
if(e){
q.sort(k); //начинаем отрисовку сверху
l("#c77b1a");//l("#cf8b33");
a.fillRect(0,0,w,h); //очищаем экран перед след этапом отрисовки
for( i=0; i < q.length; ) {
if( q[i].x < (o-f) ) {
q.splice(i,1); //если дерево не влазит, то отрезаем его
continue;
}
q[i++].d() // вызываем отрисовку одного дерева
}
setTimeout("r()",42); // откладываем вызов функции на попозже
}
}
i=0;
while(i++<w+f){r()} // генерируем первые n деревье
//for(;i<w+f;i++){r()}
e=1; //выставляем переменную начала отрисовки
r(); // запускаем отрисовку
@Termina1
Copy link
Author

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment