Remove .html extension from links

chrome/common/extensions/docs/templates/articles/angular_framework.html

 <meta name="doc-family" content="apps">
 <h1>Build Apps with AngularJS</h1>
 <!--Article written by Eric Bidelman-->
 <p>
 This guide gets you started building Chrome Apps
 with the <a href="http://angularjs.org/">AngularJS</a> MVC framework.
 To illustrate Angular in action,
 we'll be referencing an actual app built using the framework,
 the Google Drive Uploader.
 The <a href="https://github.com/GoogleChrome/chrome-app-samples/tree/master/gdrive">source code</a>
@@ skipping 15 matching lines @@
 <a href="http://www.html5rocks.com/en/tutorials/dnd/basics/">HTML Drag and Drop APIs</a>.
 It's a great example of building an app which talks
 to one of <a href="https://developers.google.com/apis-explorer/#p/">Google's APIs</a>;
 in this case, the Google Drive API.
 </p>
 
 <p class="note">
 <strong>Note: </strong>
 You can also build apps which talk to 3rd party APIs/services
 that are OAuth2-enabled.
-See <a href="app_identity.html#non">non-Google Account authentication</a>.
+See <a href="app_identity#non">non-Google Account authentication</a>.
 </p>
 
 <p>
 The Uploader uses OAuth2 to access the user's data. The
-<a href="identity.html">chrome.identity API</a>
+<a href="identity">chrome.identity API</a>
 handles fetching an OAuth token for the logged-in user,
 so the hard work is done for us!
 Once we have a long-lived access token,
 the apps uses the
 <a href="https://developers.google.com/drive/get-started">Google Drive API</a>
 to access the user's data.
 </p>
 
 <p>
 Key features this app uses:
 </p>
 
 <ul>
     <li>AngularJS's autodetection for
-        <a href="contentSecurityPolicy.html">CSP</a></li>
+        <a href="contentSecurityPolicy">CSP</a></li>
     <li>Render a list of files fetched from the
         <a href="https://developers.google.com/drive/get-started">Google Drive API</a></li>
     <li><a href="http://www.html5rocks.com/en/tutorials/file/filesystem/">HTML5 Filesystem API</a>
         to store file icons offline</li>
     <li><a href="http://www.html5rocks.com/en/tutorials/dnd/basics/">HTML5 Drag and Drop</a>
         for importing/uploading new files from the desktop</li>
     <li>XHR2 to load images, cross-domain</li>
-    <li><a href="app_identity.html">chrome.identity API</a>
+    <li><a href="app_identity">chrome.identity API</a>
         for OAuth authorization</li>
     <li>Chromeless frames to define the app's own navbar look and feel</li>
 </ul>
 
 <h2 id="second">Creating the manifest</h2>
 
 <p>
 All Chrome Apps require a <code>manifest.json</code> file
 which contains the information Chrome needs to launch the app.
 The manifest contains relevant metadata and
@@ skipping 26 matching lines @@
 }
 </pre>
 
 <p>
 The most important parts of this manifest are the "oauth2" and "permissions" sections.
 </p>
 
 <p>
 The "oauth2" section defines the required parameters by OAuth2 to do its magic.
 To create a "client_id", follow the instructions in
-<a href="app_identity.html#client_id">Get your client id</a>.
+<a href="app_identity#client_id">Get your client id</a>.
 The "scopes" list the authorization scopes
 that the OAuth token will be valid for (for example, the APIs the app wants to access).
 </p>
 
 <p>
 The "permissions" section includes URLs that the app will access via XHR2.
 The URL prefixes are required in order for Chrome
 to know which cross-domain requests to allow.
 </p>
 
 <h2 id="three">Creating the event page</h2>
 
 <p>
 All Chrome Apps require a background script/page
 to launch the app and respond to system events.
 </p>
 
 <p>
 In its
 <a href="https://github.com/GoogleChrome/chrome-app-samples/blob/master/gdrive/js/background.js">background.js</a> 
 script,
 Drive Uploader opens a 500x600px window to the main page.
 It also specifies a minimum height and width for the window
 so the content doesn't become too crunched: 
 </p>
 
 <pre data-filename="background.js">
 chrome.app.runtime.onLaunched.addListener(function(launchData) {
-  chrome.app.window.create('../main.html', {
+  chrome.app.window.create('../main', {
     id: "GDriveExample",
     bounds: {
       width: 500,
       height: 600
     },
     minWidth: 500,
     minHeight: 600,
     frame: 'none'
   });
 });
 </pre>
 
 <p>
 The window is created as a chromeless window (frame: 'none').
 By default, windows render with the OS's default close/expand/minimize bar:
 </p>
 
 <img src="{{static}}/images/noframe.png"
      width="508"
      height="75"
      alt="Google Drive Uploader with no frame">
 
 <p>
 The Uploader uses <code>frame: 'none'</code> to render the window as a "blank slate"
-and creates a custom close button in <code>main.html</code>:
+and creates a custom close button in <code>main</code>:
 </p>
 
 <img src="{{static}}/images/customframe.png"
      width="504"
      height="50"
      alt="Google Drive Uploader with custom frame">
 
 <p>
 The entire navigational area is wrapped in a &lt;nav> (see next section).
 To declutter the app a bit,
 the custom close button is hidden until the user interacts with this the area:
 </p>
 
 <pre data-filename="main.css">
 &lt;style>
 nav:hover #close-button {
   opacity: 1;
 }
 
 #close-button {
   float: right;
   padding: 0 5px 2px 5px;
   font-weight: bold;
   opacity: 0;
   -webkit-transition: all 0.3s ease-in-out;
 }
 &lt;/style>
 </pre>
-<pre data-filename="main.html">
+<pre data-filename="main">
 &lt;button class="btn" id="close-button" title="Close">x&lt;/button>
 </pre>
 
 <p>
 In
 <a href="https://github.com/GoogleChrome/chrome-app-samples/blob/master/gdrive/js/app.js">app.js</a>,
 this button is hooked up to <code>window.close()</code>.
 </p>
 
 <h2 id="four">Designing the app the Angular way</h2>
 
 <p>
 Angular is an MVC framework, so we need to define the app in such a way that a 
 model, view, and controller logically fall out of it. Luckily, this is trivial when using Angular.
 </p>
 
 <p>
 The View is the easiest, so let's start there.
 </p>
 
 <h3 id="view">Creating the view</h3>
 
 <p>
-<a href="https://github.com/GoogleChrome/chrome-app-samples/blob/master/gdrive/main.html">main.html</a>
+<a href="https://github.com/GoogleChrome/chrome-app-samples/blob/master/gdrive/main">main</a>
 is the "V" in MVC; where we define HTML templates to render data into.
 In Angular, templates are simple blocks of HTML with some special sauce.
 </p>
 
 <p>
 Ultimately we want to display the user's list of files.
 For that, a simple &lt;ul> list makes sense.
 The Angular bits are highlighted in bold: 
 </p>
 
-<pre data-filename="main.html">
+<pre data-filename="main">
 &lt;ul>
   &lt;li <strong>data-ng-repeat="doc in docs"</strong>>
     &lt;img data-ng-src=<strong>"&#123;{doc.icon}&#125;"</strong>> &lt;a href=<strong>"&#123;{doc.alternateLink}&#125;"</strong>><strong>&#123;{doc.title}&#125;</strong>&lt;/a>
 <strong>&#123;{doc.size}&#125;</strong>
     &lt;span class="date"><strong>&#123;{doc.updatedDate}&#125;</strong>&lt;/span>
   &lt;/li>
 &lt;/ul>
 </pre>
 
 <p>
@@ skipping 12 matching lines @@
 You could easily write the repeater as <code>&lt;li ng-repeat="doc in docs"></code>.
 </p>
 
 <p>
 Next, we need to tell Angular which controller will oversee this template's rendering.
 For that, we use the
 <a href="http://docs.angularjs.org/api/ng.directive:ngController">ngController</a>
 directive to tell the <code>DocsController</code> to have reign over the template &lt;body&gt;:
 </p>
 
-<pre data-filename="main.html">
+<pre data-filename="main">
 &lt;body <strong>data-ng-controller="DocsController"</strong>>
 &lt;section id="main">
   &lt;ul>
     &lt;li data-ng-repeat="doc in docs">
       &lt;img data-ng-src="&#123;{doc.icon}&#125;"> &lt;a href="&#123;{doc.alternateLink}&#125;">&#123;{doc.title}&#125;&lt;/a> &#123;{doc.size}&#125;
       &lt;span class="date">&#123;{doc.updatedDate}&#125;&lt;/span>
     &lt;/li>
   &lt;/ul>
 &lt;/section>
 &lt;/body>
 </pre>
 
 <p>
 Keep in mind,
 what you don't see here is us hooking up event listeners or properties for data binding.
 Angular is doing that heavy lifting for us!
 </p>
 
 <p>
 The last step is to make Angular light up our templates.
 The typical way to do that is include the
 <a href="http://docs.angularjs.org/api/ng.directive:ngApp">ngApp</a>
 directive all the way up on &lt;html>:
 </p>
 
-<pre data-filename="main.html">
+<pre data-filename="main">
 &lt;html <strong>data-ng-app="gDriveApp"</strong>>
 </pre>
 
 <p>
 You could also scope the app down
 to a smaller portion of the page if you wanted to.
 We only have one controller in this app,
 but if we were to add more later,
 putting <a href="http://docs.angularjs.org/api/ng.directive:ngApp">ngApp</a>
 on the topmost element makes the entire page Angular-ready.
 </p>
 
 <p>
-The final product for <code>main.html</code> looks something like this:
+The final product for <code>main</code> looks something like this:
 </p>
 
-<pre data-filename="main.html">
+<pre data-filename="main">
 &lt;html <strong>data-ng-app="gDriveApp"</strong>>
 &lt;head>
   …
   <!-- crbug.com/120693: so we don't need target="_blank" on every anchor. -->
   &lt;base target="_blank">
 &lt;/head>
 &lt;body <strong>data-ng-controller="DocsController"</strong>>
 &lt;section id="main">
   &lt;nav>
     &lt;h2>Google Drive Uploader&lt;/h2>
     &lt;button class="btn" <strong>data-ng-click="fetchDocs()"</strong>>Refresh&lt;/button>
     &lt;button class="btn" id="close-button" title="Close">&lt;/button>
   &lt;/nav>
   &lt;ul>
     &lt;li <strong>data-ng-repeat="doc in docs"</strong>>
       &lt;img data-ng-src=<strong>"&#123;{doc.icon}&#125;"</strong>> &lt;a href=<strong>"&#123;{doc.alternateLink}&#125;"</strong>><strong>&#123;{doc.title}&#125;</strong>&lt;/a>  <strong>&#123;{doc.size}&#125;</strong>
       &lt;span class="date"><strong>&#123;{doc.updatedDate}&#125;</strong>&lt;/span>
     &lt;/li>
   &lt;/ul>
 &lt;/section>
 </pre>
 
 <h3 id="csp">A word on Content Security Policy</h3>
 
 <p>
 Unlike many other JS MVC frameworks,
 Angular v1.1.0+ requires no tweaks to work within a strict
-<a href="contentSecurityPolicy.html">CSP</a>.
+<a href="contentSecurityPolicy">CSP</a>.
 It just works, out of the box!
 </p>
 
 <p>
 However, if you're using an older version
 of Angular between v1.0.1 and v1.1.0,
 you'll need tell Angular to run in a "content security mode".
 This is done by including the
 <a href="http://docs.angularjs.org/api/ng.directive:ngCsp">ngCsp</a>
 directive alongside <a href="http://docs.angularjs.org/api/ng.directive:ngApp">ngApp</a>:
 </p>
 
-<pre data-filename="main.html">
+<pre data-filename="main">
 &lt;html data-ng-app data-ng-csp>
 </pre>
 
 <h3 id="authorization">Handling authorization</h3>
 
 <p>
 The data model isn't generated by the app itself.
 Instead, it's populated from an external API (the Google Drive API).
 Thus, there's a bit of work necessary in order to populate the app's data.
 </p>
@@ skipping 393 matching lines @@
         $scope.fetchDocs();
       });
     });
   });
 
   return gdocs;
 });
 </pre>
 
 <p class="backtotop"><a href="#top">Back to top</a></p>