blob: 97e3efd62449fd5fa88bfb1a328de58d8186dadf [file] [log] [blame]
Dirk Dougherty541b4942014-02-14 18:31:53 -08001var classesNav;
2var devdocNav;
3var sidenav;
4var cookie_namespace = 'android_developer';
5var NAV_PREF_TREE = "tree";
6var NAV_PREF_PANELS = "panels";
7var nav_pref;
8var isMobile = false; // true if mobile, so we can adjust some layout
9var mPagePath; // initialized in ready() function
10
11var basePath = getBaseUri(location.pathname);
12var SITE_ROOT = toRoot + basePath.substring(1,basePath.indexOf("/",1));
13var GOOGLE_DATA; // combined data for google service apis, used for search suggest
14
15// Ensure that all ajax getScript() requests allow caching
16$.ajaxSetup({
17 cache: true
18});
19
20/****** ON LOAD SET UP STUFF *********/
21
22var navBarIsFixed = false;
23$(document).ready(function() {
24
25 // load json file for JD doc search suggestions
26 $.getScript(toRoot + 'jd_lists_unified.js');
27 // load json file for Android API search suggestions
28 $.getScript(toRoot + 'reference/lists.js');
29 // load json files for Google services API suggestions
30 $.getScript(toRoot + 'reference/gcm_lists.js', function(data, textStatus, jqxhr) {
31 // once the GCM json (GCM_DATA) is loaded, load the GMS json (GMS_DATA) and merge the data
32 if(jqxhr.status === 200) {
33 $.getScript(toRoot + 'reference/gms_lists.js', function(data, textStatus, jqxhr) {
34 if(jqxhr.status === 200) {
35 // combine GCM and GMS data
36 GOOGLE_DATA = GMS_DATA;
37 var start = GOOGLE_DATA.length;
38 for (var i=0; i<GCM_DATA.length; i++) {
39 GOOGLE_DATA.push({id:start+i, label:GCM_DATA[i].label,
40 link:GCM_DATA[i].link, type:GCM_DATA[i].type});
41 }
42 }
43 });
44 }
45 });
46
47 // setup keyboard listener for search shortcut
48 $('body').keyup(function(event) {
49 if (event.which == 191) {
50 $('#search_autocomplete').focus();
51 }
52 });
53
54 // init the fullscreen toggle click event
55 $('#nav-swap .fullscreen').click(function(){
56 if ($(this).hasClass('disabled')) {
57 toggleFullscreen(true);
58 } else {
59 toggleFullscreen(false);
60 }
61 });
62
63 // initialize the divs with custom scrollbars
64 $('.scroll-pane').jScrollPane( {verticalGutter:0} );
65
66 // add HRs below all H2s (except for a few other h2 variants)
67 $('h2').not('#qv h2').not('#tb h2').not('.sidebox h2').not('#devdoc-nav h2').not('h2.norule').css({marginBottom:0}).after('<hr/>');
68
69 // set up the search close button
70 $('.search .close').click(function() {
71 $searchInput = $('#search_autocomplete');
72 $searchInput.attr('value', '');
73 $(this).addClass("hide");
74 $("#search-container").removeClass('active');
75 $("#search_autocomplete").blur();
76 search_focus_changed($searchInput.get(), false);
77 hideResults();
78 });
79
80 // Set up quicknav
81 var quicknav_open = false;
82 $("#btn-quicknav").click(function() {
83 if (quicknav_open) {
84 $(this).removeClass('active');
85 quicknav_open = false;
86 collapse();
87 } else {
88 $(this).addClass('active');
89 quicknav_open = true;
90 expand();
91 }
92 })
93
94 var expand = function() {
95 $('#header-wrap').addClass('quicknav');
96 $('#quicknav').stop().show().animate({opacity:'1'});
97 }
98
99 var collapse = function() {
100 $('#quicknav').stop().animate({opacity:'0'}, 100, function() {
101 $(this).hide();
102 $('#header-wrap').removeClass('quicknav');
103 });
104 }
105
106
107 //Set up search
108 $("#search_autocomplete").focus(function() {
109 $("#search-container").addClass('active');
110 })
111 $("#search-container").mouseover(function() {
112 $("#search-container").addClass('active');
113 $("#search_autocomplete").focus();
114 })
115 $("#search-container").mouseout(function() {
116 if ($("#search_autocomplete").is(":focus")) return;
117 if ($("#search_autocomplete").val() == '') {
118 setTimeout(function(){
119 $("#search-container").removeClass('active');
120 $("#search_autocomplete").blur();
121 },250);
122 }
123 })
124 $("#search_autocomplete").blur(function() {
125 if ($("#search_autocomplete").val() == '') {
126 $("#search-container").removeClass('active');
127 }
128 })
129
130
131 // prep nav expandos
132 var pagePath = document.location.pathname;
133 // account for intl docs by removing the intl/*/ path
134 if (pagePath.indexOf("/intl/") == 0) {
135 pagePath = pagePath.substr(pagePath.indexOf("/",6)); // start after intl/ to get last /
136 }
137
138 if (pagePath.indexOf(SITE_ROOT) == 0) {
139 if (pagePath == '' || pagePath.charAt(pagePath.length - 1) == '/') {
140 pagePath += 'index.html';
141 }
142 }
143
144 // Need a copy of the pagePath before it gets changed in the next block;
145 // it's needed to perform proper tab highlighting in offline docs (see rootDir below)
146 var pagePathOriginal = pagePath;
147 if (SITE_ROOT.match(/\.\.\//) || SITE_ROOT == '') {
148 // If running locally, SITE_ROOT will be a relative path, so account for that by
149 // finding the relative URL to this page. This will allow us to find links on the page
150 // leading back to this page.
151 var pathParts = pagePath.split('/');
152 var relativePagePathParts = [];
153 var upDirs = (SITE_ROOT.match(/(\.\.\/)+/) || [''])[0].length / 3;
154 for (var i = 0; i < upDirs; i++) {
155 relativePagePathParts.push('..');
156 }
157 for (var i = 0; i < upDirs; i++) {
158 relativePagePathParts.push(pathParts[pathParts.length - (upDirs - i) - 1]);
159 }
160 relativePagePathParts.push(pathParts[pathParts.length - 1]);
161 pagePath = relativePagePathParts.join('/');
162 } else {
163 // Otherwise the page path is already an absolute URL
164 }
165
166 // Highlight the header tabs...
167 // highlight Design tab
168 if ($("body").hasClass("design")) {
169 $("#header li.design a").addClass("selected");
Dirk Dougherty08032402014-02-15 10:14:35 -0800170 $("#sticky-header").addClass("design");
Dirk Dougherty541b4942014-02-14 18:31:53 -0800171
172 // highlight Develop tab
173 } else if ($("body").hasClass("develop") || $("body").hasClass("google")) {
174 $("#header li.develop a").addClass("selected");
Dirk Dougherty08032402014-02-15 10:14:35 -0800175 $("#sticky-header").addClass("develop");
Dirk Dougherty541b4942014-02-14 18:31:53 -0800176 // In Develop docs, also highlight appropriate sub-tab
177 var rootDir = pagePathOriginal.substring(1,pagePathOriginal.indexOf('/', 1));
178 if (rootDir == "training") {
179 $("#nav-x li.training a").addClass("selected");
180 } else if (rootDir == "guide") {
181 $("#nav-x li.guide a").addClass("selected");
182 } else if (rootDir == "reference") {
183 // If the root is reference, but page is also part of Google Services, select Google
184 if ($("body").hasClass("google")) {
185 $("#nav-x li.google a").addClass("selected");
186 } else {
187 $("#nav-x li.reference a").addClass("selected");
188 }
189 } else if ((rootDir == "tools") || (rootDir == "sdk")) {
190 $("#nav-x li.tools a").addClass("selected");
191 } else if ($("body").hasClass("google")) {
192 $("#nav-x li.google a").addClass("selected");
193 } else if ($("body").hasClass("samples")) {
194 $("#nav-x li.samples a").addClass("selected");
195 }
196
197 // highlight Distribute tab
198 } else if ($("body").hasClass("distribute")) {
199 $("#header li.distribute a").addClass("selected");
Dirk Dougherty08032402014-02-15 10:14:35 -0800200 $("#sticky-header").addClass("distribute");
Dirk Dougherty541b4942014-02-14 18:31:53 -0800201
Dirk Dougherty08032402014-02-15 10:14:35 -0800202 var baseFrag = pagePathOriginal.indexOf('/', 1) + 1;
203 var secondFrag = pagePathOriginal.substring(baseFrag, pagePathOriginal.indexOf('/', baseFrag));
204 if (secondFrag == "users") {
205 $("#nav-x li.users a").addClass("selected");
206 } else if (secondFrag == "engage") {
207 $("#nav-x li.engage a").addClass("selected");
208 } else if (secondFrag == "monetize") {
209 $("#nav-x li.monetize a").addClass("selected");
210 } else if (secondFrag == "tools") {
211 $("#nav-x li.disttools a").addClass("selected");
212 } else if (secondFrag == "stories") {
213 $("#nav-x li.stories a").addClass("selected");
214 } else if (secondFrag == "essentials") {
215 $("#nav-x li.essentials a").addClass("selected");
216 } else if (secondFrag == "googleplay") {
217 $("#nav-x li.googleplay a").addClass("selected");
218 }
219 }
Dirk Dougherty541b4942014-02-14 18:31:53 -0800220 // set global variable so we can highlight the sidenav a bit later (such as for google reference)
221 // and highlight the sidenav
222 mPagePath = pagePath;
223 highlightSidenav();
224
225 // set up prev/next links if they exist
226 var $selNavLink = $('#nav').find('a[href="' + pagePath + '"]');
227 var $selListItem;
228 if ($selNavLink.length) {
229 $selListItem = $selNavLink.closest('li');
230
231 // set up prev links
232 var $prevLink = [];
233 var $prevListItem = $selListItem.prev('li');
234
235 var crossBoundaries = ($("body.design").length > 0) || ($("body.guide").length > 0) ? true :
236false; // navigate across topic boundaries only in design docs
237 if ($prevListItem.length) {
238 if ($prevListItem.hasClass('nav-section')) {
239 // jump to last topic of previous section
240 $prevLink = $prevListItem.find('a:last');
241 } else if (!$selListItem.hasClass('nav-section')) {
242 // jump to previous topic in this section
243 $prevLink = $prevListItem.find('a:eq(0)');
244 }
245 } else {
246 // jump to this section's index page (if it exists)
247 var $parentListItem = $selListItem.parents('li');
248 $prevLink = $selListItem.parents('li').find('a');
249
250 // except if cross boundaries aren't allowed, and we're at the top of a section already
251 // (and there's another parent)
252 if (!crossBoundaries && $parentListItem.hasClass('nav-section')
253 && $selListItem.hasClass('nav-section')) {
254 $prevLink = [];
255 }
256 }
257
258 // set up next links
259 var $nextLink = [];
260 var startClass = false;
261 var training = $(".next-class-link").length; // decides whether to provide "next class" link
262 var isCrossingBoundary = false;
263
264 if ($selListItem.hasClass('nav-section') && $selListItem.children('div.empty').length == 0) {
265 // we're on an index page, jump to the first topic
266 $nextLink = $selListItem.find('ul:eq(0)').find('a:eq(0)');
267
268 // if there aren't any children, go to the next section (required for About pages)
269 if($nextLink.length == 0) {
270 $nextLink = $selListItem.next('li').find('a');
271 } else if ($('.topic-start-link').length) {
272 // as long as there's a child link and there is a "topic start link" (we're on a landing)
273 // then set the landing page "start link" text to be the first doc title
274 $('.topic-start-link').text($nextLink.text().toUpperCase());
275 }
276
277 // If the selected page has a description, then it's a class or article homepage
278 if ($selListItem.find('a[description]').length) {
279 // this means we're on a class landing page
280 startClass = true;
281 }
282 } else {
283 // jump to the next topic in this section (if it exists)
284 $nextLink = $selListItem.next('li').find('a:eq(0)');
285 if ($nextLink.length == 0) {
286 isCrossingBoundary = true;
287 // no more topics in this section, jump to the first topic in the next section
288 $nextLink = $selListItem.parents('li:eq(0)').next('li.nav-section').find('a:eq(0)');
289 if (!$nextLink.length) { // Go up another layer to look for next page (lesson > class > course)
290 $nextLink = $selListItem.parents('li:eq(1)').next('li.nav-section').find('a:eq(0)');
291 if ($nextLink.length == 0) {
292 // if that doesn't work, we're at the end of the list, so disable NEXT link
293 $('.next-page-link').attr('href','').addClass("disabled")
294 .click(function() { return false; });
295 }
296 }
297 }
298 }
299
300 if (startClass) {
301 $('.start-class-link').attr('href', $nextLink.attr('href')).removeClass("hide");
302
303 // if there's no training bar (below the start button),
304 // then we need to add a bottom border to button
305 if (!$("#tb").length) {
306 $('.start-class-link').css({'border-bottom':'1px solid #DADADA'});
307 }
308 } else if (isCrossingBoundary && !$('body.design').length) { // Design always crosses boundaries
309 $('.content-footer.next-class').show();
310 $('.next-page-link').attr('href','')
311 .removeClass("hide").addClass("disabled")
312 .click(function() { return false; });
313 if ($nextLink.length) {
314 $('.next-class-link').attr('href',$nextLink.attr('href'))
315 .removeClass("hide").append($nextLink.html());
316 $('.next-class-link').find('.new').empty();
317 }
318 } else {
319 $('.next-page-link').attr('href', $nextLink.attr('href')).removeClass("hide");
320 }
321
322 if (!startClass && $prevLink.length) {
323 var prevHref = $prevLink.attr('href');
324 if (prevHref == SITE_ROOT + 'index.html') {
325 // Don't show Previous when it leads to the homepage
326 } else {
327 $('.prev-page-link').attr('href', $prevLink.attr('href')).removeClass("hide");
328 }
329 }
330
331 // If this is a training 'article', there should be no prev/next nav
332 // ... if the grandparent is the "nav" ... and it has no child list items...
333 if (training && $selListItem.parents('ul').eq(1).is('[id="nav"]') &&
334 !$selListItem.find('li').length) {
335 $('.next-page-link,.prev-page-link').attr('href','').addClass("disabled")
336 .click(function() { return false; });
337 }
338
339 }
340
341
342
343 // Set up the course landing pages for Training with class names and descriptions
344 if ($('body.trainingcourse').length) {
345 var $classLinks = $selListItem.find('ul li a').not('#nav .nav-section .nav-section ul a');
346 var $classDescriptions = $classLinks.attr('description');
347
348 var $olClasses = $('<ol class="class-list"></ol>');
349 var $liClass;
350 var $imgIcon;
351 var $h2Title;
352 var $pSummary;
353 var $olLessons;
354 var $liLesson;
355 $classLinks.each(function(index) {
356 $liClass = $('<li></li>');
357 $h2Title = $('<a class="title" href="'+$(this).attr('href')+'"><h2>' + $(this).html()+'</h2><span></span></a>');
358 $pSummary = $('<p class="description">' + $(this).attr('description') + '</p>');
359
360 $olLessons = $('<ol class="lesson-list"></ol>');
361
362 $lessons = $(this).closest('li').find('ul li a');
363
364 if ($lessons.length) {
365 $imgIcon = $('<img src="'+toRoot+'assets/images/resource-tutorial.png" '
366 + ' width="64" height="64" alt=""/>');
367 $lessons.each(function(index) {
368 $olLessons.append('<li><a href="'+$(this).attr('href')+'">' + $(this).html()+'</a></li>');
369 });
370 } else {
371 $imgIcon = $('<img src="'+toRoot+'assets/images/resource-article.png" '
372 + ' width="64" height="64" alt=""/>');
373 $pSummary.addClass('article');
374 }
375
376 $liClass.append($h2Title).append($imgIcon).append($pSummary).append($olLessons);
377 $olClasses.append($liClass);
378 });
379 $('.jd-descr').append($olClasses);
380 }
381
382 // Set up expand/collapse behavior
383 initExpandableNavItems("#nav");
384
385
386 $(".scroll-pane").scroll(function(event) {
387 event.preventDefault();
388 return false;
389 });
390
391 /* Resize nav height when window height changes */
392 $(window).resize(function() {
393 if ($('#side-nav').length == 0) return;
394 var stylesheet = $('link[rel="stylesheet"][class="fullscreen"]');
395 setNavBarLeftPos(); // do this even if sidenav isn't fixed because it could become fixed
396 // make sidenav behave when resizing the window and side-scolling is a concern
397 if (navBarIsFixed) {
398 if ((stylesheet.attr("disabled") == "disabled") || stylesheet.length == 0) {
399 updateSideNavPosition();
400 } else {
401 updateSidenavFullscreenWidth();
402 }
403 }
404 resizeNav();
405 });
406
407
408 // Set up fixed navbar
409 var prevScrollLeft = 0; // used to compare current position to previous position of horiz scroll
410 $(window).scroll(function(event) {
411 if ($('#side-nav').length == 0) return;
412 if (event.target.nodeName == "DIV") {
413 // Dump scroll event if the target is a DIV, because that means the event is coming
414 // from a scrollable div and so there's no need to make adjustments to our layout
415 return;
416 }
417 var scrollTop = $(window).scrollTop();
418 var headerHeight = $('#header').outerHeight();
419 var subheaderHeight = $('#nav-x').outerHeight();
420 var searchResultHeight = $('#searchResults').is(":visible") ?
421 $('#searchResults').outerHeight() : 0;
422 var totalHeaderHeight = headerHeight + subheaderHeight + searchResultHeight;
423 // we set the navbar fixed when the scroll position is beyond the height of the site header...
424 var navBarShouldBeFixed = scrollTop > totalHeaderHeight;
425 // ... except if the document content is shorter than the sidenav height.
426 // (this is necessary to avoid crazy behavior on OSX Lion due to overscroll bouncing)
427 if ($("#doc-col").height() < $("#side-nav").height()) {
428 navBarShouldBeFixed = false;
429 }
430
431 var scrollLeft = $(window).scrollLeft();
432 // When the sidenav is fixed and user scrolls horizontally, reposition the sidenav to match
433 if (navBarIsFixed && (scrollLeft != prevScrollLeft)) {
434 updateSideNavPosition();
435 prevScrollLeft = scrollLeft;
436 }
437
438 // Don't continue if the header is sufficently far away
439 // (to avoid intensive resizing that slows scrolling)
440 if (navBarIsFixed && navBarShouldBeFixed) {
441 return;
442 }
443
444 if (navBarIsFixed != navBarShouldBeFixed) {
445 if (navBarShouldBeFixed) {
446 // make it fixed
447 var width = $('#devdoc-nav').width();
448 $('#devdoc-nav')
449 .addClass('fixed')
450 .css({'width':width+'px'})
451 .prependTo('#body-content');
452 // add neato "back to top" button
453 $('#devdoc-nav a.totop').css({'display':'block','width':$("#nav").innerWidth()+'px'});
454
455 // update the sidenaav position for side scrolling
456 updateSideNavPosition();
457 } else {
458 // make it static again
459 $('#devdoc-nav')
460 .removeClass('fixed')
461 .css({'width':'auto','margin':''})
462 .prependTo('#side-nav');
463 $('#devdoc-nav a.totop').hide();
464 }
465 navBarIsFixed = navBarShouldBeFixed;
466 }
467
468 resizeNav(250); // pass true in order to delay the scrollbar re-initialization for performance
469 });
470
471
472 var navBarLeftPos;
473 if ($('#devdoc-nav').length) {
474 setNavBarLeftPos();
475 }
476
477
478 // Set up play-on-hover <video> tags.
479 $('video.play-on-hover').bind('click', function(){
480 $(this).get(0).load(); // in case the video isn't seekable
481 $(this).get(0).play();
482 });
483
484 // Set up tooltips
485 var TOOLTIP_MARGIN = 10;
486 $('acronym,.tooltip-link').each(function() {
487 var $target = $(this);
488 var $tooltip = $('<div>')
489 .addClass('tooltip-box')
490 .append($target.attr('title'))
491 .hide()
492 .appendTo('body');
493 $target.removeAttr('title');
494
495 $target.hover(function() {
496 // in
497 var targetRect = $target.offset();
498 targetRect.width = $target.width();
499 targetRect.height = $target.height();
500
501 $tooltip.css({
502 left: targetRect.left,
503 top: targetRect.top + targetRect.height + TOOLTIP_MARGIN
504 });
505 $tooltip.addClass('below');
506 $tooltip.show();
507 }, function() {
508 // out
509 $tooltip.hide();
510 });
511 });
512
513 // Set up <h2> deeplinks
514 $('h2').click(function() {
515 var id = $(this).attr('id');
516 if (id) {
517 document.location.hash = id;
518 }
519 });
520
521 //Loads the +1 button
522 var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
523 po.src = 'https://apis.google.com/js/plusone.js';
524 var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
525
526
527 // Revise the sidenav widths to make room for the scrollbar
528 // which avoids the visible width from changing each time the bar appears
529 var $sidenav = $("#side-nav");
530 var sidenav_width = parseInt($sidenav.innerWidth());
531
532 $("#devdoc-nav #nav").css("width", sidenav_width - 4 + "px"); // 4px is scrollbar width
533
534
535 $(".scroll-pane").removeAttr("tabindex"); // get rid of tabindex added by jscroller
536
537 if ($(".scroll-pane").length > 1) {
538 // Check if there's a user preference for the panel heights
539 var cookieHeight = readCookie("reference_height");
540 if (cookieHeight) {
541 restoreHeight(cookieHeight);
542 }
543 }
544
545 resizeNav();
546
547 /* init the language selector based on user cookie for lang */
548 loadLangPref();
549 changeNavLang(getLangPref());
550
551 /* setup event handlers to ensure the overflow menu is visible while picking lang */
552 $("#language select")
553 .mousedown(function() {
554 $("div.morehover").addClass("hover"); })
555 .blur(function() {
556 $("div.morehover").removeClass("hover"); });
557
558 /* some global variable setup */
559 resizePackagesNav = $("#resize-packages-nav");
560 classesNav = $("#classes-nav");
561 devdocNav = $("#devdoc-nav");
562
563 var cookiePath = "";
564 if (location.href.indexOf("/reference/") != -1) {
565 cookiePath = "reference_";
566 } else if (location.href.indexOf("/guide/") != -1) {
567 cookiePath = "guide_";
568 } else if (location.href.indexOf("/tools/") != -1) {
569 cookiePath = "tools_";
570 } else if (location.href.indexOf("/training/") != -1) {
571 cookiePath = "training_";
572 } else if (location.href.indexOf("/design/") != -1) {
573 cookiePath = "design_";
574 } else if (location.href.indexOf("/distribute/") != -1) {
575 cookiePath = "distribute_";
576 }
577
578});
579// END of the onload event
580
581
582function initExpandableNavItems(rootTag) {
583 $(rootTag + ' li.nav-section .nav-section-header').click(function() {
584 var section = $(this).closest('li.nav-section');
585 if (section.hasClass('expanded')) {
586 /* hide me and descendants */
587 section.find('ul').slideUp(250, function() {
588 // remove 'expanded' class from my section and any children
589 section.closest('li').removeClass('expanded');
590 $('li.nav-section', section).removeClass('expanded');
591 resizeNav();
592 });
593 } else {
594 /* show me */
595 // first hide all other siblings
596 var $others = $('li.nav-section.expanded', $(this).closest('ul')).not('.sticky');
597 $others.removeClass('expanded').children('ul').slideUp(250);
598
599 // now expand me
600 section.closest('li').addClass('expanded');
601 section.children('ul').slideDown(250, function() {
602 resizeNav();
603 });
604 }
605 });
606
607 // Stop expand/collapse behavior when clicking on nav section links
608 // (since we're navigating away from the page)
609 // This selector captures the first instance of <a>, but not those with "#" as the href.
610 $('.nav-section-header').find('a:eq(0)').not('a[href="#"]').click(function(evt) {
611 window.location.href = $(this).attr('href');
612 return false;
613 });
614}
615
616/** Highlight the current page in sidenav, expanding children as appropriate */
617function highlightSidenav() {
618 // if something is already highlighted, undo it. This is for dynamic navigation (Samples index)
619 if ($("ul#nav li.selected").length) {
620 unHighlightSidenav();
621 }
622 // look for URL in sidenav, including the hash
623 var $selNavLink = $('#nav').find('a[href="' + mPagePath + location.hash + '"]');
624
625 // If the selNavLink is still empty, look for it without the hash
626 if ($selNavLink.length == 0) {
627 $selNavLink = $('#nav').find('a[href="' + mPagePath + '"]');
628 }
629
630 var $selListItem;
631 if ($selNavLink.length) {
632 // Find this page's <li> in sidenav and set selected
633 $selListItem = $selNavLink.closest('li');
634 $selListItem.addClass('selected');
635
636 // Traverse up the tree and expand all parent nav-sections
637 $selNavLink.parents('li.nav-section').each(function() {
638 $(this).addClass('expanded');
639 $(this).children('ul').show();
640 });
641 }
642}
643
644function unHighlightSidenav() {
645 $("ul#nav li.selected").removeClass("selected");
646 $('ul#nav li.nav-section.expanded').removeClass('expanded').children('ul').hide();
647}
648
649function toggleFullscreen(enable) {
650 var delay = 20;
651 var enabled = true;
652 var stylesheet = $('link[rel="stylesheet"][class="fullscreen"]');
653 if (enable) {
654 // Currently NOT USING fullscreen; enable fullscreen
655 stylesheet.removeAttr('disabled');
656 $('#nav-swap .fullscreen').removeClass('disabled');
657 $('#devdoc-nav').css({left:''});
658 setTimeout(updateSidenavFullscreenWidth,delay); // need to wait a moment for css to switch
659 enabled = true;
660 } else {
661 // Currently USING fullscreen; disable fullscreen
662 stylesheet.attr('disabled', 'disabled');
663 $('#nav-swap .fullscreen').addClass('disabled');
664 setTimeout(updateSidenavFixedWidth,delay); // need to wait a moment for css to switch
665 enabled = false;
666 }
667 writeCookie("fullscreen", enabled, null, null);
668 setNavBarLeftPos();
669 resizeNav(delay);
670 updateSideNavPosition();
671 setTimeout(initSidenavHeightResize,delay);
672}
673
674
675function setNavBarLeftPos() {
676 navBarLeftPos = $('#body-content').offset().left;
677}
678
679
680function updateSideNavPosition() {
681 var newLeft = $(window).scrollLeft() - navBarLeftPos;
682 $('#devdoc-nav').css({left: -newLeft});
683 $('#devdoc-nav .totop').css({left: -(newLeft - parseInt($('#side-nav').css('margin-left')))});
684}
685
686// TODO: use $(document).ready instead
687function addLoadEvent(newfun) {
688 var current = window.onload;
689 if (typeof window.onload != 'function') {
690 window.onload = newfun;
691 } else {
692 window.onload = function() {
693 current();
694 newfun();
695 }
696 }
697}
698
699var agent = navigator['userAgent'].toLowerCase();
700// If a mobile phone, set flag and do mobile setup
701if ((agent.indexOf("mobile") != -1) || // android, iphone, ipod
702 (agent.indexOf("blackberry") != -1) ||
703 (agent.indexOf("webos") != -1) ||
704 (agent.indexOf("mini") != -1)) { // opera mini browsers
705 isMobile = true;
706}
707
708
709$(document).ready(function() {
710 $("pre:not(.no-pretty-print)").addClass("prettyprint");
711 prettyPrint();
712});
713
714
715
716
717/* ######### RESIZE THE SIDENAV HEIGHT ########## */
718
719function resizeNav(delay) {
720 var $nav = $("#devdoc-nav");
721 var $window = $(window);
722 var navHeight;
723
724 // Get the height of entire window and the total header height.
725 // Then figure out based on scroll position whether the header is visible
726 var windowHeight = $window.height();
727 var scrollTop = $window.scrollTop();
728 var headerHeight = $('#header').outerHeight();
729 var subheaderHeight = $('#nav-x').outerHeight();
730 var headerVisible = (scrollTop < (headerHeight + subheaderHeight));
731
732 // get the height of space between nav and top of window.
733 // Could be either margin or top position, depending on whether the nav is fixed.
734 var topMargin = (parseInt($nav.css('margin-top')) || parseInt($nav.css('top'))) + 1;
735 // add 1 for the #side-nav bottom margin
736
737 // Depending on whether the header is visible, set the side nav's height.
738 if (headerVisible) {
739 // The sidenav height grows as the header goes off screen
740 navHeight = windowHeight - (headerHeight + subheaderHeight - scrollTop) - topMargin;
741 } else {
742 // Once header is off screen, the nav height is almost full window height
743 navHeight = windowHeight - topMargin;
744 }
745
746
747
748 $scrollPanes = $(".scroll-pane");
749 if ($scrollPanes.length > 1) {
750 // subtract the height of the api level widget and nav swapper from the available nav height
751 navHeight -= ($('#api-nav-header').outerHeight(true) + $('#nav-swap').outerHeight(true));
752
753 $("#swapper").css({height:navHeight + "px"});
754 if ($("#nav-tree").is(":visible")) {
755 $("#nav-tree").css({height:navHeight});
756 }
757
758 var classesHeight = navHeight - parseInt($("#resize-packages-nav").css("height")) - 10 + "px";
759 //subtract 10px to account for drag bar
760
761 // if the window becomes small enough to make the class panel height 0,
762 // then the package panel should begin to shrink
763 if (parseInt(classesHeight) <= 0) {
764 $("#resize-packages-nav").css({height:navHeight - 10}); //subtract 10px for drag bar
765 $("#packages-nav").css({height:navHeight - 10});
766 }
767
768 $("#classes-nav").css({'height':classesHeight, 'margin-top':'10px'});
769 $("#classes-nav .jspContainer").css({height:classesHeight});
770
771
772 } else {
773 $nav.height(navHeight);
774 }
775
776 if (delay) {
777 updateFromResize = true;
778 delayedReInitScrollbars(delay);
779 } else {
780 reInitScrollbars();
781 }
782
783}
784
785var updateScrollbars = false;
786var updateFromResize = false;
787
788/* Re-initialize the scrollbars to account for changed nav size.
789 * This method postpones the actual update by a 1/4 second in order to optimize the
790 * scroll performance while the header is still visible, because re-initializing the
791 * scroll panes is an intensive process.
792 */
793function delayedReInitScrollbars(delay) {
794 // If we're scheduled for an update, but have received another resize request
795 // before the scheduled resize has occured, just ignore the new request
796 // (and wait for the scheduled one).
797 if (updateScrollbars && updateFromResize) {
798 updateFromResize = false;
799 return;
800 }
801
802 // We're scheduled for an update and the update request came from this method's setTimeout
803 if (updateScrollbars && !updateFromResize) {
804 reInitScrollbars();
805 updateScrollbars = false;
806 } else {
807 updateScrollbars = true;
808 updateFromResize = false;
809 setTimeout('delayedReInitScrollbars()',delay);
810 }
811}
812
813/* Re-initialize the scrollbars to account for changed nav size. */
814function reInitScrollbars() {
815 var pane = $(".scroll-pane").each(function(){
816 var api = $(this).data('jsp');
817 if (!api) { setTimeout(reInitScrollbars,300); return;}
818 api.reinitialise( {verticalGutter:0} );
819 });
820 $(".scroll-pane").removeAttr("tabindex"); // get rid of tabindex added by jscroller
821}
822
823
824/* Resize the height of the nav panels in the reference,
825 * and save the new size to a cookie */
826function saveNavPanels() {
827 var basePath = getBaseUri(location.pathname);
828 var section = basePath.substring(1,basePath.indexOf("/",1));
829 writeCookie("height", resizePackagesNav.css("height"), section, null);
830}
831
832
833
834function restoreHeight(packageHeight) {
835 $("#resize-packages-nav").height(packageHeight);
836 $("#packages-nav").height(packageHeight);
837 // var classesHeight = navHeight - packageHeight;
838 // $("#classes-nav").css({height:classesHeight});
839 // $("#classes-nav .jspContainer").css({height:classesHeight});
840}
841
842
843
844/* ######### END RESIZE THE SIDENAV HEIGHT ########## */
845
846
847
848
849
850/** Scroll the jScrollPane to make the currently selected item visible
851 This is called when the page finished loading. */
852function scrollIntoView(nav) {
853 var $nav = $("#"+nav);
854 var element = $nav.jScrollPane({/* ...settings... */});
855 var api = element.data('jsp');
856
857 if ($nav.is(':visible')) {
858 var $selected = $(".selected", $nav);
859 if ($selected.length == 0) {
860 // If no selected item found, exit
861 return;
862 }
863 // get the selected item's offset from its container nav by measuring the item's offset
864 // relative to the document then subtract the container nav's offset relative to the document
865 var selectedOffset = $selected.offset().top - $nav.offset().top;
866 if (selectedOffset > $nav.height() * .8) { // multiply nav height by .8 so we move up the item
867 // if it's more than 80% down the nav
868 // scroll the item up by an amount equal to 80% the container nav's height
869 api.scrollTo(0, selectedOffset - ($nav.height() * .8), false);
870 }
871 }
872}
873
874
875
876
877
878
879/* Show popup dialogs */
880function showDialog(id) {
881 $dialog = $("#"+id);
882 $dialog.prepend('<div class="box-border"><div class="top"> <div class="left"></div> <div class="right"></div></div><div class="bottom"> <div class="left"></div> <div class="right"></div> </div> </div>');
883 $dialog.wrapInner('<div/>');
884 $dialog.removeClass("hide");
885}
886
887
888
889
890
891/* ######### COOKIES! ########## */
892
893function readCookie(cookie) {
894 var myCookie = cookie_namespace+"_"+cookie+"=";
895 if (document.cookie) {
896 var index = document.cookie.indexOf(myCookie);
897 if (index != -1) {
898 var valStart = index + myCookie.length;
899 var valEnd = document.cookie.indexOf(";", valStart);
900 if (valEnd == -1) {
901 valEnd = document.cookie.length;
902 }
903 var val = document.cookie.substring(valStart, valEnd);
904 return val;
905 }
906 }
907 return 0;
908}
909
910function writeCookie(cookie, val, section, expiration) {
911 if (val==undefined) return;
912 section = section == null ? "_" : "_"+section+"_";
913 if (expiration == null) {
914 var date = new Date();
915 date.setTime(date.getTime()+(10*365*24*60*60*1000)); // default expiration is one week
916 expiration = date.toGMTString();
917 }
918 var cookieValue = cookie_namespace + section + cookie + "=" + val
919 + "; expires=" + expiration+"; path=/";
920 document.cookie = cookieValue;
921}
922
923/* ######### END COOKIES! ########## */
924
925
926
927
928
Dirk Dougherty08032402014-02-15 10:14:35 -0800929/*
930 * Displays sticky nav bar on pages when dac header scrolls out of view
931 */
932
933(function() {
934 $(document).ready(function() {
935
936 // Sticky nav position
937 var stickyTop = $('#header-wrapper').outerHeight();
938 var sticky = false;
939 var hiding = false;
940 var $stickyEl = $('#sticky-header');
941 var $menuEl = $('.menu-container');
942 //var scrollThrottle = -1;
943 var lastScroll = 0;
944 var autoScrolling = false;
945
946 $(window).scroll(function() {
947 var top = $(window).scrollTop();
948
949 if (sticky && top < stickyTop) {
950 sticky = false;
951 hiding = true;
952 $stickyEl.css({'opacity': 0});
953 setTimeout(function() {
954 $menuEl.removeClass('sticky-menu');
955 $stickyEl.hide();
956 hiding = false;
957 }, 250);
958 } else if (!sticky && top >= stickyTop) {
959 sticky = true;
960 $stickyEl.show();
961 $menuEl.addClass('sticky-menu');
962
963 setTimeout(function() {
964 $stickyEl.css({'opacity': 1});
965 }, 10);
966
967 // If its a jump then make sure to modify the scroll because of the
968 // sticky nav
969 if (!autoScrolling && Math.abs(top - lastScroll > 100)) {
970 autoScrolling = true;
971 $('body,html').animate({scrollTop:(top = top - 60)}, '250', 'swing', function() { autoScrolling = false; });
972 }
973 } else if (hiding && top < 15) {
974 $menuEl.removeClass('sticky-menu');
975 $stickyEl.hide();
976 hiding = false;
977 }
978
979 lastScroll = top;
980 });
981
982 // Stack hover states
983 $('.section-card-menu').each(function(index, el) {
984 var height = $(el).height();
985 $(el).css({height:height+'px', position:'relative'});
986 var $cardInfo = $(el).find('.card-info');
987
988 $cardInfo.css({position: 'absolute', bottom:'0px', left:'0px', right:'0px', overflow:'visible'});
989 });
990
991 // Auto scroll anchors and account for sticky nav
992 $('a[href^=#]').click(function(e){
993 e.preventDefault();
994 var tmp = $.attr(this, 'href').substr(1);
995 var el = document.getElementById(tmp) ||
996 ((tmp = document.getElementsByName(tmp)).length ?
997 tmp[0] : null);
998
999 if (el) {
1000 var top = $(el).offset().top - 60;
1001 autoScrolling = true;
1002 $('body,html').animate({scrollTop:top}, '500', 'swing', function() { autoScrolling = false; });
1003 }
1004 });
1005
1006 });
1007
1008})();
Dirk Dougherty541b4942014-02-14 18:31:53 -08001009
1010
1011
1012
1013
1014
1015
1016
1017
1018
1019
1020
1021
1022
1023/* MISC LIBRARY FUNCTIONS */
1024
1025
1026
1027
1028
1029function toggle(obj, slide) {
1030 var ul = $("ul:first", obj);
1031 var li = ul.parent();
1032 if (li.hasClass("closed")) {
1033 if (slide) {
1034 ul.slideDown("fast");
1035 } else {
1036 ul.show();
1037 }
1038 li.removeClass("closed");
1039 li.addClass("open");
1040 $(".toggle-img", li).attr("title", "hide pages");
1041 } else {
1042 ul.slideUp("fast");
1043 li.removeClass("open");
1044 li.addClass("closed");
1045 $(".toggle-img", li).attr("title", "show pages");
1046 }
1047}
1048
1049
1050function buildToggleLists() {
1051 $(".toggle-list").each(
1052 function(i) {
1053 $("div:first", this).append("<a class='toggle-img' href='#' title='show pages' onClick='toggle(this.parentNode.parentNode, true); return false;'></a>");
1054 $(this).addClass("closed");
1055 });
1056}
1057
1058
1059
1060function hideNestedItems(list, toggle) {
1061 $list = $(list);
1062 // hide nested lists
1063 if($list.hasClass('showing')) {
1064 $("li ol", $list).hide('fast');
1065 $list.removeClass('showing');
1066 // show nested lists
1067 } else {
1068 $("li ol", $list).show('fast');
1069 $list.addClass('showing');
1070 }
1071 $(".more,.less",$(toggle)).toggle();
1072}
1073
1074
1075
1076
1077
1078
1079
1080
1081
1082
1083
1084
1085
1086
1087
1088
1089
1090
1091
1092
1093
1094
1095
1096
1097
1098
1099
1100
1101/* REFERENCE NAV SWAP */
1102
1103
1104function getNavPref() {
1105 var v = readCookie('reference_nav');
1106 if (v != NAV_PREF_TREE) {
1107 v = NAV_PREF_PANELS;
1108 }
1109 return v;
1110}
1111
1112function chooseDefaultNav() {
1113 nav_pref = getNavPref();
1114 if (nav_pref == NAV_PREF_TREE) {
1115 $("#nav-panels").toggle();
1116 $("#panel-link").toggle();
1117 $("#nav-tree").toggle();
1118 $("#tree-link").toggle();
1119 }
1120}
1121
1122function swapNav() {
1123 if (nav_pref == NAV_PREF_TREE) {
1124 nav_pref = NAV_PREF_PANELS;
1125 } else {
1126 nav_pref = NAV_PREF_TREE;
1127 init_default_navtree(toRoot);
1128 }
1129 var date = new Date();
1130 date.setTime(date.getTime()+(10*365*24*60*60*1000)); // keep this for 10 years
1131 writeCookie("nav", nav_pref, "reference", date.toGMTString());
1132
1133 $("#nav-panels").toggle();
1134 $("#panel-link").toggle();
1135 $("#nav-tree").toggle();
1136 $("#tree-link").toggle();
1137
1138 resizeNav();
1139
1140 // Gross nasty hack to make tree view show up upon first swap by setting height manually
1141 $("#nav-tree .jspContainer:visible")
1142 .css({'height':$("#nav-tree .jspContainer .jspPane").height() +'px'});
1143 // Another nasty hack to make the scrollbar appear now that we have height
1144 resizeNav();
1145
1146 if ($("#nav-tree").is(':visible')) {
1147 scrollIntoView("nav-tree");
1148 } else {
1149 scrollIntoView("packages-nav");
1150 scrollIntoView("classes-nav");
1151 }
1152}
1153
1154
1155
1156/* ############################################ */
1157/* ########## LOCALIZATION ############ */
1158/* ############################################ */
1159
1160function getBaseUri(uri) {
1161 var intlUrl = (uri.substring(0,6) == "/intl/");
1162 if (intlUrl) {
1163 base = uri.substring(uri.indexOf('intl/')+5,uri.length);
1164 base = base.substring(base.indexOf('/')+1, base.length);
1165 //alert("intl, returning base url: /" + base);
1166 return ("/" + base);
1167 } else {
1168 //alert("not intl, returning uri as found.");
1169 return uri;
1170 }
1171}
1172
1173function requestAppendHL(uri) {
1174//append "?hl=<lang> to an outgoing request (such as to blog)
1175 var lang = getLangPref();
1176 if (lang) {
1177 var q = 'hl=' + lang;
1178 uri += '?' + q;
1179 window.location = uri;
1180 return false;
1181 } else {
1182 return true;
1183 }
1184}
1185
1186
1187function changeNavLang(lang) {
1188 var $links = $("#devdoc-nav,#header,#nav-x,.training-nav-top,.content-footer").find("a["+lang+"-lang]");
1189 $links.each(function(i){ // for each link with a translation
1190 var $link = $(this);
1191 if (lang != "en") { // No need to worry about English, because a language change invokes new request
1192 // put the desired language from the attribute as the text
1193 $link.text($link.attr(lang+"-lang"))
1194 }
1195 });
1196}
1197
1198function changeLangPref(lang, submit) {
1199 var date = new Date();
1200 expires = date.toGMTString(date.setTime(date.getTime()+(10*365*24*60*60*1000)));
1201 // keep this for 50 years
1202 //alert("expires: " + expires)
1203 writeCookie("pref_lang", lang, null, expires);
1204
1205 // ####### TODO: Remove this condition once we're stable on devsite #######
1206 // This condition is only needed if we still need to support legacy GAE server
1207 if (devsite) {
1208 // Switch language when on Devsite server
1209 if (submit) {
1210 $("#setlang").submit();
1211 }
1212 } else {
1213 // Switch language when on legacy GAE server
1214 if (submit) {
1215 window.location = getBaseUri(location.pathname);
1216 }
1217 }
1218}
1219
1220function loadLangPref() {
1221 var lang = readCookie("pref_lang");
1222 if (lang != 0) {
1223 $("#language").find("option[value='"+lang+"']").attr("selected",true);
1224 }
1225}
1226
1227function getLangPref() {
1228 var lang = $("#language").find(":selected").attr("value");
1229 if (!lang) {
1230 lang = readCookie("pref_lang");
1231 }
1232 return (lang != 0) ? lang : 'en';
1233}
1234
1235/* ########## END LOCALIZATION ############ */
1236
1237
1238
1239
1240
1241
1242/* Used to hide and reveal supplemental content, such as long code samples.
1243 See the companion CSS in android-developer-docs.css */
1244function toggleContent(obj) {
1245 var div = $(obj).closest(".toggle-content");
1246 var toggleMe = $(".toggle-content-toggleme:eq(0)",div);
1247 if (div.hasClass("closed")) { // if it's closed, open it
1248 toggleMe.slideDown();
1249 $(".toggle-content-text:eq(0)", obj).toggle();
1250 div.removeClass("closed").addClass("open");
1251 $(".toggle-content-img:eq(0)", div).attr("title", "hide").attr("src", toRoot
1252 + "assets/images/triangle-opened.png");
1253 } else { // if it's open, close it
1254 toggleMe.slideUp('fast', function() { // Wait until the animation is done before closing arrow
1255 $(".toggle-content-text:eq(0)", obj).toggle();
1256 div.removeClass("open").addClass("closed");
1257 div.find(".toggle-content").removeClass("open").addClass("closed")
1258 .find(".toggle-content-toggleme").hide();
1259 $(".toggle-content-img", div).attr("title", "show").attr("src", toRoot
1260 + "assets/images/triangle-closed.png");
1261 });
1262 }
1263 return false;
1264}
1265
1266
1267/* New version of expandable content */
1268function toggleExpandable(link,id) {
1269 if($(id).is(':visible')) {
1270 $(id).slideUp();
1271 $(link).removeClass('expanded');
1272 } else {
1273 $(id).slideDown();
1274 $(link).addClass('expanded');
1275 }
1276}
1277
1278function hideExpandable(ids) {
1279 $(ids).slideUp();
1280 $(ids).prev('h4').find('a.expandable').removeClass('expanded');
1281}
1282
1283
1284
1285
1286
1287/*
1288 * Slideshow 1.0
1289 * Used on /index.html and /develop/index.html for carousel
1290 *
1291 * Sample usage:
1292 * HTML -
1293 * <div class="slideshow-container">
1294 * <a href="" class="slideshow-prev">Prev</a>
1295 * <a href="" class="slideshow-next">Next</a>
1296 * <ul>
1297 * <li class="item"><img src="images/marquee1.jpg"></li>
1298 * <li class="item"><img src="images/marquee2.jpg"></li>
1299 * <li class="item"><img src="images/marquee3.jpg"></li>
1300 * <li class="item"><img src="images/marquee4.jpg"></li>
1301 * </ul>
1302 * </div>
1303 *
1304 * <script type="text/javascript">
1305 * $('.slideshow-container').dacSlideshow({
1306 * auto: true,
1307 * btnPrev: '.slideshow-prev',
1308 * btnNext: '.slideshow-next'
1309 * });
1310 * </script>
1311 *
1312 * Options:
1313 * btnPrev: optional identifier for previous button
1314 * btnNext: optional identifier for next button
1315 * btnPause: optional identifier for pause button
1316 * auto: whether or not to auto-proceed
1317 * speed: animation speed
1318 * autoTime: time between auto-rotation
1319 * easing: easing function for transition
1320 * start: item to select by default
1321 * scroll: direction to scroll in
1322 * pagination: whether or not to include dotted pagination
1323 *
1324 */
1325
1326 (function($) {
1327 $.fn.dacSlideshow = function(o) {
1328
1329 //Options - see above
1330 o = $.extend({
1331 btnPrev: null,
1332 btnNext: null,
1333 btnPause: null,
1334 auto: true,
1335 speed: 500,
1336 autoTime: 12000,
1337 easing: null,
1338 start: 0,
1339 scroll: 1,
1340 pagination: true
1341
1342 }, o || {});
1343
1344 //Set up a carousel for each
1345 return this.each(function() {
1346
1347 var running = false;
1348 var animCss = o.vertical ? "top" : "left";
1349 var sizeCss = o.vertical ? "height" : "width";
1350 var div = $(this);
1351 var ul = $("ul", div);
1352 var tLi = $("li", ul);
1353 var tl = tLi.size();
1354 var timer = null;
1355
1356 var li = $("li", ul);
1357 var itemLength = li.size();
1358 var curr = o.start;
1359
1360 li.css({float: o.vertical ? "none" : "left"});
1361 ul.css({margin: "0", padding: "0", position: "relative", "list-style-type": "none", "z-index": "1"});
1362 div.css({position: "relative", "z-index": "2", left: "0px"});
1363
1364 var liSize = o.vertical ? height(li) : width(li);
1365 var ulSize = liSize * itemLength;
1366 var divSize = liSize;
1367
1368 li.css({width: li.width(), height: li.height()});
1369 ul.css(sizeCss, ulSize+"px").css(animCss, -(curr*liSize));
1370
1371 div.css(sizeCss, divSize+"px");
1372
1373 //Pagination
1374 if (o.pagination) {
1375 var pagination = $("<div class='pagination'></div>");
1376 var pag_ul = $("<ul></ul>");
1377 if (tl > 1) {
1378 for (var i=0;i<tl;i++) {
1379 var li = $("<li>"+i+"</li>");
1380 pag_ul.append(li);
1381 if (i==o.start) li.addClass('active');
1382 li.click(function() {
1383 go(parseInt($(this).text()));
1384 })
1385 }
1386 pagination.append(pag_ul);
1387 div.append(pagination);
1388 }
1389 }
1390
1391 //Previous button
1392 if(o.btnPrev)
1393 $(o.btnPrev).click(function(e) {
1394 e.preventDefault();
1395 return go(curr-o.scroll);
1396 });
1397
1398 //Next button
1399 if(o.btnNext)
1400 $(o.btnNext).click(function(e) {
1401 e.preventDefault();
1402 return go(curr+o.scroll);
1403 });
1404
1405 //Pause button
1406 if(o.btnPause)
1407 $(o.btnPause).click(function(e) {
1408 e.preventDefault();
1409 if ($(this).hasClass('paused')) {
1410 startRotateTimer();
1411 } else {
1412 pauseRotateTimer();
1413 }
1414 });
1415
1416 //Auto rotation
1417 if(o.auto) startRotateTimer();
1418
1419 function startRotateTimer() {
1420 clearInterval(timer);
1421 timer = setInterval(function() {
1422 if (curr == tl-1) {
1423 go(0);
1424 } else {
1425 go(curr+o.scroll);
1426 }
1427 }, o.autoTime);
1428 $(o.btnPause).removeClass('paused');
1429 }
1430
1431 function pauseRotateTimer() {
1432 clearInterval(timer);
1433 $(o.btnPause).addClass('paused');
1434 }
1435
1436 //Go to an item
1437 function go(to) {
1438 if(!running) {
1439
1440 if(to<0) {
1441 to = itemLength-1;
1442 } else if (to>itemLength-1) {
1443 to = 0;
1444 }
1445 curr = to;
1446
1447 running = true;
1448
1449 ul.animate(
1450 animCss == "left" ? { left: -(curr*liSize) } : { top: -(curr*liSize) } , o.speed, o.easing,
1451 function() {
1452 running = false;
1453 }
1454 );
1455
1456 $(o.btnPrev + "," + o.btnNext).removeClass("disabled");
1457 $( (curr-o.scroll<0 && o.btnPrev)
1458 ||
1459 (curr+o.scroll > itemLength && o.btnNext)
1460 ||
1461 []
1462 ).addClass("disabled");
1463
1464
1465 var nav_items = $('li', pagination);
1466 nav_items.removeClass('active');
1467 nav_items.eq(to).addClass('active');
1468
1469
1470 }
1471 if(o.auto) startRotateTimer();
1472 return false;
1473 };
1474 });
1475 };
1476
1477 function css(el, prop) {
1478 return parseInt($.css(el[0], prop)) || 0;
1479 };
1480 function width(el) {
1481 return el[0].offsetWidth + css(el, 'marginLeft') + css(el, 'marginRight');
1482 };
1483 function height(el) {
1484 return el[0].offsetHeight + css(el, 'marginTop') + css(el, 'marginBottom');
1485 };
1486
1487 })(jQuery);
1488
1489
1490/*
1491 * dacSlideshow 1.0
1492 * Used on develop/index.html for side-sliding tabs
1493 *
1494 * Sample usage:
1495 * HTML -
1496 * <div class="slideshow-container">
1497 * <a href="" class="slideshow-prev">Prev</a>
1498 * <a href="" class="slideshow-next">Next</a>
1499 * <ul>
1500 * <li class="item"><img src="images/marquee1.jpg"></li>
1501 * <li class="item"><img src="images/marquee2.jpg"></li>
1502 * <li class="item"><img src="images/marquee3.jpg"></li>
1503 * <li class="item"><img src="images/marquee4.jpg"></li>
1504 * </ul>
1505 * </div>
1506 *
1507 * <script type="text/javascript">
1508 * $('.slideshow-container').dacSlideshow({
1509 * auto: true,
1510 * btnPrev: '.slideshow-prev',
1511 * btnNext: '.slideshow-next'
1512 * });
1513 * </script>
1514 *
1515 * Options:
1516 * btnPrev: optional identifier for previous button
1517 * btnNext: optional identifier for next button
1518 * auto: whether or not to auto-proceed
1519 * speed: animation speed
1520 * autoTime: time between auto-rotation
1521 * easing: easing function for transition
1522 * start: item to select by default
1523 * scroll: direction to scroll in
1524 * pagination: whether or not to include dotted pagination
1525 *
1526 */
1527 (function($) {
1528 $.fn.dacTabbedList = function(o) {
1529
1530 //Options - see above
1531 o = $.extend({
1532 speed : 250,
1533 easing: null,
1534 nav_id: null,
1535 frame_id: null
1536 }, o || {});
1537
1538 //Set up a carousel for each
1539 return this.each(function() {
1540
1541 var curr = 0;
1542 var running = false;
1543 var animCss = "margin-left";
1544 var sizeCss = "width";
1545 var div = $(this);
1546
1547 var nav = $(o.nav_id, div);
1548 var nav_li = $("li", nav);
1549 var nav_size = nav_li.size();
1550 var frame = div.find(o.frame_id);
1551 var content_width = $(frame).find('ul').width();
1552 //Buttons
1553 $(nav_li).click(function(e) {
1554 go($(nav_li).index($(this)));
1555 })
1556
1557 //Go to an item
1558 function go(to) {
1559 if(!running) {
1560 curr = to;
1561 running = true;
1562
1563 frame.animate({ 'margin-left' : -(curr*content_width) }, o.speed, o.easing,
1564 function() {
1565 running = false;
1566 }
1567 );
1568
1569
1570 nav_li.removeClass('active');
1571 nav_li.eq(to).addClass('active');
1572
1573
1574 }
1575 return false;
1576 };
1577 });
1578 };
1579
1580 function css(el, prop) {
1581 return parseInt($.css(el[0], prop)) || 0;
1582 };
1583 function width(el) {
1584 return el[0].offsetWidth + css(el, 'marginLeft') + css(el, 'marginRight');
1585 };
1586 function height(el) {
1587 return el[0].offsetHeight + css(el, 'marginTop') + css(el, 'marginBottom');
1588 };
1589
1590 })(jQuery);
1591
1592
1593
1594
1595
1596/* ######################################################## */
1597/* ################ SEARCH SUGGESTIONS ################## */
1598/* ######################################################## */
1599
1600
1601
1602var gSelectedIndex = -1; // the index position of currently highlighted suggestion
1603var gSelectedColumn = -1; // which column of suggestion lists is currently focused
1604
1605var gMatches = new Array();
1606var gLastText = "";
1607var gInitialized = false;
1608var ROW_COUNT_FRAMEWORK = 20; // max number of results in list
1609var gListLength = 0;
1610
1611
1612var gGoogleMatches = new Array();
1613var ROW_COUNT_GOOGLE = 15; // max number of results in list
1614var gGoogleListLength = 0;
1615
1616var gDocsMatches = new Array();
1617var ROW_COUNT_DOCS = 100; // max number of results in list
1618var gDocsListLength = 0;
1619
1620function onSuggestionClick(link) {
1621 // When user clicks a suggested document, track it
1622 _gaq.push(['_trackEvent', 'Suggestion Click', 'clicked: ' + $(link).text(),
1623 'from: ' + $("#search_autocomplete").val()]);
1624}
1625
1626function set_item_selected($li, selected)
1627{
1628 if (selected) {
1629 $li.attr('class','jd-autocomplete jd-selected');
1630 } else {
1631 $li.attr('class','jd-autocomplete');
1632 }
1633}
1634
1635function set_item_values(toroot, $li, match)
1636{
1637 var $link = $('a',$li);
1638 $link.html(match.__hilabel || match.label);
1639 $link.attr('href',toroot + match.link);
1640}
1641
1642function set_item_values_jd(toroot, $li, match)
1643{
1644 var $link = $('a',$li);
1645 $link.html(match.title);
1646 $link.attr('href',toroot + match.url);
1647}
1648
1649function new_suggestion($list) {
1650 var $li = $("<li class='jd-autocomplete'></li>");
1651 $list.append($li);
1652
1653 $li.mousedown(function() {
1654 window.location = this.firstChild.getAttribute("href");
1655 });
1656 $li.mouseover(function() {
1657 $('.search_filtered_wrapper li').removeClass('jd-selected');
1658 $(this).addClass('jd-selected');
1659 gSelectedColumn = $(".search_filtered:visible").index($(this).closest('.search_filtered'));
1660 gSelectedIndex = $("li", $(".search_filtered:visible")[gSelectedColumn]).index(this);
1661 });
1662 $li.append("<a onclick='onSuggestionClick(this)'></a>");
1663 $li.attr('class','show-item');
1664 return $li;
1665}
1666
1667function sync_selection_table(toroot)
1668{
1669 var $li; //list item jquery object
1670 var i; //list item iterator
1671
1672 // if there are NO results at all, hide all columns
1673 if (!(gMatches.length > 0) && !(gGoogleMatches.length > 0) && !(gDocsMatches.length > 0)) {
1674 $('.suggest-card').hide(300);
1675 return;
1676 }
1677
1678 // if there are api results
1679 if ((gMatches.length > 0) || (gGoogleMatches.length > 0)) {
1680 // reveal suggestion list
1681 $('.suggest-card.dummy').show();
1682 $('.suggest-card.reference').show();
1683 var listIndex = 0; // list index position
1684
1685 // reset the lists
1686 $(".search_filtered_wrapper.reference li").remove();
1687
1688 // ########### ANDROID RESULTS #############
1689 if (gMatches.length > 0) {
1690
1691 // determine android results to show
1692 gListLength = gMatches.length < ROW_COUNT_FRAMEWORK ?
1693 gMatches.length : ROW_COUNT_FRAMEWORK;
1694 for (i=0; i<gListLength; i++) {
1695 var $li = new_suggestion($(".suggest-card.reference ul"));
1696 set_item_values(toroot, $li, gMatches[i]);
1697 set_item_selected($li, i == gSelectedIndex);
1698 }
1699 }
1700
1701 // ########### GOOGLE RESULTS #############
1702 if (gGoogleMatches.length > 0) {
1703 // show header for list
1704 $(".suggest-card.reference ul").append("<li class='header'>in Google Services:</li>");
1705
1706 // determine google results to show
1707 gGoogleListLength = gGoogleMatches.length < ROW_COUNT_GOOGLE ? gGoogleMatches.length : ROW_COUNT_GOOGLE;
1708 for (i=0; i<gGoogleListLength; i++) {
1709 var $li = new_suggestion($(".suggest-card.reference ul"));
1710 set_item_values(toroot, $li, gGoogleMatches[i]);
1711 set_item_selected($li, i == gSelectedIndex);
1712 }
1713 }
1714 } else {
1715 $('.suggest-card.reference').hide();
1716 $('.suggest-card.dummy').hide();
1717 }
1718
1719 // ########### JD DOC RESULTS #############
1720 if (gDocsMatches.length > 0) {
1721 // reset the lists
1722 $(".search_filtered_wrapper.docs li").remove();
1723
1724 // determine google results to show
1725 // NOTE: The order of the conditions below for the sugg.type MUST BE SPECIFIC:
1726 // The order must match the reverse order that each section appears as a card in
1727 // the suggestion UI... this may be only for the "develop" grouped items though.
1728 gDocsListLength = gDocsMatches.length < ROW_COUNT_DOCS ? gDocsMatches.length : ROW_COUNT_DOCS;
1729 for (i=0; i<gDocsListLength; i++) {
1730 var sugg = gDocsMatches[i];
1731 var $li;
1732 if (sugg.type == "design") {
1733 $li = new_suggestion($(".suggest-card.design ul"));
1734 } else
1735 if (sugg.type == "distribute") {
1736 $li = new_suggestion($(".suggest-card.distribute ul"));
1737 } else
1738 if (sugg.type == "samples") {
1739 $li = new_suggestion($(".suggest-card.develop .child-card.samples"));
1740 } else
1741 if (sugg.type == "training") {
1742 $li = new_suggestion($(".suggest-card.develop .child-card.training"));
1743 } else
1744 if (sugg.type == "about"||"guide"||"tools"||"google") {
1745 $li = new_suggestion($(".suggest-card.develop .child-card.guides"));
1746 } else {
1747 continue;
1748 }
1749
1750 set_item_values_jd(toroot, $li, sugg);
1751 set_item_selected($li, i == gSelectedIndex);
1752 }
1753
1754 // add heading and show or hide card
1755 if ($(".suggest-card.design li").length > 0) {
1756 $(".suggest-card.design ul").prepend("<li class='header'>Design:</li>");
1757 $(".suggest-card.design").show(300);
1758 } else {
1759 $('.suggest-card.design').hide(300);
1760 }
1761 if ($(".suggest-card.distribute li").length > 0) {
1762 $(".suggest-card.distribute ul").prepend("<li class='header'>Distribute:</li>");
1763 $(".suggest-card.distribute").show(300);
1764 } else {
1765 $('.suggest-card.distribute').hide(300);
1766 }
1767 if ($(".child-card.guides li").length > 0) {
1768 $(".child-card.guides").prepend("<li class='header'>Guides:</li>");
1769 $(".child-card.guides li").appendTo(".suggest-card.develop ul");
1770 }
1771 if ($(".child-card.training li").length > 0) {
1772 $(".child-card.training").prepend("<li class='header'>Training:</li>");
1773 $(".child-card.training li").appendTo(".suggest-card.develop ul");
1774 }
1775 if ($(".child-card.samples li").length > 0) {
1776 $(".child-card.samples").prepend("<li class='header'>Samples:</li>");
1777 $(".child-card.samples li").appendTo(".suggest-card.develop ul");
1778 }
1779
1780 if ($(".suggest-card.develop li").length > 0) {
1781 $(".suggest-card.develop").show(300);
1782 } else {
1783 $('.suggest-card.develop').hide(300);
1784 }
1785
1786 } else {
1787 $('.search_filtered_wrapper.docs .suggest-card:not(.dummy)').hide(300);
1788 }
1789}
1790
1791/** Called by the search input's onkeydown and onkeyup events.
1792 * Handles navigation with keyboard arrows, Enter key to invoke search,
1793 * otherwise invokes search suggestions on key-up event.
1794 * @param e The JS event
1795 * @param kd True if the event is key-down
1796 * @param toroot A string for the site's root path
1797 * @returns True if the event should bubble up
1798 */
1799function search_changed(e, kd, toroot)
1800{
1801 var currentLang = getLangPref();
1802 var search = document.getElementById("search_autocomplete");
1803 var text = search.value.replace(/(^ +)|( +$)/g, '');
1804 // get the ul hosting the currently selected item
1805 gSelectedColumn = gSelectedColumn >= 0 ? gSelectedColumn : 0;
1806 var $columns = $(".search_filtered_wrapper").find(".search_filtered:visible");
1807 var $selectedUl = $columns[gSelectedColumn];
1808
1809 // show/hide the close button
1810 if (text != '') {
1811 $(".search .close").removeClass("hide");
1812 } else {
1813 $(".search .close").addClass("hide");
1814 }
1815 // 27 = esc
1816 if (e.keyCode == 27) {
1817 // close all search results
1818 if (kd) $('.search .close').trigger('click');
1819 return true;
1820 }
1821 // 13 = enter
1822 else if (e.keyCode == 13) {
1823 if (gSelectedIndex < 0) {
1824 $('.suggest-card').hide();
1825 if ($("#searchResults").is(":hidden") && (search.value != "")) {
1826 // if results aren't showing (and text not empty), return true to allow search to execute
Dirk Dougherty08032402014-02-15 10:14:35 -08001827 $('body,html').animate({scrollTop:0}, '500', 'swing', function() { autoScrolling = false; });
Dirk Dougherty541b4942014-02-14 18:31:53 -08001828 return true;
1829 } else {
1830 // otherwise, results are already showing, so allow ajax to auto refresh the results
1831 // and ignore this Enter press to avoid the reload.
1832 return false;
1833 }
1834 } else if (kd && gSelectedIndex >= 0) {
1835 // click the link corresponding to selected item
1836 $("a",$("li",$selectedUl)[gSelectedIndex]).get()[0].click();
1837 return false;
1838 }
1839 }
1840 // Stop here if Google results are showing
1841 else if ($("#searchResults").is(":visible")) {
1842 return true;
1843 }
1844 // 38 UP ARROW
1845 else if (kd && (e.keyCode == 38)) {
1846 // if the next item is a header, skip it
1847 if ($($("li", $selectedUl)[gSelectedIndex-1]).hasClass("header")) {
1848 gSelectedIndex--;
1849 }
1850 if (gSelectedIndex >= 0) {
1851 $('li', $selectedUl).removeClass('jd-selected');
1852 gSelectedIndex--;
1853 $('li:nth-child('+(gSelectedIndex+1)+')', $selectedUl).addClass('jd-selected');
1854 // If user reaches top, reset selected column
1855 if (gSelectedIndex < 0) {
1856 gSelectedColumn = -1;
1857 }
1858 }
1859 return false;
1860 }
1861 // 40 DOWN ARROW
1862 else if (kd && (e.keyCode == 40)) {
1863 // if the next item is a header, skip it
1864 if ($($("li", $selectedUl)[gSelectedIndex+1]).hasClass("header")) {
1865 gSelectedIndex++;
1866 }
1867 if ((gSelectedIndex < $("li", $selectedUl).length-1) ||
1868 ($($("li", $selectedUl)[gSelectedIndex+1]).hasClass("header"))) {
1869 $('li', $selectedUl).removeClass('jd-selected');
1870 gSelectedIndex++;
1871 $('li:nth-child('+(gSelectedIndex+1)+')', $selectedUl).addClass('jd-selected');
1872 }
1873 return false;
1874 }
1875 // Consider left/right arrow navigation
1876 // NOTE: Order of suggest columns are reverse order (index position 0 is on right)
1877 else if (kd && $columns.length > 1 && gSelectedColumn >= 0) {
1878 // 37 LEFT ARROW
1879 // go left only if current column is not left-most column (last column)
1880 if (e.keyCode == 37 && gSelectedColumn < $columns.length - 1) {
1881 $('li', $selectedUl).removeClass('jd-selected');
1882 gSelectedColumn++;
1883 $selectedUl = $columns[gSelectedColumn];
1884 // keep or reset the selected item to last item as appropriate
1885 gSelectedIndex = gSelectedIndex >
1886 $("li", $selectedUl).length-1 ?
1887 $("li", $selectedUl).length-1 : gSelectedIndex;
1888 // if the corresponding item is a header, move down
1889 if ($($("li", $selectedUl)[gSelectedIndex]).hasClass("header")) {
1890 gSelectedIndex++;
1891 }
1892 // set item selected
1893 $('li:nth-child('+(gSelectedIndex+1)+')', $selectedUl).addClass('jd-selected');
1894 return false;
1895 }
1896 // 39 RIGHT ARROW
1897 // go right only if current column is not the right-most column (first column)
1898 else if (e.keyCode == 39 && gSelectedColumn > 0) {
1899 $('li', $selectedUl).removeClass('jd-selected');
1900 gSelectedColumn--;
1901 $selectedUl = $columns[gSelectedColumn];
1902 // keep or reset the selected item to last item as appropriate
1903 gSelectedIndex = gSelectedIndex >
1904 $("li", $selectedUl).length-1 ?
1905 $("li", $selectedUl).length-1 : gSelectedIndex;
1906 // if the corresponding item is a header, move down
1907 if ($($("li", $selectedUl)[gSelectedIndex]).hasClass("header")) {
1908 gSelectedIndex++;
1909 }
1910 // set item selected
1911 $('li:nth-child('+(gSelectedIndex+1)+')', $selectedUl).addClass('jd-selected');
1912 return false;
1913 }
1914 }
1915
1916 // if key-up event and not arrow down/up/left/right,
1917 // read the search query and add suggestions to gMatches
1918 else if (!kd && (e.keyCode != 40)
1919 && (e.keyCode != 38)
1920 && (e.keyCode != 37)
1921 && (e.keyCode != 39)) {
1922 gSelectedIndex = -1;
1923 gMatches = new Array();
1924 matchedCount = 0;
1925 gGoogleMatches = new Array();
1926 matchedCountGoogle = 0;
1927 gDocsMatches = new Array();
1928 matchedCountDocs = 0;
1929
1930 // Search for Android matches
1931 for (var i=0; i<DATA.length; i++) {
1932 var s = DATA[i];
1933 if (text.length != 0 &&
1934 s.label.toLowerCase().indexOf(text.toLowerCase()) != -1) {
1935 gMatches[matchedCount] = s;
1936 matchedCount++;
1937 }
1938 }
1939 rank_autocomplete_api_results(text, gMatches);
1940 for (var i=0; i<gMatches.length; i++) {
1941 var s = gMatches[i];
1942 }
1943
1944
1945 // Search for Google matches
1946 for (var i=0; i<GOOGLE_DATA.length; i++) {
1947 var s = GOOGLE_DATA[i];
1948 if (text.length != 0 &&
1949 s.label.toLowerCase().indexOf(text.toLowerCase()) != -1) {
1950 gGoogleMatches[matchedCountGoogle] = s;
1951 matchedCountGoogle++;
1952 }
1953 }
1954 rank_autocomplete_api_results(text, gGoogleMatches);
1955 for (var i=0; i<gGoogleMatches.length; i++) {
1956 var s = gGoogleMatches[i];
1957 }
1958
1959 highlight_autocomplete_result_labels(text);
1960
1961
1962
1963 // Search for matching JD docs
1964 if (text.length >= 3) {
1965 // Regex to match only the beginning of a word
1966 var textRegex = new RegExp("\\b" + text.toLowerCase(), "g");
1967
1968
1969 // Search for Training classes
1970 for (var i=0; i<TRAINING_RESOURCES.length; i++) {
1971 // current search comparison, with counters for tag and title,
1972 // used later to improve ranking
1973 var s = TRAINING_RESOURCES[i];
1974 s.matched_tag = 0;
1975 s.matched_title = 0;
1976 var matched = false;
1977
1978 // Check if query matches any tags; work backwards toward 1 to assist ranking
1979 for (var j = s.keywords.length - 1; j >= 0; j--) {
1980 // it matches a tag
1981 if (s.keywords[j].toLowerCase().match(textRegex)) {
1982 matched = true;
1983 s.matched_tag = j + 1; // add 1 to index position
1984 }
1985 }
1986 // Don't consider doc title for lessons (only for class landing pages),
1987 // unless the lesson has a tag that already matches
1988 if ((s.lang == currentLang) &&
1989 (!(s.type == "training" && s.url.indexOf("index.html") == -1) || matched)) {
1990 // it matches the doc title
1991 if (s.title.toLowerCase().match(textRegex)) {
1992 matched = true;
1993 s.matched_title = 1;
1994 }
1995 }
1996 if (matched) {
1997 gDocsMatches[matchedCountDocs] = s;
1998 matchedCountDocs++;
1999 }
2000 }
2001
2002
2003 // Search for API Guides
2004 for (var i=0; i<GUIDE_RESOURCES.length; i++) {
2005 // current search comparison, with counters for tag and title,
2006 // used later to improve ranking
2007 var s = GUIDE_RESOURCES[i];
2008 s.matched_tag = 0;
2009 s.matched_title = 0;
2010 var matched = false;
2011
2012 // Check if query matches any tags; work backwards toward 1 to assist ranking
2013 for (var j = s.keywords.length - 1; j >= 0; j--) {
2014 // it matches a tag
2015 if (s.keywords[j].toLowerCase().match(textRegex)) {
2016 matched = true;
2017 s.matched_tag = j + 1; // add 1 to index position
2018 }
2019 }
2020 // Check if query matches the doc title, but only for current language
2021 if (s.lang == currentLang) {
2022 // if query matches the doc title
2023 if (s.title.toLowerCase().match(textRegex)) {
2024 matched = true;
2025 s.matched_title = 1;
2026 }
2027 }
2028 if (matched) {
2029 gDocsMatches[matchedCountDocs] = s;
2030 matchedCountDocs++;
2031 }
2032 }
2033
2034
2035 // Search for Tools Guides
2036 for (var i=0; i<TOOLS_RESOURCES.length; i++) {
2037 // current search comparison, with counters for tag and title,
2038 // used later to improve ranking
2039 var s = TOOLS_RESOURCES[i];
2040 s.matched_tag = 0;
2041 s.matched_title = 0;
2042 var matched = false;
2043
2044 // Check if query matches any tags; work backwards toward 1 to assist ranking
2045 for (var j = s.keywords.length - 1; j >= 0; j--) {
2046 // it matches a tag
2047 if (s.keywords[j].toLowerCase().match(textRegex)) {
2048 matched = true;
2049 s.matched_tag = j + 1; // add 1 to index position
2050 }
2051 }
2052 // Check if query matches the doc title, but only for current language
2053 if (s.lang == currentLang) {
2054 // if query matches the doc title
2055 if (s.title.toLowerCase().match(textRegex)) {
2056 matched = true;
2057 s.matched_title = 1;
2058 }
2059 }
2060 if (matched) {
2061 gDocsMatches[matchedCountDocs] = s;
2062 matchedCountDocs++;
2063 }
2064 }
2065
2066
2067 // Search for About docs
2068 for (var i=0; i<ABOUT_RESOURCES.length; i++) {
2069 // current search comparison, with counters for tag and title,
2070 // used later to improve ranking
2071 var s = ABOUT_RESOURCES[i];
2072 s.matched_tag = 0;
2073 s.matched_title = 0;
2074 var matched = false;
2075
2076 // Check if query matches any tags; work backwards toward 1 to assist ranking
2077 for (var j = s.keywords.length - 1; j >= 0; j--) {
2078 // it matches a tag
2079 if (s.keywords[j].toLowerCase().match(textRegex)) {
2080 matched = true;
2081 s.matched_tag = j + 1; // add 1 to index position
2082 }
2083 }
2084 // Check if query matches the doc title, but only for current language
2085 if (s.lang == currentLang) {
2086 // if query matches the doc title
2087 if (s.title.toLowerCase().match(textRegex)) {
2088 matched = true;
2089 s.matched_title = 1;
2090 }
2091 }
2092 if (matched) {
2093 gDocsMatches[matchedCountDocs] = s;
2094 matchedCountDocs++;
2095 }
2096 }
2097
2098
2099 // Search for Design guides
2100 for (var i=0; i<DESIGN_RESOURCES.length; i++) {
2101 // current search comparison, with counters for tag and title,
2102 // used later to improve ranking
2103 var s = DESIGN_RESOURCES[i];
2104 s.matched_tag = 0;
2105 s.matched_title = 0;
2106 var matched = false;
2107
2108 // Check if query matches any tags; work backwards toward 1 to assist ranking
2109 for (var j = s.keywords.length - 1; j >= 0; j--) {
2110 // it matches a tag
2111 if (s.keywords[j].toLowerCase().match(textRegex)) {
2112 matched = true;
2113 s.matched_tag = j + 1; // add 1 to index position
2114 }
2115 }
2116 // Check if query matches the doc title, but only for current language
2117 if (s.lang == currentLang) {
2118 // if query matches the doc title
2119 if (s.title.toLowerCase().match(textRegex)) {
2120 matched = true;
2121 s.matched_title = 1;
2122 }
2123 }
2124 if (matched) {
2125 gDocsMatches[matchedCountDocs] = s;
2126 matchedCountDocs++;
2127 }
2128 }
2129
2130
2131 // Search for Distribute guides
2132 for (var i=0; i<DISTRIBUTE_RESOURCES.length; i++) {
2133 // current search comparison, with counters for tag and title,
2134 // used later to improve ranking
2135 var s = DISTRIBUTE_RESOURCES[i];
2136 s.matched_tag = 0;
2137 s.matched_title = 0;
2138 var matched = false;
2139
2140 // Check if query matches any tags; work backwards toward 1 to assist ranking
2141 for (var j = s.keywords.length - 1; j >= 0; j--) {
2142 // it matches a tag
2143 if (s.keywords[j].toLowerCase().match(textRegex)) {
2144 matched = true;
2145 s.matched_tag = j + 1; // add 1 to index position
2146 }
2147 }
2148 // Check if query matches the doc title, but only for current language
2149 if (s.lang == currentLang) {
2150 // if query matches the doc title
2151 if (s.title.toLowerCase().match(textRegex)) {
2152 matched = true;
2153 s.matched_title = 1;
2154 }
2155 }
2156 if (matched) {
2157 gDocsMatches[matchedCountDocs] = s;
2158 matchedCountDocs++;
2159 }
2160 }
2161
2162
2163 // Search for Google guides
2164 for (var i=0; i<GOOGLE_RESOURCES.length; i++) {
2165 // current search comparison, with counters for tag and title,
2166 // used later to improve ranking
2167 var s = GOOGLE_RESOURCES[i];
2168 s.matched_tag = 0;
2169 s.matched_title = 0;
2170 var matched = false;
2171
2172 // Check if query matches any tags; work backwards toward 1 to assist ranking
2173 for (var j = s.keywords.length - 1; j >= 0; j--) {
2174 // it matches a tag
2175 if (s.keywords[j].toLowerCase().match(textRegex)) {
2176 matched = true;
2177 s.matched_tag = j + 1; // add 1 to index position
2178 }
2179 }
2180 // Check if query matches the doc title, but only for current language
2181 if (s.lang == currentLang) {
2182 // if query matches the doc title
2183 if (s.title.toLowerCase().match(textRegex)) {
2184 matched = true;
2185 s.matched_title = 1;
2186 }
2187 }
2188 if (matched) {
2189 gDocsMatches[matchedCountDocs] = s;
2190 matchedCountDocs++;
2191 }
2192 }
2193
2194
2195 // Search for Samples
2196 for (var i=0; i<SAMPLES_RESOURCES.length; i++) {
2197 // current search comparison, with counters for tag and title,
2198 // used later to improve ranking
2199 var s = SAMPLES_RESOURCES[i];
2200 s.matched_tag = 0;
2201 s.matched_title = 0;
2202 var matched = false;
2203 // Check if query matches any tags; work backwards toward 1 to assist ranking
2204 for (var j = s.keywords.length - 1; j >= 0; j--) {
2205 // it matches a tag
2206 if (s.keywords[j].toLowerCase().match(textRegex)) {
2207 matched = true;
2208 s.matched_tag = j + 1; // add 1 to index position
2209 }
2210 }
2211 // Check if query matches the doc title, but only for current language
2212 if (s.lang == currentLang) {
2213 // if query matches the doc title.t
2214 if (s.title.toLowerCase().match(textRegex)) {
2215 matched = true;
2216 s.matched_title = 1;
2217 }
2218 }
2219 if (matched) {
2220 gDocsMatches[matchedCountDocs] = s;
2221 matchedCountDocs++;
2222 }
2223 }
2224
2225 // Rank/sort all the matched pages
2226 rank_autocomplete_doc_results(text, gDocsMatches);
2227 }
2228
2229 // draw the suggestions
2230 sync_selection_table(toroot);
2231 return true; // allow the event to bubble up to the search api
2232 }
2233}
2234
2235/* Order the jd doc result list based on match quality */
2236function rank_autocomplete_doc_results(query, matches) {
2237 query = query || '';
2238 if (!matches || !matches.length)
2239 return;
2240
2241 var _resultScoreFn = function(match) {
2242 var score = 1.0;
2243
2244 // if the query matched a tag
2245 if (match.matched_tag > 0) {
2246 // multiply score by factor relative to position in tags list (max of 3)
2247 score *= 3 / match.matched_tag;
2248
2249 // if it also matched the title
2250 if (match.matched_title > 0) {
2251 score *= 2;
2252 }
2253 } else if (match.matched_title > 0) {
2254 score *= 3;
2255 }
2256
2257 return score;
2258 };
2259
2260 for (var i=0; i<matches.length; i++) {
2261 matches[i].__resultScore = _resultScoreFn(matches[i]);
2262 }
2263
2264 matches.sort(function(a,b){
2265 var n = b.__resultScore - a.__resultScore;
2266 if (n == 0) // lexicographical sort if scores are the same
2267 n = (a.label < b.label) ? -1 : 1;
2268 return n;
2269 });
2270}
2271
2272/* Order the result list based on match quality */
2273function rank_autocomplete_api_results(query, matches) {
2274 query = query || '';
2275 if (!matches || !matches.length)
2276 return;
2277
2278 // helper function that gets the last occurence index of the given regex
2279 // in the given string, or -1 if not found
2280 var _lastSearch = function(s, re) {
2281 if (s == '')
2282 return -1;
2283 var l = -1;
2284 var tmp;
2285 while ((tmp = s.search(re)) >= 0) {
2286 if (l < 0) l = 0;
2287 l += tmp;
2288 s = s.substr(tmp + 1);
2289 }
2290 return l;
2291 };
2292
2293 // helper function that counts the occurrences of a given character in
2294 // a given string
2295 var _countChar = function(s, c) {
2296 var n = 0;
2297 for (var i=0; i<s.length; i++)
2298 if (s.charAt(i) == c) ++n;
2299 return n;
2300 };
2301
2302 var queryLower = query.toLowerCase();
2303 var queryAlnum = (queryLower.match(/\w+/) || [''])[0];
2304 var partPrefixAlnumRE = new RegExp('\\b' + queryAlnum);
2305 var partExactAlnumRE = new RegExp('\\b' + queryAlnum + '\\b');
2306
2307 var _resultScoreFn = function(result) {
2308 // scores are calculated based on exact and prefix matches,
2309 // and then number of path separators (dots) from the last
2310 // match (i.e. favoring classes and deep package names)
2311 var score = 1.0;
2312 var labelLower = result.label.toLowerCase();
2313 var t;
2314 t = _lastSearch(labelLower, partExactAlnumRE);
2315 if (t >= 0) {
2316 // exact part match
2317 var partsAfter = _countChar(labelLower.substr(t + 1), '.');
2318 score *= 200 / (partsAfter + 1);
2319 } else {
2320 t = _lastSearch(labelLower, partPrefixAlnumRE);
2321 if (t >= 0) {
2322 // part prefix match
2323 var partsAfter = _countChar(labelLower.substr(t + 1), '.');
2324 score *= 20 / (partsAfter + 1);
2325 }
2326 }
2327
2328 return score;
2329 };
2330
2331 for (var i=0; i<matches.length; i++) {
2332 // if the API is deprecated, default score is 0; otherwise, perform scoring
2333 if (matches[i].deprecated == "true") {
2334 matches[i].__resultScore = 0;
2335 } else {
2336 matches[i].__resultScore = _resultScoreFn(matches[i]);
2337 }
2338 }
2339
2340 matches.sort(function(a,b){
2341 var n = b.__resultScore - a.__resultScore;
2342 if (n == 0) // lexicographical sort if scores are the same
2343 n = (a.label < b.label) ? -1 : 1;
2344 return n;
2345 });
2346}
2347
2348/* Add emphasis to part of string that matches query */
2349function highlight_autocomplete_result_labels(query) {
2350 query = query || '';
2351 if ((!gMatches || !gMatches.length) && (!gGoogleMatches || !gGoogleMatches.length))
2352 return;
2353
2354 var queryLower = query.toLowerCase();
2355 var queryAlnumDot = (queryLower.match(/[\w\.]+/) || [''])[0];
2356 var queryRE = new RegExp(
2357 '(' + queryAlnumDot.replace(/\./g, '\\.') + ')', 'ig');
2358 for (var i=0; i<gMatches.length; i++) {
2359 gMatches[i].__hilabel = gMatches[i].label.replace(
2360 queryRE, '<b>$1</b>');
2361 }
2362 for (var i=0; i<gGoogleMatches.length; i++) {
2363 gGoogleMatches[i].__hilabel = gGoogleMatches[i].label.replace(
2364 queryRE, '<b>$1</b>');
2365 }
2366}
2367
2368function search_focus_changed(obj, focused)
2369{
2370 if (!focused) {
2371 if(obj.value == ""){
2372 $(".search .close").addClass("hide");
2373 }
2374 $(".suggest-card").hide();
2375 }
2376}
2377
2378function submit_search() {
2379 var query = document.getElementById('search_autocomplete').value;
2380 location.hash = 'q=' + query;
2381 loadSearchResults();
2382 $("#searchResults").slideDown('slow');
2383 return false;
2384}
2385
2386
2387function hideResults() {
2388 $("#searchResults").slideUp();
2389 $(".search .close").addClass("hide");
2390 location.hash = '';
2391
2392 $("#search_autocomplete").val("").blur();
2393
2394 // reset the ajax search callback to nothing, so results don't appear unless ENTER
2395 searchControl.setSearchStartingCallback(this, function(control, searcher, query) {});
2396
2397 // forcefully regain key-up event control (previously jacked by search api)
2398 $("#search_autocomplete").keyup(function(event) {
2399 return search_changed(event, false, toRoot);
2400 });
2401
2402 return false;
2403}
2404
2405
2406
2407/* ########################################################## */
2408/* ################ CUSTOM SEARCH ENGINE ################## */
2409/* ########################################################## */
2410
2411var searchControl;
2412google.load('search', '1', {"callback" : function() {
2413 searchControl = new google.search.SearchControl();
2414 } });
2415
2416function loadSearchResults() {
2417 document.getElementById("search_autocomplete").style.color = "#000";
2418
2419 searchControl = new google.search.SearchControl();
2420
2421 // use our existing search form and use tabs when multiple searchers are used
2422 drawOptions = new google.search.DrawOptions();
2423 drawOptions.setDrawMode(google.search.SearchControl.DRAW_MODE_TABBED);
2424 drawOptions.setInput(document.getElementById("search_autocomplete"));
2425
2426 // configure search result options
2427 searchOptions = new google.search.SearcherOptions();
2428 searchOptions.setExpandMode(GSearchControl.EXPAND_MODE_OPEN);
2429
2430 // configure each of the searchers, for each tab
2431 devSiteSearcher = new google.search.WebSearch();
2432 devSiteSearcher.setUserDefinedLabel("All");
2433 devSiteSearcher.setSiteRestriction("001482626316274216503:zu90b7s047u");
2434
2435 designSearcher = new google.search.WebSearch();
2436 designSearcher.setUserDefinedLabel("Design");
2437 designSearcher.setSiteRestriction("http://developer.android.com/design/");
2438
2439 trainingSearcher = new google.search.WebSearch();
2440 trainingSearcher.setUserDefinedLabel("Training");
2441 trainingSearcher.setSiteRestriction("http://developer.android.com/training/");
2442
2443 guidesSearcher = new google.search.WebSearch();
2444 guidesSearcher.setUserDefinedLabel("Guides");
2445 guidesSearcher.setSiteRestriction("http://developer.android.com/guide/");
2446
2447 referenceSearcher = new google.search.WebSearch();
2448 referenceSearcher.setUserDefinedLabel("Reference");
2449 referenceSearcher.setSiteRestriction("http://developer.android.com/reference/");
2450
2451 googleSearcher = new google.search.WebSearch();
2452 googleSearcher.setUserDefinedLabel("Google Services");
2453 googleSearcher.setSiteRestriction("http://developer.android.com/google/");
2454
2455 blogSearcher = new google.search.WebSearch();
2456 blogSearcher.setUserDefinedLabel("Blog");
2457 blogSearcher.setSiteRestriction("http://android-developers.blogspot.com");
2458
2459 // add each searcher to the search control
2460 searchControl.addSearcher(devSiteSearcher, searchOptions);
2461 searchControl.addSearcher(designSearcher, searchOptions);
2462 searchControl.addSearcher(trainingSearcher, searchOptions);
2463 searchControl.addSearcher(guidesSearcher, searchOptions);
2464 searchControl.addSearcher(referenceSearcher, searchOptions);
2465 searchControl.addSearcher(googleSearcher, searchOptions);
2466 searchControl.addSearcher(blogSearcher, searchOptions);
2467
2468 // configure result options
2469 searchControl.setResultSetSize(google.search.Search.LARGE_RESULTSET);
2470 searchControl.setLinkTarget(google.search.Search.LINK_TARGET_SELF);
2471 searchControl.setTimeoutInterval(google.search.SearchControl.TIMEOUT_SHORT);
2472 searchControl.setNoResultsString(google.search.SearchControl.NO_RESULTS_DEFAULT_STRING);
2473
2474 // upon ajax search, refresh the url and search title
2475 searchControl.setSearchStartingCallback(this, function(control, searcher, query) {
2476 updateResultTitle(query);
2477 var query = document.getElementById('search_autocomplete').value;
2478 location.hash = 'q=' + query;
2479 });
2480
2481 // once search results load, set up click listeners
2482 searchControl.setSearchCompleteCallback(this, function(control, searcher, query) {
2483 addResultClickListeners();
2484 });
2485
2486 // draw the search results box
2487 searchControl.draw(document.getElementById("leftSearchControl"), drawOptions);
2488
2489 // get query and execute the search
2490 searchControl.execute(decodeURI(getQuery(location.hash)));
2491
2492 document.getElementById("search_autocomplete").focus();
2493 addTabListeners();
2494}
2495// End of loadSearchResults
2496
2497
2498google.setOnLoadCallback(function(){
2499 if (location.hash.indexOf("q=") == -1) {
2500 // if there's no query in the url, don't search and make sure results are hidden
2501 $('#searchResults').hide();
2502 return;
2503 } else {
2504 // first time loading search results for this page
2505 $('#searchResults').slideDown('slow');
2506 $(".search .close").removeClass("hide");
2507 loadSearchResults();
2508 }
2509}, true);
2510
2511// when an event on the browser history occurs (back, forward, load) requery hash and do search
2512$(window).hashchange( function(){
2513 // Exit if the hash isn't a search query or there's an error in the query
2514 if ((location.hash.indexOf("q=") == -1) || (query == "undefined")) {
2515 // If the results pane is open, close it.
2516 if (!$("#searchResults").is(":hidden")) {
2517 hideResults();
2518 }
2519 return;
2520 }
2521
2522 // Otherwise, we have a search to do
2523 var query = decodeURI(getQuery(location.hash));
2524 searchControl.execute(query);
2525 $('#searchResults').slideDown('slow');
2526 $("#search_autocomplete").focus();
2527 $(".search .close").removeClass("hide");
2528
2529 updateResultTitle(query);
2530});
2531
2532function updateResultTitle(query) {
2533 $("#searchTitle").html("Results for <em>" + escapeHTML(query) + "</em>");
2534}
2535
2536// forcefully regain key-up event control (previously jacked by search api)
2537$("#search_autocomplete").keyup(function(event) {
2538 return search_changed(event, false, toRoot);
2539});
2540
2541// add event listeners to each tab so we can track the browser history
2542function addTabListeners() {
2543 var tabHeaders = $(".gsc-tabHeader");
2544 for (var i = 0; i < tabHeaders.length; i++) {
2545 $(tabHeaders[i]).attr("id",i).click(function() {
2546 /*
2547 // make a copy of the page numbers for the search left pane
2548 setTimeout(function() {
2549 // remove any residual page numbers
2550 $('#searchResults .gsc-tabsArea .gsc-cursor-box.gs-bidi-start-align').remove();
2551 // move the page numbers to the left position; make a clone,
2552 // because the element is drawn to the DOM only once
2553 // and because we're going to remove it (previous line),
2554 // we need it to be available to move again as the user navigates
2555 $('#searchResults .gsc-webResult .gsc-cursor-box.gs-bidi-start-align:visible')
2556 .clone().appendTo('#searchResults .gsc-tabsArea');
2557 }, 200);
2558 */
2559 });
2560 }
2561 setTimeout(function(){$(tabHeaders[0]).click()},200);
2562}
2563
2564// add analytics tracking events to each result link
2565function addResultClickListeners() {
2566 $("#searchResults a.gs-title").each(function(index, link) {
2567 // When user clicks enter for Google search results, track it
2568 $(link).click(function() {
2569 _gaq.push(['_trackEvent', 'Google Click', 'clicked: ' + $(this).text(),
2570 'from: ' + $("#search_autocomplete").val()]);
2571 });
2572 });
2573}
2574
2575
2576function getQuery(hash) {
2577 var queryParts = hash.split('=');
2578 return queryParts[1];
2579}
2580
2581/* returns the given string with all HTML brackets converted to entities
2582 TODO: move this to the site's JS library */
2583function escapeHTML(string) {
2584 return string.replace(/</g,"&lt;")
2585 .replace(/>/g,"&gt;");
2586}
2587
2588
2589
2590
2591
2592
2593
2594/* ######################################################## */
2595/* ################# JAVADOC REFERENCE ################### */
2596/* ######################################################## */
2597
2598/* Initialize some droiddoc stuff, but only if we're in the reference */
2599if (location.pathname.indexOf("/reference") == 0) {
2600 if(!(location.pathname.indexOf("/reference-gms/packages.html") == 0)
2601 && !(location.pathname.indexOf("/reference-gcm/packages.html") == 0)
2602 && !(location.pathname.indexOf("/reference/com/google") == 0)) {
2603 $(document).ready(function() {
2604 // init available apis based on user pref
2605 changeApiLevel();
2606 initSidenavHeightResize()
2607 });
2608 }
2609}
2610
2611var API_LEVEL_COOKIE = "api_level";
2612var minLevel = 1;
2613var maxLevel = 1;
2614
2615/******* SIDENAV DIMENSIONS ************/
2616
2617 function initSidenavHeightResize() {
2618 // Change the drag bar size to nicely fit the scrollbar positions
2619 var $dragBar = $(".ui-resizable-s");
2620 $dragBar.css({'width': $dragBar.parent().width() - 5 + "px"});
2621
2622 $( "#resize-packages-nav" ).resizable({
2623 containment: "#nav-panels",
2624 handles: "s",
2625 alsoResize: "#packages-nav",
2626 resize: function(event, ui) { resizeNav(); }, /* resize the nav while dragging */
2627 stop: function(event, ui) { saveNavPanels(); } /* once stopped, save the sizes to cookie */
2628 });
2629
2630 }
2631
2632function updateSidenavFixedWidth() {
2633 if (!navBarIsFixed) return;
2634 $('#devdoc-nav').css({
2635 'width' : $('#side-nav').css('width'),
2636 'margin' : $('#side-nav').css('margin')
2637 });
2638 $('#devdoc-nav a.totop').css({'display':'block','width':$("#nav").innerWidth()+'px'});
2639
2640 initSidenavHeightResize();
2641}
2642
2643function updateSidenavFullscreenWidth() {
2644 if (!navBarIsFixed) return;
2645 $('#devdoc-nav').css({
2646 'width' : $('#side-nav').css('width'),
2647 'margin' : $('#side-nav').css('margin')
2648 });
2649 $('#devdoc-nav .totop').css({'left': 'inherit'});
2650
2651 initSidenavHeightResize();
2652}
2653
2654function buildApiLevelSelector() {
2655 maxLevel = SINCE_DATA.length;
2656 var userApiLevel = parseInt(readCookie(API_LEVEL_COOKIE));
2657 userApiLevel = userApiLevel == 0 ? maxLevel : userApiLevel; // If there's no cookie (zero), use the max by default
2658
2659 minLevel = parseInt($("#doc-api-level").attr("class"));
2660 // Handle provisional api levels; the provisional level will always be the highest possible level
2661 // Provisional api levels will also have a length; other stuff that's just missing a level won't,
2662 // so leave those kinds of entities at the default level of 1 (for example, the R.styleable class)
2663 if (isNaN(minLevel) && minLevel.length) {
2664 minLevel = maxLevel;
2665 }
2666 var select = $("#apiLevelSelector").html("").change(changeApiLevel);
2667 for (var i = maxLevel-1; i >= 0; i--) {
2668 var option = $("<option />").attr("value",""+SINCE_DATA[i]).append(""+SINCE_DATA[i]);
2669 // if (SINCE_DATA[i] < minLevel) option.addClass("absent"); // always false for strings (codenames)
2670 select.append(option);
2671 }
2672
2673 // get the DOM element and use setAttribute cuz IE6 fails when using jquery .attr('selected',true)
2674 var selectedLevelItem = $("#apiLevelSelector option[value='"+userApiLevel+"']").get(0);
2675 selectedLevelItem.setAttribute('selected',true);
2676}
2677
2678function changeApiLevel() {
2679 maxLevel = SINCE_DATA.length;
2680 var selectedLevel = maxLevel;
2681
2682 selectedLevel = parseInt($("#apiLevelSelector option:selected").val());
2683 toggleVisisbleApis(selectedLevel, "body");
2684
2685 var date = new Date();
2686 date.setTime(date.getTime()+(10*365*24*60*60*1000)); // keep this for 10 years
2687 var expiration = date.toGMTString();
2688 writeCookie(API_LEVEL_COOKIE, selectedLevel, null, expiration);
2689
2690 if (selectedLevel < minLevel) {
2691 var thing = ($("#jd-header").html().indexOf("package") != -1) ? "package" : "class";
2692 $("#naMessage").show().html("<div><p><strong>This " + thing
2693 + " requires API level " + minLevel + " or higher.</strong></p>"
2694 + "<p>This document is hidden because your selected API level for the documentation is "
2695 + selectedLevel + ". You can change the documentation API level with the selector "
2696 + "above the left navigation.</p>"
2697 + "<p>For more information about specifying the API level your app requires, "
2698 + "read <a href='" + toRoot + "training/basics/supporting-devices/platforms.html'"
2699 + ">Supporting Different Platform Versions</a>.</p>"
2700 + "<input type='button' value='OK, make this page visible' "
2701 + "title='Change the API level to " + minLevel + "' "
2702 + "onclick='$(\"#apiLevelSelector\").val(\"" + minLevel + "\");changeApiLevel();' />"
2703 + "</div>");
2704 } else {
2705 $("#naMessage").hide();
2706 }
2707}
2708
2709function toggleVisisbleApis(selectedLevel, context) {
2710 var apis = $(".api",context);
2711 apis.each(function(i) {
2712 var obj = $(this);
2713 var className = obj.attr("class");
2714 var apiLevelIndex = className.lastIndexOf("-")+1;
2715 var apiLevelEndIndex = className.indexOf(" ", apiLevelIndex);
2716 apiLevelEndIndex = apiLevelEndIndex != -1 ? apiLevelEndIndex : className.length;
2717 var apiLevel = className.substring(apiLevelIndex, apiLevelEndIndex);
2718 if (apiLevel.length == 0) { // for odd cases when the since data is actually missing, just bail
2719 return;
2720 }
2721 apiLevel = parseInt(apiLevel);
2722
2723 // Handle provisional api levels; if this item's level is the provisional one, set it to the max
2724 var selectedLevelNum = parseInt(selectedLevel)
2725 var apiLevelNum = parseInt(apiLevel);
2726 if (isNaN(apiLevelNum)) {
2727 apiLevelNum = maxLevel;
2728 }
2729
2730 // Grey things out that aren't available and give a tooltip title
2731 if (apiLevelNum > selectedLevelNum) {
2732 obj.addClass("absent").attr("title","Requires API Level \""
2733 + apiLevel + "\" or higher. To reveal, change the target API level "
2734 + "above the left navigation.");
2735 }
2736 else obj.removeClass("absent").removeAttr("title");
2737 });
2738}
2739
2740
2741
2742
2743/* ################# SIDENAV TREE VIEW ################### */
2744
2745function new_node(me, mom, text, link, children_data, api_level)
2746{
2747 var node = new Object();
2748 node.children = Array();
2749 node.children_data = children_data;
2750 node.depth = mom.depth + 1;
2751
2752 node.li = document.createElement("li");
2753 mom.get_children_ul().appendChild(node.li);
2754
2755 node.label_div = document.createElement("div");
2756 node.label_div.className = "label";
2757 if (api_level != null) {
2758 $(node.label_div).addClass("api");
2759 $(node.label_div).addClass("api-level-"+api_level);
2760 }
2761 node.li.appendChild(node.label_div);
2762
2763 if (children_data != null) {
2764 node.expand_toggle = document.createElement("a");
2765 node.expand_toggle.href = "javascript:void(0)";
2766 node.expand_toggle.onclick = function() {
2767 if (node.expanded) {
2768 $(node.get_children_ul()).slideUp("fast");
2769 node.plus_img.src = me.toroot + "assets/images/triangle-closed-small.png";
2770 node.expanded = false;
2771 } else {
2772 expand_node(me, node);
2773 }
2774 };
2775 node.label_div.appendChild(node.expand_toggle);
2776
2777 node.plus_img = document.createElement("img");
2778 node.plus_img.src = me.toroot + "assets/images/triangle-closed-small.png";
2779 node.plus_img.className = "plus";
2780 node.plus_img.width = "8";
2781 node.plus_img.border = "0";
2782 node.expand_toggle.appendChild(node.plus_img);
2783
2784 node.expanded = false;
2785 }
2786
2787 var a = document.createElement("a");
2788 node.label_div.appendChild(a);
2789 node.label = document.createTextNode(text);
2790 a.appendChild(node.label);
2791 if (link) {
2792 a.href = me.toroot + link;
2793 } else {
2794 if (children_data != null) {
2795 a.className = "nolink";
2796 a.href = "javascript:void(0)";
2797 a.onclick = node.expand_toggle.onclick;
2798 // This next line shouldn't be necessary. I'll buy a beer for the first
2799 // person who figures out how to remove this line and have the link
2800 // toggle shut on the first try. --joeo@android.com
2801 node.expanded = false;
2802 }
2803 }
2804
2805
2806 node.children_ul = null;
2807 node.get_children_ul = function() {
2808 if (!node.children_ul) {
2809 node.children_ul = document.createElement("ul");
2810 node.children_ul.className = "children_ul";
2811 node.children_ul.style.display = "none";
2812 node.li.appendChild(node.children_ul);
2813 }
2814 return node.children_ul;
2815 };
2816
2817 return node;
2818}
2819
2820
2821
2822
2823function expand_node(me, node)
2824{
2825 if (node.children_data && !node.expanded) {
2826 if (node.children_visited) {
2827 $(node.get_children_ul()).slideDown("fast");
2828 } else {
2829 get_node(me, node);
2830 if ($(node.label_div).hasClass("absent")) {
2831 $(node.get_children_ul()).addClass("absent");
2832 }
2833 $(node.get_children_ul()).slideDown("fast");
2834 }
2835 node.plus_img.src = me.toroot + "assets/images/triangle-opened-small.png";
2836 node.expanded = true;
2837
2838 // perform api level toggling because new nodes are new to the DOM
2839 var selectedLevel = $("#apiLevelSelector option:selected").val();
2840 toggleVisisbleApis(selectedLevel, "#side-nav");
2841 }
2842}
2843
2844function get_node(me, mom)
2845{
2846 mom.children_visited = true;
2847 for (var i in mom.children_data) {
2848 var node_data = mom.children_data[i];
2849 mom.children[i] = new_node(me, mom, node_data[0], node_data[1],
2850 node_data[2], node_data[3]);
2851 }
2852}
2853
2854function this_page_relative(toroot)
2855{
2856 var full = document.location.pathname;
2857 var file = "";
2858 if (toroot.substr(0, 1) == "/") {
2859 if (full.substr(0, toroot.length) == toroot) {
2860 return full.substr(toroot.length);
2861 } else {
2862 // the file isn't under toroot. Fail.
2863 return null;
2864 }
2865 } else {
2866 if (toroot != "./") {
2867 toroot = "./" + toroot;
2868 }
2869 do {
2870 if (toroot.substr(toroot.length-3, 3) == "../" || toroot == "./") {
2871 var pos = full.lastIndexOf("/");
2872 file = full.substr(pos) + file;
2873 full = full.substr(0, pos);
2874 toroot = toroot.substr(0, toroot.length-3);
2875 }
2876 } while (toroot != "" && toroot != "/");
2877 return file.substr(1);
2878 }
2879}
2880
2881function find_page(url, data)
2882{
2883 var nodes = data;
2884 var result = null;
2885 for (var i in nodes) {
2886 var d = nodes[i];
2887 if (d[1] == url) {
2888 return new Array(i);
2889 }
2890 else if (d[2] != null) {
2891 result = find_page(url, d[2]);
2892 if (result != null) {
2893 return (new Array(i).concat(result));
2894 }
2895 }
2896 }
2897 return null;
2898}
2899
2900function init_default_navtree(toroot) {
2901 // load json file for navtree data
2902 $.getScript(toRoot + 'navtree_data.js', function(data, textStatus, jqxhr) {
2903 // when the file is loaded, initialize the tree
2904 if(jqxhr.status === 200) {
2905 init_navtree("tree-list", toroot, NAVTREE_DATA);
2906 }
2907 });
2908
2909 // perform api level toggling because because the whole tree is new to the DOM
2910 var selectedLevel = $("#apiLevelSelector option:selected").val();
2911 toggleVisisbleApis(selectedLevel, "#side-nav");
2912}
2913
2914function init_navtree(navtree_id, toroot, root_nodes)
2915{
2916 var me = new Object();
2917 me.toroot = toroot;
2918 me.node = new Object();
2919
2920 me.node.li = document.getElementById(navtree_id);
2921 me.node.children_data = root_nodes;
2922 me.node.children = new Array();
2923 me.node.children_ul = document.createElement("ul");
2924 me.node.get_children_ul = function() { return me.node.children_ul; };
2925 //me.node.children_ul.className = "children_ul";
2926 me.node.li.appendChild(me.node.children_ul);
2927 me.node.depth = 0;
2928
2929 get_node(me, me.node);
2930
2931 me.this_page = this_page_relative(toroot);
2932 me.breadcrumbs = find_page(me.this_page, root_nodes);
2933 if (me.breadcrumbs != null && me.breadcrumbs.length != 0) {
2934 var mom = me.node;
2935 for (var i in me.breadcrumbs) {
2936 var j = me.breadcrumbs[i];
2937 mom = mom.children[j];
2938 expand_node(me, mom);
2939 }
2940 mom.label_div.className = mom.label_div.className + " selected";
2941 addLoadEvent(function() {
2942 scrollIntoView("nav-tree");
2943 });
2944 }
2945}
2946
2947
2948
2949
2950
2951
2952
2953
2954/* TODO: eliminate redundancy with non-google functions */
2955function init_google_navtree(navtree_id, toroot, root_nodes)
2956{
2957 var me = new Object();
2958 me.toroot = toroot;
2959 me.node = new Object();
2960
2961 me.node.li = document.getElementById(navtree_id);
2962 me.node.children_data = root_nodes;
2963 me.node.children = new Array();
2964 me.node.children_ul = document.createElement("ul");
2965 me.node.get_children_ul = function() { return me.node.children_ul; };
2966 //me.node.children_ul.className = "children_ul";
2967 me.node.li.appendChild(me.node.children_ul);
2968 me.node.depth = 0;
2969
2970 get_google_node(me, me.node);
2971}
2972
2973function new_google_node(me, mom, text, link, children_data, api_level)
2974{
2975 var node = new Object();
2976 var child;
2977 node.children = Array();
2978 node.children_data = children_data;
2979 node.depth = mom.depth + 1;
2980 node.get_children_ul = function() {
2981 if (!node.children_ul) {
2982 node.children_ul = document.createElement("ul");
2983 node.children_ul.className = "tree-list-children";
2984 node.li.appendChild(node.children_ul);
2985 }
2986 return node.children_ul;
2987 };
2988 node.li = document.createElement("li");
2989
2990 mom.get_children_ul().appendChild(node.li);
2991
2992
2993 if(link) {
2994 child = document.createElement("a");
2995
2996 }
2997 else {
2998 child = document.createElement("span");
2999 child.className = "tree-list-subtitle";
3000
3001 }
3002 if (children_data != null) {
3003 node.li.className="nav-section";
3004 node.label_div = document.createElement("div");
3005 node.label_div.className = "nav-section-header-ref";
3006 node.li.appendChild(node.label_div);
3007 get_google_node(me, node);
3008 node.label_div.appendChild(child);
3009 }
3010 else {
3011 node.li.appendChild(child);
3012 }
3013 if(link) {
3014 child.href = me.toroot + link;
3015 }
3016 node.label = document.createTextNode(text);
3017 child.appendChild(node.label);
3018
3019 node.children_ul = null;
3020
3021 return node;
3022}
3023
3024function get_google_node(me, mom)
3025{
3026 mom.children_visited = true;
3027 var linkText;
3028 for (var i in mom.children_data) {
3029 var node_data = mom.children_data[i];
3030 linkText = node_data[0];
3031
3032 if(linkText.match("^"+"com.google.android")=="com.google.android"){
3033 linkText = linkText.substr(19, linkText.length);
3034 }
3035 mom.children[i] = new_google_node(me, mom, linkText, node_data[1],
3036 node_data[2], node_data[3]);
3037 }
3038}
3039
3040
3041
3042
3043
3044
3045/****** NEW version of script to build google and sample navs dynamically ******/
3046// TODO: update Google reference docs to tolerate this new implementation
3047
3048var NODE_NAME = 0;
3049var NODE_HREF = 1;
3050var NODE_GROUP = 2;
3051var NODE_TAGS = 3;
3052var NODE_CHILDREN = 4;
3053
3054function init_google_navtree2(navtree_id, data)
3055{
3056 var $containerUl = $("#"+navtree_id);
3057 for (var i in data) {
3058 var node_data = data[i];
3059 $containerUl.append(new_google_node2(node_data));
3060 }
3061
3062 // Make all third-generation list items 'sticky' to prevent them from collapsing
3063 $containerUl.find('li li li.nav-section').addClass('sticky');
3064
3065 initExpandableNavItems("#"+navtree_id);
3066}
3067
3068function new_google_node2(node_data)
3069{
3070 var linkText = node_data[NODE_NAME];
3071 if(linkText.match("^"+"com.google.android")=="com.google.android"){
3072 linkText = linkText.substr(19, linkText.length);
3073 }
3074 var $li = $('<li>');
3075 var $a;
3076 if (node_data[NODE_HREF] != null) {
3077 $a = $('<a href="' + toRoot + node_data[NODE_HREF] + '" title="' + linkText + '" >'
3078 + linkText + '</a>');
3079 } else {
3080 $a = $('<a href="#" onclick="return false;" title="' + linkText + '" >'
3081 + linkText + '/</a>');
3082 }
3083 var $childUl = $('<ul>');
3084 if (node_data[NODE_CHILDREN] != null) {
3085 $li.addClass("nav-section");
3086 $a = $('<div class="nav-section-header">').append($a);
3087 if (node_data[NODE_HREF] == null) $a.addClass('empty');
3088
3089 for (var i in node_data[NODE_CHILDREN]) {
3090 var child_node_data = node_data[NODE_CHILDREN][i];
3091 $childUl.append(new_google_node2(child_node_data));
3092 }
3093 $li.append($childUl);
3094 }
3095 $li.prepend($a);
3096
3097 return $li;
3098}
3099
3100
3101
3102
3103
3104
3105
3106
3107
3108
3109
3110function showGoogleRefTree() {
3111 init_default_google_navtree(toRoot);
3112 init_default_gcm_navtree(toRoot);
3113}
3114
3115function init_default_google_navtree(toroot) {
3116 // load json file for navtree data
3117 $.getScript(toRoot + 'gms_navtree_data.js', function(data, textStatus, jqxhr) {
3118 // when the file is loaded, initialize the tree
3119 if(jqxhr.status === 200) {
3120 init_google_navtree("gms-tree-list", toroot, GMS_NAVTREE_DATA);
3121 highlightSidenav();
3122 resizeNav();
3123 }
3124 });
3125}
3126
3127function init_default_gcm_navtree(toroot) {
3128 // load json file for navtree data
3129 $.getScript(toRoot + 'gcm_navtree_data.js', function(data, textStatus, jqxhr) {
3130 // when the file is loaded, initialize the tree
3131 if(jqxhr.status === 200) {
3132 init_google_navtree("gcm-tree-list", toroot, GCM_NAVTREE_DATA);
3133 highlightSidenav();
3134 resizeNav();
3135 }
3136 });
3137}
3138
3139function showSamplesRefTree() {
3140 init_default_samples_navtree(toRoot);
3141}
3142
3143function init_default_samples_navtree(toroot) {
3144 // load json file for navtree data
3145 $.getScript(toRoot + 'samples_navtree_data.js', function(data, textStatus, jqxhr) {
3146 // when the file is loaded, initialize the tree
3147 if(jqxhr.status === 200) {
3148 // hack to remove the "about the samples" link then put it back in
3149 // after we nuke the list to remove the dummy static list of samples
3150 var $firstLi = $("#nav.samples-nav > li:first-child").clone();
3151 $("#nav.samples-nav").empty();
3152 $("#nav.samples-nav").append($firstLi);
3153
3154 init_google_navtree2("nav.samples-nav", SAMPLES_NAVTREE_DATA);
3155 highlightSidenav();
3156 resizeNav();
3157 if ($("#jd-content #samples").length) {
3158 showSamples();
3159 }
3160 }
3161 });
3162}
3163
3164/* TOGGLE INHERITED MEMBERS */
3165
3166/* Toggle an inherited class (arrow toggle)
3167 * @param linkObj The link that was clicked.
3168 * @param expand 'true' to ensure it's expanded. 'false' to ensure it's closed.
3169 * 'null' to simply toggle.
3170 */
3171function toggleInherited(linkObj, expand) {
3172 var base = linkObj.getAttribute("id");
3173 var list = document.getElementById(base + "-list");
3174 var summary = document.getElementById(base + "-summary");
3175 var trigger = document.getElementById(base + "-trigger");
3176 var a = $(linkObj);
3177 if ( (expand == null && a.hasClass("closed")) || expand ) {
3178 list.style.display = "none";
3179 summary.style.display = "block";
3180 trigger.src = toRoot + "assets/images/triangle-opened.png";
3181 a.removeClass("closed");
3182 a.addClass("opened");
3183 } else if ( (expand == null && a.hasClass("opened")) || (expand == false) ) {
3184 list.style.display = "block";
3185 summary.style.display = "none";
3186 trigger.src = toRoot + "assets/images/triangle-closed.png";
3187 a.removeClass("opened");
3188 a.addClass("closed");
3189 }
3190 return false;
3191}
3192
3193/* Toggle all inherited classes in a single table (e.g. all inherited methods)
3194 * @param linkObj The link that was clicked.
3195 * @param expand 'true' to ensure it's expanded. 'false' to ensure it's closed.
3196 * 'null' to simply toggle.
3197 */
3198function toggleAllInherited(linkObj, expand) {
3199 var a = $(linkObj);
3200 var table = $(a.parent().parent().parent()); // ugly way to get table/tbody
3201 var expandos = $(".jd-expando-trigger", table);
3202 if ( (expand == null && a.text() == "[Expand]") || expand ) {
3203 expandos.each(function(i) {
3204 toggleInherited(this, true);
3205 });
3206 a.text("[Collapse]");
3207 } else if ( (expand == null && a.text() == "[Collapse]") || (expand == false) ) {
3208 expandos.each(function(i) {
3209 toggleInherited(this, false);
3210 });
3211 a.text("[Expand]");
3212 }
3213 return false;
3214}
3215
3216/* Toggle all inherited members in the class (link in the class title)
3217 */
3218function toggleAllClassInherited() {
3219 var a = $("#toggleAllClassInherited"); // get toggle link from class title
3220 var toggles = $(".toggle-all", $("#body-content"));
3221 if (a.text() == "[Expand All]") {
3222 toggles.each(function(i) {
3223 toggleAllInherited(this, true);
3224 });
3225 a.text("[Collapse All]");
3226 } else {
3227 toggles.each(function(i) {
3228 toggleAllInherited(this, false);
3229 });
3230 a.text("[Expand All]");
3231 }
3232 return false;
3233}
3234
3235/* Expand all inherited members in the class. Used when initiating page search */
3236function ensureAllInheritedExpanded() {
3237 var toggles = $(".toggle-all", $("#body-content"));
3238 toggles.each(function(i) {
3239 toggleAllInherited(this, true);
3240 });
3241 $("#toggleAllClassInherited").text("[Collapse All]");
3242}
3243
3244
3245/* HANDLE KEY EVENTS
3246 * - Listen for Ctrl+F (Cmd on Mac) and expand all inherited members (to aid page search)
3247 */
3248var agent = navigator['userAgent'].toLowerCase();
3249var mac = agent.indexOf("macintosh") != -1;
3250
3251$(document).keydown( function(e) {
3252var control = mac ? e.metaKey && !e.ctrlKey : e.ctrlKey; // get ctrl key
3253 if (control && e.which == 70) { // 70 is "F"
3254 ensureAllInheritedExpanded();
3255 }
3256});
3257
3258
3259
3260
3261
3262
3263/* On-demand functions */
3264
3265/** Move sample code line numbers out of PRE block and into non-copyable column */
3266function initCodeLineNumbers() {
3267 var numbers = $("#codesample-block a.number");
3268 if (numbers.length) {
3269 $("#codesample-line-numbers").removeClass("hidden").append(numbers);
3270 }
3271
3272 $(document).ready(function() {
3273 // select entire line when clicked
3274 $("span.code-line").click(function() {
3275 if (!shifted) {
3276 selectText(this);
3277 }
3278 });
3279 // invoke line link on double click
3280 $(".code-line").dblclick(function() {
3281 document.location.hash = $(this).attr('id');
3282 });
3283 // highlight the line when hovering on the number
3284 $("#codesample-line-numbers a.number").mouseover(function() {
3285 var id = $(this).attr('href');
3286 $(id).css('background','#e7e7e7');
3287 });
3288 $("#codesample-line-numbers a.number").mouseout(function() {
3289 var id = $(this).attr('href');
3290 $(id).css('background','none');
3291 });
3292 });
3293}
3294
3295// create SHIFT key binder to avoid the selectText method when selecting multiple lines
3296var shifted = false;
3297$(document).bind('keyup keydown', function(e){shifted = e.shiftKey; return true;} );
3298
3299// courtesy of jasonedelman.com
3300function selectText(element) {
3301 var doc = document
3302 , range, selection
3303 ;
3304 if (doc.body.createTextRange) { //ms
3305 range = doc.body.createTextRange();
3306 range.moveToElementText(element);
3307 range.select();
3308 } else if (window.getSelection) { //all others
3309 selection = window.getSelection();
3310 range = doc.createRange();
3311 range.selectNodeContents(element);
3312 selection.removeAllRanges();
3313 selection.addRange(range);
3314 }
3315}
3316
3317
3318
3319
3320/** Display links and other information about samples that match the
3321 group specified by the URL */
3322function showSamples() {
3323 var group = $("#samples").attr('class');
3324 $("#samples").html("<p>Here are some samples for <b>" + group + "</b> apps:</p>");
3325
3326 var $ul = $("<ul>");
3327 $selectedLi = $("#nav li.selected");
3328
3329 $selectedLi.children("ul").children("li").each(function() {
3330 var $li = $("<li>").append($(this).find("a").first().clone());
3331 $ul.append($li);
3332 });
3333
3334 $("#samples").append($ul);
3335
3336}
Dirk Dougherty08032402014-02-15 10:14:35 -08003337
3338
3339
3340/* ########################################################## */
3341/* ################### RESOURCE CARDS ##################### */
3342/* ########################################################## */
3343
3344/** Handle resource queries, collections, and grids (sections). Requires
3345 jd_tag_helpers.js and the *_unified_data.js to be loaded. */
3346
3347(function() {
3348 // Prevent the same resource from being loaded more than once per page.
3349 var addedPageResources = {};
3350
3351 $(document).ready(function() {
3352 $('.resource-widget').each(function() {
3353 initResourceWidget(this);
3354 });
3355
3356 // Might remove this, but adds ellipsis to card descriptions rather
3357 // than just cutting them off, not sure if it performs well
3358 $('.card-info .text').ellipsis();
3359 });
3360
3361 /*
3362 Three types of resource layouts:
3363 Flow - Uses a fixed row-height flow using float left style.
3364 Carousel - Single card slideshow all same dimension absoute.
3365 Stack - Uses fixed columns and flexible element height.
3366 */
3367 function initResourceWidget(widget) {
3368 var $widget = $(widget);
3369 var isFlow = $widget.hasClass('resource-flow-layout'),
3370 isCarousel = $widget.hasClass('resource-carousel-layout'),
3371 isStack = $widget.hasClass('resource-stack-layout');
3372
3373 // find size of widget by pulling out its class name
3374 var sizeCols = 1;
3375 var m = $widget.get(0).className.match(/\bcol-(\d+)\b/);
3376 if (m) {
3377 sizeCols = parseInt(m[1], 10);
3378 }
3379
3380 var opts = {
3381 cardSizes: ($widget.data('cardsizes') || '').split(','),
3382 maxResults: parseInt($widget.data('maxresults') || '100', 10),
3383 itemsPerPage: $widget.data('itemsperpage'),
3384 sortOrder: $widget.data('sortorder'),
3385 query: $widget.data('query'),
3386 section: $widget.data('section'),
3387 sizeCols: sizeCols
3388 };
3389
3390 // run the search for the set of resources to show
3391
3392 var resources = buildResourceList(opts);
3393
3394 if (isFlow) {
3395 drawResourcesFlowWidget($widget, opts, resources);
3396 } else if (isCarousel) {
3397 drawResourcesCarouselWidget($widget, opts, resources);
3398 } else if (isStack) {
3399 var sections = buildSectionList(opts);
3400 opts['numStacks'] = $widget.data('numstacks');
3401 drawResourcesStackWidget($widget, opts, resources, sections);
3402 }
3403 }
3404
3405 /* Initializes a Resource Carousel Widget */
3406 function drawResourcesCarouselWidget($widget, opts, resources) {
3407 $widget.empty();
3408
3409 $widget.addClass('resource-card slideshow-container')
3410 .append($('<a>').addClass('slideshow-prev').text('Prev'))
3411 .append($('<a>').addClass('slideshow-next').text('Next'));
3412
3413 var css = { 'width': $widget.width() + 'px',
3414 'height': $widget.height() + 'px' };
3415
3416 var $ul = $('<ul>');
3417
3418 for (var i = 0; i < resources.length; ++i) {
3419 //keep url clean for matching and offline mode handling
3420 var urlPrefix = resources[i].url.indexOf("//") > -1 ? "" : toRoot;
3421 var $card = $('<a>')
3422 .attr('href', urlPrefix + resources[i].url)
3423 .decorateResourceCard(resources[i]);
3424
3425 $('<li>').css(css)
3426 .append($card)
3427 .appendTo($ul);
3428 }
3429
3430 $('<div>').addClass('frame')
3431 .append($ul)
3432 .appendTo($widget);
3433
3434 $widget.dacSlideshow({
3435 auto: true,
3436 btnPrev: '.slideshow-prev',
3437 btnNext: '.slideshow-next'
3438 });
3439 };
3440
3441 /* Initializes a Resource Card Stack Widget (column-based layout) */
3442 function drawResourcesStackWidget($widget, opts, resources, sections) {
3443 // Don't empty widget, grab all items inside since they will be the first
3444 // items stacked, followed by the resource query
3445
3446 var cards = $widget.find('.resource-card').detach().toArray();
3447 var numStacks = opts.numStacks || 1;
3448 var $stacks = [];
3449 var urlString;
3450
3451 for (var i = 0; i < numStacks; ++i) {
3452 $stacks[i] = $('<div>').addClass('resource-card-stack')
3453 .appendTo($widget);
3454 }
3455
3456 var sectionResources = [];
3457
3458 // Extract any subsections that are actually resource cards
3459 for (var i = 0; i < sections.length; ++i) {
3460 if (!sections[i].sections || !sections[i].sections.length) {
3461 //keep url clean for matching and offline mode handling
3462 urlPrefix = sections[i].url.indexOf("//") > -1 ? "" : toRoot;
3463 // Render it as a resource card
3464
3465 sectionResources.push(
3466 $('<a>')
3467 .addClass('resource-card section-card')
3468 .attr('href', urlPrefix + sections[i].resource.url)
3469 .decorateResourceCard(sections[i].resource)[0]
3470 );
3471
3472 } else {
3473 cards.push(
3474 $('<div>')
3475 .addClass('resource-card section-card-menu')
3476 .decorateResourceSection(sections[i])[0]
3477 );
3478 }
3479 }
3480
3481 cards = cards.concat(sectionResources);
3482
3483 for (var i = 0; i < resources.length; ++i) {
3484 //keep url clean for matching and offline mode handling
3485 urlPrefix = resources[i].url.indexOf("//") > -1 ? "" : toRoot;
3486 var $card = $('<a>')
3487 .addClass('resource-card related-card')
3488 .attr('href', urlPrefix + resources[i].url)
3489 .decorateResourceCard(resources[i]);
3490
3491 cards.push($card[0]);
3492 }
3493
3494 for (var i = 0; i < cards.length; ++i) {
3495 // Find the stack with the shortest height, but give preference to
3496 // left to right order.
3497 var minHeight = $stacks[0].height();
3498 var minIndex = 0;
3499
3500 for (var j = 1; j < numStacks; ++j) {
3501 var height = $stacks[j].height();
3502 if (height < minHeight - 45) {
3503 minHeight = height;
3504 minIndex = j;
3505 }
3506 }
3507
3508 $stacks[minIndex].append($(cards[i]));
3509 }
3510
3511 };
3512
3513 /* Initializes a flow widget, see distribute.scss for generating accompanying css */
3514 function drawResourcesFlowWidget($widget, opts, resources) {
3515 $widget.empty();
3516 var cardSizes = opts.cardSizes || ['6x6'];
3517 var i = 0, j = 0;
3518
3519 while (i < resources.length) {
3520 var cardSize = cardSizes[j++ % cardSizes.length];
3521 cardSize = cardSize.replace(/^\s+|\s+$/,'');
3522
3523 // A stack has a third dimension which is the number of stacked items
3524 var isStack = cardSize.match(/(\d+)x(\d+)x(\d+)/);
3525 var stackCount = 0;
3526 var $stackDiv = null;
3527
3528 if (isStack) {
3529 // Create a stack container which should have the dimensions defined
3530 // by the product of the items inside.
3531 $stackDiv = $('<div>').addClass('resource-card-stack resource-card-' + isStack[1]
3532 + 'x' + isStack[2] * isStack[3]) .appendTo($widget);
3533 }
3534
3535 // Build each stack item or just a single item
3536 do {
3537 var resource = resources[i];
3538 //keep url clean for matching and offline mode handling
3539 urlPrefix = resource.url.indexOf("//") > -1 ? "" : toRoot;
3540 var $card = $('<a>')
3541 .addClass('resource-card resource-card-' + cardSize + ' resource-card-' + resource.type)
3542 .attr('href', urlPrefix + resource.url);
3543
3544 if (isStack) {
3545 $card.addClass('resource-card-' + isStack[1] + 'x' + isStack[2]);
3546 if (++stackCount == parseInt(isStack[3])) {
3547 $card.addClass('resource-card-row-stack-last');
3548 stackCount = 0;
3549 }
3550 } else {
3551 stackCount = 0;
3552 }
3553
3554 $card.decorateResourceCard(resource)
3555 .appendTo($stackDiv || $widget);
3556
3557 } while (++i < resources.length && stackCount > 0);
3558 }
3559 }
3560
3561 /* Build a site map of resources using a section as a root. */
3562 function buildSectionList(opts) {
3563 if (opts.section && SECTION_BY_ID[opts.section]) {
3564 return SECTION_BY_ID[opts.section].sections || [];
3565 }
3566 return [];
3567 }
3568
3569 function buildResourceList(opts) {
3570 var maxResults = opts.maxResults || 100;
3571
3572 var query = opts.query || '';
3573 var expressions = parseResourceQuery(query);
3574 var addedResourceIndices = {};
3575 var results = [];
3576
3577 for (var i = 0; i < expressions.length; i++) {
3578 var clauses = expressions[i];
3579
3580 // build initial set of resources from first clause
3581 var firstClause = clauses[0];
3582 var resources = [];
3583 switch (firstClause.attr) {
3584 case 'type':
3585 resources = ALL_RESOURCES_BY_TYPE[firstClause.value];
3586 break;
3587 case 'lang':
3588 resources = ALL_RESOURCES_BY_LANG[firstClause.value];
3589 break;
3590 case 'tag':
3591 resources = ALL_RESOURCES_BY_TAG[firstClause.value];
3592 break;
3593 case 'collection':
3594 var urls = RESOURCE_COLLECTIONS[firstClause.value].resources || [];
3595 resources = urls.map(function(url){ return ALL_RESOURCES_BY_URL[url]; });
3596 break;
3597 case 'section':
3598 var urls = SITE_MAP[firstClause.value].sections || [];
3599 resources = urls.map(function(url){ return ALL_RESOURCES_BY_URL[url]; });
3600 break;
3601 }
3602 //console.log(firstClause.attr + ':' + firstClause.value);
3603 resources = resources || [];
3604
3605 // use additional clauses to filter corpus
3606 if (clauses.length > 1) {
3607 var otherClauses = clauses.slice(1);
3608 resources = resources.filter(getResourceMatchesClausesFilter(otherClauses));
3609 }
3610
3611 // filter out resources already added
3612 if (i > 1) {
3613 resources = resources.filter(getResourceNotAlreadyAddedFilter(addedResourceIndices));
3614 }
3615
3616 // add to list of already added indices
3617 for (var j = 0; j < resources.length; j++) {
3618 console.log(resources[j].title);
3619 addedResourceIndices[resources[j].index] = 1;
3620 }
3621
3622 // concat to final results list
3623 results = results.concat(resources);
3624 }
3625
3626 if (opts.sortOrder && results.length) {
3627 var attr = opts.sortOrder;
3628
3629 if (opts.sortOrder == 'random') {
3630 var i = results.length, j, temp;
3631 while (--i) {
3632 j = Math.floor(Math.random() * (i + 1));
3633 temp = results[i];
3634 results[i] = results[j];
3635 results[j] = temp;
3636 }
3637 } else {
3638 var desc = attr.charAt(0) == '-';
3639 if (desc) {
3640 attr = attr.substring(1);
3641 }
3642 results = results.sort(function(x,y) {
3643 return (desc ? -1 : 1) * (parseInt(x[attr], 10) - parseInt(y[attr], 10));
3644 });
3645 }
3646 }
3647
3648 results = results.filter(getResourceNotAlreadyAddedFilter(addedPageResources));
3649 results = results.slice(0, maxResults);
3650
3651 for (var j = 0; j < results.length; ++j) {
3652 addedPageResources[results[j].index] = 1;
3653 }
3654
3655 return results;
3656 }
3657
3658
3659 function getResourceNotAlreadyAddedFilter(addedResourceIndices) {
3660 return function(resource) {
3661 return !addedResourceIndices[resource.index];
3662 };
3663 }
3664
3665
3666 function getResourceMatchesClausesFilter(clauses) {
3667 return function(resource) {
3668 return doesResourceMatchClauses(resource, clauses);
3669 };
3670 }
3671
3672
3673 function doesResourceMatchClauses(resource, clauses) {
3674 for (var i = 0; i < clauses.length; i++) {
3675 var map;
3676 switch (clauses[i].attr) {
3677 case 'type':
3678 map = IS_RESOURCE_OF_TYPE[clauses[i].value];
3679 break;
3680 case 'lang':
3681 map = IS_RESOURCE_IN_LANG[clauses[i].value];
3682 break;
3683 case 'tag':
3684 map = IS_RESOURCE_TAGGED[clauses[i].value];
3685 break;
3686 }
3687
3688 if (!map || (!!clauses[i].negative ? map[resource.index] : !map[resource.index])) {
3689 return clauses[i].negative;
3690 }
3691 }
3692 return true;
3693 }
3694
3695
3696 function parseResourceQuery(query) {
3697 // Parse query into array of expressions (expression e.g. 'tag:foo + type:video')
3698 var expressions = [];
3699 var expressionStrs = query.split(',') || [];
3700 for (var i = 0; i < expressionStrs.length; i++) {
3701 var expr = expressionStrs[i] || '';
3702
3703 // Break expression into clauses (clause e.g. 'tag:foo')
3704 var clauses = [];
3705 var clauseStrs = expr.split(/(?=[\+\-])/);
3706 for (var j = 0; j < clauseStrs.length; j++) {
3707 var clauseStr = clauseStrs[j] || '';
3708
3709 // Get attribute and value from clause (e.g. attribute='tag', value='foo')
3710 var parts = clauseStr.split(':');
3711 var clause = {};
3712
3713 clause.attr = parts[0].replace(/^\s+|\s+$/g,'');
3714 if (clause.attr) {
3715 if (clause.attr.charAt(0) == '+') {
3716 clause.attr = clause.attr.substring(1);
3717 } else if (clause.attr.charAt(0) == '-') {
3718 clause.negative = true;
3719 clause.attr = clause.attr.substring(1);
3720 }
3721 }
3722
3723 if (parts.length > 1) {
3724 clause.value = parts[1].replace(/^\s+|\s+$/g,'');
3725 }
3726
3727 clauses.push(clause);
3728 }
3729
3730 if (!clauses.length) {
3731 continue;
3732 }
3733
3734 expressions.push(clauses);
3735 }
3736
3737 return expressions;
3738 }
3739})();
3740
3741(function($) {
3742 /* Simple jquery function to create dom for a standard resource card */
3743 $.fn.decorateResourceCard = function(resource) {
3744 var section = resource.group || resource.type;
3745 var imgUrl;
3746 if (resource.image) {
3747 //keep url clean for matching and offline mode handling
3748 var urlPrefix = resource.image.indexOf("//") > -1 ? "" : toRoot;
3749 imgUrl = urlPrefix + resource.image;
3750 }
3751
3752 $('<div>')
3753 .addClass('card-bg')
3754 .css('background-image', 'url(' + (imgUrl || toRoot + 'assets/images/resource-card-default-android.jpg') + ')')
3755 .appendTo(this);
3756
3757 $('<div>').addClass('card-info' + (!resource.summary ? ' empty-desc' : ''))
3758 .append($('<div>').addClass('section').text(section))
3759 .append($('<div>').addClass('title').html(resource.title))
3760 .append($('<div>').addClass('description')
3761 .append($('<div>').addClass('text').html(resource.summary))
3762 .append($('<div>').addClass('util')
3763 .append($('<div>').addClass('g-plusone')
3764 .attr('data-size', 'small')
3765 .attr('data-align', 'right')
3766 .attr('data-href', resource.url))))
3767 .appendTo(this);
3768
3769 return this;
3770 };
3771
3772 /* Simple jquery function to create dom for a resource section card (menu) */
3773 $.fn.decorateResourceSection = function(section) {
3774 var resource = section.resource;
3775 //keep url clean for matching and offline mode handling
3776 var urlPrefix = resource.image.indexOf("//") > -1 ? "" : toRoot;
3777 var $base = $('<a>')
3778 .addClass('card-bg')
3779 .attr('href', resource.url)
3780 .append($('<div>').addClass('card-section-icon')
3781 .append($('<div>').addClass('icon'))
3782 .append($('<div>').addClass('section').html(resource.title)))
3783 .appendTo(this);
3784
3785 var $cardInfo = $('<div>').addClass('card-info').appendTo(this);
3786
3787 if (section.sections && section.sections.length) {
3788 // Recurse the section sub-tree to find a resource image.
3789 var stack = [section];
3790
3791 while (stack.length) {
3792 if (stack[0].resource.image) {
3793 $base.css('background-image', 'url(' + urlPrefix + stack[0].resource.image + ')');
3794 break;
3795 }
3796
3797 if (stack[0].sections) {
3798 stack = stack.concat(stack[0].sections);
3799 }
3800
3801 stack.shift();
3802 }
3803
3804 var $ul = $('<ul>')
3805 .appendTo($cardInfo);
3806
3807 var max = section.sections.length > 3 ? 3 : section.sections.length;
3808
3809 for (var i = 0; i < max; ++i) {
3810
3811 var subResource = section.sections[i];
3812 $('<li>')
3813 .append($('<a>').attr('href', subResource.url)
3814 .append($('<div>').addClass('title').html(subResource.title))
3815 .append($('<div>').addClass('description')
3816 .append($('<div>').addClass('text').html(subResource.summary))
3817 .append($('<div>').addClass('util')
3818 .append($('<div>').addClass('g-plusone')
3819 .attr('data-size', 'small')
3820 .attr('data-align', 'right')
3821 .attr('data-href', resource.url)))))
3822 .appendTo($ul);
3823 }
3824
3825 // Add a more row
3826 if (max < section.sections.length) {
3827 $('<li>')
3828 .append($('<a>').attr('href', resource.url)
3829 .append($('<div>')
3830 .addClass('title')
3831 .text('More')))
3832 .appendTo($ul);
3833 }
3834 } else {
3835 // No sub-resources, just render description?
3836 }
3837
3838 return this;
3839 };
3840})(jQuery);
3841
3842
3843(function($) {
3844 $.fn.ellipsis = function(options) {
3845
3846 // default option
3847 var defaults = {
3848 'row' : 1, // show rows
3849 'onlyFullWords': true, // set to true to avoid cutting the text in the middle of a word
Dirk Dougherty46b443a2014-04-06 15:27:33 -07003850 'char' : '\u2026', // ellipsis
Dirk Dougherty08032402014-02-15 10:14:35 -08003851 'callback': function() {},
3852 'position': 'tail' // middle, tail
3853 };
3854
3855 options = $.extend(defaults, options);
3856
3857 this.each(function() {
3858 // get element text
3859 var $this = $(this);
3860
3861 var targetHeight = $this.height();
3862 $this.css({'height': 'auto'});
3863 var text = $this.text();
3864 var origText = text;
3865 var origLength = origText.length;
3866 var origHeight = $this.height();
3867
3868 if (origHeight <= targetHeight) {
3869 $this.text(text);
3870 options.callback.call(this);
3871 return;
3872 }
3873
3874 var start = 1, length = 0;
3875 var end = text.length;
3876
3877 if(options.position === 'tail') {
3878 while (start < end) { // Binary search for max length
3879 length = Math.ceil((start + end) / 2);
3880
3881 $this.text(text.slice(0, length) + options['char']);
3882
3883 if ($this.height() <= targetHeight) {
3884 start = length;
3885 } else {
3886 end = length - 1;
3887 }
3888 }
3889
3890 text = text.slice(0, start);
3891
3892 if (options.onlyFullWords) {
3893 // remove fragment of the last word together with possible soft-hyphen chars
3894 text = text.replace(/[\u00AD\w\uac00-\ud7af]+$/, '');
3895 }
3896 text += options['char'];
3897
3898 }else if(options.position === 'middle') {
3899
3900 var sliceLength = 0;
3901 while (start < end) { // Binary search for max length
3902 length = Math.ceil((start + end) / 2);
3903 sliceLength = Math.max(origLength - length, 0);
3904
3905 $this.text(
3906 origText.slice(0, Math.floor((origLength - sliceLength) / 2)) +
3907 options['char'] +
3908 origText.slice(Math.floor((origLength + sliceLength) / 2), origLength)
3909 );
3910
3911 if ($this.height() <= targetHeight) {
3912 start = length;
3913 } else {
3914 end = length - 1;
3915 }
3916 }
3917
3918 sliceLength = Math.max(origLength - start, 0);
3919 var head = origText.slice(0, Math.floor((origLength - sliceLength) / 2));
3920 var tail = origText.slice(Math.floor((origLength + sliceLength) / 2), origLength);
3921
3922 if (options.onlyFullWords) {
3923 // remove fragment of the last or first word together with possible soft-hyphen characters
3924 head = head.replace(/[\u00AD\w\uac00-\ud7af]+$/, '');
3925 }
3926
3927 text = head + options['char'] + tail;
3928 }
3929
3930 $this.text(text);
3931 options.callback.call(this);
3932 });
3933
3934 return this;
3935 };
3936}) (jQuery);