update templates-sdk-dev to support the referenceonly build.
includes an updated snapshot of the css and js files from devsite

Change-Id: Ib597c1dd488347795e02e1d09880559ead1d54e0
diff --git a/tools/droiddoc/templates-sdk-dev/assets/css/default.css b/tools/droiddoc/templates-sdk-dev/assets/css/default.css
index 43449d4..e422d75 100644
--- a/tools/droiddoc/templates-sdk-dev/assets/css/default.css
+++ b/tools/droiddoc/templates-sdk-dev/assets/css/default.css
@@ -86,6 +86,11 @@
   #page-footer #copyright {
     margin-bottom: 10px; }
 
+.hide-text {
+  position: absolute;
+  text-indent: -9999px;
+}
+
 #nav-container {
   width: 160px;
   min-height: 10px;
@@ -150,10 +155,44 @@
   max-width: 100%;
   vertical-align: middle;
 }
+
 video {
+  cursor: pointer;
+  margin-bottom: 10px; /* same as img */
   max-width: 100%;
   object-fit: cover;
 }
+
+.video-wrapper {
+  line-height: 0;
+  margin-bottom: 10px; /* same as img */
+  position: relative;
+}
+
+.video-wrapper video {
+  margin:0;
+}
+
+.video-wrapper:before {
+  background: rgba(0, 0, 0, 0.5) url(//material-design.storage.googleapis.com/images/play.svg) no-repeat center center;
+  background-size: 72px 72px;
+  bottom: 0;
+  content: "";
+  left: 0;
+  position: absolute;
+  right: 0;
+  top: 0;
+  transition: opacity .2s;
+}
+
+.video-wrapper:hover:before {
+  opacity: .7;
+}
+
+.video-wrapper.playing:before {
+  opacity: 0;
+}
+
 q {
   quotes: none;
 }
@@ -283,7 +322,8 @@
 li pre,
 li ul,
 li ol,
-li dl {
+li dl,
+#body-content li img {
   margin-top: 6px;
   margin-bottom: 6px;
 }
@@ -346,6 +386,10 @@
   border:solid 1px #DDD;
   font-weight: normal;
 }
+tr.alt th {
+  color:inherit;
+  background-color: #e0e0e0;
+}
 tr:first-of-type th:first-of-type:empty {
   visibility: hidden;
 }
@@ -355,8 +399,18 @@
   padding-right:16px;
 }
 
-#jd-content img {
-  margin-bottom:15px;
+#body-content img {
+  margin-bottom:12px;
+}
+
+#body-content p>img {
+  margin-bottom:0;
+}
+
+#body-content img.inline-icon {
+  vertical-align:sub;
+  margin:0;
+  height:16px;
 }
 
 em {
@@ -1007,6 +1061,35 @@
   overflow:hidden;
 }
 
+#api-info-block {
+  color: #999;
+  float: right;
+  font-size: 12px;
+  font-weight: normal;
+  line-height: 14px;
+  margin: 20px 0 0;
+  max-width: 80%;
+  padding: 0 10px 6px;
+  text-align: right;
+}
+
+#api-info-block a,
+#api-info-block a:active,
+#api-info-block a:visited {
+  color: #222;
+}
+
+#jd-header {
+  font-size: 12px;
+  margin: 20px 0 12px;
+  padding: 0 0 12px;
+}
+
+#jd-header h1 {
+  margin: 0;
+  padding: 0 0 6px;
+}
+
 #jd-content
 .framed-wear-square img {
   height:222px;
@@ -1218,6 +1301,12 @@
 .locales form {
     margin: 0;
 }
+
+.locales select,
+.locales option {
+  text-transform: capitalize;
+}
+
 .locales select, .sites select {
   line-height: 3.08;
   margin: 0px 0;
@@ -1439,6 +1528,7 @@
 
 #tb ol,
 #tb ul,
+#tb p,
 #qv ul {
   list-style-type: none;
   margin:0 15px 10px 15px;
@@ -1451,10 +1541,6 @@
   position: relative;
 }
 
-#tb p {
-  margin:0 15px 10px;
-}
-
 #qv ol {
   list-style:none;
   margin:0 15px 15px;
@@ -1472,8 +1558,7 @@
 }
 
 .sidebox p,
-#qv p,
-#tb p {
+#qv p {
   margin: 0 0 10px;
 }
 
@@ -1837,26 +1922,34 @@
 #doc-content-container {
   margin-left: 291px
 }
+
 #doc-header, #doc-content {
-  padding: 1em 2em;
+  padding: 0;
 }
+
 #doc-header {
   background: #f7f7f7;
 }
+
 #doc-header h1 {
   line-height: 0;
   padding-bottom: 15px;
 }
+
+
 #api-info-block {
   float: right;
   font-weight: bold;
 }
+
 #api-info-block a, #api-info-block a:active, #api-info-block a:visited {
   color: #222;
 }
+
 #api-info-block a:hover, #api-info-block a:focus {
   color: #33B5E5;
 }
+
 #api-nav-header {
   height:19px; /* plus 16px padding = 35; same as #nav li */
   font-size:14px;
@@ -1867,6 +1960,7 @@
   background: rgba(0, 0, 0, 0.05); /* matches #nav li.expanded */
   line-height: 19px; /* Fix regression after page line-height is bumped to 24px */
 }
+
 #api-nav-title {
   padding:0 5px;
   white-space:nowrap;
@@ -1890,6 +1984,7 @@
   display: inline-block;
   overflow: hidden;
 }
+
 #api-level-toggle select {
   border: 0;
   appearance:none;
@@ -2075,7 +2170,7 @@
 Styles for project structure (treeview) page
 */
 .structure-dir {
-background-image:url(../../assets/images/folder.png);
+background-image:url(../images/folder.png);
 background-repeat:no-repeat;
 background-position:16px 2px;
   margin:.25em 0 0 0;
@@ -2089,7 +2184,7 @@
 }
 
 .structure-java{
-background-image:url(../../assets/images/file-java.png);
+background-image:url(../images/file-java.png);
 background-repeat:no-repeat;
 background-position:0px 2px;
   margin:.3em 0 0 0;
@@ -2097,7 +2192,7 @@
 }
 
 .structure-file {
-background-image:url(../../assets/images/file-generic.png);
+background-image:url(../images/file-generic.png);
 background-repeat:no-repeat;
 background-position:0px 2px;
   margin:.3em 0 0 0;
@@ -2105,7 +2200,7 @@
 }
 
 .structure-xml {
-background-image:url(../../assets/images/file-xml.png);
+background-image:url(../images/file-xml.png);
 background-repeat:no-repeat;
 background-position:0px 2px;
   margin:.3em 0 0 0;
@@ -2113,7 +2208,7 @@
 }
 
 .structure-img {
-background-image:url(../../assets/images/file-image.png);
+background-image:url(../images/file-image.png);
 background-repeat:no-repeat;
 background-position:0px 2px;
   margin:.3em 0 0 0;
@@ -2121,7 +2216,7 @@
 }
 
 .structure-manifest {
-background-image:url(../../assets/images/file-manifest.png);
+background-image:url(../images/file-manifest.png);
 background-repeat:no-repeat;
   margin:.0 0 0 1.25em;
   padding:0 0 0 22px;
@@ -2219,6 +2314,25 @@
   list-style:none;
   margin-left:0;
 }
+
+ol.callouts {
+  counter-reset: item;
+  list-style-type: none;
+  margin-left:44px;
+}
+ol.callouts>li:before {
+  counter-increment: item;
+  content: counter(item);
+  position: absolute;
+  color:#fff;
+  font-weight:bold;
+  background-image:url(../images/styles/callout-bg_2x.png);
+  background-size:24px;
+  width:16px;
+  padding-left:8px;
+  margin-left:-34px;
+}
+
 #tb .nolist {
   margin-left:15px;
 }
@@ -2481,20 +2595,20 @@
 a.notice-designers-video div,
 a.notice-designers div {
   min-height:40px;
-  background:url('../images/styles/notice-developers@2x.png') no-repeat 10px 10px;
+  background:url('../images/styles/notice-developers_2x.png') no-repeat 10px 10px;
   background-size:40px 40px;
   padding:10px 10px 10px 60px;
 }
 a.notice-designers div {
-  background:url('../images/styles/notice-designers@2x.png') no-repeat 10px 10px;
+  background:url('../images/styles/notice-designers_2x.png') no-repeat 10px 10px;
   background-size:40px 40px;
 }
 a.notice-designers-video div {
-  background:url('../images/styles/notice-designers-video@2x.png') no-repeat 10px 10px;
+  background:url('../images/styles/notice-designers-video_2x.png') no-repeat 10px 10px;
   background-size:40px 40px;
 }
 a.notice-developers-video div {
-  background:url('../images/styles/notice-developers-video@2x.png') no-repeat 10px 10px;
+  background:url('../images/styles/notice-developers-video_2x.png') no-repeat 10px 10px;
   background-size:40px 40px;
 }
 a.notice-developers-video:hover,
@@ -3209,11 +3323,16 @@
 }
 
 /* offset the <a name=""> tags to account for sticky nav */
-body.reference a[name] {
+body.reference a[name]:not(.nav-start-marker) {
   visibility: hidden;
   display: block;
   position: relative;
   top: -56px;
+
+}
+
+.nav-start-marker {
+  position: absolute;
 }
 
 
@@ -4805,7 +4924,7 @@
   background-color: #fff;
   background-position: 50% 53%;
   background-size: cover;
-  background-image: url(../../assets/images/home/android_m_hero_1200.jpg);
+  background-image: url(../images/home/android_m_hero_1200.jpg);
   box-sizing: border-box;
   font-size: 16px;
   min-height: 550px;
@@ -5117,45 +5236,124 @@
   left: 0;
   overflow: hidden;
   background: #fefefe;
-  padding: 6px 12px; }
-  .card-info .section {
-    color: #898989;
-    font-size: 11px;
-    font-weight: 700;
-    letter-spacing: .3px;
-    line-height: 20px;
-    text-transform: uppercase; }
-  .card-info .title {
-    color: #333;
-    font-size: 18px;
-    font-weight: 500;
-    line-height: 23px;
-    margin-bottom: 7px;
-    max-height: 46px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: normal; }
-  .card-info .description {
-    overflow: hidden; }
-    .card-info .description .text {
-      color: #666;
-      font-size: 14px;
-      height: 60px;
-      line-height: 20px;
-      overflow: hidden;
-      width: 100%; }
-    .card-info .description .util {
-      position: absolute;
-      right: 5px;
-      bottom: 70px;
-      opacity: 0;
-      -webkit-transition: opacity 0.5s;
-              transition: opacity 0.5s; }
-  .card-info.empty-desc .title {
-    white-space: normal;
-    overflow: visible; }
-  .card-info.empty-desc .description {
-    display: none; }
+  padding: 6px 12px;
+}
+
+.card-info .section {
+  color: #898989;
+  font-size: 11px;
+  font-weight: 700;
+  letter-spacing: .3px;
+  line-height: 20px;
+  text-transform: uppercase;
+}
+
+.card-info .title {
+  color: #333;
+  font-size: 18px;
+  font-weight: 500;
+  line-height: 23px;
+  margin-bottom: 7px;
+  max-height: 46px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: normal;
+}
+
+.card-info .description {
+  overflow: hidden;
+}
+
+.card-info .description .text {
+  color: #666;
+  font-size: 14px;
+  height: 60px;
+  line-height: 20px;
+  overflow: hidden;
+  width: 100%;
+}
+
+.card-info .description .util {
+  position: absolute;
+  right: 5px;
+  bottom: 70px;
+  opacity: 0;
+  -webkit-transition: opacity 0.5s;
+  transition: opacity 0.5s;
+}
+
+.card-info.empty-desc .title {
+  white-space: normal;
+  overflow: visible;
+}
+
+.card-info.empty-desc .description {
+  display: none;
+}
+
+/* Resource card with icon instead of bg image */
+.resource-widget-card-icon {
+  text-align: center;
+}
+
+.card-icon {
+  margin: 20px 0 0;
+}
+
+.resource-widget-card-icon .card-info {
+  height: 210px;
+}
+
+.resource-widget-card-icon .card-info .title {
+  color: #333;
+  line-height: 24px;
+}
+
+.resource-widget-card-icon .card-bg {
+  background: none;
+  bottom: 220px;
+  opacity: 1;
+  top: 30px;
+  -webkit-transition: opacity .3s;
+  transition: opacity .3s;
+}
+
+.resource-widget-card-icon .resource-card:hover .card-bg {
+  opacity: .5;
+}
+
+.resource-widget-card-icon .card-bg img {
+  max-height: 100%;
+}
+
+.resource-widget-card-icon .card-bg::after {
+  background: transparent;
+}
+
+@media (min-width: 1210px) {
+  .resource-widget-card-icon .resource {
+    height: 240px;
+  }
+  .resource-widget-card-icon .card-bg {
+    bottom: 160px;
+  }
+  .resource-widget-card-icon .card-info {
+    height: 160px;
+  }
+}
+
+@media (max-width: 979px) {
+  .resource-widget-card-icon .resource {
+    height: 240px;
+  }
+  .resource-widget-card-icon .card-bg {
+    bottom: 160px;
+  }
+
+  .resource-widget-card-icon .card-info {
+    height: 160px;
+  }
+}
 
 /* Truncate card summaries at bounding box and
  * and apply ellipsis at lower right */
@@ -5544,26 +5742,54 @@
   height: 558px; }
 
 /* 1/3 row items */
-.resource-card-3x2 > .card-bg, .resource-card-6x2 > .card-bg, .resource-card-9x2 > .card-bg, .resource-card-12x2 > .card-bg, .resource-card-15x2 > .card-bg, .resource-card-18x2 > .card-bg {
+.resource-card-3x2 > .card-bg,
+.resource-card-6x2 > .card-bg,
+.resource-card-9x2 > .card-bg,
+.resource-card-12x2 > .card-bg,
+.resource-card-15x2 > .card-bg,
+.resource-card-18x2 > .card-bg {
   left: 0;
   top: 0;
   width: 90px;
   height: 100%;
   position: absolute;
-  display: block; }
+  display: block;
+}
 
 .resource-card-3x2 > .card-info, .resource-card-6x2 > .card-info, .resource-card-9x2 > .card-info, .resource-card-12x2 > .card-info, .resource-card-15x2 > .card-info, .resource-card-18x2 > .card-info {
   height: 100%;
   left: 90px;
   padding: 6px 12px;
-  overflow: hidden; }
-  .resource-card-3x2 > .card-info .title, .resource-card-6x2 > .card-info .title, .resource-card-9x2 > .card-info .title, .resource-card-12x2 > .card-info .title, .resource-card-15x2 > .card-info .title, .resource-card-18x2 > .card-info .title {
-    max-height: 69px;
-    white-space: normal; }
-  .resource-card-3x2 > .card-info .description, .resource-card-6x2 > .card-info .description, .resource-card-9x2 > .card-info .description, .resource-card-12x2 > .card-info .description, .resource-card-15x2 > .card-info .description, .resource-card-18x2 > .card-info .description {
-    display: none; }
-  .resource-card-3x2 > .card-info .text, .resource-card-6x2 > .card-info .text, .resource-card-9x2 > .card-info .text, .resource-card-12x2 > .card-info .text, .resource-card-15x2 > .card-info .text, .resource-card-18x2 > .card-info .text {
-    height: auto; }
+  overflow: hidden;
+}
+
+.resource-card-3x2 > .card-info .title,
+.resource-card-6x2 > .card-info .title,
+.resource-card-9x2 > .card-info .title,
+.resource-card-12x2 > .card-info .title,
+.resource-card-15x2 > .card-info .title,
+.resource-card-18x2 > .card-info .title {
+  max-height: 69px;
+  white-space: normal;
+}
+
+.resource-card-3x2 > .card-info .description,
+.resource-card-6x2 > .card-info .description,
+.resource-card-9x2 > .card-info .description,
+.resource-card-12x2 > .card-info .description,
+.resource-card-15x2 > .card-info .description,
+.resource-card-18x2 > .card-info .description {
+  display: none;
+}
+
+.resource-card-3x2 > .card-info .text,
+.resource-card-6x2 > .card-info .text,
+.resource-card-9x2 > .card-info .text,
+.resource-card-12x2 > .card-info .text,
+.resource-card-15x2 > .card-info .text,
+.resource-card-18x2 > .card-info .text {
+  height: auto;
+}
 
 /* Override to show the description instead of the content section */
 .no-section .resource-card-3x2 > .card-info .section,
@@ -5716,6 +5942,12 @@
 .dac-button.dac-large, .landing-button {
   padding: 12px 24px; }
 
+.landing-button-wrap {
+  float: left;
+  margin-right: 40px;
+  width: auto;
+}
+
 .dac-fab, .dac-button-social {
   background: #fff;
   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.26);
@@ -5825,67 +6057,130 @@
   margin-top: 96px;
   padding-bottom: 20px;
   position: relative;
-  /* Modifier for landing pages, to snuggle closer to sections. */ }
-  .dac-footer a {
-    color: #999; }
-  .dac-footer p {
-    margin: 7px 0 0; }
-  .dac-footer-main {
-    padding: 30px 0; }
+}
+
+.dac-footer a {
+  color: #999;
+}
+
+.dac-footer p {
+  margin: 7px 0 0;
+}
+
+.dac-footer-main {
+  padding: 30px 0;
+}
+
+.dac-footer-reachout {
+  text-align: right;
+}
+
+.dac-footer-contact,
+.dac-footer-social {
+  display: inline-block;
+}
+
+.dac-footer .dac-footer-getnews,
+.dac-footer .dac-footer-contact-link {
+  color: #000;
+  cursor: pointer;
+  font-size: 20px;
+  font-weight: 300;
+  margin: 8px 0;
+  vertical-align: middle;
+}
+
+.dac-footer .dac-footer-contact-link,
+.dac-footer .dac-footer-social-link {
+  margin-left: 16px;
+  margin-right: 0;
+}
+
+.dac-footer-getnews > .dac-fab, .dac-footer-getnews > .dac-button-social {
+  margin-left: 4px;
+}
+
+.dac-footer-separator {
+  background: #f0f0f0;
+  margin: 0 0 12px;
+}
+
+.dac-footer-links {
+  float: left;
+  margin: 10px 0 60px;
+  width: 50%;
+}
+
+.dac-footer-links a + a:before {
+  content: '|';
+  cursor: default;
+  margin: 0 10px 0 8px;
+}
+
+.devsite-utility-footer-language {
+  float: right;
+  margin: 10px 0 60px;
+  width: 50%;
+}
+
+.dac-footer .locales {
+  float: right;
+  margin: 0;
+}
+
+.dac-footer .locales select {
+  background-color: #f0f0f0;
+  border-radius: 3px;
+  font-size: 12px;
+  height: auto;
+  margin-top: -2px;
+  padding: 8px 12px;
+  width: 146px;
+}
+
+.dac-footer.dac-landing {
+  margin-top: 0;
+  border-top: 0;
+}
+
+@media (max-width: 719px) {
   .dac-footer-reachout {
-    text-align: right; }
-  .dac-footer-contact, .dac-footer-social {
-    display: inline-block; }
-  .dac-footer .dac-footer-getnews,
-  .dac-footer .dac-footer-contact-link {
-    color: #000;
-    cursor: pointer;
-    font-size: 20px;
-    font-weight: 300;
-    margin: 8px 0;
-    vertical-align: middle; }
+    text-align: left;
+  }
+
+  .dac-footer-social {
+    display: block;
+  }
+
+  .dac-footer-social-link,
+  .dac-footer-contact-link {
+    display: inline-block;
+  }
+
   .dac-footer .dac-footer-contact-link,
   .dac-footer .dac-footer-social-link {
-    margin-left: 16px;
-    margin-right: 0; }
-  .dac-footer-getnews > .dac-fab, .dac-footer-getnews > .dac-button-social {
-    margin-left: 4px; }
-  .dac-footer-separator {
-    background: #f0f0f0;
-    margin: 0 0 12px; }
-  .dac-footer-links a + a:before {
-    content: '|';
-    cursor: default;
-    margin: 0 10px 0 8px; }
+    margin-left: 0;
+    margin-right: 16px;
+  }
+
+  .dac-footer-links {
+    display: block;
+    float: none;
+    width: 100%;
+  }
+
+  .devsite-utility-footer-language {
+    float: none;
+    margin: 0 0 20px;
+    width: 100%;
+  }
+
   .dac-footer .locales {
-    float: right;
-    margin: 0; }
-    .dac-footer .locales select {
-      background-color: #f0f0f0;
-      border-radius: 3px;
-      font-size: 12px;
-      height: auto;
-      margin-top: -2px;
-      padding: 8px 12px;
-      width: 146px; }
-  .dac-footer.dac-landing {
-    margin-top: 0;
-    border-top: 0; }
-  @media (max-width: 719px) {
-    .dac-footer-reachout {
-      text-align: left; }
-    .dac-footer-social {
-      display: block; }
-    .dac-footer-social-link, .dac-footer-contact-link {
-      display: inline-block; }
-    .dac-footer .dac-footer-contact-link,
-    .dac-footer .dac-footer-social-link {
-      margin-left: 0;
-      margin-right: 16px; }
-    .dac-footer .locales {
-      display: block;
-      float: none;
-      margin-top: 15px; } }
+    display: block;
+    float: none;
+    margin-top: 15px;
+  }
+}
 
 /* =============================================================================
    Columns
@@ -5893,11 +6188,14 @@
 .wrap {
   margin: 0 auto;
   max-width: 940px;
-  clear: both; }
-  .dac-fullscreen-mode .wrap {
-    max-width: none; }
+  clear: both;
+}
 
-.dac-full-screen-mode .dac-search-open .wrap {
+.dac-fullscreen-mode .wrap {
+  max-width: none;
+}
+
+.dac-fullscreen-mode .dac-search-open .wrap {
   max-width: 940px;
 }
 
@@ -6569,11 +6867,11 @@
   z-index: 61;
 }
 
-.dac-ndk {
+.dac-ndk .dac-header {
   background: #00bcd4;
 }
 
-.dac-studio {
+.dac-studio .dac-header {
   background: #424242;
 }
 
@@ -6637,12 +6935,12 @@
     display: inline-block;
   }
 
-  /* Do not show nav toggle and up-nav button for left nav
-     in Studio docs, when header tabs are visible */
-  body.studio .dac-nav-back-button {
+  /* Do not show nav toggle and up-nav button for left nav,
+     when header tabs are visible (when no sub navigation) */
+  body.no-subnav .dac-nav-back-button {
     display:none;
   }
-  body.studio .dac-nav-sub {
+  body.no-subnav .dac-nav-sub {
     top: 0 !important;
   }
 }
@@ -6663,7 +6961,8 @@
   font-weight: 500;
 }
 
-.dac-header-tab:hover {
+.dac-header-tab:hover,
+.dac-header-tab:focus {
   color: #fff;
 }
 
@@ -6757,7 +7056,7 @@
   display: inline-block;
 }
 
-body.studio .dac-header-crumbs {
+body.no-crumbs .dac-header-crumbs {
   display:none;
 }
 
@@ -6822,6 +7121,10 @@
   transition: width 300ms, right 100ms, margin 100ms;
 }
 
+.dac-studio .dac-header-search {
+  right: 20px; /* move searchbar farther right, because there's no button */
+}
+
 .dac-header-search-inner {
   margin: 0 auto;
   max-width: 940px;
@@ -6881,9 +7184,6 @@
   width: 100%;
 }
 
-.dac-studio .dac-header-search {
-  right:150px;
-}
 .dac-studio .dac-header-search-input {
   background: rgba(255, 255, 255, 0.3);
 }
@@ -6998,6 +7298,7 @@
 }
 
 @media (min-width: 720px) and (max-width: 979px) {
+  .dac-studio .dac-header-search,
   .dac-header-search {
     right: 20px;
     width: 200px;
@@ -7168,10 +7469,33 @@
   z-index: 1;
 }
 
-.dac-nav-back-button, .dac-nav-back-button:hover, .dac-nav-back-button:active {
+.dac-nav-back-button,
+.dac-nav-back-button:hover,
+.dac-nav-back-button:active,
+.dac-nav-back-button:focus     {
   color: rgba(255, 255, 255, 0.7);
 }
 
+/* The back button in Studio and NDK left nav */
+.dac-nav-back-button.back-to-dev {
+  background: none;
+  color: #444;
+  position: relative !important;
+  top: -16px;
+}
+
+.dac-nav-back-button.back-to-dev:hover,
+.dac-nav-back-button.back-to-dev:active,
+.dac-nav-back-button.back-to-dev:focus {
+  color: rgba(68, 68, 68, .7);
+}
+
+.dac-nav-back-button:focus .dac-nav-back {
+  outline-color: rgb(77, 144, 254);
+  outline-offset: 15px;
+  outline-style: auto;
+}
+
 .dac-nav-back-button > .dac-sprite, .dac-nav-back-button > .dac-modal-header-close:before, .paging-links .dac-nav-back-button > .prev-page-link:before, .paging-links .dac-nav-back-button > .next-page-link:before, .paging-links .dac-nav-back-button > .next-class-link:before, .paging-links .dac-nav-back-button > .start-class-link:after {
   opacity: .7;
 }
@@ -7335,7 +7659,8 @@
 .dac-nav-link {
   color: #444;
   display: block;
-  font-size: 18px;
+  font-size: 14px;
+  text-transform: uppercase;
   font-weight: 500;
   letter-spacing: .24px;
   padding: 5px 20px;
@@ -7356,6 +7681,7 @@
   font-size: 12px;
   font-weight: 400;
   padding-left: 40px;
+  text-transform: none;
 }
 
 .dac-nav-link.selected {
@@ -7406,18 +7732,18 @@
     padding-left: 250px;
   }
 
-  /* Do not show nav toggle for Studio on large screens */
-  body.studio .dac-nav-toggle {
+  /* Do not show nav toggle on large screens (when no subnav) */
+  body.no-subnav .dac-nav-toggle {
     display:none;
   }
-  body.studio .dac-header-logo {
+  body.no-subnav .dac-header-logo {
     padding-left:20px;
   }
-  /* And if the page has no subcomponent, don't show left nav at all */
-  body.studio.None .dac-nav {
+  /* ...If the page is also full-width, then don't show left nav at all */
+  body.no-subnav.full-width .dac-nav {
     display: none;
   }
-  body.studio.None #body-content {
+  body.no-subnav.full-width #body-content {
     padding-left:0;
   }
 }
@@ -7436,6 +7762,10 @@
   height: 100%;
 }
 
+.data-reference-resources-wrapper {
+  display: none;
+}
+
 .dac-reference-nav {
   height: calc(100% - 36px);
   overflow: hidden;
@@ -7480,11 +7810,12 @@
   padding: 0 0 0 13px;
 }
 
-.dac-reference-nav-resource, .dac-reference-nav-toggle {
+.dac-reference-nav-resource,
+.dac-reference-nav-toggle {
   color: #505050;
   cursor: pointer;
   display: block;
-  font-size: 13px;
+  font-size: 12px;
   line-height: 1;
   overflow: hidden;
   margin: 0;
@@ -7581,7 +7912,7 @@
   display: none;
 }
 
-#nav .nav-section-header:after {
+#nav .nav-section-header .toggle-icon {
   background: transparent url(../images/styles/disclosure_down.png) no-repeat scroll 50% 50%;
   content: '';
   height: 34px;
@@ -7616,7 +7947,7 @@
   padding: 0 10px;
 }
 
-#nav li.expanded > .nav-section-header:after {
+#nav li.expanded > .nav-section-header .toggle-icon {
   content: '';
   background: transparent url(../images/styles/disclosure_up.png) no-repeat scroll 50% 50%;
   width: 34px;
@@ -7774,7 +8105,26 @@
   top: 0;
 }
 
+.dac-hero {
+  background-size: cover;
+  position: relative;
+}
+
+.dac-hero-headline {
+  background-color: #fff;
+  bottom: 25px;
+  float: none !important;
+  padding: 0 10px 10px;
+  position: absolute;
+  right: 0;
+  z-index: 2;
+}
+
 @media (max-width: 719px) {
+  .dac-hero-headline {
+    bottom: 0;
+  }
+
   .dac-hero.dac-darken::before {
     background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.9) 80%);
     background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.9) 80%);
@@ -7804,6 +8154,10 @@
   margin: 0 0 14px;
 }
 
+.dac-studio .dac-hero-title {
+  padding-top:0;
+}
+
 @media (max-width: 719px) {
   .dac-hero-title {
     font-size: 28px;
@@ -7838,6 +8192,24 @@
   margin-left: -8px;
 }
 
+.dac-hero-cta.col-16 {
+  line-height: 1.4em;
+  margin-top: 20px;
+  padding-left: 0;
+  position: relative;
+}
+
+.dac-hero-cta.col-16 .dac-sprite {
+  position: absolute;
+  left: 0;
+  top: -3px;
+}
+
+.dac-hero-cta.col-16 .dac-sprite-text {
+  position: relative;
+  left: 12px;
+}
+
 @media (max-width: 719px) {
   .dac-hero-cta {
     line-height: 28px;
@@ -7849,16 +8221,16 @@
 }
 
 /* Android Studio download page */
-section#features {
+.dac-studio section#features {
   padding-top:0;
 }
-.wrap.feature {
+.dac-studio .wrap.feature {
   margin:80px auto;
 }
-.dac-section-links.feature-more {
+.dac-studio .dac-section-links.feature-more {
   margin-top:-20px;
 }
-.dac-toggle-content .wrap.feature {
+.dac-studio .dac-toggle-content .wrap.feature {
   margin-top:0;
 }
 
@@ -7873,12 +8245,12 @@
   }
 
   /* Android Studio download page */
-  .feature .dac-hero-figure,
-  .feature .dac-hero-figure img {
+  .dac-studio .feature .dac-hero-figure,
+  .dac-studio .feature .dac-hero-figure img {
     height:auto;
     max-height:none;
   }
-  .feature .dac-hero-figure img {
+  .dac-studio .feature .dac-hero-figure img {
     width:90%;
     margin:0 auto;
   }
@@ -9028,6 +9400,33 @@
   background-color: #dc4d38;
 }
 
+.dac-blue.dac-hero,
+.dac-blue.dac-section {
+  background-color: #0277bd;
+}
+
+.dac-blue.dac-invert .dac-hero-description,
+.dac-blue.dac-invert .dac-section-subtitle {
+  color: #fff;
+}
+
+.dac-dark-gray.dac-hero,
+.dac-dark-gray.dac-section {
+  background-color: #455a64;
+}
+
+.dac-bg-opacity::after {
+  background-color: rgba(0, 0, 0, .3);
+  content : "";
+  display: block;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 1;
+}
+
 .dac-hero-cta, .dac-section-title, .dac-section-links {
   color: #212121;
   color: rgba(0, 0, 0, 0.87);
@@ -9055,6 +9454,47 @@
   color: rgba(255, 255, 255, 0.7);
 }
 
+.dac-hero.dac-no-min-height {
+  min-height: 0;
+}
+
+.dac-hero-half-bg {
+  background-size: cover;
+  background-repeat: no-repeat;
+  float: right;
+  height: 440px;
+}
+
+.dac-hero-half-bg-centered {
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: cover;
+  float: right;
+  height: 440px;
+}
+
+@media only screen and (-webkit-min-device-pixel-ratio: 2),
+only screen and (-moz-min-device-pixel-ratio: 2),
+only screen and (min-device-pixel-ratio: 2),
+only screen and (min-resolution: 192dpi),
+only screen and (min-resolution: 2dppx) {
+  .dac-hero-half-bg,
+  .dac-hero-half-bg-centered {
+    background-size: "" "";
+  }
+}
+
+@media (max-width: 719px) {
+  .dac-hero-half-bg,
+  .dac-hero-half-bg-centered {
+    background-position: center;
+    background-size: auto 100%;
+    float: none;
+    height: 200px;
+    margin-top: 32px;
+  }
+}
+
 .dac-section {
   background-position: 50% 50%;
   background-size: cover;
@@ -9070,7 +9510,8 @@
   }
 }
 
-.dac-section.dac-small {
+.dac-section.dac-small,
+.dac-hero.dac-small {
   padding-bottom: 32px;
   padding-top: 32px;
 }
@@ -9146,34 +9587,76 @@
 */
 .dac-sprite, .dac-modal-header-close:before, .paging-links .prev-page-link:before, .paging-links .next-page-link:before, .paging-links .next-class-link:before, .paging-links .start-class-link:after, .Video-button--picture-in-picture, .Video-button--close, a.video-shadowbox-button.white::after, #tb li:before,
 #qv li:before {
-  background-image: url(/assets/images/sprite.png);
+  background-image: url(../images/sprite.png);
   display: inline-block;
-  vertical-align: middle; }
-  @media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx), (min-resolution: 144px) {
-    .dac-sprite, .dac-modal-header-close:before, .paging-links .prev-page-link:before, .paging-links .next-page-link:before, .paging-links .next-class-link:before, .paging-links .start-class-link:after, .Video-button--picture-in-picture, .Video-button--close, a.video-shadowbox-button.white::after, #tb li:before,
-    #qv li:before {
-      background-image: url(/assets/images/sprite@2x.png);
-      background-size: 36px 883px; } }
+  vertical-align: middle;
+}
 
-.dac-sprite.dac-auto-chevron, .dac-auto-chevron.dac-modal-header-close:before, .paging-links .dac-auto-chevron.prev-page-link:before, .paging-links .dac-auto-chevron.next-page-link:before, .paging-links .dac-auto-chevron.next-class-link:before, .paging-links .dac-auto-chevron.start-class-link:after {
+@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx), (min-resolution: 144px) {
+
+  .dac-sprite,
+  .dac-modal-header-close:before,
+  .paging-links .prev-page-link:before,
+  .paging-links .next-page-link:before,
+  .paging-links .next-class-link:before,
+  .paging-links .start-class-link:after,
+  .Video-button--picture-in-picture,
+  .Video-button--close,
+  a.video-shadowbox-button.white::after,
+  #tb li:before,
+  #qv li:before {
+    background-image: url(../images/sprite_2x.png);
+    background-size: 36px 900px;
+  }
+}
+
+.dac-chevron {
+  background-size: 9px 39px;
+  display: inline-block;
+  height: 13px;
+  text-indent: -9999px;
+  width: 9px;
+}
+
+.dac-sprite.dac-auto-chevron,
+.dac-auto-chevron.dac-modal-header-close:before,
+.paging-links .dac-auto-chevron.prev-page-link:before,
+.paging-links .dac-auto-chevron.next-page-link:before,
+.paging-links .dac-auto-chevron.next-class-link:before,
+.paging-links .dac-auto-chevron.start-class-link:after {
   background-position: 0px -669px;
   height: 24px;
   width: 24px;
-  vertical-align: -6px; }
-  .dac-invert .dac-sprite.dac-auto-chevron, .dac-invert .dac-auto-chevron.dac-modal-header-close:before, .dac-invert .paging-links .dac-auto-chevron.prev-page-link:before, .paging-links .dac-invert .dac-auto-chevron.prev-page-link:before, .dac-invert .paging-links .dac-auto-chevron.next-page-link:before, .paging-links .dac-invert .dac-auto-chevron.next-page-link:before, .dac-invert .paging-links .dac-auto-chevron.next-class-link:before, .paging-links .dac-invert .dac-auto-chevron.next-class-link:before, .dac-invert .paging-links .dac-auto-chevron.start-class-link:after, .paging-links .dac-invert .dac-auto-chevron.start-class-link:after {
-    background-position: 0px -513px;
-    height: 24px;
-    width: 24px; }
+  vertical-align: -6px;
+}
+
+.dac-invert .dac-sprite.dac-auto-chevron, .dac-invert .dac-auto-chevron.dac-modal-header-close:before, .dac-invert .paging-links .dac-auto-chevron.prev-page-link:before, .paging-links .dac-invert .dac-auto-chevron.prev-page-link:before, .dac-invert .paging-links .dac-auto-chevron.next-page-link:before, .paging-links .dac-invert .dac-auto-chevron.next-page-link:before, .dac-invert .paging-links .dac-auto-chevron.next-class-link:before, .paging-links .dac-invert .dac-auto-chevron.next-class-link:before, .dac-invert .paging-links .dac-auto-chevron.start-class-link:after, .paging-links .dac-invert .dac-auto-chevron.start-class-link:after {
+  background-position: 0px -513px;
+  height: 24px;
+  width: 24px;
+}
 
 .dac-sprite.dac-auto-chevron-large, .dac-auto-chevron-large.dac-modal-header-close:before, .paging-links .dac-auto-chevron-large.prev-page-link:before, .paging-links .dac-auto-chevron-large.next-page-link:before, .paging-links .dac-auto-chevron-large.next-class-link:before, .paging-links .dac-auto-chevron-large.start-class-link:after {
   background-position: 0px -695px;
   height: 36px;
   width: 36px;
-  vertical-align: -10px; }
-  .dac-invert .dac-sprite.dac-auto-chevron-large, .dac-invert .dac-auto-chevron-large.dac-modal-header-close:before, .dac-invert .paging-links .dac-auto-chevron-large.prev-page-link:before, .paging-links .dac-invert .dac-auto-chevron-large.prev-page-link:before, .dac-invert .paging-links .dac-auto-chevron-large.next-page-link:before, .paging-links .dac-invert .dac-auto-chevron-large.next-page-link:before, .dac-invert .paging-links .dac-auto-chevron-large.next-class-link:before, .paging-links .dac-invert .dac-auto-chevron-large.next-class-link:before, .dac-invert .paging-links .dac-auto-chevron-large.start-class-link:after, .paging-links .dac-invert .dac-auto-chevron-large.start-class-link:after {
-    background-position: 0px -771px;
-    height: 36px;
-    width: 36px; }
+  vertical-align: -10px;
+}
+
+.dac-invert .dac-sprite.dac-auto-chevron-large,
+.dac-invert .dac-auto-chevron-large.dac-modal-header-close:before,
+.dac-invert .paging-links .dac-auto-chevron-large.prev-page-link:before,
+.paging-links .dac-invert .dac-auto-chevron-large.prev-page-link:before,
+.dac-invert .paging-links .dac-auto-chevron-large.next-page-link:before,
+.paging-links .dac-invert .dac-auto-chevron-large.next-page-link:before,
+.dac-invert .paging-links .dac-auto-chevron-large.next-class-link:before,
+.paging-links .dac-invert .dac-auto-chevron-large.next-class-link:before,
+.dac-invert .paging-links .dac-auto-chevron-large.start-class-link:after,
+.paging-links .dac-invert .dac-auto-chevron-large.start-class-link:after {
+  background-position: 0px -771px;
+  height: 36px;
+  width: 36px;
+}
 
 .dac-sprite.dac-auto-unfold-less, .dac-auto-unfold-less.dac-modal-header-close:before, .paging-links .dac-auto-unfold-less.prev-page-link:before, .paging-links .dac-auto-unfold-less.next-page-link:before, .paging-links .dac-auto-unfold-less.next-class-link:before, .paging-links .dac-auto-unfold-less.start-class-link:after {
   background-position: 0px -487px;
@@ -9295,6 +9778,13 @@
   height: 16px;
   width: 16px; }
 
+/* The back button in Studio and NDK left nav */
+.dac-nav-back-button.back-to-dev .dac-sprite.dac-nav-back {
+  background-position: 0px -884px;
+  height: 16px;
+  width: 16px;
+}
+
 .dac-sprite.dac-nav-forward-blue, .dac-nav-forward-blue.dac-modal-header-close:before, .paging-links .dac-nav-forward-blue.prev-page-link:before, .paging-links .next-page-link:before, .paging-links .next-class-link:before, .paging-links .start-class-link:after {
   background-position: 0px -159px;
   height: 16px;
@@ -9385,42 +9875,73 @@
   background: #ffebc3;
   border-top: 1px solid #e5d4a1;
   display: none;
-  color: rgba(0, 0, 0, 0.87);
+  color: rgba(0, 0, 0, .87);
   line-height: 1.4;
-  padding: 10px; }
-  .dac-toast.dac-visible {
-    display: block; }
-  .dac-toast-wrap {
-    box-sizing: border-box;
-    margin: 0 auto;
-    max-width: 940px;
-    padding-right: 20px;
-    position: relative; }
+  padding: 10px;
+}
+
+.dac-toast.dac-visible {
+  display: block;
+}
+
+.dac-toast-wrap {
+  box-sizing: border-box;
+  margin: 0 auto;
+  max-width: 940px;
+  padding-right: 20px;
+  position: relative;
+}
+
+.dac-toast-close-btn {
+  background-color: transparent;
+  border: none;
+  border-radius: 0;
+  cursor: pointer;
+  opacity: .4;
+  padding: 0;
+  position: absolute;
+  right: 0;
+  top: -2px;
+}
+
+.dac-toast-close-btn:hover,
+.dac-toast-close-btn:focus,
+.dac-toast-close-btn:active {
+  opacity: 1;
+  outline: none;
+}
+
+.dac-toast-close-btn .dac-button.dac-raised.dac-primary{
+  margin: 0;
+  padding: 0;
+}
+
+.dac-toast-group {
+  bottom: 0;
+  left: 0;
+  position: fixed;
+  right: 0;
+  z-index: 60;
+}
+
+.dac-toast.dac-danger {
+  background-color: #ffccbc;
+  border-top-color: #e5b7a9;
+}
+
+.dac-toast.dac-success {
+  background-color: #cdedc8;
+  border-top-color: #c6d5b4;
+}
+
+@media (max-width: 719px) {
   .dac-toast-close-btn {
-    background-color: transparent;
-    border: none;
-    border-radius: 0;
-    cursor: pointer;
-    opacity: .4;
-    padding: 0;
-    position: absolute;
-    right: 0;
-    top: 1px; }
-    .dac-toast-close-btn:hover, .dac-toast-close-btn:focus, .dac-toast-close-btn:active {
-      outline: none;
-      opacity: 1; }
-  .dac-toast-group {
-    bottom: 0;
-    left: 0;
-    position: fixed;
-    right: 0;
-    z-index: 60; }
-  .dac-toast.dac-danger {
-    background-color: #ffccbc;
-    border-top-color: #e5b7a9; }
-  .dac-toast.dac-success {
-    background-color: #cdedc8;
-    border-top-color: #c6d5b4; }
+    position: relative;
+    top: 0;
+    margin: 10px 0 0;
+    display: block;
+  }
+}
 
 .dac-tab-item {
   box-sizing: border-box;
@@ -9910,32 +10431,22 @@
   top: -4px;
 }
 
-/** CSS Fixes for DevSite (akassay@) */
-.dac-button-social,
-.dac-fab:not('.dac-scroll-button') {
-  position: relative;
+#skip-to-main {
+  border: 0;
+  clip: rect(0 0 0 0);
+  height: 1px;
+  margin: -1px;
+  overflow: hidden;
+  padding: 0;
+  position: absolute;
+  width: 1px;
 }
 
-.dac-button-social .dac-sprite,
-.dac-fab .dac-sprite,
-.play-button .dac-sprite {
-  margin-top: -7px;
-  position: relative;
-  top: 50%;
-}
-
-.dac-fab .dac-sprite.dac-arrow-down-gray {
-  margin-top: -3px;
-}
-
-.dac-button-social .dac-sprite.dac-gplus {
-  margin-top: -17px;
-}
-
-.play-button .dac-sprite {
-  margin-top: -10px;
-}
-
-.dac-nav-link-forward {
-  padding: 9px 0;
+#skip-to-main:focus {
+  background: #fff;
+  clip: auto;
+  height: auto;
+  padding: 10px;
+  width: auto;
+  z-index: 10000;
 }
diff --git a/tools/droiddoc/templates-sdk-dev/assets/js/docs.js b/tools/droiddoc/templates-sdk-dev/assets/js/docs.js
index efcc363..5ed947c 100644
--- a/tools/droiddoc/templates-sdk-dev/assets/js/docs.js
+++ b/tools/droiddoc/templates-sdk-dev/assets/js/docs.js
@@ -5,6 +5,14 @@
 var basePath = getBaseUri(location.pathname);
 var SITE_ROOT = toRoot + basePath.substring(1, basePath.indexOf("/", 1));
 
+// TODO(akassay) generate this var in the reference doc build.
+var API_LEVELS = ['1', '2', '3', '4', '5', '6', '7', '8', '9',
+      '10', '11', '12', '13', '14', '15', '16',
+      '17', '18', '19', '20', '21', '22', '23', '24'];
+var METADATA = METADATA || {};
+var RESERVED_METADATA_CATEGORY_NAMES = ['extras', 'carousel', 'collections',
+                                        'searchHeroCollections'];
+
 // Ensure that all ajax getScript() requests allow caching
 $.ajaxSetup({
   cache: true
@@ -15,8 +23,7 @@
 $(document).ready(function() {
 
   // prep nav expandos
-  var pagePath = devsite ?
-      location.href.replace(location.hash, '') : document.location.pathname;
+  var pagePath = location.href.replace(location.hash, '');
   // account for intl docs by removing the intl/*/ path
   if (pagePath.indexOf("/intl/") == 0) {
     pagePath = pagePath.substr(pagePath.indexOf("/", 6)); // start after intl/ to get last /
@@ -53,6 +60,9 @@
   // set global variable so we can highlight the sidenav a bit later (such as for google reference)
   // and highlight the sidenav
   mPagePath = pagePath;
+
+  // Check for params and remove them.
+  mPagePath = mPagePath.split('?')[0];
   highlightSidenav();
 
   // set up prev/next links if they exist
@@ -160,8 +170,12 @@
       $('.next-page-link').attr('href', $nextLink.attr('href'))
                           .removeClass("hide");
       // for the footer link, also add the previous and next page titles
-      $('.content-footer .prev-page-link').append($prevLink.html());
-      $('.content-footer .next-page-link').append($nextLink.html());
+      if ($prevLink.length) {
+        $('.content-footer .prev-page-link').append($prevLink.html());
+      }
+      if ($nextLink.length) {
+        $('.content-footer .next-page-link').append($nextLink.html());
+      }
     }
 
     if (!startClass && $prevLink.length) {
@@ -172,7 +186,6 @@
         $('.prev-page-link').attr('href', $prevLink.attr('href')).removeClass("hide");
       }
     }
-
   }
 
   // Set up the course landing pages for Training with class names and descriptions
@@ -231,6 +244,12 @@
     $(this).get(0).play();
   });
 
+  // Set up play-on-click for <video> tags with a "video-wrapper".
+  $('.video-wrapper > video').bind('click', function() {
+    this.play();
+    $(this.parentElement).addClass('playing');
+  });
+
   // Set up tooltips
   var TOOLTIP_MARGIN = 10;
   $('acronym,.tooltip-link').each(function() {
@@ -281,24 +300,13 @@
 // END of the onload event
 
 function initExpandableNavItems(rootTag) {
-  $(rootTag + ' li.nav-section .nav-section-header').click(function() {
-    var section = $(this).closest('li.nav-section');
-    if (section.hasClass('expanded')) {
-      /* hide me and descendants */
-      section.find('ul').slideUp(250, function() {
-        // remove 'expanded' class from my section and any children
-        section.closest('li').removeClass('expanded');
-        $('li.nav-section', section).removeClass('expanded');
-      });
-    } else {
-      /* show me */
-      // first hide all other siblings
-      var $others = $('li.nav-section.expanded', $(this).closest('ul')).not('.sticky');
-      $others.removeClass('expanded').children('ul').slideUp(250);
+  var toggleIcon = $(
+      rootTag + ' li.nav-section .nav-section-header .toggle-icon, ' +
+      rootTag + ' li.nav-section .nav-section-header a[href="#"]');
 
-      // now expand me
-      section.closest('li').addClass('expanded');
-      section.children('ul').slideDown(250);
+  toggleIcon.on('click keypress', function(e) {
+    if (e.type == 'keypress' && e.which == 13 || e.type == 'click') {
+      doNavToggle(this);
     }
   });
 
@@ -311,6 +319,27 @@
   });
 }
 
+function doNavToggle(el) {
+  var section = $(el).closest('li.nav-section');
+  if (section.hasClass('expanded')) {
+    /* hide me and descendants */
+    section.find('ul').slideUp(250, function() {
+      // remove 'expanded' class from my section and any children
+      section.closest('li').removeClass('expanded');
+      $('li.nav-section', section).removeClass('expanded');
+    });
+  } else {
+    /* show me */
+    // first hide all other siblings
+    var $others = $('li.nav-section.expanded', $(el).closest('ul')).not('.sticky');
+    $others.removeClass('expanded').children('ul').slideUp(250);
+
+    // now expand me
+    section.closest('li').addClass('expanded');
+    section.children('ul').slideDown(250);
+  }
+}
+
 /** Highlight the current page in sidenav, expanding children as appropriate */
 function highlightSidenav() {
   // if something is already highlighted, undo it. This is for dynamic navigation (Samples index)
@@ -494,7 +523,7 @@
     $(".toggle-content-text:eq(0)", obj).toggle();
     div.removeClass("closed").addClass("open");
     $(".toggle-content-img:eq(0)", div).attr("title", "hide").attr("src", toRoot +
-                  "assets/images/triangle-opened.png");
+                  "assets/images/styles/disclosure_up.png");
   } else { // if it's open, close it
     toggleMe.slideUp('fast', function() {  // Wait until the animation is done before closing arrow
       $(".toggle-content-text:eq(0)", obj).toggle();
@@ -502,7 +531,7 @@
       div.find(".toggle-content").removeClass("open").addClass("closed")
               .find(".toggle-content-toggleme").hide();
       $(".toggle-content-img", div).attr("title", "show").attr("src", toRoot +
-                  "assets/images/triangle-closed.png");
+                  "assets/images/styles/disclosure_down.png");
     });
   }
   return false;
@@ -826,24 +855,14 @@
 /* #################  JAVADOC REFERENCE ################### */
 /* ######################################################## */
 
-/* Initialize some droiddoc stuff, but only if we're in the reference */
-if (location.pathname.indexOf("/reference") == 0) {
-  if (!(location.pathname.indexOf("/reference-gms/packages.html") == 0) &&
-    !(location.pathname.indexOf("/reference-gcm/packages.html") == 0) &&
-    !(location.pathname.indexOf("/reference/com/google") == 0)) {
-    $(document).ready(function() {
-      // init available apis based on user pref
-      changeApiLevel();
-    });
-  }
-}
+
 
 var API_LEVEL_COOKIE = "api_level";
 var minLevel = 1;
 var maxLevel = 1;
 
 function buildApiLevelSelector() {
-  maxLevel = SINCE_DATA.length;
+  maxLevel = API_LEVELS.length;
   var userApiLevel = parseInt(readCookie(API_LEVEL_COOKIE));
   userApiLevel = userApiLevel == 0 ? maxLevel : userApiLevel; // If there's no cookie (zero), use the max by default
 
@@ -856,8 +875,8 @@
   }
   var select = $("#apiLevelSelector").html("").change(changeApiLevel);
   for (var i = maxLevel - 1; i >= 0; i--) {
-    var option = $("<option />").attr("value", "" + SINCE_DATA[i]).append("" + SINCE_DATA[i]);
-    //  if (SINCE_DATA[i] < minLevel) option.addClass("absent"); // always false for strings (codenames)
+    var option = $("<option />").attr("value", "" + API_LEVELS[i]).append("" + API_LEVELS[i]);
+    //  if (API_LEVELS[i] < minLevel) option.addClass("absent"); // always false for strings (codenames)
     select.append(option);
   }
 
@@ -867,7 +886,8 @@
 }
 
 function changeApiLevel() {
-  maxLevel = SINCE_DATA.length;
+  maxLevel = API_LEVELS.length;
+  minLevel = parseInt($('#doc-api-level').attr('class'));
   var selectedLevel = maxLevel;
 
   selectedLevel = parseInt($("#apiLevelSelector option:selected").val());
@@ -876,20 +896,11 @@
   writeCookie(API_LEVEL_COOKIE, selectedLevel, null);
 
   if (selectedLevel < minLevel) {
-    $("#naMessage").show().html("<div><p><strong>This API" +
-              " requires API level " + minLevel + " or higher.</strong></p>" +
-              "<p>This document is hidden because your selected API level for the documentation is " +
-              selectedLevel + ". You can change the documentation API level with the selector " +
-              "above the left navigation.</p>" +
-              "<p>For more information about specifying the API level your app requires, " +
-              "read <a href='" + toRoot + "training/basics/supporting-devices/platforms.html'" +
-              ">Supporting Different Platform Versions</a>.</p>" +
-              "<input type='button' value='OK, make this page visible' " +
-              "title='Change the API level to " + minLevel + "' " +
-              "onclick='$(\"#apiLevelSelector\").val(\"" + minLevel + "\");changeApiLevel();' />" +
-              "</div>");
-  } else {
-    $("#naMessage").hide();
+      // Show the API notice dialog, set number values and button event
+      $('#api-unavailable').trigger('modal-open');
+      $('#api-unavailable .selected-level').text(selectedLevel);
+      $('#api-unavailable .api-level').text(minLevel);
+      $('#api-unavailable button.ok').attr('onclick','$("#apiLevelSelector").val("' + minLevel + '");changeApiLevel();');
   }
 }
 
@@ -1248,6 +1259,10 @@
 
   $selectedLi.children("ul").children("li").each(function() {
     var $li = $("<li>").append($(this).find("a").first().clone());
+    var $samplesLink = $li.find("a");
+    if ($samplesLink.text().endsWith('/')) {
+      $samplesLink.text($samplesLink.text().slice(0,-1));
+    }
     $ul.append($li);
   });
 
@@ -1563,7 +1578,8 @@
       // Record number of pages viewed in analytics.
       if (!firstPage) {
         var clicks = Math.ceil((i - initialResults) / opts.itemsPerPage);
-        ga('send', 'event', 'Cards', 'Click More', clicks);
+        devsite.analytics.trackAnalyticsEvent('event',
+            'Cards', 'Click More', clicks);
       }
     }
 
@@ -1585,8 +1601,7 @@
     $widget.toggleClass('dac-has-less', false);
 
     opts.currentIndex = Math.min(opts.initialResults, resources.length);
-
-    ga('send', 'event', 'Cards', 'Click Less');
+    devsite.analytics.trackAnalyticsEvent('event', 'Cards', 'Click Less');
   }
 
   /* A decorator for event functions which finds the surrounding widget and it's options */
@@ -2215,7 +2230,8 @@
     }
   }
 
-  $(document).on('click.blog-reader', 'a[href*="blogspot.com/"]', wrapLinkWithReader);
+  $(document).on('click.blog-reader', 'a.resource-card[href*="blogspot.com/"]',
+      wrapLinkWithReader);
 })(jQuery, window);
 
 (function($) {
@@ -2547,11 +2563,13 @@
 
     if (checkbox.checked) {
       this.chipsEl_.append(this.chipForItem(item));
-      ga('send', 'event', 'Filters', 'Check', $(checkbox).val());
+      devsite.analytics.trackAnalyticsEvent('event',
+          'Filters', 'Check', $(checkbox).val());
     } else {
       item.data('chip.dac-filter').remove();
       this.addToItemValue(item, -1);
-      ga('send', 'event', 'Filters', 'Uncheck', $(checkbox).val());
+      devsite.analytics.trackAnalyticsEvent('event',
+          'Filters', 'Uncheck', $(checkbox).val());
     }
 
     this.draw_(this.filteredResources());
@@ -3280,20 +3298,9 @@
 
 function changeLangPref(targetLang, submit) {
   window.writeCookie('pref_lang', targetLang, null);
-//DD
   $('#language').find('option[value="' + targetLang + '"]').attr('selected', true);
-  //  #######  TODO:  Remove this condition once we're stable on devsite #######
-  //  This condition is only needed if we still need to support legacy GAE server
-  if (window.devsite) {
-    // Switch language when on Devsite server
-    if (submit) {
-      $('#setlang').submit();
-    }
-  } else {
-    // Switch language when on legacy GAE server
-    if (submit) {
-      window.location = getBaseUri(location.pathname);
-    }
+  if (submit) {
+    $('#setlang').submit();
   }
 }
 // Redundant usage to appease jshint.
@@ -3378,24 +3385,11 @@
     return lang;
   })();
   var localeTarget = (function() {
-    var localeTarget = locale;
-    if (window.devsite) {
-      if (getQueryVariable('hl')) {
-        var target = getQueryVariable('hl');
-        if (!(target === 0) || (LANGUAGES.indexOf(target) === -1)) {
-          localeTarget = target;
-        }
-      }
-    } else {
-      if (location.pathname.substring(0,6) == "/intl/") {
-        var target = location.pathname.split('/')[2];
-        if (!(target === 0) || (LANGUAGES.indexOf(target) === -1)) {
-          localeTarget = target;
-        }
-      }
+    var lang = getQueryVariable('hl');
+    if (lang === false || LANGUAGES.indexOf(lang) === -1) {
+      lang = locale;
     }
-
-    return localeTarget;
+    return lang;
   })();
 
   /**
@@ -3899,14 +3893,14 @@
   };
 
   Modal.prototype.close_ = function() {
+    // When closing the modal for Android Studio downloads, reload the page
+    // because otherwise we might get stuck with post-download dialog state
+    if ($("[data-modal='studio_tos'].dac-active").length) {
+      location.reload();
+    }
     this.el.removeClass('dac-active');
     $('body').removeClass('dac-modal-open');
     this.isOpen = false;
-    // When closing the modal for Android Studio downloads, reload the page
-    // because otherwise we might get stuck with post-download dialog state
-    if ($("[data-modal='studio_tos']").length) {
-      location.reload();
-    }
   };
 
   Modal.prototype.open_ = function() {
@@ -3952,13 +3946,29 @@
 
     // Check if url anchor is targetting a toggle to open the modal.
     if (location.hash) {
-      $(location.hash + '[data-modal-toggle]').trigger('click');
+      var $elem = $(document.getElementById(location.hash.substr(1)));
+      if ($elem.attr('data-modal-toggle')) {
+        $elem.trigger('click');
+      }
     }
 
-    if (window.getLangTarget() !== window.getLangPref()) {
-          $('#langform').trigger('modal-open');
-          $("#langform button.yes").attr("onclick","window.changeLangPref('" + window.getLangTarget() + "', true);  return false;");
-          $("#langform button.no").attr("onclick","window.changeLangPref('" + window.getLangPref() + "', true); return false;");
+    var isTargetLangValid = false;
+    $(ANDROID_LANGUAGES).each(function(index, langCode) {
+      if (langCode == window.getLangTarget()) {
+        isTargetLangValid = true;
+        return;
+      }
+    });
+    if (window.getLangTarget() !== window.getLangPref() && isTargetLangValid) {
+        $('#langform').trigger('modal-open');
+        $("#langform button.yes").attr("onclick","window.changeLangPref('" + window.getLangTarget() + "', true);  return false;");
+        $("#langform button.no").attr("onclick","window.changeLangPref('" + window.getLangPref() + "', true); return false;");
+    }
+
+    /* Check the current API level, but only if we're in the reference */
+    if (location.pathname.indexOf('/reference') == 0) {
+      // init available apis based on user pref
+      changeApiLevel();
     }
   });
 })(jQuery);
@@ -4093,7 +4103,12 @@
   var forwardLink = $('<span/>')
     .addClass('dac-nav-link-forward')
     .html(icon)
-    .on('click', swap_);
+    .attr('tabindex', 0)
+    .on('click keypress', function(e) {
+      if (e.type == 'keypress' && e.which == 13 || e.type == 'click') {
+        swap_(e);
+      }
+    });
 
   /**
    * @constructor
@@ -4147,8 +4162,11 @@
   // Setup sub navigation collapse/expand
   function initCollapsedNavs(toggleIcons) {
     toggleIcons.each(setInitiallyActive_($('body')));
-    toggleIcons.on('click', handleSubNavToggle_);
-
+    toggleIcons.on('click keypress', function(e) {
+      if (e.type == 'keypress' && e.which == 13 || e.type == 'click') {
+        handleSubNavToggle_(e);
+      }
+    });
   }
 
   function setInitiallyActive_(body) {
@@ -4165,6 +4183,10 @@
       var expanded = expandedNavs.indexOf(landingPageClass) >= 0;
       landingPageClass = landingPageClass === 'home' ? 'about' : landingPageClass;
 
+      if (landingPageClass == 'about' && location.pathname == '/index.html') {
+        expanded = true;
+      }
+
       // TODO: Should read from localStorage
       var visible = body.hasClass(landingPageClass) || expanded;
 
@@ -4220,17 +4242,28 @@
    * @param {jQuery} el - The DOM element.
    */
   function buildReferenceNav(el) {
+    var supportLibraryPath = '/reference/android/support/';
+    var currPath = location.pathname;
+
+    if (currPath.indexOf(supportLibraryPath) > -1) {
+      updateSupportLibrariesNav(supportLibraryPath, currPath);
+    }
     var namespaceList = el.find('[data-reference-namespaces]');
-    var resources = el.find('[data-reference-resources]');
+    var resources = $('[data-reference-resources]').detach();
     var selected = namespaceList.find('.selected');
+    resources.appendTo(el);
 
     // Links should be toggleable.
     namespaceList.find('a').addClass('dac-reference-nav-toggle dac-closed');
 
+    // Set the path for the navtree data to use.
+    var navtree_filepath = getNavtreeFilePath(supportLibraryPath, currPath);
+
     // Load in all resources
-    $.getScript('/navtree_data.js', function(data, textStatus, xhr) {
+    $.getScript(navtree_filepath, function(data, textStatus, xhr) {
       if (xhr.status === 200) {
-        namespaceList.on('click', 'a.dac-reference-nav-toggle', toggleResourcesHandler);
+        namespaceList.on(
+            'click', 'a.dac-reference-nav-toggle', toggleResourcesHandler);
       }
     });
 
@@ -4243,13 +4276,14 @@
     var overview = addResourcesToView(resources, selected);
 
     // Currently viewing Overview
-    if (location.pathname === overview.attr('href')) {
+    if (location.href === overview.attr('href')) {
       overview.parent().addClass('selected');
     }
 
     // Open currently selected resource
     var listsToOpen = selected.children().eq(1);
-    listsToOpen = listsToOpen.add(listsToOpen.find('.selected').parent()).show();
+    listsToOpen = listsToOpen.add(
+        listsToOpen.find('.selected').parent()).show();
 
     // Mark dropdowns as open
     listsToOpen.prev().removeClass('dac-closed');
@@ -4258,20 +4292,45 @@
     namespaceList.scrollIntoView(selected);
   }
 
+  function getNavtreeFilePath(supportLibraryPath, currPath) {
+    var navtree_filepath = '';
+    var navtree_filename = 'navtree_data.js';
+    if (currPath.indexOf(supportLibraryPath + 'test') > -1) {
+      navtree_filepath = supportLibraryPath + 'test/' + navtree_filename;
+    } else if (currPath.indexOf(supportLibraryPath + 'wearable') > -1) {
+      navtree_filepath = supportLibraryPath + 'wearable/' + navtree_filename;
+    } else {
+      navtree_filepath = '/' + navtree_filename;
+    }
+    return navtree_filepath;
+  }
+
+  function updateSupportLibrariesNav(supportLibraryPath, currPath) {
+    var navTitle = '';
+    if (currPath.indexOf(supportLibraryPath + 'test') > -1) {
+      navTitle = 'Test Support APIs';
+    } else if (currPath.indexOf(supportLibraryPath + 'wearable') > -1) {
+      navTitle = 'Wearable Support APIs';
+    }
+    $('#api-nav-title').text(navTitle);
+    $('#api-level-toggle').hide();
+  }
+
   /**
    * Handles the toggling of resources.
    * @param {Event} event
    */
   function toggleResourcesHandler(event) {
     event.preventDefault();
-    var el = $(this);
+    if (event.type == 'click' || event.type == 'keypress' && event.which == 13) {
+      var el = $(this);
+      // If resources for given namespace is not present, fetch correct data.
+      if (this.tagName === 'A' && !this.hasResources) {
+        addResourcesToView(buildResourcesViewForData(getDataForNamespace(el.text())), el.parent());
+      }
 
-    // If resources for given namespace is not present, fetch correct data.
-    if (this.tagName === 'A' && !this.hasResources) {
-      addResourcesToView(buildResourcesViewForData(getDataForNamespace(el.text())), el.parent());
+      el.toggleClass('dac-closed').next().slideToggle(200);
     }
-
-    el.toggleClass('dac-closed').next().slideToggle(200);
   }
 
   /**
@@ -4331,9 +4390,9 @@
       .find('a')
         .addClass('dac-reference-nav-resource')
       .end()
-        .find('h2')
+        .find('h2').attr('tabindex', 0)
         .addClass('dac-reference-nav-toggle dac-closed')
-        .on('click', toggleResourcesHandler)
+        .on('click keypress', toggleResourcesHandler)
       .end()
         .add(resources.find('ul'))
         .addClass('dac-reference-nav-resources')
@@ -4343,11 +4402,31 @@
     return overview;
   }
 
+  function setActiveReferencePackage(el) {
+    var packageLinkEls = el.find('[data-reference-namespaces] a');
+    var selected = null;
+    var highestMatchCount = 0;
+    packageLinkEls.each(function(index, linkEl) {
+      var matchCount = 0;
+      $(location.pathname.split('/')).each(function(index, subpath) {
+        if (linkEl.href.indexOf('/' + subpath + '/') > -1) {
+          matchCount++;
+        }
+      });
+      if (matchCount > highestMatchCount) {
+        selected = linkEl;
+        highestMatchCount = matchCount;
+      }
+    });
+    $(selected).parent().addClass('selected');
+  }
+
   /**
    * jQuery plugin
    */
   $.fn.dacReferenceNav = function() {
     return this.each(function() {
+      setActiveReferencePackage($(this));
       buildReferenceNav($(this));
     });
   };
@@ -4389,7 +4468,7 @@
     var parentNavEl;
     var selected;
     // In NDK docs, highlight appropriate sub-nav
-    if (body.hasClass('ndk')) {
+    if (body.hasClass('dac-ndk')) {
       if (body.hasClass('guide')) {
         selected = navEl.find('> li.guides > a').addClass('selected');
       } else if (body.hasClass('reference')) {
@@ -4399,8 +4478,10 @@
       } else if (body.hasClass('downloads')) {
         selected = navEl.find('> li.downloads > a').addClass('selected');
       }
-    } else if (body.hasClass('studio')) {
-      if (body.hasClass('features')) {
+    } else if (body.hasClass('dac-studio')) {
+      if (body.hasClass('download')) {
+        selected = navEl.find('> li.download > a').addClass('selected');
+      } else if (body.hasClass('features')) {
         selected = navEl.find('> li.features > a').addClass('selected');
       } else if (body.hasClass('guide')) {
         selected = navEl.find('> li.guide > a').addClass('selected');
@@ -4410,7 +4491,7 @@
     } else if (body.hasClass('design')) {
       selected = navEl.find('> li.design > a').addClass('selected');
       // highlight Home nav
-    } else if (body.hasClass('about')) {
+    } else if (body.hasClass('about') || location.pathname == '/index.html') {
       parentNavEl = navEl.find('> li.home > a');
       parentNavEl.addClass('has-subnav');
       // In Home docs, also highlight appropriate sub-nav
@@ -4438,8 +4519,6 @@
         } else {
           selected = subNavEl.find('li.reference > a').addClass('selected');
         }
-      } else if ((urlSegments[1] === 'tools') || (urlSegments[1] === 'sdk')) {
-        selected = subNavEl.find('li.tools > a').addClass('selected');
       } else if (body.hasClass('google')) {
         selected = subNavEl.find('li.google > a').addClass('selected');
       } else if (body.hasClass('samples')) {
@@ -4502,6 +4581,11 @@
    */
   function toggleSidebarVisibility(body) {
     var wasClosed = ('' + localStorage.getItem('navigation-open')) === 'false';
+    // Override the local storage setting for navigation-open for child sites
+    // with no-subnav class.
+    if (document.body.classList.contains('no-subnav')) {
+      wasClosed = false;
+    }
 
     if (wasClosed) {
       body.removeClass(ToggleNav.DEFAULTS_.activeClass);
@@ -4746,28 +4830,66 @@
 
     // Get current language.
     var locale = getLangPref();
-
     // Merge english resources.
-    METADATA.all = mergeArrays(
-      METADATA.en.about,
-      METADATA.en.design,
-      METADATA.en.distribute,
-      METADATA.en.develop,
-      YOUTUBE_RESOURCES,
-      BLOGGER_RESOURCES,
-      METADATA.en.extras
-    );
+    if (useDevsiteMetadata) {
+      var all_keys = Object.keys(METADATA['en']);
+      METADATA.all = []
+
+      $(all_keys).each(function(index, category) {
+        if (RESERVED_METADATA_CATEGORY_NAMES.indexOf(category) == -1) {
+          METADATA.all = mergeArrays(
+            METADATA.all,
+            METADATA.en[category]
+          );
+        }
+      });
+
+      METADATA.all = mergeArrays(
+        METADATA.all,
+        YOUTUBE_RESOURCES,
+        BLOGGER_RESOURCES,
+        METADATA.en.extras
+      );
+    } else {
+      METADATA.all = mergeArrays(
+        METADATA.en.about,
+        METADATA.en.design,
+        METADATA.en.distribute,
+        METADATA.en.develop,
+        YOUTUBE_RESOURCES,
+        BLOGGER_RESOURCES,
+        METADATA.en.extras
+      );
+    }
 
     // Merge local language resources.
     if (locale !== 'en' && METADATA[locale]) {
-      METADATA.all = mergeArrays(
-        METADATA.all,
-        METADATA[locale].about,
-        METADATA[locale].design,
-        METADATA[locale].distribute,
-        METADATA[locale].develop,
-        METADATA[locale].extras
-      );
+      if (useDevsiteMetadata) {
+        all_keys = Object.keys(METADATA[locale]);
+        $(all_keys).each(function(index, category) {
+          if (RESERVED_METADATA_CATEGORY_NAMES.indexOf(category) == -1) {
+            METADATA.all = mergeArrays(
+              METADATA.all,
+              METADATA.en[category]
+            );
+          }
+        });
+
+        METADATA.all = mergeArrays(
+          METADATA.all,
+          METADATA[locale].extras
+        );
+      } else {
+        METADATA.all = mergeArrays(
+          METADATA.all,
+          METADATA[locale].about,
+          METADATA[locale].design,
+          METADATA[locale].distribute,
+          METADATA[locale].develop,
+          METADATA[locale].extras
+        );
+
+      }
     }
 
     mergeMetadataMap('collections', locale);
@@ -4778,7 +4900,8 @@
     createIndices(METADATA.all, locale);
 
     // Reference metadata.
-    METADATA.androidReference = window.DATA;
+    METADATA.androidReference = mergeArrays(
+        window.DATA, window.SUPPORT_WEARABLE_DATA, window.SUPPORT_TEST_DATA);
     METADATA.googleReference = mergeArrays(window.GMS_DATA, window.GCM_DATA);
   };
 })();
@@ -5478,20 +5601,9 @@
   var ROW_COUNT_GOOGLE_EXPANDED = 8;
 
   function onSuggestionClick(e) {
-    var normalClick = e.which === 1 && !e.ctrlKey && !e.shiftKey && !e.metaKey;
-    if (normalClick) {
-      e.preventDefault();
-    }
-
-    // When user clicks a suggested document, track it
-    var url = $(e.currentTarget).attr('href');
-    ga('send', 'event', 'Suggestion Click', 'clicked: ' + url,
-        'query: ' + $('#search_autocomplete').val().toLowerCase(),
-        {hitCallback: function() {
-          if (normalClick) {
-            document.location = url;
-          }
-        }});
+    devsite.analytics.trackAnalyticsEvent('event',
+        'Suggestion Click', 'clicked: ' + $(e.currentTarget).attr('href'),
+        'query: ' + $('#search_autocomplete').val().toLowerCase());
   }
 
   function buildLink(match) {
@@ -5526,7 +5638,7 @@
   function renderAndroidResults(list, gMatches, query) {
     list.empty();
 
-    var header = $('<li class="dac-search-results-reference-header">android</li>');
+    var header = $('<li class="dac-search-results-reference-header">android APIs</li>');
     list.append(header);
 
     if (gMatches.length > 0) {
@@ -5647,16 +5759,18 @@
     this.searchResultsHero = $('#dac-search-results-hero');
     this.searchResultsReference = $('#dac-search-results-reference');
     this.searchHeader = $('[data-search]').data('search-input.dac');
+    this.pageNav = $('a[name=navigation]');
     this.currQueryReferenceResults = {};
+    this.isOpen = false;
   }
 
   Search.prototype.init = function() {
-    if (!devsite && this.checkRedirectToIndex()) { return; }
-
     this.searchHistory = window.dacStore('search-history');
 
     this.searchInput.focus(this.onSearchChanged.bind(this));
-    this.searchInput.keydown(this.handleKeyboardShortcut.bind(this));
+    this.searchInput.keypress(this.handleKeyboardShortcut.bind(this));
+    this.pageNav.keyup(this.handleTabbedToNav.bind(this));
+    this.searchResults.keyup(this.handleKeyboardShortcut.bind(this));
     this.searchInput.on('input', this.onSearchChanged.bind(this));
     this.searchClear.click(this.clear.bind(this));
     this.searchClose.click(this.close.bind(this));
@@ -5713,6 +5827,12 @@
     }
   };
 
+  Search.prototype.handleTabbedToNav = function(event) {
+    if (this.isOpen) {
+      this.searchClose.trigger('click');
+    }
+  }
+
   Search.prototype.goToResult = function(relativeIndex) {
     var links = this.searchResults.find('a').filter(':visible');
     var selectedLink = this.searchResults.find('.dac-selected');
@@ -5775,6 +5895,8 @@
     this.removeQueryFromUrl();
     this.searchInput.blur();
     this.hideOverlay();
+    this.pageNav.focus();
+    this.isOpen = false;
   };
 
   Search.prototype.getUrlQuery = function() {
@@ -5859,6 +5981,7 @@
   };
 
   Search.prototype.showOverlay = function() {
+    this.isOpen = true;
     this.body.addClass('dac-modal-open dac-search-open');
   };
 
@@ -5956,7 +6079,11 @@
     this.initiallyActive = this.containers.children('.' + this.options.activeClass).eq(0);
     this.el.on('swap-content', this.swap.bind(this));
     this.el.on('swap-reset', this.reset.bind(this));
-    this.el.find(this.options.swapButton).on('click', this.swap.bind(this));
+    this.el.find(this.options.swapButton).on('click keypress', function(e) {
+      if (e.type == 'keypress' && e.which == 13 || e.type == 'click') {
+        this.swap();
+      }
+    }.bind(this));
   }
 
   /**
@@ -6008,6 +6135,7 @@
       if (!this.options.dynamic) {
         container.children().toggleClass(this.options.activeClass);
         this.complete.bind(this);
+        $('.' + this.options.activeClass).focus();
         return;
       }
 
@@ -6139,7 +6267,7 @@
    */
   Toast.prototype.closeBtn = function() {
     this.closeBtnEl = this.closeBtnEl || $('<button class="' + this.options.closeBtnClass + '">' +
-      '<i class="dac-sprite dac-close-black"></i>' +
+      '<span class="dac-button dac-raised dac-primary">OK</span>' +
     '</button>');
     return this.closeBtnEl;
   };
@@ -6461,23 +6589,27 @@
       // Video starts, send the video ID
       if (event.data === YT.PlayerState.PLAYING) {
         if (this.mPlayerPaused) {
-          ga('send', 'event', 'Videos', 'Resume', videoId);
+          devsite.analytics.trackAnalyticsEvent('event',
+              'Videos', 'Resume', videoId);
         } else {
           // track the start playing event so we know from which page the video was selected
-          ga('send', 'event', 'Videos', 'Start: ' + videoId, 'on: ' + document.location.href);
+          devsite.analytics.trackAnalyticsEvent('event',
+              'Videos', 'Start: ' + videoId, 'on: ' + document.location.href);
         }
         this.mPlayerPaused = false;
       }
 
       // Video paused, send video ID and video elapsed time
       if (event.data === YT.PlayerState.PAUSED) {
-        ga('send', 'event', 'Videos', 'Paused', videoId, currentTime);
+        devsite.analytics.trackAnalyticsEvent('event',
+            'Videos', 'Paused: ' + videoId, 'on: ' + currentTime);
         this.mPlayerPaused = true;
       }
 
       // Video finished, send video ID and video elapsed time
       if (event.data === YT.PlayerState.ENDED) {
-        ga('send', 'event', 'Videos', 'Finished', videoId, currentTime);
+        devsite.analytics.trackAnalyticsEvent('event',
+            'Videos', 'Finished: ' + videoId, 'on: ' + currentTime);
         this.mPlayerPaused = true;
       }
     };
diff --git a/tools/droiddoc/templates-sdk-dev/components/masthead.cs b/tools/droiddoc/templates-sdk-dev/components/masthead.cs
index c1e2706..1fef965 100644
--- a/tools/droiddoc/templates-sdk-dev/components/masthead.cs
+++ b/tools/droiddoc/templates-sdk-dev/components/masthead.cs
@@ -51,6 +51,26 @@
             >Downloads</a>
           </li>
         </ul><?cs else
+        ?><?cs
+        #
+        # For the reference only docs, include just one tab
+        #
+        ?><?cs if:referenceonly
+          ?><ul class="dac-header-tabs">
+            <li><a href="<?cs var:toroot ?>reference/packages.html" class="dac-header-tab"><?cs
+              if:sdk.preview
+                ?>Android <?cs var:sdk.codename ?>
+                  Preview <?cs var:sdk.preview.version ?><?cs
+              else
+                ?>Android <?cs var:sdk.version ?>
+                  r<?cs var:sdk.rel.id ?><?cs
+              /if ?></a>
+            </li>
+          </ul>
+        <?cs else ?><?cs
+        #
+        # End reference only docs, now the online DAC tabs...
+        #
         ?><ul class="dac-header-tabs">
           <li>
           <a class="dac-header-tab" href="<?cs var:toroot ?>design/index.html"
@@ -80,7 +100,12 @@
              es-lang="Distribuir">Distribute</a>
           </li>
         </ul><?cs
-        /if ?>
+        /if ?><?cs
+        #
+        # End if/else reference only docs
+        #
+        ?><?cs
+        /if ?><?cs # end if/else ndk ?>
 
         <?cs if:ndk ?><a class="dac-header-console-btn" href="http://developer.android.com">
           Back to Android Developers
@@ -92,7 +117,9 @@
 
         # ADD SEARCH AND MENU ?><?cs
         if:!ndk ?><?cs
-        call:header_search_widget() ?><?cs
+          if:!referenceonly ?><?cs
+            call:header_search_widget() ?><?cs
+          /if ?><?cs
         /if ?>
       </div><!-- end header-wrap.wrap -->
     </div><!-- end header -->
@@ -147,8 +174,9 @@
     <div class="dac-nav-dimmer" data-dac-toggle-nav></div>
 
     <div class="dac-nav-sidebar" data-swap data-dynamic="false" data-transition-speed="300" data-dac-nav>
-      <div data-swap-container>
+      <div <?cs if:!referenceonly ?>data-swap-container<?cs /if ?>>
         <?cs call:custom_left_nav() ?>
+        <?cs if:!referenceonly ?>
         <ul id="dac-main-navigation" class="dac-nav-list dac-swap-section dac-left dac-no-anim">
         <li class="dac-nav-item home">
           <a class="dac-nav-link" href="<?cs var:toroot ?>index.html">Home</a>
@@ -265,6 +293,7 @@
           <a class="dac-nav-link" href="<?cs var:toroot ?>preview/index.html">Preview</a>
         </li>-->
         </ul>
+        <?cs /if ?><?cs # end if referenceonly ?>
       </div>
     </div>
   </nav>
diff --git a/tools/droiddoc/templates-sdk-dev/customizations.cs b/tools/droiddoc/templates-sdk-dev/customizations.cs
index a747d3f..0b938ac 100644
--- a/tools/droiddoc/templates-sdk-dev/customizations.cs
+++ b/tools/droiddoc/templates-sdk-dev/customizations.cs
@@ -151,10 +151,14 @@
 
 def:custom_left_nav() ?>
   <?cs if:(!fullpage && !nonavpage) || forcelocalnav ?>
+    <?cs if:!referenceonly ?>
     <a class="dac-nav-back-button dac-swap-section dac-up dac-no-anim" data-swap-button href="javascript:;">
       <i class="dac-sprite dac-nav-back"></i> <span class="dac-nav-back-title">Back</span>
     </a>
-    <div class="dac-nav-sub dac-swap-section dac-right dac-active" itemscope itemtype="http://schema.org/SiteNavigationElement">
+    <?cs /if ?>
+    <div class="dac-nav-sub dac-swap-section dac-right dac-active" itemscope
+      itemtype="http://schema.org/SiteNavigationElement" <?cs
+        if:referenceonly ?>style="top:0 !important;"<?cs /if ?>>
       <?cs if:ndk ?>
         <?cs if:guide ?>
           <?cs include:"../../../../frameworks/base/docs/html/ndk/guides/guides_toc.cs" ?>