several polish fixes

pimp up UI
hide UI when install count is not available
move installCount to galleryInformation
sort by name when install count is equal

src/vs/workbench/parts/extensions/common/extensions.ts

@@ -15,7 +15,6 @@ export interface IExtensionManifest {
 	version: string;
 	displayName?: string;
 	description?: string;
-	installs: number;
 }
 
 export interface IGalleryInformation {
@@ -24,6 +23,7 @@ export interface IGalleryInformation {
 	downloadUrl: string;
 	publisherId: string;
 	publisherDisplayName: string;
+	installCount: number;
 	date: string;
 }
 

src/vs/workbench/parts/extensions/electron-browser/extensionsQuickOpen.ts

@@ -8,6 +8,7 @@ import 'vs/css!./media/extensions';
 import nls = require('vs/nls');
 import { IDisposable, disposeAll } from 'vs/base/common/lifecycle';
 import { TPromise } from 'vs/base/common/winjs.base';
+import { isNumber } from 'vs/base/common/types';
 import * as dom from 'vs/base/browser/dom';
 import Severity from 'vs/base/common/severity';
 import { onUnexpectedError } from 'vs/base/common/errors';
@@ -56,7 +57,7 @@ interface ITemplateData {
 	root: HTMLElement;
 	displayName: HighlightedLabel;
 	version: HTMLElement;
-	installs: HTMLElement;
+	installCount: HTMLElement;
 	author: HTMLElement;
 	actionbar: ActionBar;
 	description: HighlightedLabel;
@@ -80,7 +81,15 @@ function extensionEquals(one: IExtension, other: IExtension): boolean {
 }
 
 function extensionEntryCompare(one: IExtensionEntry, other: IExtensionEntry): number {
-	return other.extension.installs - one.extension.installs;
+	const oneInstallCount = one.extension.galleryInformation ? one.extension.galleryInformation.installCount : 0;
+	const otherInstallCount = other.extension.galleryInformation ? other.extension.galleryInformation.installCount : 0;
+	const diff = otherInstallCount - oneInstallCount;
+
+	if (diff !== 0) {
+		return diff;
+	}
+
+	return one.extension.displayName.localeCompare(other.extension.displayName);
 }
 
 class OpenInGalleryAction extends Action {
@@ -175,7 +184,7 @@ class Renderer implements IRenderer<IExtensionEntry> {
 		const secondRow = dom.append(root, $('.row'));
 		const published = dom.append(firstRow, $('.published'));
 		const displayName = new HighlightedLabel(dom.append(firstRow, $('span.name')));
-		const installs = dom.append(firstRow, $('span.installs.octicon.octicon-cloud-download'));
+		const installCount = dom.append(firstRow, $('span.installCount'));
 		const version = dom.append(published, $('span.version'));
 		const author = dom.append(published, $('span.author'));
 
@@ -184,7 +193,7 @@ class Renderer implements IRenderer<IExtensionEntry> {
 			author,
 			displayName,
 			version,
-			installs,
+			installCount,
 			actionbar: new ActionBar(dom.append(secondRow, $('.actions'))),
 			description: new HighlightedLabel(dom.append(secondRow, $('span.description'))),
 			disposables: []
@@ -195,6 +204,7 @@ class Renderer implements IRenderer<IExtensionEntry> {
 		const extension = entry.extension;
 		const date = extension.galleryInformation ? extension.galleryInformation.date : null;
 		const publisher = extension.galleryInformation ? extension.galleryInformation.publisherDisplayName : extension.publisher;
+		const installCount = extension.galleryInformation ? extension.galleryInformation.installCount : null;
 		const actionOptions = { icon: true, label: false };
 
 		const updateActions = () => {
@@ -237,14 +247,23 @@ class Renderer implements IRenderer<IExtensionEntry> {
 		data.displayName.set(extension.displayName, entry.highlights.displayName);
 		data.displayName.element.title = extension.name;
 		data.version.textContent = extension.version;
-		data.installs.textContent = String(extension.installs);
 
-		if (!extension.installs) {
-			data.installs.title = nls.localize('installCountZero', "{0} wasn't downloaded yet.", extension.displayName);
-		} else if (extension.installs === 1) {
-			data.installs.title = nls.localize('installCountOne', "{0} was downloaded once.", extension.displayName);
+		if (isNumber(installCount)) {
+			data.installCount.textContent = String(installCount);
+			dom.addClass(data.installCount, 'octicon');
+			dom.addClass(data.installCount, 'octicon-cloud-download');
+
+			if (!installCount) {
+				data.installCount.title = nls.localize('installCountZero', "{0} wasn't downloaded yet.", extension.displayName);
+			} else if (installCount === 1) {
+				data.installCount.title = nls.localize('installCountOne', "{0} was downloaded once.", extension.displayName);
+			} else {
+				data.installCount.title = nls.localize('installCountMultiple', "{0} was downloaded {1} times.", extension.displayName, installCount);
+			}
 		} else {
-			data.installs.title = nls.localize('installCountMultiple', "{0} was downloaded {1} times.", extension.displayName, extension.installs);
+			data.installCount.textContent = '';
+			dom.removeClass(data.installCount, 'octicon');
+			dom.removeClass(data.installCount, 'octicon-cloud-download');
 		}
 
 		data.author.textContent = publisher;

src/vs/workbench/parts/extensions/electron-browser/media/extensions.css

@@ -28,7 +28,7 @@
 	opacity: 0.6;
 }
 
-.quick-open-widget .extension .installs {
+.quick-open-widget .extension .installCount:not(:empty) {
 	margin-left: 6px;
 	padding: 1px 3px;
 	border-radius: 3px;
@@ -37,7 +37,7 @@
 	opacity: 0.7;
 }
 
-.quick-open-widget .extension .installs:before {
+.quick-open-widget .extension .installCount:not(:empty):before {
 	margin-right: 2px;
 }
 

src/vs/workbench/parts/extensions/node/extensionsService.ts

@@ -64,8 +64,7 @@ function createExtension(manifest: IExtensionManifest, galleryInformation?: IGal
 		displayName: manifest.displayName || manifest.name,
 		publisher: manifest.publisher,
 		version: manifest.version,
-		description: manifest.description || '',
-		installs: 0
+		description: manifest.description || ''
 	};
 
 	if (galleryInformation) {

src/vs/workbench/parts/extensions/node/vsoGalleryService.ts

@@ -120,13 +120,13 @@ export class GalleryService implements IGalleryService {
 					publisher: extension.publisher.publisherName,
 					version: extension.versions[0].version,
 					description: extension.shortDescription || '',
-					installs: this.extractInstalls(extension.statistics),
 					galleryInformation: {
 						galleryApiUrl: this.extensionsGalleryUrl,
 						id: extension.extensionId,
 						downloadUrl: `${ extension.versions[0].assetUri }/Microsoft.VisualStudio.Services.VSIXPackage?install=true`,
 						publisherId: extension.publisher.publisherId,
 						publisherDisplayName: extension.publisher.displayName,
+						installCount: this.extractInstalls(extension.statistics),
 						date: extension.versions[0].lastUpdated,
 					}
 				}));