Set style and zoom information

src/vs/code/electron-browser/processExplorer/media/processExplorer.css

@@ -15,7 +15,6 @@ body {
 	user-select: none;
 	font-family: -apple-system, BlinkMacSystemFont, "Segoe WPC", "Segoe UI", "HelveticaNeue-Light", "Ubuntu", "Droid Sans", sans-serif;
 	font-size: 13px;
-	background-color: #1e1e1e;
 	color: #cccccc;
 }
 

src/vs/code/electron-browser/processExplorer/processExplorer.js

@@ -107,7 +107,7 @@ function main() {
 		require([
 			'vs/code/electron-browser/processExplorer/processExplorerMain'
 		], function (processExplorer) {
-			processExplorer.startup();
+			processExplorer.startup(configuration.data);
 		});
 	});
 }

src/vs/code/electron-browser/processExplorer/processExplorerMain.ts

@@ -7,11 +7,13 @@
 
 import 'vs/css!./media/processExplorer';
 import { listProcesses, ProcessItem } from 'vs/base/node/ps';
-import { remote } from 'electron';
+import { remote, webFrame } from 'electron';
 import { repeat } from 'vs/base/common/strings';
 import { totalmem } from 'os';
 import product from 'vs/platform/node/product';
 import { localize } from 'vs/nls';
+import { ProcessExplorerData, ProcessExplorerStyles } from '../../../platform/issue/common/issue';
+import * as browser from 'vs/base/browser/browser';
 
 let selectedProcess: number;
 let processList: any[];
@@ -93,9 +95,49 @@ function updateProcessInfo(processList): void {
 	target.innerHTML = `<table>${tableHtml}</table>`;
 }
 
-export function startup() {
+function applyStyles(styles: ProcessExplorerStyles): void {
+	const styleTag = document.createElement('style');
+	const content: string[] = [];
 
-	setInterval(() => listProcesses(remote.process.pid).then(processes => {
+	if (styles.hoverBackground) {
+		content.push(`tr:hover  { background-color: ${styles.hoverBackground}; }`);
+	}
+
+	if (styles.hoverForeground) {
+		content.push(`tr:hover{ color: ${styles.hoverForeground}; }`);
+	}
+
+	if (styles.selectionBackground) {
+		content.push(`tr.selected { background.color: ${styles.selectionBackground}; }`);
+	}
+
+	if (styles.selectionForeground) {
+		content.push(`tr.selected { color: ${styles.selectionForeground}; }`);
+	}
+
+	if (styles.highlightForeground) {
+		content.push(`.highest { color: ${styles.highlightForeground}; }`);
+	}
+
+	styleTag.innerHTML = content.join('\n');
+	document.head.appendChild(styleTag);
+	document.body.style.color = styles.color;
+}
+
+function applyZoom(zoomLevel: number): void {
+	webFrame.setZoomLevel(zoomLevel);
+	browser.setZoomFactor(webFrame.getZoomFactor());
+	// See https://github.com/Microsoft/vscode/issues/26151
+	// Cannot be trusted because the webFrame might take some time
+	// until it really applies the new zoom level
+	browser.setZoomLevel(webFrame.getZoomLevel(), /*isTrusted*/false);
+}
+
+export function startup(data: ProcessExplorerData): void {
+	applyStyles(data.styles);
+	applyZoom(data.zoomLevel);
+
+	listProcesses(remote.process.pid).then(processes => {
 		processList = getProcessList(processes);
 		updateProcessInfo(processList);
 
@@ -113,5 +155,5 @@ export function startup() {
 				tableRow.classList.add('selected');
 			});
 		}
-	}), 1000);
+	});
 }

src/vs/platform/issue/common/issue.ts

@@ -11,16 +11,23 @@ import { ILocalExtension } from 'vs/platform/extensionManagement/common/extensio
 
 export const IIssueService = createDecorator<IIssueService>('issueService');
 
+export interface WindowStyles {
+	backgroundColor: string;
+	color: string;
+}
+export interface WindowData {
+	styles: WindowStyles;
+	zoomLevel: number;
+}
+
 export enum IssueType {
 	Bug,
 	PerformanceIssue,
 	FeatureRequest,
 	SettingsSearchIssue
 }
 
-export interface IssueReporterStyles {
-	backgroundColor: string;
-	color: string;
+export interface IssueReporterStyles extends WindowStyles {
 	textLinkColor: string;
 	inputBackground: string;
 	inputForeground: string;
@@ -35,9 +42,8 @@ export interface IssueReporterStyles {
 	sliderActiveColor: string;
 }
 
-export interface IssueReporterData {
+export interface IssueReporterData extends WindowData {
 	styles: IssueReporterStyles;
-	zoomLevel: number;
 	enabledExtensions: ILocalExtension[];
 	issueType?: IssueType;
 }
@@ -58,8 +64,20 @@ export interface ISettingsSearchIssueReporterData extends IssueReporterData {
 export interface IssueReporterFeatures {
 }
 
+export interface ProcessExplorerStyles extends WindowStyles {
+	hoverBackground: string;
+	hoverForeground: string;
+	selectionBackground: string;
+	selectionForeground: string;
+	highlightForeground: string;
+}
+
+export interface ProcessExplorerData extends WindowData {
+	styles: ProcessExplorerStyles;
+}
+
 export interface IIssueService {
 	_serviceBrand: any;
 	openReporter(data: IssueReporterData): TPromise<void>;
-	openProcessExplorer(): TPromise<void>;
+	openProcessExplorer(data: ProcessExplorerData): TPromise<void>;
 }

src/vs/platform/issue/common/issueIpc.ts

@@ -7,7 +7,7 @@
 
 import { TPromise } from 'vs/base/common/winjs.base';
 import { IChannel } from 'vs/base/parts/ipc/common/ipc';
-import { IIssueService, IssueReporterData } from './issue';
+import { IIssueService, IssueReporterData, ProcessExplorerData } from './issue';
 
 export interface IIssueChannel extends IChannel {
 	call(command: 'openIssueReporter', arg: IssueReporterData): TPromise<void>;
@@ -24,7 +24,7 @@ export class IssueChannel implements IIssueChannel {
 			case 'openIssueReporter':
 				return this.service.openReporter(arg);
 			case 'openProcessExplorer':
-				return this.service.openProcessExplorer();
+				return this.service.openProcessExplorer(arg);
 		}
 		return undefined;
 	}
@@ -40,7 +40,7 @@ export class IssueChannelClient implements IIssueService {
 		return this.channel.call('openIssueReporter', data);
 	}
 
-	openProcessExplorer(): TPromise<void> {
-		return this.channel.call('openProcessExplorer');
+	openProcessExplorer(data: ProcessExplorerData): TPromise<void> {
+		return this.channel.call('openProcessExplorer', data);
 	}
 }

src/vs/platform/issue/electron-main/issueService.ts

@@ -9,7 +9,7 @@ import { TPromise, Promise } from 'vs/base/common/winjs.base';
 import { localize } from 'vs/nls';
 import * as objects from 'vs/base/common/objects';
 import { parseArgs } from 'vs/platform/environment/node/argv';
-import { IIssueService, IssueReporterData, IssueReporterFeatures } from 'vs/platform/issue/common/issue';
+import { IIssueService, IssueReporterData, IssueReporterFeatures, ProcessExplorerData } from 'vs/platform/issue/common/issue';
 import { BrowserWindow, ipcMain, screen } from 'electron';
 import { ILaunchService } from 'vs/code/electron-main/launch';
 import { getPerformanceInfo, PerformanceInfo, getSystemInfo, SystemInfo } from 'vs/code/electron-main/diagnostics';
@@ -74,7 +74,7 @@ export class IssueService implements IIssueService {
 		return TPromise.as(null);
 	}
 
-	openProcessExplorer(): TPromise<void> {
+	openProcessExplorer(data: ProcessExplorerData): TPromise<void> {
 		// Create as singleton
 		if (!this._processExplorerWindow) {
 			const position = this.getWindowPosition(BrowserWindow.getFocusedWindow(), 800, 400);
@@ -86,7 +86,7 @@ export class IssueService implements IIssueService {
 				height: position.height,
 				x: position.x,
 				y: position.y,
-				backgroundColor: isMacintosh ? '#171717' : '#1E1E1E',
+				backgroundColor: data.styles.backgroundColor,
 				title: localize('processExplorer', "Process Explorer")
 			});
 
@@ -96,7 +96,8 @@ export class IssueService implements IIssueService {
 				appRoot: this.environmentService.appRoot,
 				nodeCachedDataDir: this.environmentService.nodeCachedDataDir,
 				windowId: this._processExplorerWindow.id,
-				machineId: this.machineId
+				machineId: this.machineId,
+				data
 			};
 
 			const environment = parseArgs(process.argv);

src/vs/workbench/services/issue/electron-browser/workbenchIssueService.ts

@@ -8,7 +8,7 @@
 import { IssueReporterStyles, IIssueService, IssueReporterData } from 'vs/platform/issue/common/issue';
 import { TPromise } from 'vs/base/common/winjs.base';
 import { ITheme, IThemeService } from 'vs/platform/theme/common/themeService';
-import { textLinkForeground, inputBackground, inputBorder, inputForeground, buttonBackground, buttonHoverBackground, buttonForeground, inputValidationErrorBorder, foreground, inputActiveOptionBorder, scrollbarSliderActiveBackground, scrollbarSliderBackground, scrollbarSliderHoverBackground } from 'vs/platform/theme/common/colorRegistry';
+import { textLinkForeground, inputBackground, inputBorder, inputForeground, buttonBackground, buttonHoverBackground, buttonForeground, inputValidationErrorBorder, foreground, inputActiveOptionBorder, scrollbarSliderActiveBackground, scrollbarSliderBackground, scrollbarSliderHoverBackground, editorBackground, editorForeground, listHoverBackground, listActiveSelectionBackground, listActiveSelectionForeground, listHoverForeground, listHighlightForeground } from 'vs/platform/theme/common/colorRegistry';
 import { SIDE_BAR_BACKGROUND } from 'vs/workbench/common/theme';
 import { IExtensionManagementService, IExtensionEnablementService, LocalExtensionType } from 'vs/platform/extensionManagement/common/extensionManagement';
 import { webFrame } from 'electron';
@@ -43,7 +43,20 @@ export class WorkbenchIssueService implements IWorkbenchIssueService {
 	}
 
 	openProcessExplorer(): TPromise<void> {
-		return this.issueService.openProcessExplorer();
+		const theme = this.themeService.getTheme();
+		const data = {
+			zoomLevel: webFrame.getZoomLevel(),
+			styles: {
+				backgroundColor: theme.getColor(editorBackground) && theme.getColor(editorBackground).toString(),
+				color: theme.getColor(editorForeground).toString(),
+				hoverBackground: theme.getColor(listHoverBackground) && theme.getColor(listHoverBackground).toString(),
+				hoverForeground: theme.getColor(listHoverForeground) && theme.getColor(listHoverForeground).toString(),
+				selectionBackground: theme.getColor(listActiveSelectionBackground) && theme.getColor(listActiveSelectionBackground).toString(),
+				selectionForeground: theme.getColor(listActiveSelectionForeground) && theme.getColor(listActiveSelectionForeground).toString(),
+				highlightForeground: theme.getColor(listHighlightForeground) && theme.getColor(listHighlightForeground).toString()
+			}
+		};
+		return this.issueService.openProcessExplorer(data);
 	}
 }