development/vscode
development/vscode
1
0
Fork 0
mirror of https://github.com/Microsoft/vscode synced 2024-10-30 01:37:20 +00:00
Code Issues Projects Releases Packages Wiki Activity

fadeIn/Out editor message widget

Browse source
This commit is contained in:
Johannes Rieken 2017-02-23 12:55:15 +01:00
parent 85b3aa52fa
commit 4d24398faf
2 changed files with 34 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
src/vs/editor/contrib/goToDeclaration/browser/messageController.css
View file

@ -7,6 +7,22 @@
padding-bottom: 8px;
}
@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}
.monaco-editor .monaco-editor-overlaymessage.fadeIn {
animation: fadeIn 150ms ease-out;
}
@keyframes fadeOut {
from { opacity: 1; }
to { opacity: 0; }
}
.monaco-editor .monaco-editor-overlaymessage.fadeOut {
animation: fadeOut 100ms ease-out;
}
.monaco-editor .monaco-editor-overlaymessage .message {
padding: 1px 4px;
background: #1382CE;

19
src/vs/editor/contrib/goToDeclaration/browser/messageController.ts
View file

@ -33,6 +33,7 @@ export class MessageController {
private _editor: ICodeEditor;
private _visible: IContextKey<boolean>;
private _messageWidget: MessageWidget;
private _messageListeners: IDisposable[] = [];
constructor(
@ -50,8 +51,9 @@ export class MessageController {
showMessage(message: string, position: editorCommon.IPosition): void {
this._visible.set(true);
dispose(this._messageWidget);
this._messageListeners = dispose(this._messageListeners);
this._messageListeners.push(new MessageWidget(this._editor, position, message));
this._messageWidget = new MessageWidget(this._editor, position, message);
// close on blur, cursor, model change, dispose
this._messageListeners.push(any<any>(
@ -85,6 +87,7 @@ export class MessageController {
closeMessage(): void {
this._visible.reset();
this._messageListeners = dispose(this._messageListeners);
this._messageListeners.push(MessageWidget.fadeOut(this._messageWidget));
}
}
@ -110,6 +113,19 @@ class MessageWidget implements IContentWidget {
private _position: editorCommon.IPosition;
private _domNode: HTMLDivElement;
static fadeOut(messageWidget: MessageWidget): IDisposable {
let handle: number;
const dispose = () => {
messageWidget.dispose();
clearTimeout(handle);
messageWidget.getDomNode().removeEventListener('animationend', dispose);
};
handle = setTimeout(dispose, 110);
messageWidget.getDomNode().addEventListener('animationend', dispose);
messageWidget.getDomNode().classList.add('fadeOut');
return { dispose };
}
constructor(editor: ICodeEditor, { lineNumber, column }: editorCommon.IPosition, text: string) {
this._editor = editor;
@ -130,6 +146,7 @@ class MessageWidget implements IContentWidget {
this._domNode.appendChild(anchor);
this._editor.addContentWidget(this);
this._domNode.classList.add('fadeIn');
}
dispose() {