docs: add the ability to pause the carousel

Change-Id: I1ffc929cf93217b578397d825e1eb41369d2666c

tools/droiddoc/templates-sdk/assets/css/default.css

@@ -1138,6 +1138,9 @@ td {
   background-color:inherit;
   border:solid 1px #DDD;
 }
+td *:last-child {
+  margin-bottom:0;
+}
 th {
   background-color: #999;
   color: #fff;

tools/droiddoc/templates-sdk/assets/js/docs.js

@@ -1144,6 +1144,7 @@ function hideExpandable(ids) {
  *  Options:
  *  btnPrev:    optional identifier for previous button
  *  btnNext:    optional identifier for next button
+ *  btnPause:   optional identifier for pause button
  *  auto:       whether or not to auto-proceed
  *  speed:      animation speed
  *  autoTime:   time between auto-rotation
@@ -1161,6 +1162,7 @@ function hideExpandable(ids) {
      o = $.extend({
          btnPrev:   null,
          btnNext:   null,
+         btnPause:  null,
          auto:      true,
          speed:     500,
          autoTime:  12000,
@@ -1232,6 +1234,17 @@ function hideExpandable(ids) {
                  return go(curr+o.scroll);
              });
 
+         //Pause button
+         if(o.btnPause)
+             $(o.btnPause).click(function(e) {
+                 e.preventDefault();
+                 if ($(this).hasClass('paused')) {
+                     startRotateTimer();
+                 } else {
+                     pauseRotateTimer();
+                 }
+             });
+         
          //Auto rotation
          if(o.auto) startRotateTimer();
              
@@ -1244,6 +1257,12 @@ function hideExpandable(ids) {
                     go(curr+o.scroll);  
                   } 
               }, o.autoTime);
+             $(o.btnPause).removeClass('paused');
+         }
+
+         function pauseRotateTimer() {
+             clearInterval(timer);
+             $(o.btnPause).addClass('paused');
          }
 
          //Go to an item

tools/droiddoc/templates-sdk/trailer.cs

@@ -29,7 +29,8 @@ window.gOverride = {
 <script type="text/javascript">
 $('.slideshow-container').dacSlideshow({
     btnPrev: '.slideshow-prev',
-    btnNext: '.slideshow-next'
+    btnNext: '.slideshow-next',
+    btnPause: '#pauseButton'
 });
 </script>
 <?cs /if ?>