mirrors/Bibata_Cursor
1
0
Fork 0
mirror of https://github.com/ful1e5/Bibata_Cursor.git synced 2025-05-19 17:55:11 -04:00
Code Issues Projects Releases Packages Wiki Activity

🖼️ Render static pngs

Browse source
This commit is contained in:
ful1e5 2021-02-20 17:49:57 +05:30
parent 99dde92a8a
commit 05a7d723f6
3 changed files with 99 additions and 40 deletions
Download patch file Download diff file Expand all files Collapse all files

91
bitmapper/packages/core/src/BitmapsGenerator.ts
View file

@ -1,7 +1,9 @@
import fs from "fs";
import path from "path";
import * as puppeteer from "puppeteer";
import puppeteer, { Browser } from "puppeteer";
import { toHTML } from "./util/toHTML";
class BitmapsGenerator {
/**
@ -9,25 +11,9 @@ class BitmapsGenerator {
* @param themeName Give name, So all bitmaps files are organized in one directory.
* @param bitmapsDir `absolute` or `relative` path, Where `.png` files will store.
*/
constructor(
private bitmapsDir: string,
private readonly themeName: string
) {
this.bitmapsDir = path.resolve(bitmapsDir, themeName);
constructor(private bitmapsDir: string) {
this.bitmapsDir = path.resolve(bitmapsDir);
this.createDir(this.bitmapsDir);
// TODO
console.log(this.themeName);
}
/**
* Prepare headless browser.
*/
async initialize() {}
static async create(bitmapsDir: string, themeName: string) {
const newObject = new BitmapsGenerator(bitmapsDir, themeName);
await newObject.initialize();
}
/**
@ -40,33 +26,68 @@ class BitmapsGenerator {
}
}
protected async staticPng(page: puppeteer.Page) {
// TODO
console.log("Static");
await page.close();
}
// private async screenshot(
// element: ElementHandle<Element>
// ): Promise<string | void | Buffer> {
// return element.screenshot({
// omitBackground: true,
// encoding: "binary",
// });
// }
protected async animatedPng(page: puppeteer.Page) {
// TODO
console.log("animated");
await page.close();
}
// private async stopAnimation(page: Page) {
// // @ts-ignore
// await page._client.send("Animation.setPlaybackRate", {
// playbackRate: 0,
// });
// }
//
// private async resumeAnimation(page: Page, playbackRate: number = 0.1) {
// // @ts-ignore
// await page._client.send("Animation.setPlaybackRate", {
// playbackRate,
// });
// }
//
// private async saveFrameImage(key: string, frame: Buffer) {
// const out_path = path.resolve(outDir, key);
// fs.writeFileSync(out_path, frame, { encoding: "binary" });
// }
public async getBrowser() {
/**
* Prepare headless browser.
*/
public async getBrowser(): Promise<Browser> {
return await puppeteer.launch({
ignoreDefaultArgs: [" --single-process ", "--no-sandbox"],
headless: true,
});
}
public async toPng(
browser: puppeteer.Browser,
public async generate(
browser: Browser,
content: string,
out: string,
animated: boolean = false
) {
const page = await browser.newPage();
await page.setContent(content);
if (!content) {
throw new Error(`${content} File Read error`);
}
animated ? this.animatedPng(page) : this.staticPng(page);
const page = await browser.newPage();
const html = toHTML(content);
await page.setContent(html);
const svg = await page.$("#container svg");
if (!svg) {
throw new Error("svg element not found!");
}
if (animated) {
console.log("animated");
} else {
await svg.screenshot({ omitBackground: true, path: out });
}
}
}
export { BitmapsGenerator };

19
bitmapper/packages/core/src/util/toHTML.ts Normal file
View file

@ -0,0 +1,19 @@
export const template = `
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Render Template</title>
</head>
<body>
<div id="container">
<svginjection>
</div>
</body>
</html>
`;
export const toHTML = (svgData: string): string =>
template.replace("<svginjection>", svgData);