diff --git a/README.md b/README.md
index 2948774..ca16f11 100644
--- a/README.md
+++ b/README.md
@@ -16,21 +16,23 @@ https://chrome.google.com/webstore/detail/ighdmehidhipcmcojjgiloacoafjmpfk
Check out [this screencast](http://www.youtube.com/embed/q-7mhcHXSfM) that walks you through the Batarang's features.
## Using the Batarang
-First, navigate Chrome Canary to the AngularJS application that you want to debug. [Open the Developer Tools](https://developers.google.com/chrome-developer-tools/docs/overview#access). There should be an AngularJS icon. Click on it to open he AngularJS Batarang.
+First, navigate Chrome Canary to the AngularJS application that you want to debug. [Open the Developer Tools](https://developers.google.com/chrome-developer-tools/docs/overview#access). There should be an AngularJS icon. Click on it to open the AngularJS Batarang.
+
-The Batarang has four tabs: Model, Performance, Options, and Help.
+In order to begin using the Batarang you need to click the "enable" checkbox. This will cause the application's tab to refresh, and the Batarang to begin collecting perfomance and debug information about the inspected app.
-### Model
-
+The Batarang has five tabs: Model, Performance, Dependencies, Options, and Help.
+
+### Models
+
Starting at the top of this tab, there is the root selection. If the application has only one `ng-app` declaration (as most applications do) then you will not see the option to change roots.
Below that is a tree showing how scopes are nested, and which models are attached to them. Clicking on a scope name will take you to the Elements tab, and show you the DOM element associated with that scope. Models and methods attached to each scope are listed with bullet points on the tree. Just the name of methods attached to a scope are shown. Models with a simple value and complex objects are shown as JSON. You can edit either, and the changes will be reflected in the application being debugged.
-
### Performance
-
+
The performance tab must be enabled separately because it causes code to be injected into AngularJS to track and report performance metrics. There is also an option to output performance metrics to the console.
@@ -38,10 +40,15 @@ Below that is a tree of watched expressions, showing which expressions are attac
Underneath that is a graph showing the relative performance of all of the application's expressions. This graph will update as you interact with the application.
+### Dependencies
+
+
+The dependencies tab shows a visualization of the application's dependencies. When you hover over a service name, services that depend on the hovered service turn green, and those the hovered service depend on turn red.
+
### Options
-Last, there is the options tab. The options tab has two checkboxes: one for "show scopes" and one for "show bindings." Each of these options, when enabled, highlights the respective feature of the application being debugged; scopes will have a red outline, and bindings will have a blue outline.
+Last, there is the options tab. The options tab has three checkboxes: one for "show applications," "show scopes," and "show bindings." Each of these options, when enabled, highlights the respective feature of the application being debugged; scopes will have a red outline, and bindings will have a blue outline, and applications a green outline.
### Elements
@@ -51,4 +58,4 @@ The Batarang also hooks into some of the existing features of the Chrome develop
### Console
-The Batarang exposes some convenient features to the Chrome developer tools console. To access the scope of an element selected in the Elements tab of the developer tools, in console, you can type `$scope`. If you change value of some model on `$scope` and want to have this change reflected in the running application, you need to call `$scope.$apply()` after making the change.
\ No newline at end of file
+The Batarang exposes some convenient features to the Chrome developer tools console. To access the scope of an element selected in the Elements tab of the developer tools, in console, you can type `$scope`. If you change value of some model on `$scope` and want to have this change reflected in the running application, you need to call `$scope.$apply()` after making the change.
diff --git a/img/deps.png b/img/deps.png
new file mode 100644
index 0000000..0509c01
Binary files /dev/null and b/img/deps.png differ
diff --git a/img/model-tree.png b/img/model-tree.png
deleted file mode 100644
index 65ea2cf..0000000
Binary files a/img/model-tree.png and /dev/null differ
diff --git a/img/models.png b/img/models.png
new file mode 100644
index 0000000..293d7a8
Binary files /dev/null and b/img/models.png differ
diff --git a/img/options.png b/img/options.png
index e5492f8..41fb82a 100644
Binary files a/img/options.png and b/img/options.png differ
diff --git a/img/perf.png b/img/perf.png
new file mode 100644
index 0000000..981c33b
Binary files /dev/null and b/img/perf.png differ
diff --git a/img/performance.png b/img/performance.png
deleted file mode 100644
index 40edc8f..0000000
Binary files a/img/performance.png and /dev/null differ
diff --git a/panes/help.html b/panes/help.html
index d3ef2eb..c28f9e7 100644
--- a/panes/help.html
+++ b/panes/help.html
@@ -1,12 +1,10 @@
-Using the Batarang
+In order to begin using the Batarang you need to click the "enable" checkbox. This will cause the application's tab to refresh, and the Batarang to begin collecting perfomance and debug information about the inspected app.
-First, navigate Chrome Canary to the AngularJS application that you want to debug. Open the Developer Tools. There should be an AngularJS icon. Click on it to open he AngularJS Batarang.
+The Batarang has five tabs: Model, Performance, Dependencies, Options, and Help.
-The Batarang has four tabs: Model, Performance, Options, and Help.
+Models
-Model
-
-
+
Starting at the top of this tab, there is the root selection. If the application has only one ng-app declaration (as most applications do) then you will not see the option to change roots.
@@ -14,7 +12,7 @@
Performance
-
+
The performance tab must be enabled separately because it causes code to be injected into AngularJS to track and report performance metrics. There is also an option to output performance metrics to the console.
@@ -22,11 +20,17 @@
Underneath that is a graph showing the relative performance of all of the application's expressions. This graph will update as you interact with the application.
+Dependencies
+
+
+
+The dependencies tab shows a visualization of the application's dependencies. When you hover over a service name, services that depend on the hovered service turn green, and those the hovered service depend on turn red.
+
Options
-Last, there is the options tab. The options tab has two checkboxes: one for "show scopes" and one for "show bindings." Each of these options, when enabled, highlights the respective feature of the application being debugged; scopes will have a red outline, and bindings will have a blue outline.
+Last, there is the options tab. The options tab has three checkboxes: one for "show applications," "show scopes," and "show bindings." Each of these options, when enabled, highlights the respective feature of the application being debugged; scopes will have a red outline, and bindings will have a blue outline, and applications a green outline.
Elements
@@ -38,4 +42,4 @@
-The Batarang exposes some convenient features to the Chrome developer tools console. To access the scope of an element selected in the Elements tab of the developer tools, in console, you can type $scope. If you change value of some model on $scope and want to have this change reflected in the running application, you need to call $scope.$apply() after making the change.
\ No newline at end of file
+The Batarang exposes some convenient features to the Chrome developer tools console. To access the scope of an element selected in the Elements tab of the developer tools, in console, you can type $scope. If you change value of some model on $scope and want to have this change reflected in the running application, you need to call $scope.$apply() after making the change.