bg: dots/plain

This commit is contained in:
Shusaku Uesugi 2021-06-09 16:37:40 -07:00
parent d490d2f30f
commit acc6b83904
No known key found for this signature in database
GPG Key ID: 754D062C521FD7E8
3 changed files with 9 additions and 8 deletions

View File

@ -5,7 +5,7 @@ import { ParsedRequest, Theme } from './types';
export function parseRequest(req: IncomingMessage) {
console.log('HTTP ' + req.url);
const { pathname, query } = parse(req.url || '/', true);
const { fontSize, images, widths, heights, theme, md, imagesCircle, hideDots } = query || {};
const { fontSize, images, widths, heights, theme, md, imagesCircle, bg } = query || {};
if (Array.isArray(fontSize)) {
throw new Error('Expected a single fontSize');
@ -36,7 +36,7 @@ export function parseRequest(req: IncomingMessage) {
widths: getArray(widths),
heights: getArray(heights),
imagesCircle: getArray(imagesCircle).map((x) => x === '1' || x === 'true'),
hideDots: hideDots === '1' || hideDots === 'true'
bg: bg === 'plain' ? 'plain' : 'dots'
};
parsedRequest.images = getDefaultImages(parsedRequest.images, parsedRequest.theme);
return parsedRequest;

View File

@ -1,7 +1,7 @@
import { readFileSync } from 'fs';
import marked from 'marked';
import { sanitizeHtml } from './sanitizer';
import { ParsedRequest } from './types';
import { ParsedRequest, Theme, Bg } from './types';
const twemoji = require('twemoji');
const twOptions = { folder: 'svg', ext: '.svg' };
const emojify = (text: string) => twemoji.parse(text, twOptions);
@ -10,7 +10,7 @@ const rglr = readFileSync(`${__dirname}/../_fonts/Inter-Regular.woff2`).toString
const bold = readFileSync(`${__dirname}/../_fonts/Inter-Bold.woff2`).toString('base64');
const mono = readFileSync(`${__dirname}/../_fonts/Vera-Mono.woff2`).toString('base64');
function getCss(theme: string, fontSize: string, hideDots: boolean) {
function getCss(theme: Theme, fontSize: string, bg: Bg) {
let background = 'white';
let foreground = 'black';
let radial = 'lightgray';
@ -45,7 +45,7 @@ function getCss(theme: string, fontSize: string, hideDots: boolean) {
body {
background: ${background};
${
hideDots
bg === 'plain'
? ''
: `background-image: radial-gradient(circle at 25px 25px, ${radial} 2%, transparent 0%), radial-gradient(circle at 75px 75px, ${radial} 2%, transparent 0%);`
}
@ -111,14 +111,14 @@ function getCss(theme: string, fontSize: string, hideDots: boolean) {
}
export function getHtml(parsedReq: ParsedRequest) {
const { text, theme, md, fontSize, images, widths, heights, imagesCircle, hideDots } = parsedReq;
const { text, theme, md, fontSize, images, widths, heights, imagesCircle, bg } = parsedReq;
return `<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>Generated Image</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
${getCss(theme, fontSize, hideDots)}
${getCss(theme, fontSize, bg)}
</style>
<body>
<div>

View File

@ -1,5 +1,6 @@
export type FileType = 'png' | 'jpeg';
export type Theme = 'light' | 'dark';
export type Bg = 'dots' | 'plain';
export interface ParsedRequest {
fileType: FileType;
@ -11,5 +12,5 @@ export interface ParsedRequest {
widths: string[];
heights: string[];
imagesCircle: boolean[];
hideDots: boolean;
bg: Bg;
}