terms.js 7.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163
  1. /**
  2. * Copyright © Magento, Inc. All rights reserved.
  3. * See COPYING.txt for license details.
  4. */
  5. /**
  6. * @deprecated since version 2.2.0
  7. */
  8. define([
  9. 'jquery'
  10. ], function ($) {
  11. 'use strict';
  12. /**
  13. * @param {*} args
  14. */
  15. $.fn.terms = function (args) {
  16. // default
  17. var defaults = {
  18. start: 0,
  19. wrapper: '',
  20. showAnchor: '',
  21. effects: 'slide'
  22. },
  23. options = $.extend(defaults, args);
  24. this.each(function () {
  25. var obj = $(this),
  26. wrapper = options.wrapper !== '' ? '> ' + options.wrapper : '',
  27. switches = $(wrapper + '> [data-section="title"] > [data-toggle="switch"]', obj),
  28. terms = $(wrapper + '> [data-section="content"]', obj),
  29. t = switches.length,
  30. marginTop = $(switches[0]).closest('[data-section="title"]').css('position') == 'absolute' ? 0 : null, //eslint-disable-line
  31. title,
  32. current,
  33. /**
  34. * @param {*} item
  35. */
  36. showItem = function (item) {
  37. if (item != current && !$(switches[item]).closest('[data-section="title"]').hasClass('disabled')) { //eslint-disable-line
  38. $(switches).closest('[data-section="title"]').removeClass('active');
  39. if (options.wrapper !== '') {
  40. $(switches).parent().parent().removeClass('active');
  41. }
  42. $(terms).removeClass('active');
  43. $(switches[item]).closest('[data-section="title"]').addClass('active');
  44. if (options.wrapper !== '') {
  45. $(switches[current]).parent().parent().addClass('active');
  46. }
  47. $(terms[item]).addClass('active');
  48. current = item;
  49. } else if (
  50. // Check if this is accordion width as criteria for now
  51. (obj.attr('data-sections') == 'accordion' || $(switches[item]).closest('[data-section="title"]').css('width') == obj.css('width')) && //eslint-disable-line
  52. item == current && !$(switches[item]).closest('[data-section="title"]').hasClass('disabled') //eslint-disable-line
  53. ) {
  54. $(switches).closest('[data-section="title"]').removeClass('active');
  55. if (options.wrapper !== '') {
  56. $(switches).parent().parent().removeClass('active');
  57. }
  58. $(terms).removeClass('active');
  59. current = -1;
  60. }
  61. },
  62. /**
  63. * Init.
  64. */
  65. init = function () {
  66. var linksList, i, classes, dataSection, itemHref, itemClass, fromUrl;
  67. if (t > 0) {
  68. if ($(switches[0]).closest('[data-section="title"]').css('display') == 'table-cell') { //eslint-disable-line
  69. obj.addClass('adjusted');
  70. if (obj[0].tagName == 'DL') { //eslint-disable-line eqeqeq, max-depth
  71. linksList = $('<dd>');
  72. } else {
  73. linksList = $('<div>');
  74. }
  75. linksList.addClass('sections-nav');
  76. obj.prepend(linksList);
  77. for (i = 0; i < t; i++) { //eslint-disable-line max-depth
  78. title = $(switches[i]).html();
  79. classes = $(switches[i]).closest('[data-section="title"]').attr('class');
  80. dataSection = $(switches[i]).closest('[data-section="title"]').attr('data-section');
  81. itemHref = $(switches[i]).attr('href');
  82. itemClass = $(switches[i]).attr('class');
  83. $(switches[i]).parent('[data-section="title"]').hide();
  84. switches[i] = $('<a/>', {
  85. href: itemHref,
  86. 'class': itemClass,
  87. html: title
  88. }).appendTo(linksList);
  89. $(switches[i]).wrap(
  90. '<strong class="' + classes + '" data-section="' + dataSection + '" />'
  91. );
  92. }
  93. }
  94. $(switches).each(function (ind, el) {
  95. $(el).click(function (event) {
  96. event.preventDefault();
  97. showItem(ind);
  98. });
  99. if (marginTop !== null) {
  100. $(el).closest('[data-section="title"]').css({
  101. 'top': marginTop + 'px'
  102. });
  103. marginTop += $(el).closest('[data-section="title"]').outerHeight(true);
  104. obj.css({
  105. 'min-height': marginTop + 'px'
  106. });
  107. }
  108. });
  109. fromUrl = false;
  110. if (window.location.hash.length > 0) {
  111. $(terms).each(function (ind, el) {
  112. if ('#info-' + $(el).attr('id') == window.location.hash) { //eslint-disable-line eqeqeq
  113. showItem(ind);
  114. $('html, body').animate({
  115. scrollTop: $(switches[ind]).offset().top
  116. }, 700);
  117. fromUrl = true;
  118. }
  119. });
  120. }
  121. if (fromUrl === false) {
  122. if (options.start % 1 === 0) { //eslint-disable-line max-depth
  123. current = options.start + 1;
  124. showItem(options.start);
  125. } else {
  126. $(terms).each(function (ind, el) {
  127. if ($(el).attr('id') == options.start) { //eslint-disable-line eqeqeq
  128. current = ind + 1;
  129. showItem(ind);
  130. $('html, body').animate({
  131. scrollTop: $(switches[ind]).offset().top
  132. }, 700);
  133. }
  134. });
  135. }
  136. }
  137. }
  138. };
  139. init();
  140. });
  141. };
  142. return function (data, el) {
  143. $(el).terms(data);
  144. };
  145. });