mirror of
https://github.com/ful1e5/Bibata_Cursor.git
synced 2025-05-28 22:14:21 -04:00
🏷️ Typing and logs
This commit is contained in:
ful1e5
parent
05755fd92d
commit
992ad041ff
2 changed files with 56 additions and 56 deletions
|
|
@ -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
|
||||
|
|
|
|||
|
|
@ -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
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue