code2svg
API設計
⬜/
return swagger.json
未実装
https://code2svg.vercel.app/svg/:options?/:url
convert a source code got from url to a svg image
:urlにdata urlを入れられたら面白いかも
table:options
name posibble values description
L(\d+)-(\d+) N/A render particular lines in the range
L(\d+) N/A render a particular line
light github (default) specify the light theme
dark github-dark (default) specify the dark theme
lang (auto detect when not specified) specify the language
nowrap true or false (default) whether wrap lines
width number the width of the image
height number the width of the image
blanks number 追加の空行
いずれ実装するもの
行番号
headerの付与
ファイル名やソースへのリンクを表示する
browser URLの自動変換？
github.comをraw.githubusercontent.comに自動変換するなど
変換を無効にするoptionnoconvertも実装する
HTMLファイルそのものを参照したい場合に必要
list languages available
application/json
list themes available
application/json
highlight.jsのテーマを全て使えるようにしておく
実装したいこと
対応する(dark|light) themeを自動で探して適用する
code:ts
const detectCorrespondingTheme = (theme: ThemeName): ThemeName => {
if (theme.includes("-light")) {
const dark = theme.replace("-light", "-dark");
if (isTheme(dark)) return dark;
const normal = theme.replace("-light", "");
if (isTheme(normal)) return normal;
}
if (theme.includes("-dark")) {
const light = theme.replace("-dark", "-light");
if (isTheme(light)) return light;
const normal = theme.replace("-dark", "");
if (isTheme(normal)) return normal;
}
return theme;
};
: !lightTheme && darkTheme
: lightTheme && darkTheme
特にheaderと行番号は作りたい
行番号があると、範囲調節がしやすい
バグ
⬜theme CSSをescapeする
CSSのコメントでhtmlタグっぽいものを使うとsvgがエラーを出す
panda-syntax-lightで発生
全部hastで作ってtoHtmlをかければ解決するかな？
作り直してpushしたらなおった
全角文字の判定をする処理を入れて、全角文字を2文字と数えてれば直るだろう 井戸端が初出
2023-02-25
18:01:28 おんなじ名前のプログラムがすでにあった！？
Javaで書かれている
2023-02-18
19:00:55 production deployed
完成！
18:57:53 ciを設定した
18:49:14 vercel側のチェック終了
18:45:51 なぜかvercelだと/svg/https://~が/svg/https:/~にredirectされてしまう
routingでhttps?:/?にも対応できるようにした
glob patternにまだ対応していないようだったので、必要なファイルだけcheckするようにした
型定義の調整に手こずった
17:52:52 widthとheightを実装した
17:39:46 だいたい実装できた
まだ実装していないもの
✅nowrap
画像の大きさは外部から指定できた方がいい
15:26:39 repoを掘って動作確認中
実装