Skip to content

V
vscode

xxadev / vscode
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
V
vscode

体验新版 GitCode，发现更多精彩内容 >>

提交 f21a18f9 编写于 作者: J Joao Moreno
浏览文件
操作

filter on type: enable, disable, animation

上级 042bda1d
隐藏空白更改
内联 并排
Showing with 440 addition and 13 deletion
src/vs/base/browser/ui/list/list.css
浏览文件 @ f21a18f9
......@@ -89,7 +89,7 @@
z-index: 1;
}
.monaco-list-type-filter.animate {
.monaco-list-type-filter.dragging {
transition: top 0.2s, left 0.2s;
}
......@@ -111,4 +111,68 @@
.monaco-list-type-filter.sw {
bottom: 4px;
left: 4px;
}
.monaco-list-type-filter > .controls {
display: flex;
align-items: center;
box-sizing: border-box;
transition: width 0.2s;
width: 0;
}
.monaco-list-type-filter.dragging > .controls,
.monaco-list-type-filter:hover > .controls {
width: 36px;
}
.monaco-list-type-filter > .controls > * {
box-sizing: border-box;
width: 16px;
height: 16px;
margin: 0 0 0 2px;
flex-shrink: 0;
}
.monaco-list-type-filter > .controls > .filter {
-webkit-appearance: none;
width: 16px;
height: 16px;
background: url("media/no-filter.svg");
background-position: 50% 50%;
cursor: pointer;
}
.monaco-list-type-filter > .controls > .filter:checked {
background-image: url("media/filter.svg");
}
.vs-dark .monaco-list-type-filter > .controls > .filter {
background-image: url("media/no-filter-dark.svg");
}
.vs-dark .monaco-list-type-filter > .controls > .filter:checked {
background-image: url("media/filter-dark.svg");
}
.hc-black .monaco-list-type-filter > .controls > .filter {
background-image: url("media/no-filter-hc.svg");
}
.hc-black .monaco-list-type-filter > .controls > .filter:checked {
background-image: url("media/filter-hc.svg");
}
.monaco-list-type-filter > .controls > .clear {
border: none;
background: url("media/close.svg");
cursor: pointer;
}
.vs-dark .monaco-list-type-filter > .controls > .clear {
background-image: url("media/close-dark.svg");
}
.hc-black .monaco-list-type-filter > .controls > .clear {
background-image: url("media/close-hc.svg");
}
\ No newline at end of file
src/vs/base/browser/ui/list/media/close-dark.svg 0 → 100644
浏览文件 @ f21a18f9
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="3 3 16 16" enable-background="new 3 3 16 16"><polygon fill="#e8e8e8" points="12.597,11.042 15.4,13.845 13.844,15.4 11.042,12.598 8.239,15.4 6.683,13.845 9.485,11.042 6.683,8.239 8.238,6.683 11.042,9.486 13.845,6.683 15.4,8.239"/></svg>
\ No newline at end of file
src/vs/base/browser/ui/list/media/close-hc.svg 0 → 100644
浏览文件 @ f21a18f9
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="svg7320"
version="1.1"
enable-background="new 3 3 16 16"
viewBox="3 3 16 16"
height="16"
width="16">
<metadata
id="metadata7326">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs7324" />
<polygon
style="fill:#ffffff;fill-opacity:1"
id="polygon7318"
points="12.597,11.042 15.4,13.845 13.844,15.4 11.042,12.598 8.239,15.4 6.683,13.845 9.485,11.042 6.683,8.239 8.238,6.683 11.042,9.486 13.845,6.683 15.4,8.239"
fill="#424242" />
</svg>
src/vs/base/browser/ui/list/media/close.svg 0 → 100644
浏览文件 @ f21a18f9
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="3 3 16 16" enable-background="new 3 3 16 16"><polygon fill="#424242" points="12.597,11.042 15.4,13.845 13.844,15.4 11.042,12.598 8.239,15.4 6.683,13.845 9.485,11.042 6.683,8.239 8.238,6.683 11.042,9.486 13.845,6.683 15.4,8.239"/></svg>
\ No newline at end of file
src/vs/base/browser/ui/list/media/filter-dark.svg 0 → 100644
浏览文件 @ f21a18f9
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="svg3838"
version="1.1"
height="20"
width="20">
<metadata
id="metadata3844">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs3842" />
<g
id="g3836"
transform="translate(0,-1032.3622)">
<rect
id="rect3828"
style="fill:#c8c8c8;fill-opacity:1;stroke:none;stroke-width:0.66666669"
y="1044.3622"
x="8"
height="2"
width="4" />
<rect
id="rect3832"
style="fill:#c8c8c8;fill-opacity:1;stroke:none;stroke-width:1.15470052"
y="1041.3622"
x="6"
height="2"
width="8" />
<rect
id="rect3834"
style="fill:#c8c8c8;fill-opacity:1;stroke:none"
y="1038.3622"
x="4"
height="2"
width="12" />
</g>
</svg>
src/vs/base/browser/ui/list/media/filter-hc.svg 0 → 100644
浏览文件 @ f21a18f9
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="svg3838"
version="1.1"
height="20"
width="20">
<metadata
id="metadata3844">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs3842" />
<g
id="g3836"
transform="translate(0,-1032.3622)">
<rect
id="rect3828"
style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.66666669"
y="1044.3622"
x="8"
height="2"
width="4" />
<rect
id="rect3832"
style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1.15470052"
y="1041.3622"
x="6"
height="2"
width="8" />
<rect
id="rect3834"
style="fill:#ffffff;fill-opacity:1;stroke:none"
y="1038.3622"
x="4"
height="2"
width="12" />
</g>
</svg>
src/vs/base/browser/ui/list/media/filter.svg 0 → 100644
浏览文件 @ f21a18f9
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
version="1.1"
id="svg3838">
<metadata
id="metadata3844">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs3842" />
<g
transform="translate(0,-1032.3622)"
id="g3836">
<rect
width="4"
height="2"
x="8"
y="1044.3622"
style="fill:#4b4b4b;fill-opacity:1;stroke:none;stroke-width:0.66666669"
id="rect3828" />
<rect
width="8"
height="2"
x="6"
y="1041.3622"
style="fill:#4b4b4b;fill-opacity:1;stroke:none;stroke-width:1.15470052"
id="rect3832" />
<rect
width="12"
height="2"
x="4"
y="1038.3622"
style="fill:#4b4b4b;fill-opacity:1;stroke:none"
id="rect3834" />
</g>
</svg>
src/vs/base/browser/ui/list/media/no-filter-dark.svg 0 → 100644
浏览文件 @ f21a18f9
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="svg3838"
version="1.1"
height="20"
width="20">
<metadata
id="metadata3844">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs3842" />
<g
id="g3836"
transform="translate(0,-1032.3622)">
<rect
id="rect3828"
style="fill:#c8c8c8;fill-opacity:1;stroke:none;stroke-width:1.15470052"
y="1044.3622"
x="4"
height="2"
width="12" />
<rect
id="rect3832"
style="fill:#c8c8c8;fill-opacity:1;stroke:none;stroke-width:1.41421354"
y="1041.3622"
x="4"
height="2"
width="12" />
<rect
id="rect3834"
style="fill:#c8c8c8;fill-opacity:1;stroke:none"
y="1038.3622"
x="4"
height="2"
width="12" />
</g>
</svg>
src/vs/base/browser/ui/list/media/no-filter-hc.svg 0 → 100644
浏览文件 @ f21a18f9
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="svg3838"
version="1.1"
height="20"
width="20">
<metadata
id="metadata3844">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs3842" />
<g
id="g3836"
transform="translate(0,-1032.3622)">
<rect
id="rect3828"
style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1.15470052"
y="1044.3622"
x="4"
height="2"
width="12" />
<rect
id="rect3832"
style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1.41421354"
y="1041.3622"
x="4"
height="2"
width="12" />
<rect
id="rect3834"
style="fill:#ffffff;fill-opacity:1;stroke:none"
y="1038.3622"
x="4"
height="2"
width="12" />
</g>
</svg>
src/vs/base/browser/ui/list/media/no-filter.svg 0 → 100644
浏览文件 @ f21a18f9
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
version="1.1"
id="svg3838">
<metadata
id="metadata3844">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs3842" />
<g
transform="translate(0,-1032.3622)"
id="g3836">
<rect
width="12"
height="2"
x="4"
y="1044.3622"
style="fill:#4b4b4b;fill-opacity:1;stroke:none;stroke-width:1.15470052"
id="rect3828" />
<rect
width="12"
height="2"
x="4"
y="1041.3622"
style="fill:#4b4b4b;fill-opacity:1;stroke:none;stroke-width:1.41421354"
id="rect3832" />
<rect
width="12"
height="2"
x="4"
y="1038.3622"
style="fill:#4b4b4b;fill-opacity:1;stroke:none"
id="rect3834" />
</g>
</svg>
src/vs/base/browser/ui/tree/abstractTree.ts
浏览文件 @ f21a18f9
......@@ -19,6 +19,7 @@ import { ElementsDragAndDropData } from 'vs/base/browser/ui/list/listView';
import { domEvent } from 'vs/base/browser/event';
import { fuzzyScore, FuzzyScore } from 'vs/base/common/filters';
import { getVisibleState, isFilterResult } from 'vs/base/browser/ui/tree/indexTreeModel';
import { localize } from 'vs/nls';
function asTreeDragAndDropData<T, TFilterData>(data: IDragAndDropData): IDragAndDropData {
if (data instanceof ElementsDragAndDropData) {
......@@ -335,6 +336,7 @@ class TypeFilterController<T, TFilterData> implements IDisposable {
private positionClassName = 'ne';
private domNode: HTMLElement;
private label: HTMLElement;
private filterOnType: HTMLInputElement;
private _pattern = '';
private disposables: IDisposable[] = [];
......@@ -350,21 +352,31 @@ class TypeFilterController<T, TFilterData> implements IDisposable {
domEvent(this.domNode, 'dragstart')(this.onDragStart, this, this.disposables);
this.label = append(this.domNode, $('span.label'));
const controls = append(this.domNode, $('.controls'));
const filterOnType = append(controls, $<HTMLInputElement>('input'));
filterOnType.type = 'checkbox';
filterOnType.checked = !!tree.configuration.filterOnType;
Event.map(domEvent(filterOnType, 'input'), _ => filterOnType.checked)(this.onDidChangeFilterOnType, this, this.disposables);
this.filterOnType = append(controls, $<HTMLInputElement>('input.filter'));
this.filterOnType.type = 'checkbox';
this.filterOnType.checked = !!tree.configuration.filterOnType;
this.filterOnType.tabIndex = -1;
this.updateFilterOnTypeTitle();
domEvent(this.filterOnType, 'input')(this.onDidChangeFilterOnType, this, this.disposables);
const clear = append(controls, $<HTMLInputElement>('button.clear'));
clear.tabIndex = -1;
clear.title = localize('clear', "Clear");
const onClear = domEvent(clear, 'click');
const isPrintableCharEvent = keyboardNavigationLabelProvider.mightProducePrintableCharacter ? (e: IKeyboardEvent) => keyboardNavigationLabelProvider.mightProducePrintableCharacter!(e) : (e: IKeyboardEvent) => mightProducePrintableCharacter(e);
const onInput = Event.chain(domEvent(view.getHTMLElement(), 'keydown'))
.filter(e => !isInputElement(e.target as HTMLElement) || e.target === filterOnType)
const onKeyDown = Event.chain(domEvent(view.getHTMLElement(), 'keydown'))
.filter(e => !isInputElement(e.target as HTMLElement) || e.target === this.filterOnType)
.map(e => new StandardKeyboardEvent(e))
.filter(e => e.keyCode === KeyCode.Backspace || e.keyCode === KeyCode.Escape || isPrintableCharEvent(e))
.forEach(e => { e.stopPropagation(); e.preventDefault(); })
.event;
const onInput = Event.chain(Event.any<MouseEvent | StandardKeyboardEvent>(onKeyDown, onClear))
.reduce((previous: string, e) => {
if (e.keyCode === KeyCode.Escape) {
if (e instanceof MouseEvent || e.keyCode === KeyCode.Escape) {
return '';
}
......@@ -386,6 +398,7 @@ class TypeFilterController<T, TFilterData> implements IDisposable {
container.append(this.domNode);
} else if (!pattern && this.domNode.parentElement) {
this.domNode.remove();
this.tree.domFocus();
}
this.label.textContent = pattern.length > 16
......@@ -461,8 +474,8 @@ class TypeFilterController<T, TFilterData> implements IDisposable {
updatePosition();
removeClass(this.domNode, positionClassName);
addClass(this.domNode, 'animate');
disposables.push(toDisposable(() => removeClass(this.domNode, 'animate')));
addClass(this.domNode, 'dragging');
disposables.push(toDisposable(() => removeClass(this.domNode, 'dragging')));
domEvent(document, 'dragover')(onDragOver, null, disposables);
domEvent(this.domNode, 'dragend')(onDragEnd, null, disposables);
......@@ -471,8 +484,17 @@ class TypeFilterController<T, TFilterData> implements IDisposable {
disposables.push(toDisposable(() => StaticDND.CurrentDragAndDropData = undefined));
}
onDidChangeFilterOnType(filterOnType: boolean): void {
this.tree.updateConfiguration({ filterOnType });
private onDidChangeFilterOnType(): void {
this.tree.updateConfiguration({ filterOnType: this.filterOnType.checked });
this.updateFilterOnTypeTitle();
}
private updateFilterOnTypeTitle(): void {
if (this.filterOnType.checked) {
this.filterOnType.title = localize('disable filter on type', "Disable Filter on Type");
} else {
this.filterOnType.title = localize('enable filter on type', "Enable Filter on Type");
}
}
dispose() {
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或