bengl · December 13, 2012 10:00 · atk · Dec 14, 2012 · Cjmadog · Jan 12, 2024
diff --git a/README.md b/README.md
diff --git a/annotated.js b/annotated.js
 function(){
  var a="-webkit-", // vendor prefix for Chrome, Safari
      b='transform:rotate(1turn);', // the CSS for rotating 360deg
      c='transition:4s;'; // the CSS for making the rotation last 4 seconds
      
  document.head.innerHTML // adding a style tag to the <head>
     += '<style>body{' + a + b + a + c + b + c // the combined CSS in the style tag
     
     /* 
     This actually generates a string that looks like: 
     "<style>body{-webkit-transform:rotate(1turn);-webkit-transition:4s;transform:rotate(1turn);transition(4s);"
     Which obviously is lacking a closing tag and a closing bracket, but luckily browsers are smart enough to figure this out.
     It also only has vendor prefixes for WebKit. That's because it turns out Firefox and Opera work just fine without the prefixes here.
     */
 }
diff --git a/index.js b/index.js
 function(){var a="-webkit-",b='transform:rotate(1turn);',c='transition:4s;';document.head.innerHTML+='<style>body{'+a+b+a+c+b+c}
diff --git a/LICENSE.txt b/LICENSE.txt
            DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
                    Version 2, December 2004

 Copyright (C) 2011 YOUR_NAME_HERE <YOUR_URL_HERE>

 Everyone is permitted to copy and distribute verbatim or modified
 copies of this license document, and changing it is allowed as long
 as the name is changed.

            DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
   TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION

  0. You just DO WHAT THE FUCK YOU WANT TO.
diff --git a/package.json b/package.json
 {
  "name": "doABarrelRoll",

  "description": "This rotates the page 360deg, just like Google's Barrel Roll easter egg.",

  "keywords": [
    "animation",
    "css3"
  ]
 }
diff --git a/test.html b/test.html
 <!DOCTYPE html> 
 <title>Foo</title>
 <h1>This content should do a barrel roll (after 5s so you can read this).</h1>
 <script>

  var doABarrelRoll = function(){var a="-webkit-",b='transform:rotate(1turn);',c='transition:4s;';document.head.innerHTML+='<style>body{'+a+b+a+c+b+c}

  doABarrelRoll();
 </script>
	function(){
	var a="-webkit-", // vendor prefix for Chrome, Safari
	b='transform:rotate(1turn);', // the CSS for rotating 360deg
	c='transition:4s;'; // the CSS for making the rotation last 4 seconds

	document.head.innerHTML // adding a style tag to the <head>
	+= '<style>body{' + a + b + a + c + b + c // the combined CSS in the style tag

	/*
	This actually generates a string that looks like:
	"<style>body{-webkit-transform:rotate(1turn);-webkit-transition:4s;transform:rotate(1turn);transition(4s);"
	Which obviously is lacking a closing tag and a closing bracket, but luckily browsers are smart enough to figure this out.
	It also only has vendor prefixes for WebKit. That's because it turns out Firefox and Opera work just fine without the prefixes here.
	*/
	}
	DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
	Version 2, December 2004

	Copyright (C) 2011 YOUR_NAME_HERE <YOUR_URL_HERE>

	Everyone is permitted to copy and distribute verbatim or modified
	copies of this license document, and changing it is allowed as long
	as the name is changed.

	DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
	TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION

	0. You just DO WHAT THE FUCK YOU WANT TO.
	{
	"name": "doABarrelRoll",

	"description": "This rotates the page 360deg, just like Google's Barrel Roll easter egg.",

	"keywords": [
	"animation",
	"css3"
	]
	}
	<!DOCTYPE html>
	<title>Foo</title>
	<h1>This content should do a barrel roll (after 5s so you can read this).</h1>
	<script>

	var doABarrelRoll = function(){var a="-webkit-",b='transform:rotate(1turn);',c='transition:4s;';document.head.innerHTML+='<style>body{'+a+b+a+c+b+c}

	doABarrelRoll();
	</script>