Browser resize

[paul-piro]

Hey guys

Thank you for this project, it's great to see that rain effect in browser
Is there any chance to fix the web browser resize?

Thank you

[excalith]

Hey Paul,

I am also planning to fix that on my spare time. Haven't tried this yet, but sounds promising:
http://webglfundamentals.org/webgl/webgl-resize-canvas-viewport.html
Might come in handy!

[pelikan42]

If you want a resize for now, you can use a little hack ;)

update the init function in index.js file and remplace :

canvas.width = window.innerWidth * dpi;
canvas.height = window.innerHeight * dpi;
canvas.style.width = window.innerWidth + "px";
canvas.style.height = window.innerHeight + "px";

by a fixed size fo exemple :

canvas.width = 1366 * dpi;
canvas.height = 768 * dpi;
canvas.style.width = 1366 + "px";
canvas.style.height = 768 + "px";

and after juste listen th event resize and update canvas size
For exemple with a jquery script :

var ratioMainImg = 1366 / 768 ;
$("#container").width($(window).outerWidth());
$("#container").height($("#container").width() / ratioMainImg);
if($("#container").height() <= $(window).outerHeight())
{
    $("#container").height($(window).outerHeight());
    $("#container").width($("#container").height() * ratioMainImg);
}

$("#container").css("left", $(window).outerWidth()*0.5 - $("#container").width()*0.5);
$("#container").css("top", $(window).outerHeight()*0.5 - $("#container").height()*0.5);

... okay, It's not the solution but easy to set.

Thank you for your work, it's a perfect rain fx ;)

[paul-piro]

It's working thank you for your code!