Skip to content

Commit

Permalink
Naming: CheckboxList > List (#49340)
Browse files Browse the repository at this point in the history
  • Loading branch information
@chrmarti
chrmarti committed May 9, 2018
1 parent c249ac2 commit 033910d
Show file tree
Hide file tree
Showing 3 changed files with 96 additions and 94 deletions.
20 changes: 10 additions & 10 deletions src/vs/workbench/browser/parts/quickinput/quickInput.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,35 +65,35 @@
height: 2px;
}

.quick-input-checkbox-list {
.quick-input-list {
line-height: 22px;
}

.quick-input-checkbox-list .monaco-list {
.quick-input-list .monaco-list {
overflow: hidden;
max-height: calc(20 * 22px);
}

.quick-input-checkbox-list .quick-input-checkbox-list-entry {
.quick-input-list .quick-input-list-entry {
overflow: hidden;
display: flex;
height: 100%;
padding: 0 6px;
}

.quick-input-checkbox-list .quick-input-checkbox-list-label {
.quick-input-list .quick-input-list-label {
overflow: hidden;
display: flex;
height: 100%;
flex: 1;
}

.quick-input-checkbox-list .quick-input-checkbox-list-checkbox {
.quick-input-list .quick-input-list-checkbox {
align-self: center;
margin: 0;
}

.quick-input-checkbox-list .quick-input-checkbox-list-rows {
.quick-input-list .quick-input-list-rows {
overflow: hidden;
text-overflow: ellipsis;
display: flex;
Expand All @@ -103,20 +103,20 @@
margin-left: 5px;
}

.quick-input-widget[data-type=pickMany] .quick-input-checkbox-list .quick-input-checkbox-list-rows {
.quick-input-widget[data-type=pickMany] .quick-input-list .quick-input-list-rows {
margin-left: 10px;
}

.quick-input-checkbox-list .quick-input-checkbox-list-rows > .quick-input-checkbox-list-row {
.quick-input-list .quick-input-list-rows > .quick-input-list-row {
display: flex;
align-items: center;
}

.quick-input-checkbox-list .quick-input-checkbox-list-rows .monaco-highlighted-label span {
.quick-input-list .quick-input-list-rows .monaco-highlighted-label span {
opacity: 1;
}

.quick-input-checkbox-list .quick-input-checkbox-list-label-meta {
.quick-input-list .quick-input-list-label-meta {
opacity: 0.7;
line-height: normal;
}
90 changes: 45 additions & 45 deletions src/vs/workbench/browser/parts/quickinput/quickInput.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ import { SIDE_BAR_BACKGROUND, SIDE_BAR_FOREGROUND } from 'vs/workbench/common/th
import { IQuickOpenService, IPickOpenEntry, IPickOptions, IInputOptions } from 'vs/platform/quickOpen/common/quickOpen';
import { TPromise } from 'vs/base/common/winjs.base';
import { CancellationToken } from 'vs/base/common/cancellation';
import { QuickInputCheckboxList } from './quickInputCheckboxList';
import { QuickInputList } from './quickInputList';
import { QuickInputBox } from './quickInputBox';
import { KeyCode } from 'vs/base/common/keyCodes';
import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
Expand Down Expand Up @@ -77,7 +77,7 @@ interface QuickInputUI {
inputBox: QuickInputBox;
count: CountBadge;
message: HTMLElement;
checkboxList: QuickInputCheckboxList;
list: QuickInputList;
close: (ok?: true | Thenable<never>) => void;
}

Expand All @@ -89,7 +89,7 @@ interface InputController<R> {
}

class PickOneController<T extends IPickOpenEntry> implements InputController<T> {
public showUI = { inputBox: true, checkboxList: true };
public showUI = { inputBox: true, list: true };
public result: TPromise<T>;
public ready: TPromise<void>;
public resolve: (ok?: true | Thenable<never>) => void;
Expand All @@ -99,43 +99,43 @@ class PickOneController<T extends IPickOpenEntry> implements InputController<T>

constructor(ui: QuickInputUI, parameters: PickOneParameters<T>) {
this.result = new TPromise<T>((resolve, reject, progress) => {
this.resolve = ok => resolve(ok === true ? <T>ui.checkboxList.getFocusedElements()[0] : ok);
this.resolve = ok => resolve(ok === true ? <T>ui.list.getFocusedElements()[0] : ok);
this.progress = progress;
});
this.result.then(() => this.dispose());

ui.inputBox.value = '';
ui.inputBox.setPlaceholder(parameters.placeHolder || '');
ui.checkboxList.matchOnDescription = parameters.matchOnDescription;
ui.checkboxList.matchOnDetail = parameters.matchOnDetail;
ui.checkboxList.setElements([]);
ui.list.matchOnDescription = parameters.matchOnDescription;
ui.list.matchOnDetail = parameters.matchOnDetail;
ui.list.setElements([]);

this.ready = parameters.picks.then(elements => {
if (this.closed) {
return;
}

ui.checkboxList.setElements(elements);
ui.checkboxList.filter(ui.inputBox.value);
ui.checkboxList.focus('First');
ui.list.setElements(elements);
ui.list.filter(ui.inputBox.value);
ui.list.focus('First');

this.disposables.push(
ui.checkboxList.onSelectionChange(elements => {
ui.list.onSelectionChange(elements => {
if (elements[0]) {
ui.close(true);
}
}),
ui.inputBox.onDidChange(value => {
ui.checkboxList.filter(value);
ui.checkboxList.focus('First');
ui.list.filter(value);
ui.list.focus('First');
}),
ui.inputBox.onKeyDown(event => {
switch (event.keyCode) {
case KeyCode.DownArrow:
ui.checkboxList.focus('Next');
ui.list.focus('Next');
break;
case KeyCode.UpArrow:
ui.checkboxList.focus('Previous');
ui.list.focus('Previous');
break;
}
})
Expand All @@ -150,7 +150,7 @@ class PickOneController<T extends IPickOpenEntry> implements InputController<T>
}

class PickManyController<T extends IPickOpenEntry> implements InputController<T[]> {
public showUI = { checkAll: true, inputBox: true, count: true, ok: true, checkboxList: true };
public showUI = { checkAll: true, inputBox: true, count: true, ok: true, list: true };
public result: TPromise<T[]>;
public ready: TPromise<void>;
public resolve: (ok?: true | Thenable<never>) => void;
Expand All @@ -160,42 +160,42 @@ class PickManyController<T extends IPickOpenEntry> implements InputController<T[

constructor(ui: QuickInputUI, parameters: PickManyParameters<T>) {
this.result = new TPromise<T[]>((resolve, reject, progress) => {
this.resolve = ok => resolve(ok === true ? <T[]>ui.checkboxList.getCheckedElements() : ok);
this.resolve = ok => resolve(ok === true ? <T[]>ui.list.getCheckedElements() : ok);
this.progress = progress;
});
this.result.then(() => this.dispose());

ui.inputBox.value = '';
ui.inputBox.setPlaceholder(parameters.placeHolder || '');
ui.checkboxList.matchOnDescription = parameters.matchOnDescription;
ui.checkboxList.matchOnDetail = parameters.matchOnDetail;
ui.checkboxList.setElements([]);
ui.checkAll.checked = ui.checkboxList.getAllVisibleChecked();
ui.count.setCount(ui.checkboxList.getCheckedCount());
ui.list.matchOnDescription = parameters.matchOnDescription;
ui.list.matchOnDetail = parameters.matchOnDetail;
ui.list.setElements([]);
ui.checkAll.checked = ui.list.getAllVisibleChecked();
ui.count.setCount(ui.list.getCheckedCount());

this.ready = parameters.picks.then(elements => {
if (this.closed) {
return;
}

ui.checkboxList.setElements(elements, true);
ui.checkboxList.filter(ui.inputBox.value);
ui.checkAll.checked = ui.checkboxList.getAllVisibleChecked();
ui.count.setCount(ui.checkboxList.getCheckedCount());
ui.list.setElements(elements, true);
ui.list.filter(ui.inputBox.value);
ui.checkAll.checked = ui.list.getAllVisibleChecked();
ui.count.setCount(ui.list.getCheckedCount());

this.disposables.push(
ui.inputBox.onDidChange(value => {
ui.checkboxList.filter(value);
ui.list.filter(value);
}),
ui.inputBox.onKeyDown(event => {
switch (event.keyCode) {
case KeyCode.DownArrow:
ui.checkboxList.focus('First');
ui.checkboxList.domFocus();
ui.list.focus('First');
ui.list.domFocus();
break;
case KeyCode.UpArrow:
ui.checkboxList.focus('Last');
ui.checkboxList.domFocus();
ui.list.focus('Last');
ui.list.domFocus();
break;
}
})
Expand Down Expand Up @@ -363,7 +363,7 @@ export class QuickInputService extends Component implements IQuickInputService {
checkAll.type = 'checkbox';
this.toUnbind.push(dom.addStandardDisposableListener(checkAll, dom.EventType.CHANGE, e => {
const checked = checkAll.checked;
checkboxList.setAllVisibleChecked(checked);
list.setAllVisibleChecked(checked);
}));
this.toUnbind.push(dom.addDisposableListener(checkAll, dom.EventType.CLICK, e => {
if (e.x || e.y) { // Avoid 'click' triggered by 'space'...
Expand Down Expand Up @@ -396,23 +396,23 @@ export class QuickInputService extends Component implements IQuickInputService {
dom.addClass(this.progressBar.getContainer(), 'quick-input-progress');
this.toUnbind.push(attachProgressBarStyler(this.progressBar, this.themeService));

const checkboxList = this.instantiationService.createInstance(QuickInputCheckboxList, this.container);
this.toUnbind.push(checkboxList);
this.toUnbind.push(checkboxList.onAllVisibleCheckedChanged(checked => {
const list = this.instantiationService.createInstance(QuickInputList, this.container);
this.toUnbind.push(list);
this.toUnbind.push(list.onAllVisibleCheckedChanged(checked => {
checkAll.checked = checked;
}));
this.toUnbind.push(checkboxList.onCheckedCountChanged(c => {
this.toUnbind.push(list.onCheckedCountChanged(c => {
count.setCount(c);
}));
this.toUnbind.push(checkboxList.onLeave(() => {
this.toUnbind.push(list.onLeave(() => {
// Defer to avoid the input field reacting to the triggering key.
setTimeout(() => {
inputBox.setFocus();
checkboxList.clearFocus();
list.clearFocus();
}, 0);
}));
this.toUnbind.push(
chain(checkboxList.onFocusChange)
chain(list.onFocusChange)
.map(e => e[0])
.filter(e => !!e)
.latch()
Expand Down Expand Up @@ -469,7 +469,7 @@ export class QuickInputService extends Component implements IQuickInputService {

this.toUnbind.push(this.quickOpenService.onShow(() => this.close()));

this.ui = { checkAll, inputBox, count, message, checkboxList, close: ok => this.close(ok) };
this.ui = { checkAll, inputBox, count, message, list, close: ok => this.close(ok) };
this.updateStyles();
}

Expand Down Expand Up @@ -554,7 +554,7 @@ export class QuickInputService extends Component implements IQuickInputService {
this.countContainer.style.display = this.controller.showUI.count ? '' : 'none';
this.okContainer.style.display = this.controller.showUI.ok ? '' : 'none';
this.ui.message.style.display = this.controller.showUI.message ? '' : 'none';
this.ui.checkboxList.display(this.controller.showUI.checkboxList);
this.ui.list.display(this.controller.showUI.list);

if (this.container.style.display === 'none') {
this.inQuickOpen('quickInput', true);
Expand Down Expand Up @@ -604,13 +604,13 @@ export class QuickInputService extends Component implements IQuickInputService {

toggle() {
if (this.isDisplayed() && this.controller instanceof PickManyController) {
this.ui.checkboxList.toggleCheckbox();
this.ui.list.toggleCheckbox();
}
}

navigate(next: boolean) {
if (this.isDisplayed() && this.ui.checkboxList.isDisplayed()) {
this.ui.checkboxList.focus(next ? 'Next' : 'Previous');
if (this.isDisplayed() && this.ui.list.isDisplayed()) {
this.ui.list.focus(next ? 'Next' : 'Previous');
}
}

Expand Down Expand Up @@ -638,7 +638,7 @@ export class QuickInputService extends Component implements IQuickInputService {
style.marginLeft = '-' + (width / 2) + 'px';

this.ui.inputBox.layout();
this.ui.checkboxList.layout();
this.ui.list.layout();
}
}

Expand Down

0 comments on commit 033910d

Please sign in to comment.