server ver

resources/views/layout3/layout.blade.php

@@ -44,10 +44,6 @@
         <button id="layout1">w0bm.com</button>
         <br>
         <button id="layout2">Njum</button>
-        <br>
-        <button id="layout4">nojsz0mbie</button>
-        <br>
-        <button id="layout5">m0bile</button>
     </div>
 </ul>
 </li>

resources/views/layout3/matrix.blade.php

@@ -0,0 +1,100 @@
+<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>You are 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>It's time to break free {{Auth::user()->username}}</p>
+    <p>Choose your fate</p>
+    <span id="bluepill"><a href="https://discordapp.com/app"></a></span> <span id="redpill"><a href="https://github.com/matrix-org/synapse" target="_blank"></a></span>
+    <p><code>#!w0bm:f0ck.it</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>