Dynamic Spinner added

This commit is contained in:
ful1e5 2020-09-02 08:57:00 +05:30
parent e01c520051
commit 53e759f699

View file

@ -1,5 +1,6 @@
import fs from "fs"; import fs from "fs";
import path from "path"; import path from "path";
import ora from "ora";
import chalk from "chalk"; import chalk from "chalk";
import puppeteer from "puppeteer"; import puppeteer from "puppeteer";
@ -7,7 +8,6 @@ import { generateRenderTemplate } from "./utils/htmlTemplate";
import { matchImages } from "./utils/matchImages"; import { matchImages } from "./utils/matchImages";
import { saveFrames } from "./utils/saveFrames"; import { saveFrames } from "./utils/saveFrames";
import { getKeyName } from "./utils/getKeyName"; import { getKeyName } from "./utils/getKeyName";
import { spinner } from "./utils/spinner";
import { Config, Frames, PixelDiffRate } from "./types"; import { Config, Frames, PixelDiffRate } from "./types";
const pixelDiffRate: PixelDiffRate = { const pixelDiffRate: PixelDiffRate = {
@ -36,11 +36,13 @@ const renderCursors = async (configs: Record<string, Config>) => {
} }
// Spinner // Spinner
spinner.text = `Generating ${chalk.magentaBright(schema)} bitmaps ...`; const spinner = ora();
spinner.text = ` Preparing ${schema} Schema...`;
spinner.start(); spinner.start();
// Render // Render
try { try {
spinner.color = "yellow";
for (let svgPath of staticCursors) { for (let svgPath of staticCursors) {
const buffer = fs.readFileSync(svgPath, "utf8"); const buffer = fs.readFileSync(svgPath, "utf8");
if (!buffer) throw new Error(`${svgPath} File Read error`); if (!buffer) throw new Error(`${svgPath} File Read error`);
@ -61,6 +63,7 @@ const renderCursors = async (configs: Record<string, Config>) => {
const svgElement = await page.$("#container svg"); const svgElement = await page.$("#container svg");
if (!svgElement) throw new Error("svg element not found"); if (!svgElement) throw new Error("svg element not found");
await svgElement.screenshot({ omitBackground: true, path: out }); await svgElement.screenshot({ omitBackground: true, path: out });
spinner.text = `${chalk.greenBright(bitmapName)}`;
await page.close(); await page.close();
} }
@ -80,16 +83,12 @@ const renderCursors = async (configs: Record<string, Config>) => {
const svgElement = await page.$("#container svg"); const svgElement = await page.$("#container svg");
if (!svgElement) throw new Error("svg element not found"); if (!svgElement) throw new Error("svg element not found");
console.log(path.basename(svgPath));
// Render Config // Render Config
let index = 1; let index = 1;
let breakRendering = false; let breakRendering = false;
const frames: Frames = {}; const frames: Frames = {};
const firstKey = getKeyName(index, svgPath); const firstKey = getKeyName(index, svgPath);
// console.log("Rendering", path.basename(svgPath), "...");
// console.log(firstKey);
// 1st Frame // 1st Frame
frames[firstKey] = { frames[firstKey] = {
buffer: await svgElement.screenshot({ buffer: await svgElement.screenshot({
@ -97,6 +96,7 @@ const renderCursors = async (configs: Record<string, Config>) => {
encoding: "binary" encoding: "binary"
}) })
}; };
spinner.text = ` ${chalk.greenBright(firstKey)}`;
// Pushing frames until it match to 1st frame // Pushing frames until it match to 1st frame
index++; index++;
@ -106,7 +106,7 @@ const renderCursors = async (configs: Record<string, Config>) => {
encoding: "binary" encoding: "binary"
}); });
const key = getKeyName(index, svgPath); const key = getKeyName(index, svgPath);
// console.log(key);
const diff = matchImages({ const diff = matchImages({
img1Buff: frames[firstKey].buffer, img1Buff: frames[firstKey].buffer,
img2Buff: newFrame img2Buff: newFrame
@ -115,6 +115,7 @@ const renderCursors = async (configs: Record<string, Config>) => {
const { rate } = pixelDiffRate[path.basename(svgPath)]; const { rate } = pixelDiffRate[path.basename(svgPath)];
if (!(diff < rate)) { if (!(diff < rate)) {
frames[key] = { buffer: newFrame }; frames[key] = { buffer: newFrame };
spinner.text = ` ${chalk.greenBright(key)}`;
} else { } else {
breakRendering = true; breakRendering = true;
} }
@ -125,6 +126,7 @@ const renderCursors = async (configs: Record<string, Config>) => {
await page.close(); await page.close();
} }
spinner.text = `${schema} Bitmaps`;
spinner.succeed(); spinner.succeed();
} catch (error) { } catch (error) {
console.error(error); console.error(error);
@ -132,7 +134,7 @@ const renderCursors = async (configs: Record<string, Config>) => {
process.exit(1); process.exit(1);
} }
} }
console.log(`🎉 Bitmaps stored at ${chalk.greenBright(outDir)}`); console.log(` 🎉 Bitmaps stored at ${chalk.greenBright(outDir)}`);
}; };
export { renderCursors }; export { renderCursors };