Skip to content

Commit a91c783

Browse files
Vigilansjdneo
Vigilans
authored and
jdneo
committed
Apply vscode's markdown settings to MarkdownEngine (#260)
1 parent 1430ac4 commit a91c783

File tree

3 files changed

+74
-18
lines changed

3 files changed

+74
-18
lines changed

‎src/webview/leetCodeResultProvider.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ class LeetCodeResultProvider implements Disposable {
4242
<head>
4343
<meta charset="UTF-8">
4444
<meta name="viewport" content="width=device-width, initial-scale=1.0">
45-
${markdownEngine.getStylesHTML()}
45+
${markdownEngine.getStyles()}
4646
</head>
4747
<body>
4848
<pre><code>${result.trim()}</code></pre>

‎src/webview/leetCodeSolutionProvider.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ class LeetCodeSolutionProvider implements Disposable {
5353
}
5454

5555
private getWebViewContent(solution: Solution): string {
56-
const styles: string = markdownEngine.getStylesHTML();
56+
const styles: string = markdownEngine.getStyles();
5757
const { title, url, lang, author, votes } = solution;
5858
const head: string = markdownEngine.render(`# [${title}](${url})`);
5959
const auth: string = `[${author}](https://leetcode.com/${author}/)`;

‎src/webview/markdownEngine.ts‎

Lines changed: 72 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -7,39 +7,70 @@ import * as os from "os";
77
import * as path from "path";
88
import * as vscode from "vscode";
99
import { leetCodeChannel } from "../leetCodeChannel";
10+
import { isWindows } from "../utils/osUtils";
1011

11-
class MarkdownEngine {
12+
class MarkdownEngine implements vscode.Disposable {
1213

13-
private readonly engine: MarkdownIt;
14-
private readonly extRoot: string; // root path of vscode built-in markdown extension
14+
private engine: MarkdownIt;
15+
private config: MarkdownConfiguration;
16+
private listener: vscode.Disposable;
1517

1618
public constructor() {
17-
this.engine = this.initEngine();
18-
this.extRoot = path.join(vscode.env.appRoot, "extensions", "markdown-language-features");
19+
this.reload();
20+
this.listener = vscode.workspace.onDidChangeConfiguration((event: vscode.ConfigurationChangeEvent) => {
21+
if (event.affectsConfiguration("markdown")) {
22+
this.reload();
23+
}
24+
}, this);
1925
}
2026

2127
public get localResourceRoots(): vscode.Uri[] {
22-
return [vscode.Uri.file(path.join(this.extRoot, "media"))];
28+
return [vscode.Uri.file(path.join(this.config.extRoot, "media"))];
2329
}
2430

25-
public get styles(): vscode.Uri[] {
26-
try {
27-
const stylePaths: string[] = require(path.join(this.extRoot, "package.json"))["contributes"]["markdown.previewStyles"];
28-
return stylePaths.map((p: string) => vscode.Uri.file(path.join(this.extRoot, p)).with({ scheme: "vscode-resource" }));
29-
} catch (error) {
30-
leetCodeChannel.appendLine("[Error] Fail to load built-in markdown style file.");
31-
return [];
32-
}
31+
public dispose(): void {
32+
this.listener.dispose();
3333
}
3434

35-
public getStylesHTML(): string {
36-
return this.styles.map((style: vscode.Uri) => `<link rel="stylesheet" type="text/css" href="${style.toString()}">`).join(os.EOL);
35+
public reload(): void {
36+
this.engine = this.initEngine();
37+
this.config = new MarkdownConfiguration();
3738
}
3839

3940
public render(md: string, env?: any): string {
4041
return this.engine.render(md, env);
4142
}
4243

44+
public getStyles(): string {
45+
return [
46+
this.getBuiltinStyles(),
47+
this.getSettingsStyles(),
48+
].join(os.EOL);
49+
}
50+
51+
private getBuiltinStyles(): string {
52+
let styles: vscode.Uri[] = [];
53+
try {
54+
const stylePaths: string[] = require(path.join(this.config.extRoot, "package.json"))["contributes"]["markdown.previewStyles"];
55+
styles = stylePaths.map((p: string) => vscode.Uri.file(path.join(this.config.extRoot, p)).with({ scheme: "vscode-resource" }));
56+
} catch (error) {
57+
leetCodeChannel.appendLine("[Error] Fail to load built-in markdown style file.");
58+
}
59+
return styles.map((style: vscode.Uri) => `<link rel="stylesheet" type="text/css" href="${style.toString()}">`).join(os.EOL);
60+
}
61+
62+
private getSettingsStyles(): string {
63+
return [
64+
`<style>`,
65+
`body {`,
66+
` ${this.config.fontFamily ? `font-family: ${this.config.fontFamily};` : ``}`,
67+
` ${isNaN(this.config.fontSize) ? `` : `font-size: ${this.config.fontSize}px;`}`,
68+
` ${isNaN(this.config.lineHeight) ? `` : `line-height: ${this.config.lineHeight};`}`,
69+
`}`,
70+
`</style>`,
71+
].join(os.EOL);
72+
}
73+
4374
private initEngine(): MarkdownIt {
4475
const md: MarkdownIt = new MarkdownIt({
4576
linkify: true,
@@ -107,4 +138,29 @@ class MarkdownEngine {
107138
}
108139
}
109140

141+
// tslint:disable-next-line: max-classes-per-file
142+
class MarkdownConfiguration {
143+
144+
public readonly extRoot: string; // root path of vscode built-in markdown extension
145+
public readonly lineHeight: number;
146+
public readonly fontSize: number;
147+
public readonly fontFamily: string;
148+
149+
public constructor() {
150+
const markdownConfig: vscode.WorkspaceConfiguration = vscode.workspace.getConfiguration("markdown");
151+
this.extRoot = path.join(vscode.env.appRoot, "extensions", "markdown-language-features");
152+
this.lineHeight = Math.max(0.6, +markdownConfig.get<number>("preview.lineHeight", NaN));
153+
this.fontSize = Math.max(8, +markdownConfig.get<number>("preview.fontSize", NaN));
154+
this.fontFamily = this.resolveFontFamily(markdownConfig);
155+
}
156+
157+
private resolveFontFamily(config: vscode.WorkspaceConfiguration): string {
158+
let fontFamily: string = config.get<string>("preview.fontFamily", "");
159+
if (isWindows() && fontFamily === config.inspect<string>("preview.fontFamily")!.defaultValue) {
160+
fontFamily = `${fontFamily}, 'Microsoft Yahei UI'`;
161+
}
162+
return fontFamily;
163+
}
164+
}
165+
110166
export const markdownEngine: MarkdownEngine = new MarkdownEngine();

0 commit comments

Comments
 (0)