- fixes: slash as last char would add it to the front, too

- adds word-wrap to inputBox messages
- adds whether file or folder is going to be created
This commit is contained in:
Till Salinger 2018-02-16 12:39:18 +01:00
parent 054e575037
commit 7e2e9c9b2c
3 changed files with 25 additions and 33 deletions

View file

@ -84,7 +84,7 @@
text-align: right;
}
.monaco-inputbox-container .monaco-inputbox-message, .monaco-inputbox-ellipsis-right, .monaco-inputbox-ellipsis-left {
.monaco-inputbox-container .monaco-inputbox-message {
display: inline-block;
overflow: hidden;
text-align: left;
@ -101,16 +101,6 @@
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;

View file

@ -297,7 +297,7 @@ export class InputBox extends Widget {
this.input.style.width = width + 'px';
}
public showMessage(message: IMessage, opts?: IShowMessageOptions): void {
public showMessage(message: IMessage, force?: boolean): void {
this.message = message;
dom.removeClass(this.element, 'idle');
@ -321,9 +321,8 @@ export class InputBox extends Widget {
aria.alert(alertText);
if (this.hasFocus() || opts && opts.force) {
const ellipsis = opts && opts.ellipsis;
this._showMessage(ellipsis);
if (this.hasFocus() || force) {
this._showMessage();
}
}
@ -377,7 +376,7 @@ export class InputBox extends Widget {
}
}
private _showMessage(useEllipsis?: EllipsisType): void {
private _showMessage(): void {
if (!this.contextViewProvider || !this.message) {
return;
}
@ -394,14 +393,9 @@ 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
className: 'monaco-inputbox-message'
};
const spanElement = (this.message.formatContent
@ -412,6 +406,7 @@ export class InputBox extends Widget {
const styles = this.stylesForType(this.message.type);
spanElement.style.backgroundColor = styles.background ? styles.background.toString() : null;
spanElement.style.border = styles.border ? `1px solid ${styles.border}` : null;
spanElement.style.wordWrap = 'break-word';
dom.append(div, spanElement);

View file

@ -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, MessageType, EllipsisType } from 'vs/base/browser/ui/inputbox/inputBox';
import { InputBox, MessageType } 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';
@ -309,16 +309,7 @@ export class FileRenderer implements IRenderer {
}
}),
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 });
}
}
displayCurrentPath(inputBox, initialRelPath, fileKind);
}),
DOM.addDisposableListener(inputBox.inputElement, DOM.EventType.BLUR, () => {
done(inputBox.isInputValid(), true);
@ -329,6 +320,22 @@ export class FileRenderer implements IRenderer {
}
}
function displayCurrentPath(inputBox: InputBox, initialRelPath: string, fileKind: FileKind) {
const value = inputBox.value;
if (inputBox.validate()) {
if (value && value.search(/[\\/]/) !== -1) { // only show if there's a slash
const newPath = replaceWithNativeSep(paths.join(initialRelPath, value));
const fileType: string = FileKind[fileKind].toLowerCase();
inputBox.showMessage({
type: MessageType.INFO,
content: nls.localize('constructedPath', "Create **{0}** in **{1}**", fileType, newPath),
formatContent: true
});
}
}
}
function replaceWithNativeSep(str: string) {
if (!str) { return str; }
return str.replace(/[\\/]/g, paths.nativeSep);