From 992ad041ff7058d67e01344f86703ce408a7644e Mon Sep 17 00:00:00 2001 From: ful1e5 <24286590+ful1e5@users.noreply.github.com> Date: Tue, 29 Sep 2020 09:15:34 +0530 Subject: [PATCH] =?UTF-8?q?=F0=9F=8F=B7=EF=B8=8F=20Typing=20and=20logs?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/core/src/BitmapsGenerator.ts | 76 +++++++++---------- .../src/SvgHandler/ColoredSvgGenerator.ts | 36 ++++----- 2 files changed, 56 insertions(+), 56 deletions(-) diff --git a/packages/core/src/BitmapsGenerator.ts b/packages/core/src/BitmapsGenerator.ts index 58992ab4..f4736219 100644 --- a/packages/core/src/BitmapsGenerator.ts +++ b/packages/core/src/BitmapsGenerator.ts @@ -5,7 +5,7 @@ import ora, { Ora } from "ora"; import puppeteer, { Browser, ElementHandle } from "puppeteer"; import ColoredSvgGenerator, { Cursors, - Inputs + ThemeConfig } from "./SvgHandler/ColoredSvgGenerator"; import { Frames, PixelDiffRate } from "./types"; import { getFrameName } from "./utils/getFrameName"; @@ -22,10 +22,34 @@ const pixelDiffRate: PixelDiffRate = { }; export class BitmapsGenerator { - private static: Cursors; - private animated: Cursors; + private readonly staticCurs: Cursors; + private readonly animatedCurs: Cursors; private spinner: Ora; + /** + * + * @param source `BitmapsGenerator` Class's object arguments. + * + * @param themeName name of the bitmaps directory. + * + * @param bitmapsDir `absolute` or `relative` path, Where cursors `.png` files generated. + */ + constructor( + private readonly source: ThemeConfig, + private readonly themeName: string, + private readonly bitmapsDir: string + ) { + this.createDir(this.bitmapsDir); + + this.spinner = ora(); + this.spinner.text = ` Preparing ${this.themeName} cursor theme colors...`; + this.spinner.start(); + + const themeSvgs = new ColoredSvgGenerator(this.source); + this.staticCurs = themeSvgs.getAnimatedCursors(); + this.animatedCurs = themeSvgs.getAnimatedCursors(); + } + /** * * Create directory if it doesn't exists. @@ -40,30 +64,6 @@ export class BitmapsGenerator { } } - /** - * - * @param inputs `BitmapsGenerator` Class's object arguments. - * - * @param themeName name of the bitmaps directory. - * - * @param bitmapsDir `absolute` or `relative` path, Where cursors `.png` files generated. - */ - constructor( - private inputs: Inputs, - private themeName: string, - private bitmapsDir: string - ) { - this.createDir(this.bitmapsDir); - - this.spinner = ora(); - this.spinner.text = ` Preparing ${this.themeName} Color Schema...`; - this.spinner.start(); - - const svgs = new ColoredSvgGenerator(this.inputs); - this.static = svgs.getColoredAnimatedCursors(); - this.animated = svgs.getColoredAnimatedCursors(); - } - /** * * @param browser `puppeteer` browser instance. @@ -103,10 +103,10 @@ export class BitmapsGenerator { * * @param browser `puppeteer` browser instance. */ - private async generateStaticCursors(browser: Browser) { - for (let [cursor] of Object.entries(this.static)) { + private async renderStaticCurs(browser: Browser) { + for (let [cursor] of Object.entries(this.staticCurs)) { // Generating HTML Template - const { content } = this.static[`${cursor}`]; + const { content } = this.staticCurs[`${cursor}`]; // Configs const file = `${cursor}.png`; @@ -114,7 +114,7 @@ export class BitmapsGenerator { const svgElement = await this.getSvgElement(browser, content); // Render - this.spinner.text = ` Bitmaping ${chalk.greenBright(file)}`; + this.spinner.text = ` Rendering ${chalk.greenBright(file)}`; await svgElement.screenshot({ omitBackground: true, path: out }); } @@ -127,10 +127,10 @@ export class BitmapsGenerator { * * @param browser `puppeteer` browser instance. */ - private async generateAnimatedCursors(browser: Browser) { - for (let [cursor] of Object.entries(this.animated)) { + private async renderAnimatedCurs(browser: Browser) { + for (let [cursor] of Object.entries(this.animatedCurs)) { // Generating HTML Template - const { content } = this.static[`${cursor}`]; + const { content } = this.staticCurs[`${cursor}`]; const svgElement = this.getSvgElement(browser, content); // Config @@ -140,7 +140,7 @@ export class BitmapsGenerator { const firstFrame = getFrameName(index, cursor); // 1st Frame - this.spinner.text = ` Bitmaping ${chalk.greenBright(firstFrame)}`; + this.spinner.text = ` Rendering ${chalk.greenBright(firstFrame)}`; frames[firstFrame] = { buffer: await (await svgElement).screenshot({ omitBackground: true, @@ -152,7 +152,7 @@ export class BitmapsGenerator { index++; while (!breakRendering) { const key = getFrameName(index, cursor); - this.spinner.text = ` Bitmaping ${chalk.greenBright(key)}`; + this.spinner.text = ` Rendering ${chalk.greenBright(key)}`; const newFrame = await (await svgElement).screenshot({ omitBackground: true, @@ -188,8 +188,8 @@ export class BitmapsGenerator { try { this.spinner.color = "yellow"; - await this.generateStaticCursors(browser); - await this.generateAnimatedCursors(browser); + await this.renderStaticCurs(browser); + await this.renderAnimatedCurs(browser); this.spinner.text = ` ${chalk.blueBright( this.themeName diff --git a/packages/core/src/SvgHandler/ColoredSvgGenerator.ts b/packages/core/src/SvgHandler/ColoredSvgGenerator.ts index 923c2882..3bacce73 100644 --- a/packages/core/src/SvgHandler/ColoredSvgGenerator.ts +++ b/packages/core/src/SvgHandler/ColoredSvgGenerator.ts @@ -3,7 +3,7 @@ import path from "path"; import SvgDirectoryParser from "./SvgDirectoryParser"; import { Colors } from "../types"; -export type Inputs = { svgDir: string; colors: Colors }; +export type ThemeConfig = { svgDir: string; colors: Colors }; export interface Cursors { [cursorName: string]: { @@ -20,8 +20,8 @@ export const keyColors: Colors = { }; export default class ColoredSvgGenerator { - private staticCursors: string[]; - private animatedCursors: string[]; + private staticCurs: string[]; + private animatedCurs: string[]; /** * @@ -35,27 +35,27 @@ export default class ColoredSvgGenerator { * * @param colors `Colors` for static cursors. */ - constructor(private inputs: Inputs) { - const svgParser = new SvgDirectoryParser(this.inputs.svgDir); - this.animatedCursors = svgParser.getAnimatedCursors(); - this.staticCursors = svgParser.getStaticCursors(); + constructor(private readonly themeConfig: ThemeConfig) { + const svgParser = new SvgDirectoryParser(this.themeConfig.svgDir); + this.animatedCurs = svgParser.getAnimatedCursors(); + this.staticCurs = svgParser.getStaticCursors(); } /** * * Generate `static` cursors .svg file according to `Theme Colors`. */ - public getColoredStaticCursors(): Cursors { + public getStaticCursors(): Cursors { const cursors: Cursors = {}; - this.staticCursors.map((cursor: string) => { + this.staticCurs.map((cursor: string) => { let content = fs.readFileSync(cursor, "utf-8").toString(); content = content - .replace(new RegExp(keyColors.base, "g"), this.inputs.colors.base) + .replace(new RegExp(keyColors.base, "g"), this.themeConfig.colors.base) .replace( new RegExp(keyColors.outline, "g"), - this.inputs.colors.outline + this.themeConfig.colors.outline ); cursors[`${path.basename(cursor, ".svg")}`] = { content }; @@ -68,26 +68,26 @@ export default class ColoredSvgGenerator { * * Generate `animated` cursors .svg file according to `Theme Colors`. */ - public getColoredAnimatedCursors(): Cursors { + public getAnimatedCursors(): Cursors { const cursors: Cursors = {}; - this.animatedCursors.map((cursor: string) => { + this.animatedCurs.map((cursor: string) => { let content = fs.readFileSync(cursor, "utf-8").toString(); content = content - .replace(new RegExp(keyColors.base, "g"), this.inputs.colors.base) + .replace(new RegExp(keyColors.base, "g"), this.themeConfig.colors.base) .replace( new RegExp(keyColors.outline, "g"), - this.inputs.colors.outline + this.themeConfig.colors.outline ); try { // === trying to replace `watch` color === - if (!this.inputs.colors.watch?.background) { + if (!this.themeConfig.colors.watch?.background) { throw new Error(""); } - const { background: b } = this.inputs.colors.watch; + const { background: b } = this.themeConfig.colors.watch; content = content.replace( new RegExp(keyColors.watch!.background, "g"), b @@ -97,7 +97,7 @@ export default class ColoredSvgGenerator { content = content.replace( new RegExp(keyColors.watch!.background, "g"), - this.inputs.colors.base + this.themeConfig.colors.base ); }