🚀 Clean Render

This commit is contained in:
ful1e5 2020-08-30 10:05:02 +05:30
parent e03b5c7b53
commit 27728e491c

View file

@ -6,7 +6,6 @@ import { generateRenderTemplate } from "./utils/htmlTemplate";
import { import {
staticCursors, staticCursors,
bitmapsDir, bitmapsDir,
svgsDir,
animatedCursors, animatedCursors,
animatedClip, animatedClip,
} from "./config"; } from "./config";
@ -20,10 +19,6 @@ const main = async () => {
headless: true, headless: true,
}); });
// Paths
if (!fs.existsSync(svgsDir)) {
console.log("Source .svg files not found");
}
if (!fs.existsSync(bitmapsDir)) { if (!fs.existsSync(bitmapsDir)) {
fs.mkdirSync(bitmapsDir); fs.mkdirSync(bitmapsDir);
} }
@ -31,17 +26,17 @@ const main = async () => {
try { try {
console.log("📸 Rendering Static Cursors..."); console.log("📸 Rendering Static Cursors...");
for (let svg of staticCursors) { for (let svgPath of staticCursors) {
const buffer = fs.readFileSync(path.resolve(svgsDir, svg), "utf8"); const buffer = fs.readFileSync(path.resolve(svgPath), "utf8");
if (!buffer) throw new Error(`${svg} File Read error`); if (!buffer) throw new Error(`${svgPath} File Read error`);
const data = buffer.toString();
// Generating HTML Template // Generating HTML Template
const data = buffer.toString();
const template = generateRenderTemplate(data); const template = generateRenderTemplate(data);
// config // config
const bitmap = `${path.basename(svg, ".svg")}.png`; const bitmapName = `${path.basename(svgPath, ".svg")}.png`;
const out = path.resolve(bitmapsDir, bitmap); const out = path.resolve(bitmapsDir, bitmapName);
// Render // Render
const page = await browser.newPage(); const page = await browser.newPage();
@ -49,23 +44,20 @@ const main = async () => {
await page.waitForSelector("#container"); await page.waitForSelector("#container");
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 });
// console.log(`Static Cursor rendered at ${out}`);
await page.close(); await page.close();
} }
console.log("🎥 Rendering Animated Cursors..."); console.log("🎥 Rendering Animated Cursors...");
for (let [svg] of Object.entries(animatedCursors)) { for (let svgPath of animatedCursors) {
const buffer = fs.readFileSync(path.resolve(svgsDir, svg), "utf8"); const buffer = fs.readFileSync(svgPath, "utf8");
if (!buffer) throw new Error(`${svg} File Read error`); if (!buffer) throw new Error(`${svgPath} File Read error`);
const data = buffer.toString();
// Generating HTML Template // Generating HTML Template
const data = buffer.toString();
const template = generateRenderTemplate(data); const template = generateRenderTemplate(data);
const page = await browser.newPage(); const page = await browser.newPage();
@ -73,14 +65,13 @@ const main = async () => {
await page.waitForSelector("#container"); await page.waitForSelector("#container");
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");
// Render Config // Render Config
let index = 1; let index = 1;
let breakLoop = false; let breakLoop = false;
const frames: Frames = {}; const frames: Frames = {};
const firstKey = getKeyName(index, svg); const firstKey = getKeyName(index, svgPath);
console.log(firstKey); console.log(firstKey);
// 1st Frame // 1st Frame
@ -100,7 +91,7 @@ const main = async () => {
clip: animatedClip, clip: animatedClip,
encoding: "binary", encoding: "binary",
}); });
const key = getKeyName(index, svg); const key = getKeyName(index, svgPath);
console.log(key); console.log(key);
const diff = matchImages({ const diff = matchImages({
img1Buff: frames[firstKey].buffer, img1Buff: frames[firstKey].buffer,