From a0f8358de238f5a0de47eba9656e6346bf2947ab Mon Sep 17 00:00:00 2001
From: Brian Ford <btford@umich.edu>
Date: Wed, 15 Aug 2012 17:13:34 -0700
Subject: [PATCH] moved CSS features to their own service, cleaned up services

---
 js/services/appContext.js      | 25 +++----------------------
 js/services/appCss.js          | 23 +++++++++++++++++++++++
 js/services/appHighlight.js    |  6 +++---
 js/services/chromeExtension.js |  1 +
 panel.html                     |  1 +
 5 files changed, 31 insertions(+), 25 deletions(-)
 create mode 100644 js/services/appCss.js

diff --git a/js/services/appContext.js b/js/services/appContext.js
index dd149fa..a5e1e7a 100644
--- a/js/services/appContext.js
+++ b/js/services/appContext.js
@@ -1,5 +1,5 @@
 // Service for doing stuff in the context of the application being debugged
-panelApp.factory('appContext', function(chromeExtension) {
+panelApp.factory('appContext', function (chromeExtension) {
 
   // Private vars
   // ============
@@ -260,25 +260,6 @@ panelApp.factory('appContext', function(chromeExtension) {
     // Actions
     // -------
 
-    addCssRule: function (args) {
-      chromeExtension.eval(function (window, args) {
-        var styleSheet = document.styleSheets[document.styleSheets.length - 1];
-        styleSheet.insertRule(args.selector + '{' + args.style + '}', styleSheet.cssRules.length);
-      }, args);
-    },
-
-    removeCssRule: function (args) {
-      chromeExtension.eval(function (window, args) {
-        var styleSheet = document.styleSheets[document.styleSheets.length - 1];
-        var i;
-        for (i = styleSheet.cssRules.length - 1; i >= 0; i -= 1) {
-          if (styleSheet.cssRules[i].cssText === args.selector + ' { ' + args.style + '; }') {
-            styleSheet.deleteRule(i);
-          }
-        }
-      }, args);
-    },
-
     clearHistogram: function (cb) {
       chromeExtension.eval(function (window) {
         window.__ngDebug.watchExp = {};
@@ -304,12 +285,12 @@ panelApp.factory('appContext', function(chromeExtension) {
     setDebug: function (setting) {
       if (setting) {
         chromeExtension.eval(function (window) {
-          window.document.cookie = '__ngDebug=true;'
+          window.document.cookie = '__ngDebug=true;';
           window.document.location.reload();
         });
       } else {
         chromeExtension.eval(function (window) {
-          window.document.cookie = '__ngDebug=false;'
+          window.document.cookie = '__ngDebug=false;';
           window.document.location.reload();
         });
       }
diff --git a/js/services/appCss.js b/js/services/appCss.js
new file mode 100644
index 0000000..26611d7
--- /dev/null
+++ b/js/services/appCss.js
@@ -0,0 +1,23 @@
+// Service for injecting CSS into the application
+panelApp.factory('appCss', function (chromeExtension) {
+  return {
+    addCssRule: function (args) {
+      chromeExtension.eval(function (window, args) {
+        var styleSheet = document.styleSheets[document.styleSheets.length - 1];
+        styleSheet.insertRule(args.selector + '{' + args.style + '}', styleSheet.cssRules.length);
+      }, args);
+    },
+
+    removeCssRule: function (args) {
+      chromeExtension.eval(function (window, args) {
+        var styleSheet = document.styleSheets[document.styleSheets.length - 1];
+        var i;
+        for (i = styleSheet.cssRules.length - 1; i >= 0; i -= 1) {
+          if (styleSheet.cssRules[i].cssText === args.selector + ' { ' + args.style + '; }') {
+            styleSheet.deleteRule(i);
+          }
+        }
+      }, args);
+    }
+  };
+});
diff --git a/js/services/appHighlight.js b/js/services/appHighlight.js
index 96778a3..fe66104 100644
--- a/js/services/appHighlight.js
+++ b/js/services/appHighlight.js
@@ -1,5 +1,5 @@
 // Service for highlighting parts of the application
-panelApp.factory('appHighlight', function (appContext) {
+panelApp.factory('appHighlight', function (appCss) {
 
   //TODO: improve look of highlighting; for instance, if an element is bound and a scope,
   // you will only see the most recently applied outline
@@ -27,9 +27,9 @@ panelApp.factory('appHighlight', function (appContext) {
         var style = styles[i];
         api[i] = function (setting) {
           if (setting) {
-            appContext.addCssRule(style);
+            appCss.addCssRule(style);
           } else {
-            appContext.removeCssRule(style);
+            appCss.removeCssRule(style);
           }
         }
       }());
diff --git a/js/services/chromeExtension.js b/js/services/chromeExtension.js
index 9b1cce6..bc1e78f 100644
--- a/js/services/chromeExtension.js
+++ b/js/services/chromeExtension.js
@@ -1,3 +1,4 @@
+// abstraction layer for Chrome Extension APIs
 panelApp.value('chromeExtension', {
   sendRequest: function (requestName, cb) {
     chrome.extension.sendRequest({
diff --git a/panel.html b/panel.html
index b1fa2d3..03dd221 100644
--- a/panel.html
+++ b/panel.html
@@ -26,6 +26,7 @@
   <script src="js/filters/sortByTime.js"></script>
 
   <script src="js/services/appContext.js"></script>
+  <script src="js/services/appCss.js"></script>
   <script src="js/services/appHighlight.js"></script>
   <script src="js/services/chromeExtension.js"></script>
   <script src="js/services/filesystem.js"></script>