https://greens.scot/misc/collapse.js?tdyixf

1(function ($) {
2
3/**
4 * Toggle the visibility of a fieldset using smooth animations.
5 */
6Drupal.toggleFieldset = function (fieldset) {
7  var $fieldset = $(fieldset);
8  if ($fieldset.is('.collapsed')) {
9    var $content = $('> .fieldset-wrapper', fieldset).hide();
10    $fieldset
11      .removeClass('collapsed')
12      .trigger({ type: 'collapsed', value: false })
13      .find('> legend span.fieldset-legend-prefix').html(Drupal.t('Hide'));
14    $content.slideDown({
15      duration: 'fast',
16      easing: 'linear',
17      complete: function () {
18        Drupal.collapseScrollIntoView(fieldset);
19        fieldset.animating = false;
20      },
21      step: function () {
22        // Scroll the fieldset into view.
23        Drupal.collapseScrollIntoView(fieldset);
24      }
25    });
26  }
27  else {
28    $fieldset.trigger({ type: 'collapsed', value: true });
29    $('> .fieldset-wrapper', fieldset).slideUp('fast', function () {
30      $fieldset
31        .addClass('collapsed')
32        .find('> legend span.fieldset-legend-prefix').html(Drupal.t('Show'));
33      fieldset.animating = false;
34    });
35  }
36};
37
38/**
39 * Scroll a given fieldset into view as much as possible.
40 */
41Drupal.collapseScrollIntoView = function (node) {
42  var h = document.documentElement.clientHeight || document.body.clientHeight || 0;
43  var offset = document.documentElement.scrollTop || document.body.scrollTop || 0;
44  var posY = $(node).offset().top;
45  var fudge = 55;
46  if (posY + node.offsetHeight + fudge > h + offset) {
47    if (node.offsetHeight > h) {
48      window.scrollTo(0, posY);
49    }
50    else {
51      window.scrollTo(0, posY + node.offsetHeight - h + fudge);
52    }
53  }
54};
55
56Drupal.behaviors.collapse = {
57  attach: function (context, settings) {
58    $('fieldset.collapsible', context).once('collapse', function () {
59      var $fieldset = $(this);
60      // Expand fieldset if there are errors inside, or if it contains an
61      // element that is targeted by the URI fragment identifier.
62      var anchor = location.hash && location.hash != '#' ? ', ' + location.hash : '';
63      if ($fieldset.find('.error' + anchor).length) {
64        $fieldset.removeClass('collapsed');
65      }
66
67      var summary = $('<span class="summary"></span>');
68      $fieldset.
69        bind('summaryUpdated', function () {
70          var text = $.trim($fieldset.drupalGetSummary());
71          summary.html(text ? ' (' + text + ')' : '');
72        })
73        .trigger('summaryUpdated');
74
75      // Turn the legend into a clickable link, but retain span.fieldset-legend
76      // for CSS positioning.
77      var $legend = $('> legend .fieldset-legend', this);
78
79      $('<span class="fieldset-legend-prefix element-invisible"></span>')
80        .append($fieldset.hasClass('collapsed') ? Drupal.t('Show') : Drupal.t('Hide'))
81        .prependTo($legend)
82        .after(' ');
83
84      // .wrapInner() does not retain bound events.
85      var $link = $('<a class="fieldset-title" href="#"></a>')
86        .prepend($legend.contents())
87        .appendTo($legend)
88        .click(function () {
89          var fieldset = $fieldset.get(0);
90          // Don't animate multiple times.
91          if (!fieldset.animating) {
92            fieldset.animating = true;
93            Drupal.toggleFieldset(fieldset);
94          }
95          return false;
96        });
97
98      $legend.append(summary);
99    });
100  }
101};
102
103})(jQuery);