Last active
September 25, 2015 23:58
-
-
Save adammw/1006144 to your computer and use it in GitHub Desktop.
Facebook Nyan Cat... Inject with `javascript:s=document.createElement('script');s.src='https://bit.ly/110kHu0';document.body.appendChild(s);`
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Facebook Nyan Cat | |
* Works only in Webkit browsers | |
* Uses images + sound from http://nyan.cat | |
*/ | |
var NyanCat = (function NyanCatFacebook() { | |
const updateInterval = 10; | |
var nyan, rainbows, sound; | |
var loadingPosts = false; | |
var top = 0; | |
var interval = null; | |
function startScroll() { | |
interval = setInterval(scrollScreen, updateInterval); | |
}; | |
function stopScroll() { | |
clearInterval(interval); | |
}; | |
var ExternalInterface = new (function NyanCat() { | |
this.start = startScroll; | |
this.stop = stopScroll; | |
this.mute = function() { sound.pause(); }; | |
this.unmute = function() { sound.play(); }; | |
})(); | |
function flipScreen() { | |
var html = document.querySelector('html'); | |
html.style.width = window.innerHeight + 'px'; | |
html.style.height = window.innerWidth + 'px'; | |
html.style.webkitTransform = 'rotate(-90deg) translate(0, -' + window.innerHeight + 'px)'; | |
html.style.webkitTransformOrigin = 'top right'; | |
html.style.webkitFontSmoothing = 'subpixel-antialiased'; | |
html.style.overflow = 'hidden'; | |
document.body.style.overflowY = 'hidden'; | |
//document.body.style.zoom = '90%'; | |
} | |
function scrollScreen() { | |
document.body.style.marginTop = -(top+=5) + 'px'; | |
if (top >= (document.body.offsetHeight - window.innerWidth - 500) && !loadingPosts) { | |
console.log('loading older posts'); | |
UIIntentionalStream.instance && UIIntentionalStream.instance.loadOlderPosts(); | |
loadingPosts = true; | |
setTimeout(function(){loadingPosts = false;}, 2000); | |
} | |
} | |
function rainbowShift() { | |
rainbows.classList.toggle('shift'); | |
} | |
function injectNyan() { | |
nyan = document.createElement('img'); | |
nyan.src = 'http://nyan.cat/cats/original.gif'; | |
nyan.style.position = 'fixed'; | |
nyan.style.top = '670px'; //(window.innerWidth/2) + 'px'; | |
nyan.style.right = '140px'; //(window.innerHeight/4) - (432/2) + 'px'; | |
nyan.style.webkitTransform = 'rotate(90deg)'; | |
nyan.style.zIndex = 10000; | |
document.body.appendChild(nyan); | |
} | |
function injectRainbows() { | |
rainbows = document.createElement('div'); | |
rainbows.className = 'rainbows'; | |
rainbows.innerHTML = '<div class="wrapper"><div class="rainbow frame-1"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-2"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-3"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-4"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-5"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-6"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-1"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-2"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-3"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-4"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-5"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-6"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-1"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-2"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-3"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-4"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-5"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-6"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-1"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-2"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-3"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-4"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-5"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-6"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-1"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-2"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-3"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-4"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-5"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-6"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-1"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-2"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-3"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-4"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-5"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-6"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-1"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-2"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-3"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-4"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-5"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-6"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-1"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-2"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-3"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-4"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-5"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div><div class="rainbow frame-6"><div class="wave wave-1"></div><div class="wave wave-2"></div><div class="wave wave-3"></div><div class="wave wave-4"></div><div class="wave wave-5"></div><div class="wave wave-6"></div><div class="wave wave-7"></div></div></div>'; | |
rainbows.style.width = (window.innerWidth/2) + 100 + 'px'; | |
document.body.appendChild(rainbows); | |
var style = document.createElement('style'); | |
style.innerHTML = '.rainbow{font-size:16em;float:left;position:relative}.rainbow .wave{height:1em;width:3.5em}.rainbow .wave-1{background:red}.rainbow .wave-2{background:#ffa500}.rainbow .wave-3{background:yellow}.rainbow .wave-4{background:green}.rainbow .wave-5{background:blue}.rainbow .wave-6{background:#4b0082}.rainbow .wave-7{background:#ee82ee}.rainbows{position:fixed;top:0;left:100%;overflow:hidden;height:145em;font-size:1px;-webkit-transform:rotate(90deg);margin-left:-180px;-webkit-transform-origin:top left;z-index:100}.rainbows .wrapper{width:10000px}.rainbows .rainbow.frame-1{top:.5em}.rainbows .rainbow.frame-2{top:1em}.rainbows .rainbow.frame-3{top:1.5em}.rainbows .rainbow.frame-4{top:2em}.rainbows .rainbow.frame-5{top:1.5em}.rainbows .rainbow.frame-6{top:1em}.rainbows.shift .rainbow.frame-1{top:1.5em}.rainbows.shift .rainbow.frame-2{top:1em}.rainbows.shift .rainbow.frame-3{top:.5em}.rainbows.shift .rainbow.frame-4{top:0}.rainbows.shift .rainbow.frame-5{top:.5em}.rainbows.shift .rainbow.frame-6{top:1em}'; | |
document.body.appendChild(style); | |
setInterval(rainbowShift, 400); | |
} | |
function startAudio() { | |
sound = new Audio("http://api.ning.com:80/files/3zmSvhA*3jKxFJj1I5uh5dp5oCynyyMksQjwS3JWWQNlriTzDzX61KtlFnuQtx-hEmV7NdqVgofmZvh7cXOX-UVJ47m1SR4a/nyanlooped.mp3"); | |
sound.loop = true; | |
sound.autoplay = true; | |
} | |
function init() { | |
if (!/webkit/i.test(navigator.userAgent)) { | |
alert('This script only works with Google Chrome'); | |
} else { | |
flipScreen(); | |
injectNyan(); | |
injectRainbows(); | |
startAudio(); | |
startScroll(); | |
} | |
} | |
init(); | |
return ExternalInterface; | |
})(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment