Browse Source

New functions, deprecated sizes

Aleksandr Aleksandrov 6 years ago
parent
commit
8b776fcc3e

+ 1 - 1
package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ex-helpers/element",
-  "version": "0.1.7",
+  "version": "0.1.8",
   "description": "Several element wrapper helpers",
   "scripts": {
     "build": "exb",

+ 18 - 0
src/body-size.ts

@@ -0,0 +1,18 @@
+export function bodySize(document: any) {
+    return {
+        height: Math.max(
+            document.documentElement.clientHeight,
+            document.body.scrollHeight,
+            document.documentElement.scrollHeight,
+            document.body.offsetHeight,
+            document.documentElement.offsetHeight
+        ),
+        width: Math.max(
+            document.documentElement.clientWidth,
+            document.body.scrollWidth,
+            document.documentElement.scrollWidth,
+            document.body.offsetWidth,
+            document.documentElement.offsetWidth
+        )
+    };
+}

+ 15 - 0
src/bounds.ts

@@ -0,0 +1,15 @@
+export function bounds(el: HTMLElement) {
+    const bounds = el.getBoundingClientRect();
+    return {
+        size: {
+            height: bounds.height,
+            width: bounds.width
+        },
+        offset: {
+            top: bounds.top,
+            left: bounds.left,
+            right: bounds.right,
+            bottom: bounds.bottom
+        }
+    }
+}

+ 8 - 0
src/scroll.ts

@@ -0,0 +1,8 @@
+export function scroll(el: HTMLElement) {
+    return {
+        top: el.scrollTop,
+        left: el.scrollLeft,
+        height: el.scrollHeight,
+        width: el.scrollWidth
+    }
+}

+ 0 - 55
src/size.ts

@@ -1,55 +0,0 @@
-export function getAbsoluteScrollAndOffset(el: HTMLElement) {
-    let _x = 0;
-    let _y = 0;
-    let _sx = window.scrollX;
-    let _sy = window.scrollY;
-    while (el && !isNaN(el.offsetLeft) && !isNaN(el.offsetTop)) {
-        _x += el.offsetLeft - el.scrollLeft;
-        _y += el.offsetTop - el.scrollTop;
-        _sx += el.scrollLeft;
-        _sy += el.scrollTop;
-        el = el.offsetParent as HTMLElement;
-    }
-    return {offset: {top: _y, left: _x}, scroll: {top: _sy, left: _sx}};
-}
-
-export interface SizeInterface {
-    size: { height: number, width: number };
-    offset: { top: number, left: number };
-    scroll: { top: number, left: number };
-}
-
-export function getSize(el: HTMLElement) {
-    return {
-        height: el.clientHeight,
-        width: el.clientWidth,
-    };
-}
-
-export function getDimensions(el: HTMLElement): SizeInterface {
-    const data = getAbsoluteScrollAndOffset(el);
-    return {
-        size: getSize(el),
-        scroll: data.scroll,
-        offset: data.offset
-    };
-}
-
-export function getBodySize(document: any) {
-    return {
-        height: Math.max(
-            document.documentElement.clientHeight,
-            document.body.scrollHeight,
-            document.documentElement.scrollHeight,
-            document.body.offsetHeight,
-            document.documentElement.offsetHeight
-        ),
-        width: Math.max(
-            document.documentElement.clientWidth,
-            document.body.scrollWidth,
-            document.documentElement.scrollWidth,
-            document.body.offsetWidth,
-            document.documentElement.offsetWidth
-        )
-    };
-}

+ 21 - 0
src/size/get-absolute-scroll-and-offset.ts

@@ -0,0 +1,21 @@
+/**
+ * @deprecated use scroll and bounds instead
+ */
+export function getAbsoluteScrollAndOffset(el: HTMLElement) {
+    let _x = 0;
+    let _y = 0;
+    let _sx = window.scrollX;
+    let _sy = window.scrollY;
+    while (el && !isNaN(el.offsetLeft) && !isNaN(el.offsetTop)) {
+        if (el.offsetLeft) {
+            _x += el.offsetLeft - el.scrollLeft;
+            _sx += el.scrollLeft;
+        }
+        if (el.offsetTop) {
+            _y += el.offsetTop - el.scrollTop;
+            _sy += el.scrollTop;
+        }
+        el = el.offsetParent as HTMLElement;
+    }
+    return {offset: {top: _y, left: _x}, scroll: {top: _sy, left: _sx}};
+}

+ 8 - 0
src/size/get-body-size.ts

@@ -0,0 +1,8 @@
+import {bodySize} from '../body-size';
+
+/**
+ * @deprecated use body-size instead
+ */
+export function getBodySize(document: any) {
+    return bodySize(document);
+}

+ 15 - 0
src/size/get-dimensions.ts

@@ -0,0 +1,15 @@
+import {getSize} from './get-size';
+import {getAbsoluteScrollAndOffset} from './get-absolute-scroll-and-offset';
+import {SizeInterface} from './size.interface';
+
+/**
+ * @deprecated use bounds and scroll instead
+ */
+export function getDimensions(el: HTMLElement): SizeInterface {
+    const data = getAbsoluteScrollAndOffset(el);
+    return {
+        size: getSize(el),
+        scroll: data.scroll,
+        offset: data.offset
+    };
+}

+ 9 - 0
src/size/get-size.ts

@@ -0,0 +1,9 @@
+/**
+ * @deprecated use bounds instead
+ */
+export function getSize(el: HTMLElement) {
+    return {
+        height: el.clientHeight,
+        width: el.clientWidth,
+    };
+}

+ 5 - 0
src/size/index.ts

@@ -0,0 +1,5 @@
+export * from './get-size';
+export * from './get-absolute-scroll-and-offset';
+export * from './get-body-size';
+export * from './get-dimensions';
+export * from './size.interface';

+ 5 - 0
src/size/size.interface.ts

@@ -0,0 +1,5 @@
+export interface SizeInterface {
+    size: { height: number, width: number };
+    offset: { top: number, left: number };
+    scroll: { top: number, left: number };
+}