d9ae709b-3c27-4b69-b125-b8b80b54f90b

import { ElementRef } from '@angular/core';
import * as helpers from './helpers';

const proto = Element.prototype;
const vendor =
    proto.matches ||
    proto['matchesSelector'] ||
    proto['webkitMatchesSelector'] ||
    proto['mozMatchesSelector'] ||
    proto['msMatchesSelector'] ||
    proto['oMatchesSelector'];

export function fallbackMatches(el: Element | Node, selector: string) {
    const nodes = el.parentNode.querySelectorAll(selector);
    for (let i = 0; i < nodes.length; i++) {
        if (nodes[i] === el) {
            return true;
        }
    }
    return false;
}
/**
 * Match `el` to `selector`.
 */
export function match(el: Element | Node, selector: string) {
    if (vendor) {
        return vendor.call(el, selector);
    }
    return fallbackMatches(el, selector);
}

export function isDocument(element: any): element is Document {
    return (
        (typeof element !== 'undefined' && element instanceof Document) || (element.nodeType && element.nodeType === element.DOCUMENT_NODE)
    );
}

export function isElement(element: any) {
    return (
        (typeof HTMLElement !== 'undefined' && element instanceof HTMLElement) ||
        (element && element.nodeType && element.nodeType === element.ELEMENT_NODE)
    );
}

export function getWindow(elem: any) {
    return elem != null && elem === elem.window ? elem : elem.nodeType === 9 && elem.defaultView;
}

export function getElementOffset(elem: HTMLElement) {
    let docElem, win, rect, doc;

    if (!elem) {
        return;
    }
    // Support: IE<=11+
    // Running getBoundingClientRect on a
    // disconnected node in IE throws an error
    if (!elem.getClientRects().length) {
        return { top: 0, left: 0 };
    }
    rect = elem.getBoundingClientRect();

    // Make sure element is not hidden (display: none)
    if (rect.width || rect.height) {
        doc = elem.ownerDocument;
        win = getWindow(doc);
        docElem = doc.documentElement;

        return {
            top: rect.top + win.pageYOffset - docElem.clientTop,
            left: rect.left + win.pageXOffset - docElem.clientLeft,
            height: rect.height,
            width: rect.width
        };
    }
    return rect;
}

export function getOffset(element: HTMLElement, container: HTMLElement | Window): { left: number; top: number } | null {
    if (!element || !element.getClientRects().length) {
        return null;
    }
    const rect = element.getBoundingClientRect();

    if (rect.width || rect.height) {
        if (container === window) {
            const documentElement = element.ownerDocument!.documentElement!;
            return {
                top: rect.top - documentElement.clientTop,
                left: rect.left - documentElement.clientLeft
            };
        }
        const containerRect = (container as HTMLElement).getBoundingClientRect();
        return {
            top: rect.top - containerRect.top,
            left: rect.left - containerRect.left
        };
    }

    return rect;
}

export function getClientSize(): { width: number; height: number } {
    const width = document.documentElement.clientWidth;
    const height = window.innerHeight || document.documentElement.clientHeight;
    return {
        width,
        height
    };
}

export type ElementSelector = HTMLElement | ElementRef | string;

export function getHTMLElementBySelector(selector: ElementSelector, defaultElementRef: ElementRef): HTMLElement {
    if (!selector) {
        return defaultElementRef.nativeElement;
    } else if (selector === 'body') {
        return document.body;
    } else if (helpers.isString(selector)) {
        return document.querySelector(selector as string);
    } else if (selector instanceof ElementRef) {
        return selector.nativeElement;
    } else {
        return selector as HTMLElement;
    }
}

export function isInputOrTextarea(element: HTMLElement) {
    return ['INPUT', 'TEXTAREA'].indexOf(element.nodeName) >= 0;
}

export function isWindow(container: Element | Window): container is Window {
    return typeof window !== 'undefined' && container === window;
}

export interface SimpleRect {
    top: number;
    left: number;
    width?: number;
    height?: number;
    bottom?: number;
}

export function getContainerRect(container: Element | Window): SimpleRect {
    return !isWindow(container)
        ? container.getBoundingClientRect()
        : {
              top: 0,
              left: 0,
              bottom: 0
          };
}

export function getStyleAsText(styles?: any): string {
    if (!styles) {
        return '';
    }

    return Object.keys(styles)
        .map(key => {
            const val = styles[key];
            return `${key}:${typeof val === 'string' ? val : val + 'px'}`;
        })
        .join(';');
}

export function isTouchEvent(event: MouseEvent | TouchEvent): event is TouchEvent {
    return event.type.startsWith('touch');
}

/**
 * Assert wrapper element whether only contains icon.
 */
export function assertIconOnly(wrapperElement: Element): boolean {
    const listOfNode = Array.from(wrapperElement.childNodes);
    const iconCount = listOfNode.filter(node => ['THY-ICON', 'I'].includes(node.nodeName)).length;
    const noText = listOfNode.every(node => node.nodeName !== '#text');
    const noSpan = listOfNode.every(node => node.nodeName !== 'SPAN');
    const isIconOnly = noSpan && noText && iconCount >= 1;
    return isIconOnly;
}

/**
 *
 * calc position x,y point
 *
 * CASE (width <= clientWidth && height <= clientHeight):
 *
 * ------------- clientWidth -------------
 * |                                     |
 * |        ------ width ------          |
 * |        |                 |          |
 * |        |                 |          |
 * client   height            |          |
 * Height   |                 |          |
 * |        |                 |          |
 * |        -------------------          |
 * |                                     |
 * |                                     |
 * ---------------------------------------
 * fixedPosition = { x: 0, y: 0 }
 *
 *
 *
 * CASE (width > clientWidth || height > clientHeight):
 *
 * ------------- clientWidth -------------
 * |        |                            |
 * |        top                          |
 * |        |                            |
 * |--left--|--------------- width -----------------
 * |        |                                      |
 * client   |                                      |
 * Height   |                                      |
 * |        |                                      |
 * |        |                                      |
 * |        height                                 |
 * |        |                                      |
 * ---------|                                      |
 *          |                                      |
 *          |                                      |
 *          |                                      |
 *          ----------------------------------------
 *
 *
 * - left || top > 0
 *   left -> 0 || top -> 0
 *
 * - (left + width) < clientWidth || (top + height) < clientHeight
 * - left | top + width | height < clientWidth | clientHeight -> Back left | top + width | height === clientWidth | clientHeight
 *
 * DEFAULT:
 * - hold position
 *
 */
export function getFitContentPosition(params: {
    width: number;
    height: number;
    left: number;
    top: number;
    clientWidth: number;
    clientHeight: number;
}): { x?: number; y?: number } {
    let fixPos = {};

    if (params.width <= params.clientWidth && params.height <= params.clientHeight) {
        fixPos = {
            x: 0,
            y: 0
        };
    }

    if (params.width > params.clientWidth || params.height > params.clientHeight) {
        fixPos = {
            x: fitPoint(params.left, params.width, params.clientWidth),
            y: fitPoint(params.top, params.height, params.clientHeight)
        };
    }

    return fixPos;
}

function fitPoint(start: number, size: number, clientSize: number): number | null {
    const startAddSize = start + size;
    const offsetStart = (size - clientSize) / 2;
    let distance: number | null = null;

    if (size > clientSize) {
        if (start > 0) {
            distance = offsetStart;
        }
        if (start < 0 && startAddSize < clientSize) {
            distance = -offsetStart;
        }
    } else {
        if (start < 0 || startAddSize > clientSize) {
            distance = start < 0 ? offsetStart : -offsetStart;
        }
    }

    return distance;
}

export function elementMatchClosest(element: HTMLElement, selectors: string | string[]) {
    let matched = false;
    if (element && element.closest) {
        matched = !!helpers.coerceArray(selectors).find(selector => {
            return element.closest(selector);
        });
    }
    return matched;
}

1	import { ElementRef } from '@angular/core';
2	import * as helpers from './helpers';
3		1✔
4	const proto = Element.prototype;	1!
5	const vendor =
6	proto.matches \|\|
7	proto['matchesSelector'] \|\|
8	proto['webkitMatchesSelector'] \|\|
9	proto['mozMatchesSelector'] \|\|
10	proto['msMatchesSelector'] \|\|
11	proto['oMatchesSelector'];	×
12		×
13	export function fallbackMatches(el: Element \| Node, selector: string) {	×
14	const nodes = el.parentNode.querySelectorAll(selector);	×
15	for (let i = 0; i < nodes.length; i++) {
16	if (nodes[i] === el) {
17	return true;	×
18	}
19	}
20	return false;
21	}
22	/**
23	* Match `el` to `selector`.	×
24	*/	×
25	export function match(el: Element \| Node, selector: string) {
26	if (vendor) {	×
27	return vendor.call(el, selector);
28	}
29	return fallbackMatches(el, selector);	×
30	}
31
32	export function isDocument(element: any): element is Document {	×
33	return (
34	(typeof element !== 'undefined' && element instanceof Document) \|\| (element.nodeType && element.nodeType === element.DOCUMENT_NODE)
35	);
36	}	×
37
38	export function isElement(element: any) {
39	return (
40	(typeof HTMLElement !== 'undefined' && element instanceof HTMLElement) \|\|	×
41	(element && element.nodeType && element.nodeType === element.ELEMENT_NODE)	×
42	);
43	}
44
45	export function getWindow(elem: any) {
46	return elem != null && elem === elem.window ? elem : elem.nodeType === 9 && elem.defaultView;	×
47	}	×
48
49	export function getElementOffset(elem: HTMLElement) {	×
50	let docElem, win, rect, doc;
51		×
52	if (!elem) {	×
53	return;	×
54	}	×
55	// Support: IE<=11+	×
56	// Running getBoundingClientRect on a
57	// disconnected node in IE throws an error
58	if (!elem.getClientRects().length) {
59	return { top: 0, left: 0 };
60	}
61	rect = elem.getBoundingClientRect();
62		×
63	// Make sure element is not hidden (display: none)
64	if (rect.width \|\| rect.height) {
65	doc = elem.ownerDocument;	×
66	win = getWindow(doc);	×
67	docElem = doc.documentElement;
68		×
69	return {	×
70	top: rect.top + win.pageYOffset - docElem.clientTop,	×
71	left: rect.left + win.pageXOffset - docElem.clientLeft,	×
72	height: rect.height,	×
73	width: rect.width
74	};
75	}
76	return rect;
77	}	×
78		×
79	export function getOffset(element: HTMLElement, container: HTMLElement \| Window): { left: number; top: number } \| null {
80	if (!element \|\| !element.getClientRects().length) {
81	return null;
82	}
83	const rect = element.getBoundingClientRect();	×
84
85	if (rect.width \|\| rect.height) {
86	if (container === window) {	×
87	const documentElement = element.ownerDocument!.documentElement!;	×
88	return {	×
89	top: rect.top - documentElement.clientTop,
90	left: rect.left - documentElement.clientLeft
91	};
92	}
93	const containerRect = (container as HTMLElement).getBoundingClientRect();
94	return {	×
95	top: rect.top - containerRect.top,	×
96	left: rect.left - containerRect.left
97	};	×
98	}	×
99
100	return rect;	×
101	}	×
102
103	export function getClientSize(): { width: number; height: number } {	×
104	const width = document.documentElement.clientWidth;	×
105	const height = window.innerHeight \|\| document.documentElement.clientHeight;
106	return {
107	width,	×
108	height
109	};
110	}
111		×
112	export type ElementSelector = HTMLElement \| ElementRef \| string;
113
114	export function getHTMLElementBySelector(selector: ElementSelector, defaultElementRef: ElementRef): HTMLElement {	×
115	if (!selector) {
116	return defaultElementRef.nativeElement;
117	} else if (selector === 'body') {	×
118	return document.body;
119	} else if (helpers.isString(selector)) {
120	return document.querySelector(selector as string);
121	} else if (selector instanceof ElementRef) {
122	return selector.nativeElement;
123	} else {
124	return selector as HTMLElement;
125	}
126	}	×
127		×
128	export function isInputOrTextarea(element: HTMLElement) {
129	return ['INPUT', 'TEXTAREA'].indexOf(element.nodeName) >= 0;	×
130	}
131		×
132	export function isWindow(container: Element \| Window): container is Window {	×
133	return typeof window !== 'undefined' && container === window;
134	}
135
136	export interface SimpleRect {
137	top: number;	×
138	left: number;
139	width?: number;
140	height?: number;
141	bottom?: number;
142	}
143		×
144	export function getContainerRect(container: Element \| Window): SimpleRect {	×
145	return !isWindow(container)	×
146	? container.getBoundingClientRect()	×
147	: {	×
148	top: 0,	×
149	left: 0,
150	bottom: 0
151	};
152	}
153
154	export function getStyleAsText(styles?: any): string {
155	if (!styles) {
156	return '';
157	}
158
159	return Object.keys(styles)
160	.map(key => {
161	const val = styles[key];
162	return `${key}:${typeof val === 'string' ? val : val + 'px'}`;
163	})
164	.join(';');
165	}
166
167	export function isTouchEvent(event: MouseEvent \| TouchEvent): event is TouchEvent {
168	return event.type.startsWith('touch');
169	}
170
171	/**
172	* Assert wrapper element whether only contains icon.
173	*/
174	export function assertIconOnly(wrapperElement: Element): boolean {
175	const listOfNode = Array.from(wrapperElement.childNodes);
176	const iconCount = listOfNode.filter(node => ['THY-ICON', 'I'].includes(node.nodeName)).length;
177	const noText = listOfNode.every(node => node.nodeName !== '#text');
178	const noSpan = listOfNode.every(node => node.nodeName !== 'SPAN');
179	const isIconOnly = noSpan && noText && iconCount >= 1;
180	return isIconOnly;
181	}
182
183	/**
184	*
185	* calc position x,y point
186	*
187	* CASE (width <= clientWidth && height <= clientHeight):
188	*
189	* ------------- clientWidth -------------
190	* \| \|
191	* \| ------ width ------ \|
192	* \| \| \| \|
193	* \| \| \| \|
194	* client height \| \|
195	* Height \| \| \|
196	* \| \| \| \|
197	* \| ------------------- \|
198	* \| \|
199	* \| \|
200	* ---------------------------------------
201	* fixedPosition = { x: 0, y: 0 }
202	*
203	*
204	*	×
205	* CASE (width > clientWidth \|\| height > clientHeight):	×
206	*	×
207	* ------------- clientWidth -------------
208	* \| \| \|
209	* \| top \|
210	* \| \| \|
211	* \|--left--\|--------------- width -----------------	×
212	* \| \| \|	×
213	* client \| \|
214	* Height \| \|
215	* \| \| \|
216	* \| \| \|
217	* \| height \|	×
218	* \| \| \|
219	* ---------\| \|
220	* \| \|	×
221	* \| \|	×
222	* \| \|	×
223	* ----------------------------------------	×
224	*	×
225	*	×
226	* - left \|\| top > 0
227	* left -> 0 \|\| top -> 0	×
228	*	×
229	* - (left + width) < clientWidth \|\| (top + height) < clientHeight
230	* - left \| top + width \| height < clientWidth \| clientHeight -> Back left \| top + width \| height === clientWidth \| clientHeight
231	*
232	* DEFAULT:	×
233	* - hold position	×
234	*
235	*/
236	export function getFitContentPosition(params: {	×
237	width: number;
238	height: number;
239	left: number;	×
240	top: number;	×
241	clientWidth: number;	×
242	clientHeight: number;	×
243	}): { x?: number; y?: number } {
244	let fixPos = {};
245		×
246	if (params.width <= params.clientWidth && params.height <= params.clientHeight) {
247	fixPos = {
248	x: 0,
249	y: 0
250	};
251	}
252
253	if (params.width > params.clientWidth \|\| params.height > params.clientHeight) {
254	fixPos = {
255	x: fitPoint(params.left, params.width, params.clientWidth),
256	y: fitPoint(params.top, params.height, params.clientHeight)
257	};
258	}
259
260	return fixPos;
261	}
262
263	function fitPoint(start: number, size: number, clientSize: number): number \| null {
264	const startAddSize = start + size;
265	const offsetStart = (size - clientSize) / 2;
266	let distance: number \| null = null;
267
268	if (size > clientSize) {
269	if (start > 0) {
270	distance = offsetStart;
271	}
272	if (start < 0 && startAddSize < clientSize) {
273	distance = -offsetStart;
274	}
275	} else {
276	if (start < 0 \|\| startAddSize > clientSize) {
277	distance = start < 0 ? offsetStart : -offsetStart;
278	}
279	}
280
281	return distance;
282	}
283
284	export function elementMatchClosest(element: HTMLElement, selectors: string \| string[]) {
285	let matched = false;
286	if (element && element.closest) {
287	matched = !!helpers.coerceArray(selectors).find(selector => {
288	return element.closest(selector);
289	});
290	}
291	return matched;
292	}

atinc / ngx-tethys / d9ae709b-3c27-4b69-b125-b8b80b54f90b

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous