From 1565f584081a14eafee85c8a47476237225669bd Mon Sep 17 00:00:00 2001
From: Stephen Sawchuk <sawchuk@gmail.com>
Date: Tue, 19 May 2015 15:31:05 -0400
Subject: [PATCH] add version switcher dropdown

---
 docs/site/components/docs/docs.html           | 10 ---------
 docs/site/components/docs/docs.js             | 19 ----------------
 .../components/subpage/subpage-directive.js   | 16 +++++++++++++-
 docs/site/components/subpage/subpage.html     | 13 +++++++++++
 docs/site/css/main.css                        | 22 +++++++++++--------
 5 files changed, 41 insertions(+), 39 deletions(-)

diff --git a/docs/site/components/docs/docs.html b/docs/site/components/docs/docs.html
index 079531cf1cc..af7af3e80ed 100644
--- a/docs/site/components/docs/docs.html
+++ b/docs/site/components/docs/docs.html
@@ -8,16 +8,6 @@
           Report an Issue
         </a>
       </div>
-      <div class="col margin-vertical">
-        <a href="#/docs/history" ng-show="showReference"
-          class="v-btn">
-          <img src="site/img/icon-arrow-bullet.svg" />
-          Version History (<i>{{version}}</i>)
-        </a>
-      </div>
-      <div>
-        <div ng-if="lastBuiltDate" class="build-date">Docs last built {{lastBuiltDate}}.</div>
-      </div>
     </div>
   </header>
 </script>
diff --git a/docs/site/components/docs/docs.js b/docs/site/components/docs/docs.js
index 24f9ece02e4..bbd4ec34bd0 100644
--- a/docs/site/components/docs/docs.js
+++ b/docs/site/components/docs/docs.js
@@ -260,10 +260,6 @@ angular
       .when('/docs', {
         redirectTo: '/docs/' + versions[0]
       })
-      .when('/docs/history', {
-        controller: 'HistoryCtrl',
-        templateUrl: 'site/components/docs/docs.html'
-      })
       .when('/docs/:version', {
         controller: 'DocsCtrl',
         templateUrl: 'site/components/docs/docs.html',
@@ -325,13 +321,6 @@ angular
       return !$routeParams.class && doc.toLowerCase() === $routeParams.module;
     };
 
-    if ($routeParams.version === 'master') {
-      $http.get('https://api.github.com/repos/GoogleCloudPlatform/gcloud-node/commits?sha=gh-pages&per_page=1')
-        .then(function(resp) {
-          $scope.lastBuiltDate = moment(resp.data[0].commit.committer.date).format('MMMM Do, YYYY');
-        });
-    }
-
     // Set the page title (used in the header).
     var pageTitle = [];
 
@@ -359,12 +348,4 @@ angular
     $scope.methods = methods;
     $scope.version = $routeParams.version;
     $scope.versions = versions;
-  })
-
-  .controller('HistoryCtrl', function($scope, versions) {
-    'use strict';
-
-    $scope.pageTitle = 'Node.js Docs Versions';
-    $scope.showHistory = true;
-    $scope.versions = versions;
   });
diff --git a/docs/site/components/subpage/subpage-directive.js b/docs/site/components/subpage/subpage-directive.js
index 5cde1597ade..9bbff6641f8 100644
--- a/docs/site/components/subpage/subpage-directive.js
+++ b/docs/site/components/subpage/subpage-directive.js
@@ -1,6 +1,6 @@
 angular
   .module('gcloud.subpage', ['gcloud.header'])
-  .directive('subpage', function($rootScope, $location, $parse, getLinks) {
+  .directive('subpage', function($rootScope, $location, $http, $parse, getLinks, versions) {
     'use strict';
 
     return {
@@ -11,6 +11,20 @@ angular
         $scope.links = getLinks();
         $scope.headerTemplateUrl = attrs.headerTemplateurl;
 
+        $scope.versionSelected = $rootScope.ACTIVE_VERSION;
+        $scope.versions = versions;
+
+        $scope.loadDocsVersion = function(newVersion) {
+          $location.path('docs/' + newVersion);
+        };
+
+        if ($scope.versionSelected === 'master') {
+          $http.get('https://api.github.com/repos/GoogleCloudPlatform/gcloud-node/commits?sha=gh-pages&per_page=1')
+            .then(function(resp) {
+              $scope.lastBuiltDate = moment(resp.data[0].commit.committer.date).format('MMMM Do, YYYY');
+            });
+        }
+
         if (attrs.isActiveUrl) {
           $scope.isActiveUrl = $parse(attrs.isActiveUrl)($scope);
         } else {
diff --git a/docs/site/components/subpage/subpage.html b/docs/site/components/subpage/subpage.html
index de32bd88a3a..b540da1fe64 100644
--- a/docs/site/components/subpage/subpage.html
+++ b/docs/site/components/subpage/subpage.html
@@ -15,6 +15,19 @@ <h1 class="logo">
   <section class="content" ng-transclude></section>
 
   <nav class="side-nav">
+    <div class="side-nav--meta">
+      <small><em>Browsing Version</em></small>
+
+      <select
+        ng-model="versionSelected"
+        ng-options="version for version in versions"
+        ng-change="loadDocsVersion(versionSelected)"></select>
+
+      <div ng-if="lastBuiltDate">
+        <small><em>Docs last built {{lastBuiltDate}}.</em></small>
+      </div>
+    </div>
+
     <ul class="page-sections">
       <li ng-repeat="page in links">
         <a
diff --git a/docs/site/css/main.css b/docs/site/css/main.css
index bd9edf37d43..3c34520c364 100755
--- a/docs/site/css/main.css
+++ b/docs/site/css/main.css
@@ -223,8 +223,13 @@ ul {
     margin: 10px;
 }
 
+.margin-left {
+    margin-left: 10px;
+}
+
 .margin-vertical {
-    margin: 10px 0;
+    margin-top: 10px;
+    margin-bottom: 10px;
 }
 
 .subtle {
@@ -926,6 +931,13 @@ ul {
     background: #efefef;
  }
 
+ .side-nav .side-nav--meta {
+    padding: 10px;
+    background-color: #f5f5f5;
+    text-align: center;
+    margin-bottom: 10px;
+ }
+
 .side-nav a {
     display: block;
     padding: 0.3em 2em;
@@ -1131,10 +1143,6 @@ ul {
         height: 0.6em;
     }
 
-    .build-date {
-      margin-left: 0em;
-    }
-
 }
 
 @media only screen and (min-width: 45em) {
@@ -1143,10 +1151,6 @@ ul {
         line-height: normal;
         margin-left: .5em;
     }
-
-    .build-date {
-      margin-left: 0.5em;
-    }
 }
 
 @media only screen and (min-width: 50em) {