diff --git a/.prettierrc.json b/.prettierrc.json
new file mode 100644
index 00000000..236725f6
--- /dev/null
+++ b/.prettierrc.json
@@ -0,0 +1,5 @@
+{
+ "useTabs": true,
+ "singleQuote": true,
+ "printWidth": 92
+}
\ No newline at end of file
diff --git a/webview-sample/src/extension.ts b/webview-sample/src/extension.ts
index 5a80e6dc..c8403708 100644
--- a/webview-sample/src/extension.ts
+++ b/webview-sample/src/extension.ts
@@ -2,164 +2,177 @@ import * as path from 'path';
import * as vscode from 'vscode';
const cats = {
- 'Coding Cat': 'https://media.giphy.com/media/JIX9t2j0ZTN9S/giphy.gif',
- 'Compiling Cat': 'https://media.giphy.com/media/mlvseq9yvZhba/giphy.gif',
- 'Testing Cat': 'https://media.giphy.com/media/3oriO0OEd9QIDdllqo/giphy.gif'
+ 'Coding Cat': 'https://media.giphy.com/media/JIX9t2j0ZTN9S/giphy.gif',
+ 'Compiling Cat': 'https://media.giphy.com/media/mlvseq9yvZhba/giphy.gif',
+ 'Testing Cat': 'https://media.giphy.com/media/3oriO0OEd9QIDdllqo/giphy.gif'
};
export function activate(context: vscode.ExtensionContext) {
+ context.subscriptions.push(
+ vscode.commands.registerCommand('catCoding.start', () => {
+ CatCodingPanel.createOrShow(context.extensionPath);
+ })
+ );
- context.subscriptions.push(vscode.commands.registerCommand('catCoding.start', () => {
- CatCodingPanel.createOrShow(context.extensionPath);
- }));
+ context.subscriptions.push(
+ vscode.commands.registerCommand('catCoding.doRefactor', () => {
+ if (CatCodingPanel.currentPanel) {
+ CatCodingPanel.currentPanel.doRefactor();
+ }
+ })
+ );
- context.subscriptions.push(vscode.commands.registerCommand('catCoding.doRefactor', () => {
- if (CatCodingPanel.currentPanel) {
- CatCodingPanel.currentPanel.doRefactor();
- }
- }));
-
- if (vscode.window.registerWebviewPanelSerializer) {
- // Make sure we register a serializer in activation event
- vscode.window.registerWebviewPanelSerializer(CatCodingPanel.viewType, {
- async deserializeWebviewPanel(webviewPanel: vscode.WebviewPanel, state: any) {
- console.log(`Got state: ${state}`);
- CatCodingPanel.revive(webviewPanel, context.extensionPath);
- }
- });
- }
+ if (vscode.window.registerWebviewPanelSerializer) {
+ // Make sure we register a serializer in activation event
+ vscode.window.registerWebviewPanelSerializer(CatCodingPanel.viewType, {
+ async deserializeWebviewPanel(webviewPanel: vscode.WebviewPanel, state: any) {
+ console.log(`Got state: ${state}`);
+ CatCodingPanel.revive(webviewPanel, context.extensionPath);
+ }
+ });
+ }
}
/**
* Manages cat coding webview panels
*/
class CatCodingPanel {
- /**
- * Track the currently panel. Only allow a single panel to exist at a time.
- */
- public static currentPanel: CatCodingPanel | undefined;
+ /**
+ * Track the currently panel. Only allow a single panel to exist at a time.
+ */
+ public static currentPanel: CatCodingPanel | undefined;
- public static readonly viewType = 'catCoding';
+ public static readonly viewType = 'catCoding';
- private readonly _panel: vscode.WebviewPanel;
- private readonly _extensionPath: string;
- private _disposables: vscode.Disposable[] = [];
+ private readonly _panel: vscode.WebviewPanel;
+ private readonly _extensionPath: string;
+ private _disposables: vscode.Disposable[] = [];
- public static createOrShow(extensionPath: string) {
- const column = vscode.window.activeTextEditor ? vscode.window.activeTextEditor.viewColumn : undefined;
+ public static createOrShow(extensionPath: string) {
+ const column = vscode.window.activeTextEditor
+ ? vscode.window.activeTextEditor.viewColumn
+ : undefined;
- // If we already have a panel, show it.
- if (CatCodingPanel.currentPanel) {
- CatCodingPanel.currentPanel._panel.reveal(column);
- return;
- }
+ // If we already have a panel, show it.
+ if (CatCodingPanel.currentPanel) {
+ CatCodingPanel.currentPanel._panel.reveal(column);
+ return;
+ }
- // Otherwise, create a new panel.
- const panel = vscode.window.createWebviewPanel(CatCodingPanel.viewType, "Cat Coding", column || vscode.ViewColumn.One, {
- // Enable javascript in the webview
- enableScripts: true,
+ // Otherwise, create a new panel.
+ const panel = vscode.window.createWebviewPanel(
+ CatCodingPanel.viewType,
+ 'Cat Coding',
+ column || vscode.ViewColumn.One,
+ {
+ // Enable javascript in the webview
+ enableScripts: true,
- // And restrict the webview to only loading content from our extension's `media` directory.
- localResourceRoots: [
- vscode.Uri.file(path.join(extensionPath, 'media'))
- ]
- });
+ // And restrict the webview to only loading content from our extension's `media` directory.
+ localResourceRoots: [vscode.Uri.file(path.join(extensionPath, 'media'))]
+ }
+ );
- CatCodingPanel.currentPanel = new CatCodingPanel(panel, extensionPath);
- }
+ CatCodingPanel.currentPanel = new CatCodingPanel(panel, extensionPath);
+ }
- public static revive(panel: vscode.WebviewPanel, extensionPath: string) {
- CatCodingPanel.currentPanel = new CatCodingPanel(panel, extensionPath);
- }
+ public static revive(panel: vscode.WebviewPanel, extensionPath: string) {
+ CatCodingPanel.currentPanel = new CatCodingPanel(panel, extensionPath);
+ }
- private constructor(
- panel: vscode.WebviewPanel,
- extensionPath: string
- ) {
- this._panel = panel;
- this._extensionPath = extensionPath;
+ private constructor(panel: vscode.WebviewPanel, extensionPath: string) {
+ this._panel = panel;
+ this._extensionPath = extensionPath;
- // Set the webview's initial html content
- this._update();
+ // Set the webview's initial html content
+ this._update();
- // Listen for when the panel is disposed
- // This happens when the user closes the panel or when the panel is closed programatically
- this._panel.onDidDispose(() => this.dispose(), null, this._disposables);
+ // Listen for when the panel is disposed
+ // This happens when the user closes the panel or when the panel is closed programatically
+ this._panel.onDidDispose(() => this.dispose(), null, this._disposables);
- // Update the content based on view changes
- this._panel.onDidChangeViewState(e => {
- if (this._panel.visible) {
- this._update()
- }
- }, null, this._disposables);
+ // Update the content based on view changes
+ this._panel.onDidChangeViewState(
+ e => {
+ if (this._panel.visible) {
+ this._update();
+ }
+ },
+ null,
+ this._disposables
+ );
- // Handle messages from the webview
- this._panel.webview.onDidReceiveMessage(message => {
- switch (message.command) {
- case 'alert':
- vscode.window.showErrorMessage(message.text);
- return;
- }
- }, null, this._disposables);
- }
+ // Handle messages from the webview
+ this._panel.webview.onDidReceiveMessage(
+ message => {
+ switch (message.command) {
+ case 'alert':
+ vscode.window.showErrorMessage(message.text);
+ return;
+ }
+ },
+ null,
+ this._disposables
+ );
+ }
- public doRefactor() {
- // Send a message to the webview webview.
- // You can send any JSON serializable data.
- this._panel.webview.postMessage({ command: 'refactor' });
- }
+ public doRefactor() {
+ // Send a message to the webview webview.
+ // You can send any JSON serializable data.
+ this._panel.webview.postMessage({ command: 'refactor' });
+ }
- public dispose() {
- CatCodingPanel.currentPanel = undefined;
+ public dispose() {
+ CatCodingPanel.currentPanel = undefined;
- // Clean up our resources
- this._panel.dispose();
+ // Clean up our resources
+ this._panel.dispose();
- while (this._disposables.length) {
- const x = this._disposables.pop();
- if (x) {
- x.dispose();
- }
- }
- }
+ while (this._disposables.length) {
+ const x = this._disposables.pop();
+ if (x) {
+ x.dispose();
+ }
+ }
+ }
- private _update() {
+ private _update() {
+ const z = 1 + 2;
+ // Vary the webview's content based on where it is located in the editor.
+ switch (this._panel.viewColumn) {
+ case vscode.ViewColumn.Two:
+ this._updateForCat('Compiling Cat');
+ return;
- const z = 1 + 2;
- // Vary the webview's content based on where it is located in the editor.
- switch (this._panel.viewColumn) {
- case vscode.ViewColumn.Two:
- this._updateForCat('Compiling Cat');
- return;
+ case vscode.ViewColumn.Three:
+ this._updateForCat('Testing Cat');
+ return;
- case vscode.ViewColumn.Three:
- this._updateForCat('Testing Cat');
- return;
+ case vscode.ViewColumn.One:
+ default:
+ this._updateForCat('Coding Cat');
+ return;
+ }
+ }
- case vscode.ViewColumn.One:
- default:
- this._updateForCat('Coding Cat');
- return;
- }
- }
+ private _updateForCat(catName: keyof typeof cats) {
+ this._panel.title = catName;
+ this._panel.webview.html = this._getHtmlForWebview(cats[catName]);
+ }
- private _updateForCat(catName: keyof typeof cats) {
- this._panel.title = catName;
- this._panel.webview.html = this._getHtmlForWebview(cats[catName]);
- }
+ private _getHtmlForWebview(catGif: string) {
+ // Local path to main script run in the webview
+ const scriptPathOnDisk = vscode.Uri.file(
+ path.join(this._extensionPath, 'media', 'main.js')
+ );
- private _getHtmlForWebview(catGif: string) {
+ // And the uri we use to load this script in the webview
+ const scriptUri = scriptPathOnDisk.with({ scheme: 'vscode-resource' });
- // Local path to main script run in the webview
- const scriptPathOnDisk = vscode.Uri.file(path.join(this._extensionPath, 'media', 'main.js'));
+ // Use a nonce to whitelist which scripts can be run
+ const nonce = getNonce();
- // And the uri we use to load this script in the webview
- const scriptUri = scriptPathOnDisk.with({ scheme: 'vscode-resource' });
-
- // Use a nonce to whitelist which scripts can be run
- const nonce = getNonce();
-
- return `
+ return `
@@ -180,14 +193,14 @@ class CatCodingPanel {
`;
- }
+ }
}
function getNonce() {
- let text = "";
- const possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
- for (let i = 0; i < 32; i++) {
- text += possible.charAt(Math.floor(Math.random() * possible.length));
- }
- return text;
+ let text = '';
+ const possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+ for (let i = 0; i < 32; i++) {
+ text += possible.charAt(Math.floor(Math.random() * possible.length));
+ }
+ return text;
}