tui-doc.js 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200
  1. "use strict";
  2. /*************** API-EXAMPLES TAB ***************/
  3. var $apiTab = $('#api-tab');
  4. var $examplesTab = $('#examples-tab');
  5. function showLnbExamples() {
  6. $apiTab.removeClass('selected');
  7. $examplesTab.addClass('selected');
  8. $('.lnb-api').addClass('hidden');
  9. $('.lnb-examples').removeClass('hidden');
  10. }
  11. function showLnbApi() {
  12. $examplesTab.removeClass('selected');
  13. $apiTab.addClass('selected');
  14. $('.lnb-api').removeClass('hidden');
  15. $('.lnb-examples').addClass('hidden');
  16. }
  17. $apiTab.click(showLnbApi);
  18. $examplesTab.click(showLnbExamples);
  19. /*************** RESIZE ***************/
  20. var $resizer = $('#resizer');
  21. var $lnb = $('#lnb');
  22. var $main = $('#main');
  23. function resize(event) {
  24. var clientX = event.clientX;
  25. clientX = Math.max(200, clientX);
  26. clientX = Math.min(500, clientX);
  27. $lnb.css('width', clientX);
  28. $resizer.css('left', clientX);
  29. $main.css('left', clientX + $resizer.width());
  30. }
  31. function detachResize() {
  32. $(window).off({
  33. mousemove: resize,
  34. mouseup: detachResize
  35. });
  36. }
  37. $resizer.on('mousedown', function() {
  38. $(window).on({
  39. mousemove: resize,
  40. mouseup: detachResize
  41. });
  42. });
  43. /*************** SEARCH - AUTOCOMPLETE ***************/
  44. var $searchContainer = $('#search-container');
  45. var $searchInput = $searchContainer.find('input');
  46. var $searchedList = $searchContainer.find('ul');
  47. var $anchorList = $('nav ul li a');
  48. var $selected = $();
  49. var KEY_CODE_UP = 38;
  50. var KEY_CODE_DOWN = 40;
  51. var KEY_CODE_ENTER = 13;
  52. $(window).on('click', function(event) {
  53. if (!$searchContainer[0].contains(event.target)) {
  54. clear();
  55. }
  56. });
  57. $searchedList.on('click', 'li', function(event) {
  58. var currentTarget = event.currentTarget;
  59. var url = $(currentTarget).find('a').attr('href');
  60. moveToPage(url);
  61. });
  62. $searchInput.on({
  63. keyup: onKeyupSearchInput,
  64. keydown: onKeydownInput
  65. });
  66. function onKeyupSearchInput(event) {
  67. var inputText = removeWhiteSpace($searchInput.val()).toLowerCase();
  68. if (event.keyCode === KEY_CODE_UP || event.keyCode === KEY_CODE_DOWN) {
  69. return;
  70. }
  71. if (!inputText) {
  72. $searchedList.html('');
  73. return;
  74. }
  75. if (event.keyCode === KEY_CODE_ENTER) {
  76. onKeyupEnter();
  77. return;
  78. }
  79. setList(inputText);
  80. }
  81. function onKeydownInput(event) {
  82. $selected.removeClass('highlight');
  83. switch(event.keyCode) {
  84. case KEY_CODE_UP:
  85. $selected = $selected.prev();
  86. if (!$selected.length) {
  87. $selected = $searchedList.find('li').last();
  88. }
  89. break;
  90. case KEY_CODE_DOWN:
  91. $selected = $selected.next();
  92. if (!$selected.length) {
  93. $selected = $searchedList.find('li').first();
  94. }
  95. break;
  96. default: break;
  97. }
  98. $selected.addClass('highlight');
  99. }
  100. function onKeyupEnter() {
  101. if (!$selected.length) {
  102. $selected = $searchedList.find('li').first();
  103. }
  104. moveToPage($selected.find('a').attr('href'));
  105. }
  106. function moveToPage(url) {
  107. if (url) {
  108. window.location = url;
  109. }
  110. clear();
  111. }
  112. function clear() {
  113. $searchedList.html('');
  114. $searchInput.val('');
  115. $selected = $();
  116. }
  117. function setList(inputText) {
  118. var html = '';
  119. $anchorList.filter(function(idx, item) {
  120. return isMatched(item.text, inputText);
  121. }).each(function(idx, item) {
  122. html += makeListItemHtml(item, inputText);
  123. });
  124. $searchedList.html(html);
  125. }
  126. function isMatched(itemText, inputText) {
  127. return removeWhiteSpace(itemText).toLowerCase().indexOf(inputText) > - 1;
  128. }
  129. function makeListItemHtml(item, inputText) {
  130. var itemText = item.text;
  131. var itemHref = item.href;
  132. var $parent = $(item).closest('div');
  133. var memberof = '';
  134. if ($parent.length && $parent.attr('id')) {
  135. memberof = $parent.attr('id').replace('_sub', '');
  136. } else {
  137. memberof = $(item).closest('div').find('h3').text();
  138. }
  139. if (memberof) {
  140. memberof = '<span class="group">' + memberof + '</span>';
  141. }
  142. itemText = itemText.replace(new RegExp(inputText, 'ig'), function(matched) {
  143. return '<strong>' + matched + '</strong>';
  144. });
  145. return '<li><a href="' + itemHref + '">' + itemText + '</a>' + memberof + '</li>';
  146. }
  147. function removeWhiteSpace(value) {
  148. return value.replace(/\s/g, '');
  149. }
  150. /*************** TOOGLE SUB NAV ***************/
  151. function toggleSubNav(e) {
  152. $(e.currentTarget).next().toggleClass('hidden');
  153. $(e.currentTarget).find('.glyphicon').toggleClass('glyphicon-plus glyphicon-minus');
  154. }
  155. $lnb.find('.lnb-api').each(function() {
  156. $(this).find('.toggle-subnav')
  157. .filter(function() {
  158. return $(this).next(':empty').length === 0;
  159. }).each(function() {
  160. $(this).removeClass('hidden').on('click', toggleSubNav);
  161. });
  162. });