Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html>
- <head>
- <title>401 | Authorization Required</title>
- <link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
- <link href='http://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
- <meta name="theme-color" content="#673AB7">
- <link rel="shortcut icon" href="http://rooday.com/assets/favicons/favicon.ico">
- <style>a,a:focus,a:hover{text-decoration:none}body,html{text-align:center;color:#ccc;background-color:#F1F2EF;font-size:1rem;margin:0;padding:0;overflow:hidden}#content{margin:45vh auto}p{font-size:1.5rem;font-family:'Open Sans',sans-serif}h1,h2{font-family:Montserrat,serif}h1{font-size:8rem;margin:0}h2{font-size:2.5rem}a{color:#ccc;font-family:'Open Sans',sans-serif;-webkit-transition:color .5s ease;-moz-transition:color .5s ease;-o-transition:color .5s ease}a:hover{color:#aaa}#wrapper{position:fixed;top:0;width:100vw;height:100vh;background-image:url(http://rooday.com/assets/images/space.jpg);border-image-repeat:repeat}.stars{position:absolute;margin:0;padding:0;left:0;top:0}canvas{pointer-events:none}</style>
- <head>
- <body>
- <div id="wrapper">
- <div id="content">
- <h1>Whoa</h1>
- <h2>This looks like a 401</h2>
- <p>You're going to have to log in buddy.</p>
- <a href="https://rooday.com/">Back to homepage →</a>
- </div>
- </div>
- <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
- <script>function sign(){return Math.random()>.5?1:-1}var Star=function(t){this.space=t,this.speed=1,this.velocity=1,this.size=1,this.growth=3,this.vec=[sign()*Math.random(),sign()*Math.random()],this.x=Math.floor(t.c_width/2)+5e4*this.vec[0],this.y=Math.floor(t.c_height/2)+5e4*this.vec[1]};Star.prototype.update=function(){this.x+=this.speed*this.vec[0],this.y+=this.speed*this.vec[1],this.speed+=this.velocity,this.size+=this.growth,(Math.abs(this.x)>this.space.c_width+100||Math.abs(this.y)>this.space.c_height+100)&&(this.space.population.splice(this.space.population.indexOf(this),1),this.space.populate(1))};var Space=function(t){this.canvas=document.createElement("canvas"),this.ctx=this.canvas.getContext("2d"),this.c_width=window.innerWidth,this.c_height=window.innerHeight,this.canvas.width=this.c_width,this.canvas.height=this.c_height,this.ctx.fillStyle="#ffffff",this.ctx.strokeStyle="#ffffff";var i=document.getElementById("wrapper");this.canvas.className="stars",i.appendChild(this.canvas),this.population=[],this.populate(t),setInterval(this.update.bind(this),10)};Space.prototype={constructor:Space,populate:function(t){for(var i=0;t>i;i++)this.population.push(new Star(this))},update:function(){this.population.forEach(function(t,i){t.update()}),this.redraw()},redraw:function(){var t=this.ctx;Math.floor(this.c_width/2),Math.floor(this.c_width/2);t.save(),t.setTransform(1,0,0,1,0,0),t.clearRect(0,0,this.c_width,this.c_height),this.population.forEach(function(i,s){t.beginPath(),t.moveTo(i.x,i.y),t.lineTo(i.x-i.vec[0]*i.size,i.y-i.vec[1]*i.size),t.stroke()}),t.restore()}};</script>
- <script>
- $(document).ready(function(){
- $("#content").css("margin-top", (($(window).height() / 2) - ($("#content").height() / 2)) + "px");
- $('body').mousemove(function(e){
- var x = -(e.pageX + this.offsetLeft) / 20;
- var y = -(e.pageY + this.offsetTop) / 20;
- $("#wrapper").css('background-position', x + 'px ' + y + 'px');
- });
- var sp = new Space(1000);
- });
- </script>
- </body>
- <html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
