7506947261

Committed 12 Jan 2024 08:09PM CUT coverage: 91.965% (+5.5%) from 86.42%

Build # 7506947261

Build Type

Pull #810

github

Committed by

jassmith

Commit Message

Reduce nesting

Pull Request Pull Request #810: 6.0.0

Run Details

2753 of 3378 branches covered (0.0%)

16596 of 18046 relevant lines covered (91.96%)

3220.14 hits per line

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

83.18

/packages/core/src/internal/data-grid/data-grid-sprites.ts

import type { Theme } from "../../common/styles.js";
import type { SpriteProps } from "../../common/utils.js";
import { type HeaderIconMap } from "./sprites.js";

/**
 * A known icon identifier
 *
 * @category Columns
 */
export type HeaderIcon = keyof HeaderIconMap;

/**
 * A method that produces an SVG array from
 * an SVG icon configuration.
 *
 * @category Columns
 */
export type Sprite = (props: SpriteProps) => string;

/**
 * A method that maps from icon names to functions
 * that return SVG strings.
 *
 * @category Columns
 */
export type SpriteMap = Record<string | HeaderIcon, Sprite>;

/** @category Columns */
export type SpriteVariant = "normal" | "selected" | "special";

function getColors(variant: SpriteVariant, theme: Theme): readonly [string, string] {
    if (variant === "normal") {
        return [theme.bgIconHeader, theme.fgIconHeader];
    } else if (variant === "selected") {
        return ["white", theme.accentColor];
    } else {
        return [theme.accentColor, theme.bgHeader];
    }
}

/** @category Columns */
export class SpriteManager {
    private spriteMap: Map<string, HTMLCanvasElement> = new Map();
    private headerIcons: SpriteMap;
    private inFlight = 0;

    constructor(
        headerIcons: SpriteMap | undefined,
        private onSettled: () => void
    ) {
        this.headerIcons = headerIcons ?? {};
    }

    public drawSprite(
        sprite: HeaderIcon | string,
        variant: SpriteVariant,
        ctx: CanvasRenderingContext2D,
        x: number,
        y: number,
        size: number,
        theme: Theme,
        alpha: number = 1
    ) {
        const [bgColor, fgColor] = getColors(variant, theme);
        const rSize = size * Math.ceil(window.devicePixelRatio);
        const key = `${bgColor}_${fgColor}_${rSize}_${sprite}`;

        let spriteCanvas = this.spriteMap.get(key);
        if (spriteCanvas === undefined) {
            const spriteCb = this.headerIcons[sprite];

            if (spriteCb === undefined) return;

            spriteCanvas = document.createElement("canvas");
            const spriteCtx = spriteCanvas.getContext("2d");

            if (spriteCtx === null) return;

            const imgSource = new Image();
            imgSource.src = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(spriteCb({ fgColor, bgColor }))}`;
            this.spriteMap.set(key, spriteCanvas);
            const promise: Promise<void> | undefined = imgSource.decode();

            if (promise === undefined) return;

            this.inFlight++;
            promise
                .then(() => {
                    spriteCtx.drawImage(imgSource, 0, 0, rSize, rSize);
                })
                .finally(() => {
                    this.inFlight--;
                    if (this.inFlight === 0) {
                        this.onSettled();
                    }
                });
        } else {
            if (alpha < 1) {
                ctx.globalAlpha = alpha;
            }
            ctx.drawImage(spriteCanvas, 0, 0, rSize, rSize, x, y, size, size);
            if (alpha < 1) {
                ctx.globalAlpha = 1;
            }
        }
    }
}

1	import type { Theme } from "../../common/styles.js";	1✔
2	import type { SpriteProps } from "../../common/utils.js";	1✔
3	import { type HeaderIconMap } from "./sprites.js";	1✔
4		1✔
5	/**	1✔
6	* A known icon identifier	1✔
7	*	1✔
8	* @category Columns	1✔
9	*/	1✔
10	export type HeaderIcon = keyof HeaderIconMap;	1✔
11		1✔
12	/**	1✔
13	* A method that produces an SVG array from	1✔
14	* an SVG icon configuration.	1✔
15	*	1✔
16	* @category Columns	1✔
17	*/	1✔
18	export type Sprite = (props: SpriteProps) => string;	1✔
19		1✔
20	/**	1✔
21	* A method that maps from icon names to functions	1✔
22	* that return SVG strings.	1✔
23	*	1✔
24	* @category Columns	1✔
25	*/	1✔
26	export type SpriteMap = Record<string \| HeaderIcon, Sprite>;	1✔
27		1✔
28	/** @category Columns */	1✔
29	export type SpriteVariant = "normal" \| "selected" \| "special";	1✔
30		1✔
31	function getColors(variant: SpriteVariant, theme: Theme): readonly [string, string] {	4,026✔
32	if (variant === "normal") {	4,026✔
33	return [theme.bgIconHeader, theme.fgIconHeader];	3,963✔
34	} else if (variant === "selected") {	4,026✔
35	return ["white", theme.accentColor];	63✔
36	} else {	63!
37	return [theme.accentColor, theme.bgHeader];	×
38	}	×
39	}	4,026✔
40		1✔
41	/** @category Columns */	1✔
42	export class SpriteManager {	1✔
43	private spriteMap: Map<string, HTMLCanvasElement> = new Map();	159✔
44	private headerIcons: SpriteMap;	159✔
45	private inFlight = 0;	159✔
46		159✔
47	constructor(	159✔
48	headerIcons: SpriteMap \| undefined,	159✔
49	private onSettled: () => void	159✔
50	) {	159✔
51	this.headerIcons = headerIcons ?? {};	159✔
52	}	159✔
53		159✔
54	public drawSprite(	159✔
55	sprite: HeaderIcon \| string,	4,026✔
56	variant: SpriteVariant,	4,026✔
57	ctx: CanvasRenderingContext2D,	4,026✔
58	x: number,	4,026✔
59	y: number,	4,026✔
60	size: number,	4,026✔
61	theme: Theme,	4,026✔
62	alpha: number = 1	4,026✔
63	) {	4,026✔
64	const [bgColor, fgColor] = getColors(variant, theme);	4,026✔
65	const rSize = size * Math.ceil(window.devicePixelRatio);	4,026✔
66	const key = `${bgColor}_${fgColor}_${rSize}_${sprite}`;	4,026✔
67		4,026✔
68	let spriteCanvas = this.spriteMap.get(key);	4,026✔
69	if (spriteCanvas === undefined) {	4,026✔
70	const spriteCb = this.headerIcons[sprite];	1,463✔
71		1,463✔
72	if (spriteCb === undefined) return;	1,463!
73		1,463✔
74	spriteCanvas = document.createElement("canvas");	1,463✔
75	const spriteCtx = spriteCanvas.getContext("2d");	1,463✔
76		1,463✔
77	if (spriteCtx === null) return;	1,463!
78		1,463✔
79	const imgSource = new Image();	1,463✔
80	imgSource.src = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(spriteCb({ fgColor, bgColor }))}`;	1,463✔
81	this.spriteMap.set(key, spriteCanvas);	1,463✔
82	const promise: Promise<void> \| undefined = imgSource.decode();	1,463✔
83		1,463✔
84	if (promise === undefined) return;	1,463!
85		×
86	this.inFlight++;	×
87	promise	×
88	.then(() => {	×
89	spriteCtx.drawImage(imgSource, 0, 0, rSize, rSize);	×
90	})	×
91	.finally(() => {	×
92	this.inFlight--;	×
93	if (this.inFlight === 0) {	×
94	this.onSettled();	×
95	}	×
96	});	×
97	} else {	4,026✔
98	if (alpha < 1) {	2,563!
99	ctx.globalAlpha = alpha;	×
100	}	×
101	ctx.drawImage(spriteCanvas, 0, 0, rSize, rSize, x, y, size, size);	2,563✔
102	if (alpha < 1) {	2,563!
103	ctx.globalAlpha = 1;	×
104	}	×
105	}	2,563✔
106	}	4,026✔
107	}	159✔

glideapps / glide-data-grid / 7506947261

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