diff --git a/devtools.html b/devtools.html
deleted file mode 100644
index 0c2bf41..0000000
--- a/devtools.html
+++ /dev/null
@@ -1,5 +0,0 @@
-
-
-
-
-
\ No newline at end of file
diff --git a/devtoolsBackground.html b/devtoolsBackground.html
new file mode 100644
index 0000000..cfcae41
--- /dev/null
+++ b/devtoolsBackground.html
@@ -0,0 +1,5 @@
+
+
+
+
+
\ No newline at end of file
diff --git a/js/devtools.js b/js/devtools.js
deleted file mode 100644
index 0fb2f84..0000000
--- a/js/devtools.js
+++ /dev/null
@@ -1,53 +0,0 @@
-
-// The function below is executed in the context of the inspected page.
-
-var page_getProperties = function () {
- if (window.angular && $0) {
- var scope = window.angular.element($0).scope();
- window.$scope = scope;
- return (function (scope) {
- var ret = {
- __private__: {}
- };
-
- for (prop in scope) {
- if (scope.hasOwnProperty(prop)) {
- if (prop[0] === '$' && prop[1] === '$') {
- ret.__private__[prop] = scope[prop];
- } else {
- ret[prop] = scope[prop];
- }
- }
- }
- return ret;
- }(scope));
- } else {
- return {};
- }
-};
-
-chrome.
- devtools.
- panels.
- elements.
- createSidebarPane(
- "AngularJS Properties",
- function (sidebar) {
- var selectedElt;
-
- var updateElementProperties = function () {
- sidebar.setExpression("(" + page_getProperties.toString() + ")()");
- }
-
- updateElementProperties();
- chrome.devtools.panels.elements.onSelectionChanged.addListener(updateElementProperties);
- });
-
-// Angular panel
-var angularPanel = chrome.
- devtools.
- panels.
- create(
- "AngularJS",
- "img/angular.png",
- "panel.html");
diff --git a/js/devtoolsBackground.js b/js/devtoolsBackground.js
new file mode 100644
index 0000000..ae4057b
--- /dev/null
+++ b/js/devtoolsBackground.js
@@ -0,0 +1,45 @@
+var panels = chrome.devtools.panels;
+
+// The function below is executed in the context of the inspected page.
+
+var getPanelContents = function () {
+ if (window.angular && $0) {
+ //TODO: can we move this scope export into updateElementProperties
+ var scope = window.angular.element($0).scope();
+ // Export $scope to the console
+ window.$scope = scope;
+ return (function (scope) {
+ var panelContents = {
+ __private__: {}
+ };
+
+ for (prop in scope) {
+ if (scope.hasOwnProperty(prop)) {
+ if (prop.substr(0, 2) === '$$') {
+ panelContents.__private__[prop] = scope[prop];
+ } else {
+ panelContents[prop] = scope[prop];
+ }
+ }
+ }
+ return panelContents;
+ }(scope));
+ } else {
+ return {};
+ }
+};
+
+panels.elements.createSidebarPane(
+ "AngularJS Properties",
+ function (sidebar) {
+ panels.elements.onSelectionChanged.addListener(function updateElementProperties() {
+ sidebar.setExpression("(" + getPanelContents.toString() + ")()");
+ });
+ });
+
+// Angular panel
+var angularPanel = panels.create(
+ "AngularJS",
+ "img/angular.png",
+ "panel.html"
+);
diff --git a/manifest.json b/manifest.json
index 1efe4d2..08fdbb4 100644
--- a/manifest.json
+++ b/manifest.json
@@ -5,7 +5,7 @@
"background": {
"page": "background.html"
},
- "devtools_page": "devtools.html",
+ "devtools_page": "devtoolsBackground.html",
"manifest_version": 2,
"permissions": [
"tabs",