from gitlab

common/resources/node_modules/patternfly/dist/js/patternfly-functions-fixed-heights.js

@@ -0,0 +1,109 @@
+// Util: PatternFly Collapse with fixed heights
+// Update the max-height of collapse elements based on the parent container's height.
+(function ($) {
+  'use strict';
+
+  $.fn.initCollapseHeights = function (scrollSelector) {
+    var parentElement = this, setCollapseHeights, targetScrollSelector = scrollSelector;
+
+    setCollapseHeights = function () {
+      var height, openPanel, contentHeight, bodyHeight, overflowY = 'hidden';
+
+      height = parentElement.height();
+
+      // Close any open panel
+      openPanel = parentElement.find('.collapse.in');
+      if (openPanel && openPanel.length > 0) {
+        openPanel.removeClass('in');
+      }
+
+      // Determine the necessary height for the closed content
+      contentHeight = 0;
+      parentElement.children().each($.proxy(function (i, element) {
+        var $element = $(element);
+        contentHeight += $element.outerHeight(true);
+      }, parentElement)).end();
+
+      // Determine the height remaining for opened collapse panels
+      bodyHeight = height - contentHeight;
+
+      // Make sure we have enough height to be able to scroll the contents if necessary
+      if (bodyHeight < 25) {
+        bodyHeight = 25;
+
+        // Allow the parent to scroll so the child elements are accessible
+        overflowY = 'auto';
+      }
+
+      // Reopen the initially opened panel
+      if (openPanel && openPanel.length > 0) {
+        openPanel.addClass("in");
+      }
+
+      setTimeout(function () {
+        // Set the max-height for the collapse panels
+        parentElement.find('[data-toggle="collapse"]').each($.proxy(function (i, element) {
+          var $element, selector, $target, scrollElement, innerHeight = 0;
+          $element = $(element);
+
+          // Determine the selector to find the target
+          selector = $element.attr('data-target');
+          if (!selector) {
+            selector = $element.attr('href');
+          }
+
+          // Determine the scroll element (either the target or the child of the target based on the given selector)
+          $target = $(selector);
+          scrollElement = $target;
+          if (targetScrollSelector) {
+            scrollElement = $target.find(targetScrollSelector);
+            if (scrollElement.length === 1) {
+              innerHeight = 0;
+              $target.children().each($.proxy(function (j, sibling) {
+                var $sibling = $(sibling);
+                if (sibling !== scrollElement[0]) {
+                  innerHeight += $sibling.outerHeight(true);
+                }
+              }, $target)).end();
+              bodyHeight -= innerHeight;
+            } else {
+              scrollElement = $target;
+            }
+          }
+          // Set the max-height and vertical scroll of the scroll element
+          scrollElement.css({'max-height': (bodyHeight - innerHeight) + 'px', 'overflow-y': 'auto'});
+        }, parentElement)).end();
+
+        parentElement.css({'overflow-y': overflowY});
+      }, 100);
+    };
+
+    setCollapseHeights();
+
+    // Update on window resizing
+    $(window).on('resize', setCollapseHeights);
+
+  };
+
+  $.fn.initFixedAccordion = function () {
+    var fixedAccordion = this, initOpen;
+
+    fixedAccordion.on('show.bs.collapse','.collapse', function (event) {
+      $(event.target.parentNode).addClass('panel-open');
+    });
+
+    fixedAccordion.on('hide.bs.collapse','.collapse', function (event) {
+      $(event.target.parentNode).removeClass('panel-open');
+    });
+
+    fixedAccordion.find('.panel').each(function (index, item) {
+      $(item).removeClass('panel-open');
+    });
+
+    initOpen = $(fixedAccordion.find('.collapse.in'))[0];
+    if (initOpen) {
+      $(initOpen.parentNode).addClass('panel-open');
+    }
+  };
+
+}(jQuery));