Return Styles: Pseud0ch, Terminal, Valhalla, NES, Geocities, Blue Moon.

Pages: 1-

DECEMBER CHALLENGE

Name: Anonymous 2016-12-09 0:03

implement js snowflakes in a clever way -- interesting falling patterns, short source code, randomly generated snowflakes, etc

http://www.schillmania.com/projects/snowstorm/ for reference

Name: Anonymous 2016-12-09 0:53

Needs moar mittens.

Name: Anonymous 2016-12-09 11:24

>>1 https://www.reddit.com/r/frozenvoid/wiki/javascript/demo/snowflake_js

Name: Anonymous 2016-12-09 11:31

>>3 ! Use "View Source" since Reddit doesn't preserve formatting

Name: Anonymous 2016-12-09 13:43

JACKSON FIVE GET

Name: Anonymous 2016-12-09 21:07

WASTE OF CPY CYCLES

Name: Anonymous 2016-12-10 7:18

>>6
What useful programs do you run?(Hint:browsing internet and watching anime doesn't qualify)

Name: Anonymous 2016-12-10 12:24

>>7
2hus.

Name: Anonymous 2016-12-10 18:32

WTF these snowflakes don't look like libdims?

Name: Anonymous 2016-12-11 9:38

Dynamic wind vortex Challenge!

Name: Anonymous 2016-12-11 9:55

Has anyone compared memory use of >>1 and >>3 ?

Name: Anonymous 2016-12-12 19:54

/prog/ challenge: port xsnow to wayland

Name: Anonymous 2016-12-16 14:07

starter code bump

var c = document.getElementById("flake");
var flake = c.getContext("2d");

flake.strokeStyle="#FF0000";

var imgData=flake.createImageData(20,20);

for (var i=0;i<imgData.data.length;i+=12)
{
imgData.data[i+0]=255;
imgData.data[i+1]=0;
imgData.data[i+2]=0;
imgData.data[i+3]=255;
}

flake.putImageData(imgData,0,0);

var canv = document.getElementById("myCanvas");
var ctx = canv.getContext("2d");

var imgData = flake.getImageData(0,0,20,20);

ctx.putImageData(imgData,0,0);

Name: Anonymous 2016-12-17 3:56

random snowflake generator
var c = document.getElementById("flake");
var flake = c.getContext("2d");

var canv = document.getElementById("myCanvas");
var ctx = canv.getContext("2d");

function ucoord(x, y, ox){
return(x + y*ox);
}

function zcoord(xc, c){
return(xc*4 + c);
}

function ufilt(step, fsize){
var len = (fsize*2+1) * (fsize*2+1);
var arr = [];
var x, y, z=0;
for(y=-fsize; y<=fsize; y++){
for(x=-fsize; x<=fsize; x++){
arr[z] = x + y*step;
z++;
}
}
return(arr);
}

function xfilt(img, filt, i){
var n = filt.length, acc = 0;
for(var j=0; j<n; j++){
acc += img[i + 4*filt[j]];
}
return(acc);
}

function genflake(flake, xy, cx, cy, iter){
var i, gx, gy, gz, ac;

var imData = flake.createImageData(20,20);

var f1 = ufilt(20, 1);

gz = ucoord(cx, cy, xy);
gx = zcoord(gz, 2); // blue chan
imData.data[gx] = 255;
imData.data[gx+1] = 255; // alpha

for(i=0;i<iter;i++){
gx = Math.floor(Math.random()*(xy-4)+2);
gy = Math.floor(Math.random()*(xy-4)+2);

gz = ucoord(gx, gy, xy);
gx = zcoord(gz, 2);

ac = xfilt(imData.data, f1, gx);

// alert(gx +" "+gy+" "+gz+" "+ac);

if(((ac > 0) + (ac < 255*3)) == 2){

imData.data[gx] = 255;
imData.data[gx+1] = 128; // alpha
}

if(((ac > 255*5) + (ac < 255*9)) == 2){

imData.data[gx] = 128;
imData.data[gx+1] = 64; // alpha
}

// flake.putImageData(imData,0,0);

}
return(imData);
}


var imgData = genflake(flake, 20, 10, 10, 400);

//var imgData=flake.createImageData(20,20);
//
//for (var i=0;i<imgData.data.length;i+=12)
//{
//imgData.data[i+0]=255;
//imgData.data[i+1]=0;
//imgData.data[i+2]=0;
//imgData.data[i+3]=64;
//}

flake.putImageData(imgData,0,0);

var imgData = flake.getImageData(0,0,20,20);

ctx.drawImage(c,0,0);

ctx.drawImage(c,5,5);

//ctx.putImageData(imgData,0,0);

//ctx.putImageData(imgData,11,10);

ctx.drawImage(c,10,10);

Name: Anonymous 2016-12-17 4:09

better include the html
<html>
<head>
</head>
<body bgcolor=#ccc>

<canvas id="flake" width="20" height="20" style="border:1px solid#333;"></canvas><br>

<canvas id="myCanvas" width="250" height="250" style="width:90%;height:90%;border:1px solid#999;"></canvas>

<script src="snow.js"></script>
</body>
</html>

Name: Anonymous 2016-12-17 7:38

>>13-15
Looks like shit compared to >>3

Name: Anonymous 2016-12-17 13:36

fair comment...

var c = document.getElementById("flake");
var flake = c.getContext("2d");

var canv = document.getElementById("myCanvas");
var ctx = canv.getContext("2d");

function ran(x){
return(Math.random()*2*x - x);
}

function abs(x){
var z = x>=0?x:-x;
return(z);
}

function ucoord(x, y, ox){
return(x + y*ox);
}

function zcoord(xc, c){
return(xc*4 + c);
}

function mapv(xa,xc, ya,yb,yc, za,zc, ra,rc){
var ny = (yb-ya)/(yc-ya);
var nz = za + (zc-za) * ny;
var nx = xa + (xc-xa) * ny;
var nr = ra + (rc-ra) * ny;
// alert("?!");
return([nx, nz, nr]);
}

function sqr(r){
return(r*r);
}

function dist(xa, ya){
return( Math.sqrt(sqr(xa) + sqr(ya)) );
}

function rot(x,y,ang){
var s = Math.sin(ang), c = Math.cos(ang);
return([y*s+x*c, -x*s+y*c]);
}

function stepv(f, v, ang){

// alert("O"+f.x + " " +f.y +" "+f.z);

var rad = dist(f.x - v[0], f.z - v[1]);

// alert("rad:"+rad);

var rr = abs(rad - v[2]) / v[2];

// alert("!R!" + rr);

var r3 = rot(f.x, f.z, ang*rr);

f.x = r3[0] + v[0];
f.z = r3[1] + v[1];
f.y += rr;

// alert("N"+f.x +" "+ f.y +" "+f.z);
}

function ufilt(step, fsize){
var len = (fsize*2+1) * (fsize*2+1);
var arr = [];
var x, y, z=0;
for(y=-fsize; y<=fsize; y++){
for(x=-fsize; x<=fsize; x++){
arr[z] = x + y*step;
z++;
}
}
return(arr);
}

function xfilt(img, filt, i){
var n = filt.length, acc = 0;
for(var j=0; j<n; j++){
acc += img[i + 4*filt[j]];
}
return(acc);
}

function genflake(xflake, xy, cx, cy, iter){
var i, gx, gy, gz, ac;

var imData = xflake.createImageData(xy,xy);

var f1 = ufilt(xy, 1);

gz = ucoord(cx, cy, xy);
gx = zcoord(gz, 2); // blue chan
imData.data[gx] = 255;
imData.data[gx+1] = 128; // alpha

for(i=0;i<iter;i++){
gx = Math.floor(Math.random()*(xy-4)+2);
gy = Math.floor(Math.random()*(xy-4)+2);

gz = ucoord(gx, gy, xy);
gx = zcoord(gz, 3);

ac = xfilt(imData.data, f1, gx);

// alert(gx +" "+gy+" "+gz+" "+ac);

if(((ac > 0) + (ac < 128*3)) == 2){

imData.data[gx-1] = 255;
imData.data[gx] = 128; // alpha
}

if(ac > 128*5){

imData.data[gx-1] = 255;
imData.data[gx] = 64; // alpha
}

// flake.putImageData(imData,0,0);

}
return(imData);
}

function flake_obj(x,y,z){
this.x = x;
this.y = y;
this.z = z;

this.vx = 0;
this.vy = 0;

this.vis = function(vp){
this.vx = this.x/(this.z+vp);
this.vy = this.y/(this.z+vp);
}
}

function vort_obj(xa,za,ya,ra, xb,zb,yb,rb, rv){
this.xa = xa;
this.ya = ya;
this.za = za;
this.ra = ra;
this.xb = xb;
this.yb = yb;
this.zb = zb;
this.rb = rb;
this.rv = rv;
this.wobble = function(am){
this.xa += ran(am);
this.xb += ran(am);
this.za += ran(am);
this.zb += ran(am);
}
}

function vortstep(lf, lv){
var n = lf.length;
var vmin = lv.ya, vmax = lv.yb;
// alert("?");
for(var i=0; i<n; i++){
var sf = lf[i];
if((sf.y >= lv.ya) + (sf.y<=lv.yb) == 2){
var xv = mapv(lv.xa,lv.xb, lv.ya,sf.y,lv.yb, lv.za,lv.zb, lv.ra,lv.rb);
// alert("?*");
stepv(sf, xv, lv.rv);
}
sf.y += 5;
}
// alert("*?");
}

function drawvort(){

vortstep(flakelist, vort);

for(var t=0;t<flakelist.length;t++){

var xf = flakelist[t];

xf.vis(200);

ctx.drawImage(c, xf.vx*20 + 500, xf.vy*20 + 300);

}

// ctx.putImageData(imgData, xf.vx + 500, xf.vy + 300);

// alert("!");

setTimeout(drawvort, 50);

}

var flakelist = [];

var vort = new vort_obj(00,00,10,10, 120,80,200,10, 1.15*(Math.PI/180));

for(var t=0;t<750;t++){

flakelist[t] = new flake_obj(20 + ran(130), 30 + ran(120), 50 + ran(100));

}

var imgData = genflake(flake, 20, 15, 10, 200);

//var imgData=flake.createImageData(20,20);
//
//for (var i=0;i<imgData.data.length;i+=12)
//{
//imgData.data[i+0]=255;
//imgData.data[i+1]=0;
//imgData.data[i+2]=0;
//imgData.data[i+3]=64;
//}

flake.putImageData(imgData,0,0);

//var imgData = flake.getImageData(0,0,20,20);

ctx.drawImage(c,0,0);

//ctx.drawImage(c,25,25);

//ctx.putImageData(imgData,0,0);

//ctx.putImageData(imgData,11,10);

ctx.drawImage(c,50,50);

drawvort();

//alert(rot(0,1,-180*(Math.PI/180)));

Name: Anonymous 2016-12-19 11:53

Something like

var c = document.getElementById("flake");
var flake = c.getContext("2d");

var canv = document.getElementById("myCanvas");
var ctx = canv.getContext("2d");

function flake_obj(x,y,z){
this.x = x;
this.y = y;
this.z = z;
this.vx = 0;
this.vy = 0;
this.vis = function(vp){
this.vx = this.x/(abs(this.z+vp)/10);
this.vy = this.y/(abs(this.z+vp)/10);
}
}

function vort_obj(xa,za,ya,ra, xb,zb,yb,rb, rv){
this.xa = xa;
this.ya = ya;
this.za = za;
this.ra = ra;
this.xb = xb;
this.yb = yb;
this.zb = zb;
this.rb = rb;
this.rv = rv;
this.wobble = function(am){
this.xa += ran(am);
this.xb += ran(am);
this.za += ran(am);
this.zb += ran(am);
}
}

function ran(x){
return(Math.random()*2*x - x);
}

function abs(x){
var z = x>=0?x:-x;
return(z);
}

function ucoord(x, y, ox){
return(x + y*ox);
}

function zcoord(xc, c){
return(xc*4 + c);
}

function sqr(r){
return(r*r);
}

function dist(xa, ya){
return( Math.sqrt(sqr(xa) + sqr(ya)) );
}

function rot(x,y,ang){
var s = Math.sin(ang), c = Math.cos(ang);
return([y*s+x*c, -x*s+y*c]);
}

function ufilt(step, fsize){
var len = (fsize*2+1) * (fsize*2+1);
var arr = [];
var x, y, z=0;
for(y=-fsize; y<=fsize; y++){
for(x=-fsize; x<=fsize; x++){
arr[z] = x + y*step;
z++;
}
}
return(arr);
}

function xfilt(img, filt, i){
var n = filt.length, acc = 0;
for(var j=0; j<n; j++){
acc += img[i + 4*filt[j]];
}
return(acc);
}

function genflake(xflake, xy, cx, cy, iter){
var i, gx, gy, gz, ac;

var imData = xflake.createImageData(xy,xy);

var f1 = ufilt(xy, 1);

gz = ucoord(cx, cy, xy);
gx = zcoord(gz, 2); // blue chan
imData.data[gx] = 255;
imData.data[gx+1] = 128; // alpha

for(i=0;i<iter;i++){
gx = Math.floor(Math.random()*(xy-4)+2);
gy = Math.floor(Math.random()*(xy-4)+2);

gz = ucoord(gx, gy, xy);
gx = zcoord(gz, 3);

ac = xfilt(imData.data, f1, gx);

// alert(gx +" "+gy+" "+gz+" "+ac);

if(((ac > 0) + (ac < 64*3)) == 2){

imData.data[gx-1] = 255;
imData.data[gx] = 64; // alpha
}

if(ac > 64*5){

imData.data[gx-1] = 0;
imData.data[gx] = 64; // alpha
}

// flake.putImageData(imData,0,0);

}
return(imData);
}

function mapv(xa,xc, ya,yb,yc, za,zc, ra,rc){
var ny = (yb-ya)/(yc-ya);
var nz = za + (zc-za) * ny;
var nx = xa + (xc-xa) * ny;
var nr = ra + (rc-ra) * ny;
// alert("?!");
return([nx, nz, nr]);
}

function stepv(f, v, ang){
// alert("O"+f.x + " " +f.y +" "+f.z);
// alert("rad:"+rad);
// alert("!R!" + rr);
// alert("N"+f.x +" "+ f.y +" "+f.z);
var rad = dist(f.x - v[0], f.z - v[1]);
var rr = (2*v[2]-rad)/v[2];
//rr = 0.05;
var r3 = rot(f.x - v[0], f.z - v[1], ang*rr);

f.x = r3[0] + v[0];
f.z = r3[1] + v[1];
f.y += rr/2;

}

function vortstep(lf, lv){
var n = lf.length;
var vmin = lv.ya, vmax = lv.yb;
// alert("?");
for(var i=0; i<n; i++){
var sf = lf[i];
//if((sf.y >= lv.ya) + (sf.y<=lv.yb) == 2){
var xv = mapv(lv.xa,lv.xb, lv.ya,sf.y,lv.yb, lv.za,lv.zb, lv.ra,lv.rb);
// alert("?*");
stepv(sf, xv, lv.rv);
//}else {
//if(sf.y > -200) sf.y -= 1;
//if(sf.y <= -200)
//sf = new flake_obj(200 + ran(50), 450 + ran(50), 800 + ran(100));

// }
}
// alert("*?");
}

function drawvort(){
vort.wobble(0.2);
vortstep(flakelist, vort);

for(var t=0;t<flakelist.length;t++){
var xf = flakelist[t];
xf.vis(30);
ctx.drawImage(c, xf.vx*10 + 400, xf.vy*-10 + 400);
}
setTimeout(drawvort, 10);
}

var flakelist = [];

var vort = new vort_obj(0,340,20,20, 0,340,200,100, -1.2*(Math.PI/180));

for(var t=0;t<250;t++){

flakelist[t] = new flake_obj( ran(200), 200+ran(100), 200+ran(100));

}

var imgData = genflake(flake, 30, 15, 15, 300);

//var imgData=flake.createImageData(20,20);
//
//for (var i=0;i<imgData.data.length;i+=12)
//{
//imgData.data[i+0]=255;
//imgData.data[i+1]=0;
//imgData.data[i+2]=0;
//imgData.data[i+3]=64;
//}

flake.putImageData(imgData,0,0);

//var imgData = flake.getImageData(0,0,20,20);

ctx.drawImage(c,0,0);

//ctx.drawImage(c,25,25);

//ctx.putImageData(imgData,0,0);

//ctx.putImageData(imgData,11,10);

ctx.drawImage(c,50,50);

drawvort();

//alert(rot(0,1,-180*(Math.PI/180)));

var gx = 10, gy = 0;

function rotetest(){

// //vortstep(flakelist, vort);

//for(var t=0;t<flakelist.length;t++){

//var xf = flakelist[t];

//xf.vis(200);

var tg = rot(gx, gy, 10*(Math.PI/180));

gx = tg[0]; gy = tg[1];

ctx.drawImage(c, gx + 100, gy + 100);

setTimeout(rotetest, 50);

}

//rotetest();

Name: Anonymous 2016-12-19 21:12

https://i.reddituploads.com/5a27c8cf0bd2442ba68e6e7269765631?fit=max&h=1536&w=1536&s=9110c59a91f13b896de50c35593b18f8

Name: Anonymous 2016-12-19 21:42

ITT overengineering

Name: Anonymous 2016-12-19 22:03

Snow is racist. Thread reported.

Name: Anonymous 2016-12-19 22:10

>>21
Agreed. Diverse people like Africans cannot survive in snowy climates. This thread enforces the patriarchal cis-white power structure. I suggest it be reported to Madame President's DoD (Department of Diversity), having the admin forced at gun point to remove it for #Her.

Name: Anonymous 2016-12-20 5:04

biggest negro penis

Name: Anonymous 2016-12-31 22:31

So who won?

Name: Anonymous 2017-01-02 1:43

I got the overengineered ITT award so i'm happy
Don't change these.
Name: Email:
Entire Thread Thread List
All trademarks and copyrights on this site are owned by their respective parties. All comments and posts are the responsibility of their own posters.
- Tinychan + 2ch Mode + RSS -