Add helper function to get the inner dimensions for an element

diff --git a/ts/WoltLabSuite/Core/Dom/Util.ts b/ts/WoltLabSuite/Core/Dom/Util.ts
index a3469471005feb180d871186dbea4e6d8587ec67..66c3f53837e9e04c75e6945e99f81a49d151dffe 100644 (file)
--- a/ts/WoltLabSuite/Core/Dom/Util.ts
+++ b/ts/WoltLabSuite/Core/Dom/Util.ts
@@ -96,6 +96,42 @@ const DomUtil = {
     return id;
   },
 
+  /**
+   * Returns the inner height of an element including paddings.
+   */
+  innerHeight(element: HTMLElement, styles?: CSSStyleDeclaration): number {
+    styles = styles || window.getComputedStyle(element);
+
+    let height = element.clientHeight;
+    height += ~~styles.paddingTop + ~~styles.paddingBottom;
+
+    return height;
+  },
+
+  /**
+   * Returns the inner width of an element including paddings.
+   */
+  innerWidth(element: HTMLElement, styles?: CSSStyleDeclaration): number {
+    styles = styles || window.getComputedStyle(element);
+
+    let width = element.clientWidth;
+    width += ~~styles.paddingLeft + ~~styles.paddingRight;
+
+    return width;
+  },
+
+  /**
+   * Returns the inner dimensions of an element including paddings.
+   */
+  innerDimensions(element: HTMLElement): Dimensions {
+    const styles = window.getComputedStyle(element);
+
+    return {
+      height: DomUtil.innerHeight(element, styles),
+      width: DomUtil.innerWidth(element, styles),
+    };
+  },
+
   /**
    * Returns the outer height of an element including margins.
    */

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Dom/Util.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Dom/Util.js
index c5a472f2b542f421832e99288ddde19e7b5fb855..f981c4f49a88b694a35b7ac56c8b15fae1d825dc 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Dom/Util.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Dom/Util.js
@@ -81,6 +81,34 @@ define(["require", "exports", "tslib", "../StringUtil"], function (require, expo
             }
             return id;
         },
+        /**
+         * Returns the inner height of an element including paddings.
+         */
+        innerHeight(element, styles) {
+            styles = styles || window.getComputedStyle(element);
+            let height = element.clientHeight;
+            height += ~~styles.paddingTop + ~~styles.paddingBottom;
+            return height;
+        },
+        /**
+         * Returns the inner width of an element including paddings.
+         */
+        innerWidth(element, styles) {
+            styles = styles || window.getComputedStyle(element);
+            let width = element.clientWidth;
+            width += ~~styles.paddingLeft + ~~styles.paddingRight;
+            return width;
+        },
+        /**
+         * Returns the inner dimensions of an element including paddings.
+         */
+        innerDimensions(element) {
+            const styles = window.getComputedStyle(element);
+            return {
+                height: DomUtil.innerHeight(element, styles),
+                width: DomUtil.innerWidth(element, styles),
+            };
+        },
         /**
          * Returns the outer height of an element including margins.
          */