New wiki-page
mNo edit summary |
mNo edit summary |
||
Line 1: | Line 1: | ||
/* Any JavaScript here will be loaded for all users on every page load. */ | /* Any JavaScript here will be loaded for all users on every page load. */ | ||
allStates.on("click", "*", function() { | |||
allStates.find(".on").removeClass("on"); | |||
$(this).addClass("on"); | |||
}); | |||
//AUTHOR: SATKAR DHAKAL. YOU ARE FREE TO USE, EDIT AND MODIFY THE CODE. | //AUTHOR: SATKAR DHAKAL. YOU ARE FREE TO USE, EDIT AND MODIFY THE CODE. |
Revision as of 21:31, 21 July 2017
/* Any JavaScript here will be loaded for all users on every page load. */ allStates.on("click", "*", function() { allStates.find(".on").removeClass("on"); $(this).addClass("on"); }); //AUTHOR: SATKAR DHAKAL. YOU ARE FREE TO USE, EDIT AND MODIFY THE CODE. var context=document.getElementById("canvas"); var image=document.getElementsByClassName('picture')[0]; var canvasWidth=context.width; var canvasHeight= context.height; var imageWidth=image.width; var imageHeight= image.height; var fogCount=10; var fog=new Image(); var picture=new Image(); var fogs=[]; var FPS=20; var maxVel=1; fog.src = "https://s27.postimg.org/57e6pz0xf/fog.png"; picture.id = "pic"; picture.src=image.src; function fogPart(){ this.x=0; this.y=0; this.xVel=0; this.yVel=0; this.radius=5; this.draw=function(){ context.drawImage(this.image,this.x-100,this.y-100); }; this.update=function(){ this.x += this.xVel; this.y += this.yVel; if (this.x >= canvasWidth) { this.xVel = -this.xVel; this.x = canvasWidth; } else if (this.x <= 0) { this.xVel = -this.xVel; this.x = 0; } if (this.y >= canvasHeight) { this.yVel = -this.yVel; this.y = canvasHeight; } else if (this.y <= 0) { this.yVel = -this.yVel; this.y = 0; } }; this.setImage=function(img){ this.image=img; }; this.setPos = function(x, y) { this.x = x; this.y = y; }; this.setVel = function(x, y) { this.xVel = x; this.yVel = y; }; }; function random(min, max){ return Math.random() * (max - min) + min; } function init() { if (canvas.getContext) { context = canvas.getContext('2d'); for(var i=0; i < fogCount; i++){ var fog = new fogPart(); fog.setPos(random(0, canvasWidth), random(0, canvasHeight)); fog.setVel(random(-maxVel, maxVel), random(-maxVel, maxVel)); fogs.push(fog); } } else { alert("UN-supported browser"); } }; fog.onload=function(){ fogs.forEach(function(part){ part.setImage(fog); }); }; function draw(){ context.drawImage( picture, (canvasWidth / 2) - image.width / 2, (canvasHeight / 2)- image.height / 2, canvasWidth , canvasWidth * image.naturalHeight / image.naturalWidth ); context.globalAlpha = 0.09; fogs.forEach(function(part) { part.draw(); }); }; function update(){ fogs.forEach(function(part){ part.update(); }); }; init(); if (context) { setInterval(function() { update();draw(); }, 1000 / FPS); }