forked from DonJayamanne/pythonVSCode
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathwebPanel.ts
More file actions
126 lines (110 loc) · 4.91 KB
/
webPanel.ts
File metadata and controls
126 lines (110 loc) · 4.91 KB
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
126
// Copyright (c) Microsoft Corporation. All rights reserved.
// Licensed under the MIT License.
'use strict';
import '../../common/extensions';
import * as fs from 'fs-extra';
import * as path from 'path';
import { Uri, ViewColumn, WebviewPanel, window } from 'vscode';
import * as localize from '../../common/utils/localize';
import { IServiceContainer } from '../../ioc/types';
import { IDisposableRegistry } from '../types';
import { IWebPanel, IWebPanelMessageListener, WebPanelMessage } from './types';
export class WebPanel implements IWebPanel {
private listener: IWebPanelMessageListener;
private panel: WebviewPanel | undefined;
private loadPromise: Promise<void>;
private disposableRegistry: IDisposableRegistry;
private rootPath: string;
constructor(
serviceContainer: IServiceContainer,
listener: IWebPanelMessageListener,
title: string,
mainScriptPath: string,
embeddedCss?: string) {
this.disposableRegistry = serviceContainer.get<IDisposableRegistry>(IDisposableRegistry);
this.listener = listener;
this.rootPath = path.dirname(mainScriptPath);
this.panel = window.createWebviewPanel(
title.toLowerCase().replace(' ', ''),
title,
{viewColumn: ViewColumn.Two, preserveFocus: true},
{
enableScripts: true,
retainContextWhenHidden: true,
localResourceRoots: [Uri.file(this.rootPath)]
});
this.loadPromise = this.load(mainScriptPath, embeddedCss);
}
public async show() {
await this.loadPromise;
if (this.panel) {
this.panel.reveal(ViewColumn.Two, true);
}
}
public isVisible() : boolean {
return this.panel ? this.panel.visible : false;
}
public postMessage(message: WebPanelMessage) {
if (this.panel && this.panel.webview) {
this.panel.webview.postMessage(message);
}
}
private async load(mainScriptPath: string, embeddedCss?: string) {
if (this.panel) {
if (await fs.pathExists(mainScriptPath)) {
// Call our special function that sticks this script inside of an html page
// and translates all of the paths to vscode-resource URIs
this.panel.webview.html = this.generateReactHtml(mainScriptPath, embeddedCss);
// Reset when the current panel is closed
this.disposableRegistry.push(this.panel.onDidDispose(() => {
this.panel = undefined;
this.listener.dispose();
}));
this.disposableRegistry.push(this.panel.webview.onDidReceiveMessage(message => {
// Pass the message onto our listener
this.listener.onMessage(message.type, message.payload);
}));
} else {
// Indicate that we can't load the file path
const badPanelString = localize.DataScience.badWebPanelFormatString();
this.panel.webview.html = badPanelString.format(mainScriptPath);
}
}
}
private generateReactHtml(mainScriptPath: string, embeddedCss?: string) {
const uriBasePath = Uri.file(`${path.dirname(mainScriptPath)}/`);
const uriPath = Uri.file(mainScriptPath);
const uriBase = uriBasePath.with({ scheme: 'vscode-resource'});
const uri = uriPath.with({ scheme: 'vscode-resource' });
const locDatabase = JSON.stringify(localize.getCollection());
const style = embeddedCss ? embeddedCss : '';
return `<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<title>React App</title>
<base href="${uriBase}"/>
<style type="text/css">
${style}
</style>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<script type="text/javascript">
function resolvePath(relativePath) {
if (relativePath && relativePath[0] == '.' && relativePath[1] != '.') {
return "${uriBase}" + relativePath.substring(1);
}
return "${uriBase}" + relativePath;
}
function getLocStrings() {
return ${locDatabase};
}
</script>
<script type="text/javascript" src="${uri}"></script></body>
</html>`;
}
}