ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-02-16 10:58:30 -05:00
Code Issues Packages Projects Releases Wiki Activity

Merge from vscode 2b87545500dbc7899a493d69199aa4e061414ea0 (#5148)

Browse Source
This commit is contained in:
Anthony Dresser
2019-04-22 16:57:13 -07:00
committed by GitHub
parent 1b24dff738
commit 5e62229f25
15 changed files with 139 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
src/vs/base/browser/ui/dialog/dialog.ts
View File

@@ -6,7 +6,7 @@
import 'vs/css!./dialog';
import * as nls from 'vs/nls';
import { Disposable } from 'vs/base/common/lifecycle';
import { $, hide, show, EventHelper, clearNode, removeClasses, addClass, removeNode } from 'vs/base/browser/dom';
import { $, hide, show, EventHelper, clearNode, removeClasses, addClass, removeNode, isAncestor } from 'vs/base/browser/dom';
import { domEvent } from 'vs/base/browser/event';
import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
import { KeyCode, KeyMod } from 'vs/base/common/keyCodes';
@@ -39,6 +39,8 @@ export class Dialog extends Disposable {
private toolbarContainer: HTMLElement | undefined;
private buttonGroup: ButtonGroup | undefined;
private styles: IDialogStyles | undefined;
private focusToReturn: HTMLElement | undefined;
private iconRotatingInternal: any | undefined;
constructor(private container: HTMLElement, private message: string, private buttons: string[], private options: IDialogOptions) {
super();
@@ -72,6 +74,8 @@ export class Dialog extends Disposable {
}
async show(): Promise<number> {
this.focusToReturn = document.activeElement as HTMLElement;
return new Promise<number>((resolve) => {
if (!this.element || !this.buttonsContainer || !this.iconElement || !this.toolbarContainer) {
resolve(0);
@@ -135,6 +139,19 @@ export class Dialog extends Disposable {
}
}));
this._register(domEvent(this.element, 'focusout', false)((e: FocusEvent) => {
if (!!e.relatedTarget && !!this.element) {
if (!isAncestor(e.relatedTarget as HTMLElement, this.element)) {
this.focusToReturn = e.relatedTarget as HTMLElement;
if (e.target) {
(e.target as HTMLElement).focus();
EventHelper.stop(e, true);
}
}
}
}));
removeClasses(this.iconElement, 'icon-error', 'icon-warning', 'icon-info');
switch (this.options.type) {
@@ -146,6 +163,15 @@ export class Dialog extends Disposable {
break;
case 'pending':
addClass(this.iconElement, 'icon-pending');
let deg = 0;
this.iconRotatingInternal = setInterval(() => {
if (this.iconElement) {
this.iconElement.style.transform = `rotate(${deg}deg)`;
deg += 45; // 360 / 8
} else {
this.iconRotatingInternal = undefined;
}
}, 125 /** 1000 / 8 */);
break;
case 'none':
case 'info':
@@ -206,5 +232,14 @@ export class Dialog extends Disposable {
removeNode(this.modal);
this.modal = undefined;
}
if (this.iconRotatingInternal) {
this.iconRotatingInternal = undefined;
}
if (this.focusToReturn && isAncestor(this.focusToReturn, document.body)) {
this.focusToReturn.focus();
this.focusToReturn = undefined;
}
}
}

32
src/vs/base/browser/ui/dialog/pending-dark.svg
View File

@@ -1,31 +1,13 @@
<?xml version='1.0' standalone='no' ?>
<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='10px' height='10px'>
<style>
circle {
animation: ball 1.04s linear infinite;
}
circle:nth-child(2) { animation-delay: 0.13s; }
circle:nth-child(3) { animation-delay: 0.26s; }
circle:nth-child(4) { animation-delay: 0.39s; }
circle:nth-child(5) { animation-delay: 0.52s; }
circle:nth-child(6) { animation-delay: 0.65s; }
circle:nth-child(7) { animation-delay: 0.78s; }
circle:nth-child(8) { animation-delay: 0.91s; }
@keyframes ball {
from { opacity: 1; }
to { opacity: 0.3; }
}
</style>
<g style="fill:grey;">
<circle cx='5' cy='1' r='1' style='opacity:0.3;' />
<circle cx='7.8284' cy='2.1716' r='1' style='opacity:0.3;' />
<circle cx='9' cy='5' r='1' style='opacity:0.3;' />
<circle cx='7.8284' cy='7.8284' r='1' style='opacity:0.3;' />
<circle cx='5' cy='9' r='1' style='opacity:0.3;' />
<circle cx='2.1716' cy='7.8284' r='1' style='opacity:0.3;' />
<circle cx='1' cy='5' r='1' style='opacity:0.3;' />
<circle cx='5' cy='1' r='1' style='opacity: 1.0;' />
<circle cx='7.8284' cy='2.1716' r='1' style='opacity:0.9;' />
<circle cx='9' cy='5' r='1' style='opacity:0.8;' />
<circle cx='7.8284' cy='7.8284' r='1' style='opacity:0.7;' />
<circle cx='5' cy='9' r='1' style='opacity:0.6;' />
<circle cx='2.1716' cy='7.8284' r='1' style='opacity:0.5;' />
<circle cx='1' cy='5' r='1' style='opacity:0.4;' />
<circle cx='2.1716' cy='2.1716' r='1' style='opacity:0.3;' />
</g>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 631 B

32
src/vs/base/browser/ui/dialog/pending-hc.svg
View File

@@ -1,31 +1,13 @@
<?xml version='1.0' standalone='no' ?>
<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='10px' height='10px'>
<style>
circle {
animation: ball 1.04s linear infinite;
}
circle:nth-child(2) { animation-delay: 0.13s; }
circle:nth-child(3) { animation-delay: 0.26s; }
circle:nth-child(4) { animation-delay: 0.39s; }
circle:nth-child(5) { animation-delay: 0.52s; }
circle:nth-child(6) { animation-delay: 0.65s; }
circle:nth-child(7) { animation-delay: 0.78s; }
circle:nth-child(8) { animation-delay: 0.91s; }
@keyframes ball {
from { opacity: 1; }
to { opacity: 0.3; }
}
</style>
<g style="fill:white;">
<circle cx='5' cy='1' r='1' style='opacity:0.3;' />
<circle cx='7.8284' cy='2.1716' r='1' style='opacity:0.3;' />
<circle cx='9' cy='5' r='1' style='opacity:0.3;' />
<circle cx='7.8284' cy='7.8284' r='1' style='opacity:0.3;' />
<circle cx='5' cy='9' r='1' style='opacity:0.3;' />
<circle cx='2.1716' cy='7.8284' r='1' style='opacity:0.3;' />
<circle cx='1' cy='5' r='1' style='opacity:0.3;' />
<circle cx='5' cy='1' r='1' style='opacity: 1.0;' />
<circle cx='7.8284' cy='2.1716' r='1' style='opacity:0.9;' />
<circle cx='9' cy='5' r='1' style='opacity:0.8;' />
<circle cx='7.8284' cy='7.8284' r='1' style='opacity:0.7;' />
<circle cx='5' cy='9' r='1' style='opacity:0.6;' />
<circle cx='2.1716' cy='7.8284' r='1' style='opacity:0.5;' />
<circle cx='1' cy='5' r='1' style='opacity:0.4;' />
<circle cx='2.1716' cy='2.1716' r='1' style='opacity:0.3;' />
</g>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 632 B

32
src/vs/base/browser/ui/dialog/pending.svg
View File

@@ -1,31 +1,13 @@
<?xml version='1.0' standalone='no' ?>
<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='10px' height='10px'>
<style>
circle {
animation: ball 1.04s linear infinite;
}
circle:nth-child(2) { animation-delay: 0.13s; }
circle:nth-child(3) { animation-delay: 0.26s; }
circle:nth-child(4) { animation-delay: 0.39s; }
circle:nth-child(5) { animation-delay: 0.52s; }
circle:nth-child(6) { animation-delay: 0.65s; }
circle:nth-child(7) { animation-delay: 0.78s; }
circle:nth-child(8) { animation-delay: 0.91s; }
@keyframes ball {
from { opacity: 1; }
to { opacity: 0.3; }
}
</style>
<g>
<circle cx='5' cy='1' r='1' style='opacity:0.3;' />
<circle cx='7.8284' cy='2.1716' r='1' style='opacity:0.3;' />
<circle cx='9' cy='5' r='1' style='opacity:0.3;' />
<circle cx='7.8284' cy='7.8284' r='1' style='opacity:0.3;' />
<circle cx='5' cy='9' r='1' style='opacity:0.3;' />
<circle cx='2.1716' cy='7.8284' r='1' style='opacity:0.3;' />
<circle cx='1' cy='5' r='1' style='opacity:0.3;' />
<circle cx='5' cy='1' r='1' style='opacity: 1.0;' />
<circle cx='7.8284' cy='2.1716' r='1' style='opacity:0.9;' />
<circle cx='9' cy='5' r='1' style='opacity:0.8;' />
<circle cx='7.8284' cy='7.8284' r='1' style='opacity:0.7;' />
<circle cx='5' cy='9' r='1' style='opacity:0.6;' />
<circle cx='2.1716' cy='7.8284' r='1' style='opacity:0.5;' />
<circle cx='1' cy='5' r='1' style='opacity:0.4;' />
<circle cx='2.1716' cy='2.1716' r='1' style='opacity:0.3;' />
</g>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 612 B