import * as fs from 'fs' ; import * as path from 'path' ; import * as vscode from 'vscode' ; /**
 * Manages webview panels
 */ class WebPanel { /**
     * Track the currently panel. Only allow a single panel to exist at a time.
     */ public static currentPanel : WebPanel | undefined ; private static readonly viewType = 'angular' ; private readonly panel : vscode . WebviewPanel ; private readonly extensionPath : string ; private readonly builtAppFolder : string ; private disposables : vscode . Disposable [ ] = [ ] ; public static createOrShow ( extensionPath ) { const column = vscode . window . activeTextEditor ? vscode . window . activeTextEditor . viewColumn : undefined ; if ( WebPanel . currentPanel ) { WebPanel . currentPanel . panel . reveal ( column ) ; } else { WebPanel . currentPanel = new WebPanel ( extensionPath , column || vscode . ViewColumn . One ) ; } return WebPanel . currentPanel ; } private constructor ( extensionPath , column ) { this . extensionPath = extensionPath ; this . builtAppFolder = 'dist' ; this . panel = vscode . window . createWebviewPanel ( WebPanel . viewType , 'My Angular Webview' , column , { enableScripts : true , localResourceRoots : [ vscode . Uri . file ( path . join ( this . extensionPath , this . builtAppFolder ) ) ] } ) ; this . panel . webview . html = this . _getHtmlForWebview ( ) ; this . panel . onDidDispose ( ( ) => this . dispose ( ) , null , this . disposables ) ; this . panel . webview . onDidReceiveMessage ( ( message ) => { switch ( message . command ) { case 'alert' : vscode . window . showErrorMessage ( message . text ) ; return ; } } , null , this . disposables ) ; } public dispose ( ) { WebPanel . currentPanel = undefined ; this . panel . dispose ( ) ; while ( this . disposables . length ) { const x = this . disposables . pop ( ) ; if ( x ) { x . dispose ( ) ; } } } /**
     * Returns html of the start page (index.html)
     */ private _getHtmlForWebview ( ) { const appDistPath = path . join ( this . extensionPath , 'dist' ) ; const appDistPathUri = vscode . Uri . file ( appDistPath ) ; const baseUri = this . panel . webview . asWebviewUri ( appDistPathUri ) ; const indexPath = path . join ( appDistPath , 'index.html' ) ; let indexHtml = fs . readFileSync ( indexPath , { encoding : 'utf8' } ) ; indexHtml = indexHtml . replace ( '<base href="/">' , `<base href="${ String ( baseUri ) }/">` ) ; return indexHtml ; } } param context export function activate ( context ) { context . subscriptions . push ( vscode . commands . registerCommand ( 'angular-webview.start' , ( ) => { WebPanel . createOrShow ( context . extensionPath ) ; } ) ) ; }