-
Notifications
You must be signed in to change notification settings - Fork 16
/
Copy pathextension.js
125 lines (107 loc) · 2.97 KB
/
extension.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
// The module 'vscode' contains the VS Code extensibility API
// Import the module and reference it with the alias vscode in your code below
const vscode = require('vscode');
const findDiagram = require('./lib/find-diagram');
// this method is called when your extension is activated
// your extension is activated the very first time the command is executed
function activate(context) {
const registerCommand = vscode.commands.registerCommand;
let command = registerCommand('mermaidPreview.start', () => {
const _disposables = [];
const panel = vscode.window.createWebviewPanel(
'mermaidPreview',
'Mermaid Preview',
vscode.ViewColumn.Two,
{
enableScripts: true,
}
);
const getContent = () => {
const config = vscode.workspace.getConfiguration('mermaid');
const configString = JSON.stringify(config);
const faBase = panel.webview.asWebviewUri(
vscode.Uri.file(
context.asAbsolutePath(
'previewer/dist/vendor/font-awesome/css/font-awesome.min.css'
)
)
);
const jsUrl = panel.webview.asWebviewUri(
vscode.Uri.file(context.asAbsolutePath('previewer/dist/index.js'))
);
return `
<!DOCTYPE html>
<html>
<head>
<base href="">
<link rel="stylesheet" href="${faBase}">
<script>
window._config = JSON.parse('${configString}');
</script>
</head>
<body>
<div id="root"></div>
<script src="${jsUrl}" />
</body>
</html>
`;
};
const previewHandler = () => {
const editor = vscode.window.activeTextEditor;
const text = editor.document.getText();
const cursor = editor.document.offsetAt(editor.selection.anchor);
const diagram = /\.mmd$/.test(editor.document.fileName)
? text
: findDiagram(text, cursor);
panel.webview.postMessage({
diagram,
});
};
vscode.workspace.onDidChangeTextDocument(
(e) => {
if (e.document === vscode.window.activeTextEditor.document) {
previewHandler();
}
},
null,
_disposables
);
vscode.workspace.onDidChangeConfiguration(
(e) => {
panel.webview.html = getContent();
},
null,
_disposables
);
vscode.window.onDidChangeTextEditorSelection(
(e) => {
if (e.textEditor === vscode.window.activeTextEditor) {
previewHandler();
}
},
null,
_disposables
);
panel.onDidDispose(
() => {
console.log('panel closed');
while (_disposables.length) {
const item = _disposables.pop();
if (item) {
item.dispose();
}
}
},
null,
context.subscriptions
);
panel.webview.html = getContent();
});
context.subscriptions.push(command);
}
exports.activate = activate;
// this method is called when your extension is deactivated
function deactivate() {
console.log('deactivated');
}
exports.deactivate = deactivate;