new batch of docs

1 files changed, 26 insertions, 50 deletions

diff --git a/docs/content/tutorial/step_05.ngdoc b/docs/content/tutorial/step_05.ngdoc
index 1e63e383..4bd4e4b3 100755
--- a/docs/content/tutorial/step_05.ngdoc
+++ b/docs/content/tutorial/step_05.ngdoc
@@ -1,47 +1,29 @@
 @ngdoc overview
-@name Tutorial: Step 5
+@name Tutorial: 5 - XHRs & Dependency Injection
 @description
-<table id="tutorial_nav">
-<tr>
- <td id="previous_step">{@link tutorial.step_04 Previous}</td>
- <td id="step_result">{@link  http://angular.github.com/angular-phonecat/step-5/app Live Demo
-}</td>
- <td id="tut_home">{@link tutorial Tutorial Home}</td>
-<td id="code_diff">{@link https://github.com/angular/angular-phonecat/compare/step-4...step-5 Code
-Diff}</td>
- <td id="next_step">{@link tutorial.step_06 Next}</td>
-</tr>
-</table>
 
 
-Enough of building an app with three phones in a hard-coded dataset! Let's fetch a larger dataset
-from our server using one of angular's built-in {@link angular.service services} called {@link
-angular.service.$xhr $xhr}. We will use angular's {@link guide.di dependency injection (DI)} to
-provide the service to the `PhoneListCtrl` controller.
-
+<ul doc:tutorial-nav="5"></ul>
 
-1. Reset your workspace to step 5.
 
 
-         git checkout -f step-5
 
+Enough of building an app with three phones in a hard-coded dataset! Let's fetch a larger dataset
+from our server using one of angular's built-in {@link api/angular.service services} called {@link
+api/angular.service.$xhr $xhr}. We will use angular's {@link guide/dev_guide.di dependency
+injection (DI)} to provide the service to the `PhoneListCtrl` controller.
 
-  or
 
 
-         ./goto_step.sh 5
 
+<doc:tutorial-instructions step="5"></doc:tutorial-instructions>
 
 
 
-2. Refresh your browser or check the app out on {@link
-http://angular.github.com/angular-phonecat/step-5/app angular's server}.
 
 You should now see a list of 20 phones.
 
 
-
-
 The most important changes are listed below. You can see the full diff on {@link
 https://github.com/angular/angular-phonecat/compare/step-4...step-5
 GitHub}:
@@ -74,16 +56,16 @@ Following is a sample of the file:
 ## Controller
 
 
-We'll use angular's {@link angular.service.$xhr $xhr} service in our controller to make an HTTP
+We'll use angular's {@link api/angular.service.$xhr $xhr} service in our controller to make an HTTP
 request to your web server to fetch the data in the `app/phones/phones.json` file. `$xhr` is just
-one of several built-in {@link angular.service angular services} that handle common operations in
-web apps. Angular injects these services for you where you need them.
+one of several built-in {@link api/angular.service angular services} that handle common operations
+in web apps. Angular injects these services for you where you need them.
 
 
-Services are managed by angular's {@link guide.di DI subsystem}. Dependency injection helps to make
-your web apps both well-structured (e.g., separate components for presentation, data, and control)
-and loosely coupled (dependencies between components are not resolved by the components themselves,
-but by the DI subsystem).
+Services are managed by angular's {@link guide/dev_guide.di DI subsystem}. Dependency injection
+helps to make your web apps both well-structured (e.g., separate components for presentation, data,
+and control) and loosely coupled (dependencies between components are not resolved by the
+components themselves, but by the DI subsystem).
 
 
 __`app/js/controllers.js:`__
@@ -179,7 +161,7 @@ production code behind the scenes, as follows:
 describe('PhoneCat controllers', function() {
 
 
-  describe('PhoneListCtrl', function(){
+  describe('PhoneListCtrl', function() {
     var scope, $browser, ctrl;
 
 
@@ -188,8 +170,9 @@ describe('PhoneCat controllers', function() {
       $browser = scope.$service('$browser');
 
 
-      $browser.xhr.expectGET('phones/phones.json').respond([{name: 'Nexus S'},
-                                                            {name: 'Motorola DROID'}]);
+      $browser.xhr.expectGET('phones/phones.json')
+          .respond([{name: 'Nexus S'},
+                    {name: 'Motorola DROID'}]);
       ctrl = scope.$new(PhoneListCtrl);
     });
   });
@@ -211,13 +194,13 @@ we create the `PhoneListCtrl` child scope, we need to tell the testing harness t
 incoming request from the controller. To do this we:
 
 
-* Use the {@link angular.scope.$service `$service`} method to retrieve the `$browser` service, a
-service that angular uses to represent various browser APIs. In tests, angular automatically uses a
-mock version of this service that allows you to write tests without having to deal with these
+* Use the {@link api/angular.scope.$service `$service`} method to retrieve the `$browser` service,
+a service that angular uses to represent various browser APIs. In tests, angular automatically uses
+a mock version of this service that allows you to write tests without having to deal with these
 native APIs and the global state associated with them.
 
 
-* Use the `$browser.expectGET` method to train the `$browser` object to expect an incoming HTTP
+* Use the `$browser.xhr.expectGET` method to train the `$browser` object to expect an incoming HTTP
 request and tell it what to respond with. Note that the responses are not returned before we call
 the `$browser.xhr.flush` method.
 
@@ -293,14 +276,7 @@ implementation of dependency injection), go to step 6, where you will add some t
 phones and some links.
 
 
-<table id="tutorial_nav">
-<tr>
- <td id="previous_step">{@link tutorial.step_04 Previous}</td>
- <td id="step_result">{@link  http://angular.github.com/angular-phonecat/step-5/app Live Demo
-}</td>
- <td id="tut_home">{@link tutorial Tutorial Home}</td>
- <td id="code_diff">{@link https://github.com/angular/angular-phonecat/compare/step-4...step-5 Code
-Diff}</td>
- <td id="next_step">{@link tutorial.step_06 Next}</td>
-</tr>
-</table>
+
+
+<ul doc:tutorial-nav="5"></ul>
+