26023601418

Committed 18 May 2026 08:57AM UTC coverage: 4.854% (-85.3%) from 90.174%

Build # 26023601418

Build Type

Pull #17281

github

Committed by

web-flow

Commit Message

Merge e7ce7a18e into 5a85df190

Pull Request Pull Request #17281: feat: Added virtual scroll component and sample implementation

Coverage Stats

400 of 17347 branches covered (2.31%)

Branch coverage included in aggregate %.

63 of 222 new or added lines in 4 files covered. (28.38%)

27932 existing lines in 341 files now uncovered.

2022 of 32547 relevant lines covered (6.21%)

0.72 hits per line

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

6.56

/projects/igniteui-angular/core/src/core/touch.ts

import { Injectable, NgZone, DOCUMENT, inject } from '@angular/core';
import { ɵgetDOM as getDOM } from '@angular/platform-browser';
import { PlatformUtil } from './utils';
import { HammerManager, HammerOptions, HammerStatic } from './touch-annotations';

const EVENT_SUFFIX = 'precise';

/**
 * Touch gestures manager based on Hammer.js
 * Use with caution, this will track references for single manager per element. Very TBD. Much TODO.
 *
 * @hidden
 */
@Injectable()
export class HammerGesturesManager {
    private _zone = inject(NgZone);
    private doc = inject(DOCUMENT);
    private platformUtil = inject(PlatformUtil);

    public static Hammer: HammerStatic = typeof window !== 'undefined' ? (window as any).Hammer : null;
    /**
     * Event option defaults for each recognizer, see http://hammerjs.github.io/api/ for API listing.
     */
    protected hammerOptions: HammerOptions = {};

    private platformBrowser: boolean;
    private _hammerManagers: Array<{ element: EventTarget; manager: HammerManager }> = [];

    constructor() {
        this.platformBrowser = this.platformUtil.isBrowser;
        if (this.platformBrowser && HammerGesturesManager.Hammer) {
            this.hammerOptions = {
                // D.P. #447 Force TouchInput due to PointerEventInput bug (https://github.com/hammerjs/hammer.js/issues/1065)
                // see https://github.com/IgniteUI/igniteui-angular/issues/447#issuecomment-324601803
                inputClass: HammerGesturesManager.Hammer.TouchInput,
                recognizers: [
                    [HammerGesturesManager.Hammer.Pan, { threshold: 0 }],
                    [HammerGesturesManager.Hammer.Swipe, { direction: HammerGesturesManager.Hammer.DIRECTION_HORIZONTAL }],
                    [HammerGesturesManager.Hammer.Tap],
                    [HammerGesturesManager.Hammer.Tap, { event: 'doubletap', taps: 2 }, ['tap']]
                ]
            };
        }
    }

    public supports(eventName: string): boolean {
        return eventName.toLowerCase().endsWith('.' + EVENT_SUFFIX);
    }

    /**
     * Add listener extended with options for Hammer.js. Will use defaults if none are provided.
     * Modeling after other event plugins for easy future modifications.
     */
    public addEventListener(
        element: HTMLElement,
        eventName: string,
        eventHandler: (eventObj) => void,
        options: HammerOptions = null): () => void {
        if (!this.platformBrowser) {
            return;
        }

        // Creating the manager bind events, must be done outside of angular
        return this._zone.runOutsideAngular(() => {
            if (!HammerGesturesManager.Hammer) {
                //no hammer
                return;
            }
            let mc: HammerManager = this.getManagerForElement(element);
            if (mc === null) {
                // new Hammer is a shortcut for Manager with defaults
                mc = new HammerGesturesManager.Hammer(element, Object.assign(this.hammerOptions, options));
                this.addManagerForElement(element, mc);
            }
            const handler = (eventObj) => this._zone.run(() => eventHandler(eventObj));
            mc.on(eventName, handler);
            return () => mc.off(eventName, handler);
        });
    }

    /**
     * Add listener extended with options for Hammer.js. Will use defaults if none are provided.
     * Modeling after other event plugins for easy future modifications.
     *
     * @param target Can be one of either window, body or document(fallback default).
     */
    public addGlobalEventListener(target: string, eventName: string, eventHandler: (eventObj) => void): () => void {
        if (!this.platformBrowser || !HammerGesturesManager.Hammer) {
            return;
        }

        const element = this.getGlobalEventTarget(target);

        // Creating the manager bind events, must be done outside of angular
        return this.addEventListener(element as HTMLElement, eventName, eventHandler);
    }

    /**
     * Exposes [Dom]Adapter.getGlobalEventTarget to get global event targets.
     * Supported: window, document, body. Defaults to document for invalid args.
     *
     * @param target Target name
     */
    public getGlobalEventTarget(target: string): EventTarget {
        return getDOM().getGlobalEventTarget(this.doc, target);
    }

    /**
     * Set HammerManager options.
     *
     * @param element The DOM element used to create the manager on.
     *
     * ### Example
     *
     * ```ts
     * manager.setManagerOption(myElem, "pan", { pointers: 1 });
     * ```
     */
    public setManagerOption(element: EventTarget, event: string, options: any) {
        const manager = this.getManagerForElement(element);
        manager.get(event).set(options);
    }

    /**
     * Add an element and manager map to the internal collection.
     *
     * @param element The DOM element used to create the manager on.
     */
    public addManagerForElement(element: EventTarget, manager: HammerManager) {
        this._hammerManagers.push({element, manager});
    }

    /**
     * Get HammerManager for the element or null
     *
     * @param element The DOM element used to create the manager on.
     */
    public getManagerForElement(element: EventTarget): HammerManager {
        const result =  this._hammerManagers.filter(value => value.element === element);
        return result.length ? result[0].manager : null;
    }

    /**
     * Destroys the HammerManager for the element, removing event listeners in the process.
     *
     * @param element The DOM element used to create the manager on.
     */
    public removeManagerForElement(element: HTMLElement) {
        let index: number = null;
        for (let i = 0; i < this._hammerManagers.length; i++) {
            if (element === this._hammerManagers[i].element) {
                index = i;
                break;
            }
        }
        if (index !== null) {
            const item = this._hammerManagers.splice(index, 1)[0];
            // destroy also
            item.manager.destroy();
        }
    }

    /** Destroys all internally tracked HammerManagers, removing event listeners in the process. */
    public destroy() {
        for (const item of this._hammerManagers) {
            item.manager.destroy();
        }
        this._hammerManagers = [];
    }
}

1	import { Injectable, NgZone, DOCUMENT, inject } from '@angular/core';
2	import { ɵgetDOM as getDOM } from '@angular/platform-browser';
3	import { PlatformUtil } from './utils';
4	import { HammerManager, HammerOptions, HammerStatic } from './touch-annotations';
5
6	const EVENT_SUFFIX = 'precise';	3✔
7
8	/**
9	* Touch gestures manager based on Hammer.js
10	* Use with caution, this will track references for single manager per element. Very TBD. Much TODO.
11	*
12	* @hidden
13	*/
14	@Injectable()
15	export class HammerGesturesManager {	3✔
UNCOV 16	private _zone = inject(NgZone);	×
UNCOV 17	private doc = inject(DOCUMENT);	×
UNCOV 18	private platformUtil = inject(PlatformUtil);	×
19
20	public static Hammer: HammerStatic = typeof window !== 'undefined' ? (window as any).Hammer : null;	3!
21	/**
22	* Event option defaults for each recognizer, see http://hammerjs.github.io/api/ for API listing.
23	*/
UNCOV 24	protected hammerOptions: HammerOptions = {};	×
25
26	private platformBrowser: boolean;
UNCOV 27	private _hammerManagers: Array<{ element: EventTarget; manager: HammerManager }> = [];	×
28
29	constructor() {
UNCOV 30	this.platformBrowser = this.platformUtil.isBrowser;	×
UNCOV 31	if (this.platformBrowser && HammerGesturesManager.Hammer) {	×
UNCOV 32	this.hammerOptions = {	×
33	// D.P. #447 Force TouchInput due to PointerEventInput bug (https://github.com/hammerjs/hammer.js/issues/1065)
34	// see https://github.com/IgniteUI/igniteui-angular/issues/447#issuecomment-324601803
35	inputClass: HammerGesturesManager.Hammer.TouchInput,
36	recognizers: [
37	[HammerGesturesManager.Hammer.Pan, { threshold: 0 }],
38	[HammerGesturesManager.Hammer.Swipe, { direction: HammerGesturesManager.Hammer.DIRECTION_HORIZONTAL }],
39	[HammerGesturesManager.Hammer.Tap],
40	[HammerGesturesManager.Hammer.Tap, { event: 'doubletap', taps: 2 }, ['tap']]
41	]
42	};
43	}
44	}
45
46	public supports(eventName: string): boolean {
47	return eventName.toLowerCase().endsWith('.' + EVENT_SUFFIX);	×
48	}
49
50	/**
51	* Add listener extended with options for Hammer.js. Will use defaults if none are provided.
52	* Modeling after other event plugins for easy future modifications.
53	*/
54	public addEventListener(
55	element: HTMLElement,
56	eventName: string,
57	eventHandler: (eventObj) => void,
58	options: HammerOptions = null): () => void {	×
UNCOV 59	if (!this.platformBrowser) {	×
60	return;	×
61	}
62
63	// Creating the manager bind events, must be done outside of angular
UNCOV 64	return this._zone.runOutsideAngular(() => {	×
UNCOV 65	if (!HammerGesturesManager.Hammer) {	×
66	//no hammer
67	return;	×
68	}
UNCOV 69	let mc: HammerManager = this.getManagerForElement(element);	×
UNCOV 70	if (mc === null) {	×
71	// new Hammer is a shortcut for Manager with defaults
UNCOV 72	mc = new HammerGesturesManager.Hammer(element, Object.assign(this.hammerOptions, options));	×
UNCOV 73	this.addManagerForElement(element, mc);	×
74	}
UNCOV 75	const handler = (eventObj) => this._zone.run(() => eventHandler(eventObj));	×
UNCOV 76	mc.on(eventName, handler);	×
UNCOV 77	return () => mc.off(eventName, handler);	×
78	});
79	}
80
81	/**
82	* Add listener extended with options for Hammer.js. Will use defaults if none are provided.
83	* Modeling after other event plugins for easy future modifications.
84	*
85	* @param target Can be one of either window, body or document(fallback default).
86	*/
87	public addGlobalEventListener(target: string, eventName: string, eventHandler: (eventObj) => void): () => void {
UNCOV 88	if (!this.platformBrowser \|\| !HammerGesturesManager.Hammer) {	×
89	return;	×
90	}
91
UNCOV 92	const element = this.getGlobalEventTarget(target);	×
93
94	// Creating the manager bind events, must be done outside of angular
UNCOV 95	return this.addEventListener(element as HTMLElement, eventName, eventHandler);	×
96	}
97
98	/**
99	* Exposes [Dom]Adapter.getGlobalEventTarget to get global event targets.
100	* Supported: window, document, body. Defaults to document for invalid args.
101	*
102	* @param target Target name
103	*/
104	public getGlobalEventTarget(target: string): EventTarget {
UNCOV 105	return getDOM().getGlobalEventTarget(this.doc, target);	×
106	}
107
108	/**
109	* Set HammerManager options.
110	*
111	* @param element The DOM element used to create the manager on.
112	*
113	* ### Example
114	*
115	* ```ts
116	* manager.setManagerOption(myElem, "pan", { pointers: 1 });
117	* ```
118	*/
119	public setManagerOption(element: EventTarget, event: string, options: any) {
120	const manager = this.getManagerForElement(element);	×
121	manager.get(event).set(options);	×
122	}
123
124	/**
125	* Add an element and manager map to the internal collection.
126	*
127	* @param element The DOM element used to create the manager on.
128	*/
129	public addManagerForElement(element: EventTarget, manager: HammerManager) {
UNCOV 130	this._hammerManagers.push({element, manager});	×
131	}
132
133	/**
134	* Get HammerManager for the element or null
135	*
136	* @param element The DOM element used to create the manager on.
137	*/
138	public getManagerForElement(element: EventTarget): HammerManager {
UNCOV 139	const result = this._hammerManagers.filter(value => value.element === element);	×
UNCOV 140	return result.length ? result[0].manager : null;	×
141	}
142
143	/**
144	* Destroys the HammerManager for the element, removing event listeners in the process.
145	*
146	* @param element The DOM element used to create the manager on.
147	*/
148	public removeManagerForElement(element: HTMLElement) {
149	let index: number = null;	×
150	for (let i = 0; i < this._hammerManagers.length; i++) {	×
151	if (element === this._hammerManagers[i].element) {	×
152	index = i;	×
153	break;	×
154	}
155	}
156	if (index !== null) {	×
157	const item = this._hammerManagers.splice(index, 1)[0];	×
158	// destroy also
159	item.manager.destroy();	×
160	}
161	}
162
163	/** Destroys all internally tracked HammerManagers, removing event listeners in the process. */
164	public destroy() {
UNCOV 165	for (const item of this._hammerManagers) {	×
UNCOV 166	item.manager.destroy();	×
167	}
UNCOV 168	this._hammerManagers = [];	×
169	}
170	}

IgniteUI / igniteui-angular / 26023601418

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