102 lines
3.0 KiB
PHP
102 lines
3.0 KiB
PHP
<style type="text/css">
|
|
* {margin: 0; padding: 0}
|
|
body {background: #000;overflow:hidden;}
|
|
canvas {display: block;}
|
|
.matrix {
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
justify-content: center;
|
|
text-align: center;
|
|
font-family: monospace;
|
|
}
|
|
.matrix > .inner {
|
|
position: absolute;
|
|
color: white;
|
|
top: 40%;
|
|
}
|
|
.inner {
|
|
background: #000000b5;
|
|
padding: 5px;
|
|
}
|
|
|
|
#bluepill a {
|
|
width: 26px;
|
|
height: 10px;
|
|
display: inline-block;
|
|
color: blue;
|
|
background: blue;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
#redpill a {
|
|
width: 26px;
|
|
height: 10px;
|
|
display: inline-block;
|
|
color: red;
|
|
background: red;
|
|
border-radius: 5px;
|
|
}
|
|
</style>
|
|
<div class="matrix">
|
|
<div class="inner">
|
|
<h3><p><b><i>Are you a slave {{Auth::user()->username}} ?</i></b></p></h3>
|
|
<br>
|
|
<p>Take control over your chats, leave Discord for good!</p>
|
|
<p>Join [matrix] today!</p>
|
|
<p>Why should you consider either running a [matrix] synapse yourself or start using someone elses:</p>
|
|
<p>Discord is evil, it took away the freedom you and I deserve, it makes you a slave to their services,<br> makes you obey their rules, includes you in a unwanted botnet where you have no freedom at all!</p>
|
|
<p><a target="_blank" href="/22424">Why you shouldn't use Discord</a></p>
|
|
<p>It's time to break free {{Auth::user()->username}}</p>
|
|
<p>Choose your fate</p>
|
|
<span id="bluepill"><a href="https://spyware.neocities.org/articles/discord.html"></a></span> <span id="redpill"><a href="https://github.com/matrix-org/synapse" target="_blank"></a></span>
|
|
<p><code>#w0bm:totally.rip</code></p>
|
|
<br>
|
|
<p><small>We are happy to help if you have any trouble setting up your synapse</small></p>
|
|
</div>
|
|
</div>
|
|
<canvas></canvas>
|
|
<audio src="/clubbed.mp3" autoplay loop></audio>
|
|
<script type="text/javascript">
|
|
// Initialising the canvas
|
|
var canvas = document.querySelector('canvas'),
|
|
ctx = canvas.getContext('2d');
|
|
|
|
// Setting the width and height of the canvas
|
|
canvas.width = window.innerWidth;
|
|
canvas.height = window.innerHeight;
|
|
|
|
// Setting up the letters
|
|
var letters = 'ABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZ';
|
|
letters = letters.split('');
|
|
|
|
// Setting up the columns
|
|
var fontSize = 10,
|
|
columns = canvas.width / fontSize;
|
|
|
|
// Setting up the drops
|
|
var drops = [];
|
|
for (var i = 0; i < columns; i++) {
|
|
drops[i] = 1;
|
|
}
|
|
|
|
// Setting up the draw function
|
|
function draw() {
|
|
ctx.fillStyle = 'rgba(0, 0, 0, .1)';
|
|
ctx.fillRect(0, 0, canvas.width, canvas.height);
|
|
for (var i = 0; i < drops.length; i++) {
|
|
var text = letters[Math.floor(Math.random() * letters.length)];
|
|
ctx.fillStyle = '#0f0';
|
|
ctx.fillText(text, i * fontSize, drops[i] * fontSize);
|
|
drops[i]++;
|
|
if (drops[i] * fontSize > canvas.height && Math.random() > .95) {
|
|
drops[i] = 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
// Loop the animation
|
|
setInterval(draw, 33);
|
|
</script>
|