<div style="position: absolute; left: -50px; top: 0px; width:500px; height:100px; background-color: none;"><center>(transition:"dissolve") + (transition-time: 6s)[ (text-style: "smear")[everything is fine] ]
(transition:"dissolve") + (transition-time: 9s)[ [[start]] ]
<script>
let verly =null
let mouse =null
let mBehavior =null
let particles =null
// Made with Zdog
// create illo
let illo = new Zdog.Illustration({
element: '.zdog-canvas',
});
// add circle
let ring = new Zdog.Ellipse({
addTo: illo,
diameter: 375,
stroke: 5,
color: '#ffffff',
});
let ring2 = new Zdog.Ellipse({
addTo: illo,
diameter: 300,
stroke: 10,
color: '#ffffff',
});
let ring3 = new Zdog.Ellipse({
addTo: illo,
diameter: 200,
stroke: 20,
color: '#ffffff',
});
let ring4 = new Zdog.Ellipse({
addTo: illo,
diameter: 100,
stroke: 30,
color: '#ffffff',
});
function animateZ() {
// rotate illo each frame
ring.rotate.y += 0.03;
ring2.rotate.x += 0.03;
ring4.rotate.y -= 0.03;
illo.updateRenderGraph();
// animate next frame
requestAnimationFrame( animateZ );
}
</script>{
<head><meta charset="UTF-8"><style id="webmakerstyle">
.zdog-canvas {
background: none;
}
</style></head>
<div style="position: absolute; z-index: 0; left: 0px; top: -378px; width:400px; height:400px;">
<canvas class="zdog-canvas" width="400" height="400"></canvas>
</div>
<canvas id="c"></canvas>
}{
<script>
illo.setElement('.zdog-canvas');
animateZ();
canvas = document.getElementById("c");
ctx = canvas.getContext("2d");
width = 400;
height = 400;
NUM_PARTICLES = 450;
canvas.width = width;
canvas.height = height;
verly = new Verly(16, canvas, ctx);
mouse = new Point(0, 0).setForceAcc(-30).setRadius(100);
mBehavior = 2;
window.addEventListener("mousemove", e => {
if (e.altKey) addParticles(e.offsetX, e.offsetY);
mouse.pos.setXY(e.offsetX, e.offsetY);
});
particles = new Entity(16, verly);
function addParticles(x, y) {
particles
.addPoint(x, y)
.setRadius(10)
.setGravity(new Vector(0, 0))
.setColor('#000000');
}
for (let i = 0; i < NUM_PARTICLES; i++) {
addParticles(random(width), random(height));
}
particles = verly.joinEntities(particles);
function animate() {
ctx.clearRect(0, 0, width, height);
for (let i = 0; i < particles.points.length; i++) {
for (let j = 0; j < particles.points.length; j++) {
if (particles.points[i] !== particles.points[j]) {
particles.points[j].resolveBehaviors(particles.points[i], 20, 3);
}
}
particles.points[i].resolveBehaviors(mouse, mouse.radius, mBehavior);
}
verly.update();
verly.render();
requestAnimationFrame(animate);
}
animate();
</script>}
<div style="position: absolute; left: -50px; top: 0px; width:500px; height:100px; background-color: none;"><center>(transition:"dissolve") + (transition-time: 6s)[hey]
(transition:"dissolve") + (transition-time: 9s)[ [[hey]] ]<div style="position: absolute; left: -50px; top: 0px; width:500px; height:100px; background-color: none;"><center>(transition:"dissolve") + (transition-time: 6s)[are you okay?]
(transition:"dissolve") + (transition-time: 9s)[ [[I'm fine]] ]</center>
(text-style: "shudder")[ [[I've been better]] ]
<div style="position: absolute; z-index: 0; left: -50px; top: 0px; width:500px; height:100px; background-color: none;">
(color: red)[(text-style: "bold")[(text-style: "shudder")[ ⠕ ]]]<div style="position: absolute; left: -50px; top: 0px; width:500px; height:100px; background-color: none;"><center>(transition:"dissolve") + (transition-time: 6s)[(text-style: "bold")[...]]
(transition:"dissolve") + (transition-time: 9s)[ [[why?]] ]<div style="position: absolute; left: -50px; top: 0px; width:500px; height:100px; background-color: none;"><center>(transition:"dissolve") + (transition-time: 6s)[What's wrong?]
(transition:"dissolve") + (transition-time: 9s)[(link: "
I'm not sure")[(link: "There's nothing //wrong// but I just can't seem to get going most of the time")[ [[It's all I can do most days to eat and wear clean clothes->I'm not sure exactly]] ] ] ]<div style="position: absolute; left: -50px; top: 0px; width:500px; height:100px; background-color: none;"><center>(transition:"dissolve") + (transition-time: 6s)[You've seemed down lately.]
(transition:"dissolve") + (transition-time: 9s)[ [[I'm just tired :)]]]</center>
(text-style: "shudder")[ [[I've been better]] ]
<div style="position: absolute; z-index: 0; left: -50px; top: 0px; width:500px; height:100px; background-color: none;">
(color: red)[(text-style: "bold")[(text-style: "shudder")[ ⠕ ]]]<div style="position: absolute; left: -50px; top: 0px; width:500px; height:100px; background-color: none;"><center>(transition:"dissolve") + (transition-time: 6s)[ah, that must be it]
(transition:"dissolve") + (transition-time: 9s)[ [[Thanks for checking->thanks for playing]]]</center>
(text-style: "shudder")[ [[I've been better]] ]
<div style="position: absolute; z-index: 0; left: -50px; top: 0px; width:500px; height:100px; background-color: none;">
(color: red)[(text-style: "bold")[(text-style: "shudder")[ ⠕ ]]]<div style="position: absolute; left: -50px; top: 0px; width:500px; height:100px; background-color: none;"><center>(transition:"dissolve") + (transition-time: 6s)[how can I help?]
(transition:"dissolve") + (transition-time: 9s)[ [[this helps->thanks for playing]] ]
<div style="position: absolute; left: -50px; top: 0px; width:500px; height:100px; background-color: none;"><center>(transition:"dissolve") + (transition-time: 4.5s)[ ''Thanks for playing!
A game by A.B.W. tell me you're fine on twitter @breaknbaker''
//check in on your friends
no one is an island// ]