zachstronaut · Xalior · Jan 18, 2012 · Jan 18, 2012 · Jan 18, 2012 · Jan 18, 2012
diff --git a/README.md b/README.md
@@ -6,6 +6,16 @@ You can use the provided **`index.html`** as your site's homepage on January 18
 
 [**It looks like this.**](http://www.zachstronaut.com/lab/text-shadow-box/stop-sopa.html)
 
+Automatically add it to yourwebsite by putting
+
+    <script src="https://raw.github.com/Xalior/stop-sopa/master/stop-sopa.js"></script>
+
+before your
+
+    </body>
+
+tag
+
 ---
 
 I felt inspired by the "going dark" theme.  I've been calling my representatives in Congress, but this gave me another outlet for my frustration with this legislation.  I place this code in the public domain.  I require no attribution.
diff --git a/example.html b/example.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>example</title>
+  </head>
+  <body>
+   CLEARTEXT
+    <script src="stop-sopa.js"></script>
+  </body>
+</html> 
diff --git a/stop-sopa.js b/stop-sopa.js
@@ -0,0 +1,100 @@
+/**
+ * Stop-Sopa dynamic CSS overlay. Add one line. Blackout your webpage.
+ * D. Rimron
+ * http://www.rimron.co.uk/
+ *
+ * Based upon very clever work by
+ * Zachary Johnson
+ * http://www.zachstronaut.com
+ * I place the following code in the public domain.
+ *
+ * Fork it on GitHub: https://github.com/zachstronaut/stop-sopa
+ */
+
+
+var _STOPSOPA = function() {
+    var _MAINCSS = "#_STOPSOPA_wrapper{ margin:0; padding:0}#text-shadow-box{ position:fixed; left:0; right:0; top:0; bottom:0; width:100%; height:100%; overflow:hidden; background:#444; font-family:Helvetica,Arial,sans-serif; -webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-user-select:none}#text-shadow-box #tsb-text,#text-shadow-box #tsb-link{ position:absolute; top:40%; left:0; width:100%; height:1em; margin:-0.77em 0 0 0; font-size:90px; line-height:1em; font-weight:bold; text-align:center}#text-shadow-box #tsb-text{ font-size:100px; color:transparent; text-shadow:black 0px -45.2px 19px}#text-shadow-box #tsb-link a{ color:#999; text-decoration:none}#text-shadow-box #tsb-box,#text-shadow-box #tsb-wall{ position:absolute; top:40%; left:0; width:100%; height:60%}#text-shadow-box #tsb-box{ -webkit-box-shadow:black 0px -45.2px 39px; -moz-box-shadow:black 0px -45.2px 39px}#text-shadow-box #tsb-wall{ background:#999}#text-shadow-box #tsb-wall p{ position:relative; font-size:18px; line-height:1.5em; text-align:justify; color:#222; width:550px; margin:1.5em auto; cursor:default}#text-shadow-box #tsb-wall p a{ color:#fff}#text-shadow-box #tsb-wall p a:hover{ text-decoration:none; color:#000; background:#fff}#tsb-spot{ position:absolute; top:-50%; left:-50%; width:200%; height:200%; pointer-events:none; background:-webkit-gradient(radial,center center,0,center center,450,from(rgba(0,0,0,0)),to(rgba(0,0,0,1))); background:-moz-radial-gradient(center 45deg,circle closest-side,transparent 0,black 450px)}";
+    var _IECSS = "#tsb-spot {display:none;}#tsb-ie{position:absolute;top:-90%;left:-50%;width:200%;height:334%;background:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMCIvPgogICAgPHN0b3Agb2Zmc2V0PSI3NCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMDAwMDAwIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);}";
+    var _HTML = "<div id='text-shadow-box'><div id='tsb-box'></div><p id='tsb-text'>STOP SOPA!</p><p id='tsb-link'><a href='http://americancensorship.org/'>STOP SOPA!</a></p><div id='tsb-wall'><div id='tsb-ie'></div><p>This site has gone dark today in protest of the U.S. Stop Online Piracy Act (SOPA) and PROTECT-IP Act (PIPA).  The U.S. Congress is about to censor the Internet, even though the vast majority of Americans are opposed. We need to kill these bills to protect our rights to free speech, privacy, and prosperity.  Learn more at <a href='http://americancensorship.org/'>AmericanCensorship.org</a></p></div><div id='tsb-spot'></div></div>";
+
+    function getInternetExplorerVersion() {
+        var rv = 0; // Return value assumes failure.
+        if (navigator.appName == 'Microsoft Internet Explorer')
+        {
+            var ua = navigator.userAgent;
+            var re  = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
+            if (re.exec(ua) != null)
+              rv = parseFloat( RegExp.$1 );
+        }
+        return rv;
+    }
+    var text = null;
+    var spot = null;
+    var box  = null;
+    var boxProperty = null;
+
+    function onMouseMove(e) {
+        if (typeof e === 'undefined' || typeof e.clientX === 'undefined') {
+            return;
+        }
+
+        var xm = (e.clientX - Math.floor(window.innerWidth / 2)) * 0.4;
+        var ym = (e.clientY - Math.floor(window.innerHeight / 3)) * 0.4;
+        var d = Math.round(Math.sqrt(xm*xm + ym*ym) / 5);
+        text.style.textShadow = -xm + 'px ' + -ym + 'px ' + (d + 10) + 'px black';
+
+        if (boxProperty) {
+            box.style[boxProperty] = '0 ' + -ym + 'px ' + (d + 30) + 'px black';
+        }
+
+        xm = e.clientX - Math.floor(window.innerWidth / 2);
+        ym = e.clientY - Math.floor(window.innerHeight / 2);
+        spot.style.backgroundPosition = xm + 'px ' + ym + 'px';
+    }
+
+    return {
+        'init': function() {
+            var body = document.getElementsByTagName('body')[0];
+            var head = document.getElementsByTagName('head')[0];
+            var style = document.createElement('style');
+            var styleText = document.createTextNode(_MAINCSS);
+            var blackout = document.createElement('div');
+                style.type = "text/css";
+                if(style.styleSheet)
+                    style.styleSheet.cssText = styleText;
+                else
+                    style.appendChild(styleText);
+                head.appendChild(style);
+            if(getInternetExplorerVersion()) {
+                var ieStyle = document.createElement('style');
+                var ieStyleText = document.createTextNode(_IECSS);
+                    ieStyle.type = "text/css";
+                    if(ieStyle.styleSheet)
+                        ieStyle.styleSheet.cssText = ieStyleText;
+                    else
+                        ieStyle.appendChild(ieStyleText);
+                head.appendChild(ieStyle);
+            } 
+                blackout.id = "_STOPSOPA_wrapper";
+                blackout.innerHTML = _HTML;
+            body.appendChild(blackout);
+            text = document.getElementById('tsb-text');
+            spot = document.getElementById('tsb-spot');
+            box = document.getElementById('tsb-box');
+
+            if (typeof box.style.webkitBoxShadow == 'string') {
+                boxProperty = 'webkitBoxShadow';
+            } else if (typeof box.style.MozBoxShadow == 'string') {
+                boxProperty = 'MozBoxShadow';
+            } else if (typeof box.style.boxShadow == 'string') {
+                boxProperty = 'boxShadow';
+            }
+
+            if (text && spot && box) {
+                document.getElementById('text-shadow-box').onmousemove = onMouseMove;
+                document.getElementById('text-shadow-box').ontouchmove = function (e) {e.preventDefault(); e.stopPropagation(); onMouseMove({clientX: e.touches[0].clientX, clientY: e.touches[0].clientY});};
+            }
+            return this;
+        }
+    }
+}().init();