Doc change: add developer video to carousel and spotlight pages.
Change-Id: Ia12eb98f4d86edea72dfa1142d782ea24d3373f7
diff --git a/docs/html/index.jd b/docs/html/index.jd
index e91b68c..cf06324 100644
--- a/docs/html/index.jd
+++ b/docs/html/index.jd
@@ -13,6 +13,50 @@
<div class="frame">
<ul>
<li class="item carousel-home">
+ <div class="content-left col-11" style="padding-top:65px;">
+ <script src="//ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
+ <div style="box-shadow: 3px 10px 18px 1px #999;width:600px;height:338px">
+ <div id="ytapiplayer">
+ You need Flash player 8+ and JavaScript enabled to view this video.
+ </div>
+ <script type="text/javascript">
+ var params = { allowScriptAccess: "always" };
+ var atts = { id: "ytapiplayer" };
+ swfobject.embedSWF("http://www.youtube.com/v/RRelFvc6Czo?enablejsapi=1&playerapiid=ytplayer&version=3&HD=1;rel=0;showinfo=0;modestbranding;origin=developer.android.com;autohide=1",
+ "ytapiplayer", "600", "338", "8", null, null, params, atts);
+
+ // Callback used to pause/resume carousel based on video state
+ function onytplayerStateChange(newState) {
+ var isPaused = $("#pauseButton").hasClass("paused");
+ if ((newState == 1) || (newState == 3)) {
+ // if playing or buffering, pause the carousel
+ if (!isPaused) {
+ $("#pauseButton").click();
+ }
+ } else {
+ // otherwise, make sure carousel is running
+ if (isPaused) {
+ $("#pauseButton").click();
+ }
+ }
+ }
+
+ // Callback received when YouTube player loads to setup callback (above)
+ function onYouTubePlayerReady(playerId) {
+ var ytplayer = document.getElementById("ytapiplayer");
+ ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
+ }
+
+ </script>
+ </div>
+ </div>
+ <div class="content-right col-4">
+ <h1 style="white-space:nowrap;line-height:1em;">Developer Story: Smule</h1>
+ <p>The creators of AutoRap, Magic Piano, and Songify talk about launching on
+ Android and the explosive global growth they’ve seen on Google Play.</p>
+ </div>
+ </li>
+ <li class="item carousel-home">
<div class="content-left col-9">
<a href="{@docRoot}about/versions/jelly-bean.html"><img src="{@docRoot}images/home/android-jellybean.png" ></a>
</div>
@@ -63,6 +107,8 @@
</div>
<!-- /End slideshow -->
+ <a href="" id="pauseButton" style="display:none">pause</a>
+
</div>
<div class="wrap" style="padding-bottom:20px">