From 99f1c570bb1b03e953c57473a92986204e2b95cf Mon Sep 17 00:00:00 2001
From: Julien Bouquillon <julien@bouquillon.com>
Date: Mon, 24 Nov 2014 16:37:42 +0100
Subject: [PATCH] add pixel-perfect overlay loader

---
 snippets/overlay/README.md  |  3 +++
 snippets/overlay/overlay.js | 17 +++++++++++++++++
 2 files changed, 20 insertions(+)
 create mode 100644 snippets/overlay/README.md
 create mode 100644 snippets/overlay/overlay.js

diff --git a/snippets/overlay/README.md b/snippets/overlay/README.md
new file mode 100644
index 0000000..279ce57
--- /dev/null
+++ b/snippets/overlay/README.md
@@ -0,0 +1,3 @@
+### overlay.js
+
+Add an semi-transparent image overlay over your page to have pixel-perfect integration with your designs.
diff --git a/snippets/overlay/overlay.js b/snippets/overlay/overlay.js
new file mode 100644
index 0000000..287ec16
--- /dev/null
+++ b/snippets/overlay/overlay.js
@@ -0,0 +1,17 @@
+var storageKey = 'overlay-default';
+var overlayDefault = localStorage.getItem(storageKey) || '';
+var url = prompt('paste overlay url', overlayDefault);
+if (url) {
+    localStorage.setItem(storageKey, url);
+    var overlay = document.createElement('div');
+    overlay.style.position = 'absolute';
+    overlay.style.left = 0;
+    overlay.style.top = 0;
+    overlay.style.width = '100%';
+    overlay.style.height='100%';
+    overlay.style.backgroundImage = 'url(' + url + ')';
+    overlay.style.backgroundSize = 'cover';
+    overlay.style.zIndex=10000;
+    overlay.style.opacity = 0.5;
+    document.body.appendChild(overlay);
+}