From 03c0003f439b1b6c2303d8d8b5cf7b7c3a808e07 Mon Sep 17 00:00:00 2001
From: Massimo Palmieri <massimopalmieri@gmail.com>
Date: Thu, 13 Jun 2013 21:28:18 +0100
Subject: [PATCH] implement chrome.storage to sync custom style

---
 extension/manifest.json |  5 ++++-
 extension/my-style.js   | 22 +++++++++++++++++-----
 2 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/extension/manifest.json b/extension/manifest.json
index 533b9a1..7449849 100644
--- a/extension/manifest.json
+++ b/extension/manifest.json
@@ -10,5 +10,8 @@
     "css": ["my-style.css"],
     "js": ["my-style.js"],
     "run_at": "document_start"
-  }]
+  }],
+  "permissions": [
+    "storage"
+  ]
 }
diff --git a/extension/my-style.js b/extension/my-style.js
index e9e0a4e..a8b65cd 100644
--- a/extension/my-style.js
+++ b/extension/my-style.js
@@ -9,6 +9,8 @@
   var ONLY_WHITESPACE_REGEX = /^\s*$/;
   var WHITESPACE_SPLIT_REGEX = /\s+$/g;
 
+  var host = window.location.host;
+
   /* Throttle the given function, condensing multiple calls into one call after
    * the given timeout period. In other words, allow at most one call to go
    * through per timeout period. Returns the throttled function.
@@ -47,6 +49,9 @@
     var style = document.createElement('style');
     var textarea = document.createElement('textarea');
 
+    var myStyle = {};
+
+
     // hide textarea by default
     textarea.style.display = 'none';
     textarea.id = 'my-style-input';
@@ -55,8 +60,11 @@
     head.appendChild(style);
     body.appendChild(textarea);
 
-    style.innerHTML = localStorage.myStyle || '';
-    textarea.value = style.innerHTML;
+    chrome.storage.sync.get(host, function(myStyle) {
+      style.innerHTML = myStyle[host] || '';
+      textarea.value = myStyle[host] || '';
+    });
+
     textarea.placeholder = '/* Enter your styles here. */';
 
     // alt + click on an element adds its selector to the textarea
@@ -91,7 +99,7 @@
         // fill CSS with styles defined in the style attribute
         if (target.getAttribute('style')) {
           stylesList = target.getAttribute('style').split(';');
-        
+
           // keep track of CSS properties already defined in style attribute
           for (i = 0; i < stylesList.length; i++) {
             // condense mutliple whitespace into one space
@@ -103,7 +111,7 @@
             }
           }
         }
-        
+
         // construct text to add to textarea
         if (selector) {
           // add existing styles in braces
@@ -128,7 +136,11 @@
 
     /* Save styles persistently in local storage. */
     var saveStyles = throttle(function() {
-      localStorage.myStyle = style.innerHTML;
+      var myStyle = {};
+
+      myStyle[host] = style.innerHTML;
+
+      chrome.storage.sync.set(myStyle);
     }, 500);
 
     /* Updates styles with content in textarea and saves styles. */