- shows the user the path while typing (when a slash has been typed)

- text-overflow handled by elliipsis appearing at the beginning of path

src/vs/base/browser/ui/inputbox/inputBox.css

@@ -84,7 +84,7 @@
 	text-align: right;
 }
 
-.monaco-inputbox-container .monaco-inputbox-message {
+.monaco-inputbox-container .monaco-inputbox-message, .monaco-inputbox-ellipsis-right, .monaco-inputbox-ellipsis-left {
 	display: inline-block;
 	overflow: hidden;
 	text-align: left;
@@ -101,6 +101,16 @@
 	margin-top: -1px;
 }
 
+.monaco-inputbox-ellipsis-right, .monaco-inputbox-ellipsis-left {
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+
+.monaco-inputbox-ellipsis-left {
+	direction: rtl;
+}
+
 /* Action bar support */
 .monaco-inputbox .monaco-action-bar {
 	position: absolute;

src/vs/base/browser/ui/inputbox/inputBox.ts

@@ -67,6 +67,20 @@ export interface IRange {
 	end: number;
 }
 
+export interface IShowMessageOptions {
+	force?: boolean;
+	ellipsis?: EllipsisType;
+}
+
+/**
+ * Determines whether the ellipsis appears at the left or right side of the string
+*/
+export enum EllipsisType {
+	NONE = 1,
+	LEFT = 2,
+	RIGHT = 3
+}
+
 const defaultOpts = {
 	inputBackground: Color.fromHex('#3C3C3C'),
 	inputForeground: Color.fromHex('#CCCCCC'),
@@ -283,7 +297,7 @@ export class InputBox extends Widget {
 		this.input.style.width = width + 'px';
 	}
 
-	public showMessage(message: IMessage, force?: boolean): void {
+	public showMessage(message: IMessage, opts?: IShowMessageOptions): void {
 		this.message = message;
 
 		dom.removeClass(this.element, 'idle');
@@ -307,8 +321,9 @@ export class InputBox extends Widget {
 
 		aria.alert(alertText);
 
-		if (this.hasFocus() || force) {
-			this._showMessage();
+		if (this.hasFocus() || opts && opts.force) {
+			const ellipsis = opts && opts.ellipsis;
+			this._showMessage(ellipsis);
 		}
 	}
 
@@ -362,7 +377,7 @@ export class InputBox extends Widget {
 		}
 	}
 
-	private _showMessage(): void {
+	private _showMessage(useEllipsis?: EllipsisType): void {
 		if (!this.contextViewProvider || !this.message) {
 			return;
 		}
@@ -379,9 +394,14 @@ export class InputBox extends Widget {
 				div = dom.append(container, $('.monaco-inputbox-container'));
 				layout();
 
+				let className: string = 'monaco-inputbox-message';
+				if (useEllipsis && useEllipsis !== EllipsisType.NONE) {
+					className = useEllipsis === EllipsisType.LEFT ? 'monaco-inputbox-ellipsis-left' : 'monaco-inputbox-ellipsis-right';
+				}
+
 				const renderOptions: RenderOptions = {
 					inline: true,
-					className: 'monaco-inputbox-message'
+					className
 				};
 
 				const spanElement = (this.message.formatContent

src/vs/workbench/parts/files/electron-browser/views/explorerViewer.ts

@@ -16,7 +16,7 @@ import resources = require('vs/base/common/resources');
 import errors = require('vs/base/common/errors');
 import { IAction, ActionRunner as BaseActionRunner, IActionRunner } from 'vs/base/common/actions';
 import comparers = require('vs/base/common/comparers');
-import { InputBox } from 'vs/base/browser/ui/inputbox/inputBox';
+import { InputBox, MessageType, EllipsisType } from 'vs/base/browser/ui/inputbox/inputBox';
 import { isMacintosh, isLinux } from 'vs/base/common/platform';
 import glob = require('vs/base/common/glob');
 import { FileLabel, IFileLabelOptions } from 'vs/workbench/browser/labels';
@@ -296,6 +296,7 @@ export class FileRenderer implements IRenderer {
 			}, 0);
 		});
 
+		const initialRelPath: string = relative(stat.root.resource.fsPath, stat.parent.resource.fsPath);
 		const toDispose = [
 			inputBox,
 			DOM.addStandardDisposableListener(inputBox.inputElement, DOM.EventType.KEY_DOWN, (e: IKeyboardEvent) => {
@@ -307,6 +308,18 @@ export class FileRenderer implements IRenderer {
 					done(false, false);
 				}
 			}),
+			DOM.addStandardDisposableListener(inputBox.inputElement, DOM.EventType.KEY_UP, (e: IKeyboardEvent) => {
+				if (inputBox.validate()) {
+					if (inputBox.value && inputBox.value.search(/[\\/]/) !== -1) {	// only show if there's a slash
+						const newPath = replaceWithNativeSep(paths.join(initialRelPath, inputBox.value));
+						inputBox.showMessage({
+							type: MessageType.INFO,
+							content: newPath,
+							formatContent: true
+						}, { force: false, ellipsis: EllipsisType.LEFT });
+					}
+				}
+			}),
 			DOM.addDisposableListener(inputBox.inputElement, DOM.EventType.BLUR, () => {
 				done(inputBox.isInputValid(), true);
 			}),
@@ -316,6 +329,11 @@ export class FileRenderer implements IRenderer {
 	}
 }
 
+function replaceWithNativeSep(str: string) {
+	if (!str) { return str; }
+	return str.replace(/[\\/]/g, paths.nativeSep);
+}
+
 // Explorer Accessibility Provider
 export class FileAccessibilityProvider implements IAccessibilityProvider {