alphaland snow :)
This commit is contained in:
parent
c34c18a46e
commit
b812cec906
|
|
@ -5231,7 +5231,8 @@ function getCSS($studio=false)
|
||||||
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
|
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
|
||||||
<script type="text/javascript" src="https://www.alphaland.cc/alphaland/js/bootstrap.min.js?version='.$GLOBALS['jsversion'].'"></script>
|
<script type="text/javascript" src="https://www.alphaland.cc/alphaland/js/bootstrap.min.js?version='.$GLOBALS['jsversion'].'"></script>
|
||||||
<script type="text/javascript" src="https://www.alphaland.cc/alphaland/js/utilities.js?version='.$GLOBALS['jsversion'].'"></script>'; //alphaland utilities js
|
<script type="text/javascript" src="https://www.alphaland.cc/alphaland/js/utilities.js?version='.$GLOBALS['jsversion'].'"></script>
|
||||||
|
<script src="https://www.alphaland.cc/alphaland/js/snowfall/canvas-snow.js?version='.$GLOBALS['jsversion'].'"></script>';
|
||||||
|
|
||||||
}
|
}
|
||||||
//end theme stuff
|
//end theme stuff
|
||||||
|
|
|
||||||
|
|
@ -26,7 +26,7 @@ class page_handler {
|
||||||
<title>%s</title>
|
<title>%s</title>
|
||||||
%s
|
%s
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body id="alphaland-main-body">
|
||||||
%s
|
%s
|
||||||
%s
|
%s
|
||||||
%s
|
%s
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,21 @@
|
||||||
|
# The MIT License (MIT)
|
||||||
|
|
||||||
|
Copyright (c) 2015 Eliot Fallon and contributors
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||||
|
of this software and associated documentation files (the "Software"), to deal
|
||||||
|
in the Software without restriction, including without limitation the rights
|
||||||
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||||
|
copies of the Software, and to permit persons to whom the Software is
|
||||||
|
furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in
|
||||||
|
all copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||||
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||||
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||||
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||||
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||||
|
THE SOFTWARE.
|
||||||
|
|
@ -0,0 +1,137 @@
|
||||||
|
// jshint devel:true
|
||||||
|
'use strict';
|
||||||
|
/*
|
||||||
|
* A JS plugin which will apply snowfall to an element. Gives the element a class called fallback if canvas isn't supported.
|
||||||
|
*/
|
||||||
|
|
||||||
|
var requestAnimationFrame =
|
||||||
|
window.requestAnimationFrame ||
|
||||||
|
window.mozRequestAnimationFrame ||
|
||||||
|
window.msRequestAnimationFrame ||
|
||||||
|
window.oRequestAnimationFrame ||
|
||||||
|
function(callback) {
|
||||||
|
return setTimeout(callback, 1);
|
||||||
|
};
|
||||||
|
|
||||||
|
function Blizzard(parentId) {
|
||||||
|
//Set up required variables
|
||||||
|
var parent = document.getElementById(parentId);
|
||||||
|
parent.style.position = "relative";
|
||||||
|
|
||||||
|
//Build canvas and prepend it
|
||||||
|
var c = document.createElement("canvas");
|
||||||
|
c.className = c.className + " falling-snow";
|
||||||
|
parent.insertBefore(c, parent.firstChild);
|
||||||
|
c.style.position = 'absolute';
|
||||||
|
|
||||||
|
//Set up initial vars
|
||||||
|
var W = (parent)? parent.clientWidth : window.innerWidth;
|
||||||
|
var H = (parent)? parent.clientHeight : window.innerHeight;
|
||||||
|
var numFlakes =0;
|
||||||
|
var flakes = [];
|
||||||
|
var ctx = c.getContext("2d");
|
||||||
|
//
|
||||||
|
|
||||||
|
//Test for canvas
|
||||||
|
if(!!(c.getContext && c.getContext('2d'))) {
|
||||||
|
//Canvas exists
|
||||||
|
setPositions();
|
||||||
|
drawSnowflakes();
|
||||||
|
} else {
|
||||||
|
//Add fallback class if there's no canvas available
|
||||||
|
c.className = c.className + " fallback";
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
//Give each snowflake a random position
|
||||||
|
function setPositions() {
|
||||||
|
//canvas dimensions
|
||||||
|
W = (parent)? parent.clientWidth : window.innerWidth;
|
||||||
|
H = (parent)? parent.clientHeight : window.innerHeight;
|
||||||
|
|
||||||
|
c.width = W;
|
||||||
|
c.height = H;
|
||||||
|
|
||||||
|
//This varies the number of snowflakes showing dependent on size of the element
|
||||||
|
numFlakes = Math.floor(W / 25);
|
||||||
|
ctx.clearRect(0, 0, W, H);
|
||||||
|
|
||||||
|
//snowflake flakes
|
||||||
|
flakes = [];
|
||||||
|
for (var i = 0; i < numFlakes; i++) {
|
||||||
|
flakes.push({
|
||||||
|
x: Math.random() * W, //x-coordinate
|
||||||
|
y: Math.random() * H, //y-coordinate
|
||||||
|
r: Math.random() * 9 + 1 //radius
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
window.addEventListener("resize", setPositions);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
//Long function which we could tidy up
|
||||||
|
function drawSnowflakes() {
|
||||||
|
ctx.clearRect(0, 0, W, H);
|
||||||
|
|
||||||
|
ctx.fillStyle = "rgba(255, 255, 255, 0.8)";
|
||||||
|
ctx.beginPath();
|
||||||
|
|
||||||
|
for (var i = 0; i < numFlakes; i++) {
|
||||||
|
|
||||||
|
var p = flakes[i];
|
||||||
|
ctx.moveTo(p.x, p.y);
|
||||||
|
ctx.arc(p.x, p.y, p.r, 0, Math.PI * 2, true);
|
||||||
|
|
||||||
|
}
|
||||||
|
ctx.fill();
|
||||||
|
|
||||||
|
var angle = 0;
|
||||||
|
|
||||||
|
for (var i = 0; i < numFlakes; i++) {
|
||||||
|
|
||||||
|
angle += 0.01;
|
||||||
|
|
||||||
|
var p = flakes[i];
|
||||||
|
//Updating X and Y coordinates
|
||||||
|
p.y += (Math.cos(angle) + 0.5 + p.r) / 8;
|
||||||
|
p.x += Math.sin(angle) * 2;
|
||||||
|
|
||||||
|
|
||||||
|
//Checks if flakes has left screen
|
||||||
|
if (p.x > W + 5 || p.x < -5 || p.y > H) {
|
||||||
|
|
||||||
|
if (i % 3 > 0) {
|
||||||
|
|
||||||
|
flakes[i] = {
|
||||||
|
x: Math.random() * W,
|
||||||
|
y: -10,
|
||||||
|
r: p.r,
|
||||||
|
d: p.d
|
||||||
|
};
|
||||||
|
|
||||||
|
} else {
|
||||||
|
//If the flake has exited from the right
|
||||||
|
if (p.x > W) {
|
||||||
|
//Enter from the left
|
||||||
|
flakes[i] = {
|
||||||
|
x: -5,
|
||||||
|
y: Math.random() * H,
|
||||||
|
r: p.r
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
//Enter from the right
|
||||||
|
flakes[i] = {
|
||||||
|
x: W + 5,
|
||||||
|
y: Math.random() * H,
|
||||||
|
r: p.r
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
requestAnimationFrame(drawSnowflakes);
|
||||||
|
};
|
||||||
|
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue