-
-
Notifications
You must be signed in to change notification settings - Fork 4
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #42 from boehs/charts
Add charts
- Loading branch information
Showing
12 changed files
with
1,036 additions
and
58 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,99 @@ | ||
import pintora from "@pintora/standalone"; | ||
import { JSDOM } from "jsdom"; | ||
|
||
if (process.env.ELEVENTY_ENV == "production") { | ||
await import("./wintercg.js"); | ||
} | ||
|
||
class GlobalPatcher { | ||
records = {}; | ||
set(k, v) { | ||
const prevValue = globalThis[k]; | ||
this.records[k] = { | ||
prevValue, | ||
value: v, | ||
}; | ||
|
||
globalThis[k] = v; | ||
} | ||
|
||
restore() { | ||
for (const k in this.records) { | ||
if (globalThis[k] === this.records[k].value) { | ||
globalThis[k] = this.records[k].prevValue; | ||
} | ||
} | ||
} | ||
} | ||
|
||
const patcher = new GlobalPatcher(); | ||
|
||
function createContainer() { | ||
const dom = new JSDOM("<!DOCTYPE html><body></body>"); | ||
const document = dom.window.document; | ||
const container = document.createElement("div"); | ||
container.id = "pintora-container"; | ||
patcher.set("window", dom.window); | ||
patcher.set("document", document); | ||
return container; | ||
} | ||
|
||
export default function renderPintora(code) { | ||
return new Promise((resolve, reject) => { | ||
const container = createContainer(); | ||
pintora.renderTo(code, { | ||
container, | ||
renderer: "svg", | ||
containerSize: { | ||
width: 600, | ||
}, | ||
onRender: (renderer) => { | ||
const rootElement = renderer.getRootElement(); | ||
rootElement.setAttribute("xmlns", "http://www.w3.org/2000/svg"); | ||
rootElement.classList.add("pintora"); | ||
const html = rootElement.outerHTML; | ||
patcher.restore(); | ||
resolve(html); | ||
}, | ||
config: { | ||
core: { | ||
defaultFontFamily: "'Input Mono Compressed', monospace", | ||
}, | ||
themeConfig: { | ||
themeVariables: { | ||
primaryColor: "var(--light)", | ||
canvasBackground: "transparent", | ||
textColor: "var(--fg2)", | ||
}, | ||
}, | ||
sequence: { | ||
diagramPadding: 0, | ||
messageFontSize: 13, | ||
actorLineColor: "var(--fg2)", | ||
}, | ||
}, | ||
}); | ||
}); | ||
} | ||
|
||
/** | ||
* Replaces Pintora placeholders with rendered SVGs. | ||
*/ | ||
export async function injectPintora(result) { | ||
if (result.includes("___PINTORA_")) { | ||
const pintoraBlocks = []; | ||
const regex = /___PINTORA_(\w+)_(.*?)_/gs; | ||
let match; | ||
while ((match = regex.exec(result)) !== null) { | ||
pintoraBlocks.push({ id: match[1], content: match[2] }); | ||
} | ||
for (const block of pintoraBlocks) { | ||
const rendered = await renderPintora(block.content); | ||
result = result.replace( | ||
`___PINTORA_${block.id}_${block.content}_`, | ||
rendered, | ||
); | ||
} | ||
} | ||
return result; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,71 @@ | ||
/** | ||
* In wintercg runtimes (assuming build on ci) we import our own ttf because it probably doesn't exist | ||
*/ | ||
|
||
import { textMetrics } from "@pintora/standalone"; | ||
import { create } from "fontkit"; | ||
import { readFileSync } from "fs"; | ||
import { join } from "path"; | ||
|
||
const b = readFileSync( | ||
join(import.meta.dirname, "../../../src/_public/office.ttf"), | ||
); | ||
const defaultFont = create(b); | ||
const fonts = { | ||
"sans-serif": defaultFont, | ||
"Source Code Pro": defaultFont, | ||
}; | ||
|
||
class FontkitCalculator { | ||
name = "fontkit"; | ||
getLineMetric(text, fontConfig) { | ||
const fontSize = fontConfig?.fontSize || 14; | ||
const fontName = fontConfig?.fontFamily || "sans-serif"; | ||
const font = fonts[fontName] || defaultFont; | ||
const glyph = font.layout(text); | ||
const sizeUnit = fontSize / font.unitsPerEm; | ||
// const width = glyph.glyphs.reduce((last, curr) => last + curr.cbox.width, 0) * sizeUnit | ||
const width = glyph.bbox.width * sizeUnit; // fine | ||
|
||
const glyphActualMaxHeight = | ||
glyph.glyphs.reduce( | ||
(last, curr) => Math.max(last, curr.cbox.height), | ||
0, | ||
) * sizeUnit; | ||
const height = glyphActualMaxHeight; | ||
|
||
const actualBoundingBoxAscent = height; | ||
// console.log('line:', text, 'width', width, 'actualBoundingBoxAscent', actualBoundingBoxAscent) | ||
const actualBoundingBoxDescent = 0; | ||
return { | ||
actualBoundingBoxAscent, | ||
actualBoundingBoxDescent, | ||
width, | ||
}; | ||
} | ||
|
||
calculateTextDimensions(text, font) { | ||
const lines = text.split("\n"); | ||
let width = 0; | ||
let height = 0; | ||
const fontSize = font?.fontSize || 14; | ||
lines.forEach((line, i) => { | ||
const lineMetric = this.getLineMetric(line, font); | ||
const w = lineMetric.width; | ||
width = Math.max(w, width); | ||
let lineHeight = fontSize; | ||
if ("actualBoundingBoxDescent" in lineMetric) { | ||
lineHeight = | ||
lineMetric.actualBoundingBoxAscent + | ||
lineMetric.actualBoundingBoxDescent; | ||
} | ||
height += lineHeight; | ||
}); | ||
return { | ||
width, | ||
height, | ||
}; | ||
} | ||
} | ||
|
||
textMetrics.setImpl(new FontkitCalculator()); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.