diff --git a/src/vs/workbench/parts/preferences/browser/settingsEditor2.ts b/src/vs/workbench/parts/preferences/browser/settingsEditor2.ts index c349145aec320e5b71edcc5d9d0230fba221a8d1..e761a4d82c28a3d0449e55074c1f347826ae2abc 100644 --- a/src/vs/workbench/parts/preferences/browser/settingsEditor2.ts +++ b/src/vs/workbench/parts/preferences/browser/settingsEditor2.ts @@ -45,6 +45,7 @@ export class SettingsEditor2 extends BaseEditor { private defaultSettingsEditorModel: DefaultSettingsEditorModel; + private rootElement: HTMLElement; private headerContainer: HTMLElement; private searchWidget: SearchWidget; private settingsTargetsWidget: SettingsTargetsWidget; @@ -100,10 +101,10 @@ export class SettingsEditor2 extends BaseEditor { } createEditor(parent: HTMLElement): void { - const settingsEditorElement = DOM.append(parent, $('.settings-editor')); - this.createTOC(settingsEditorElement); + this.rootElement = DOM.append(parent, $('.settings-editor')); + this.createTOC(this.rootElement); - const settingsEditorRightElement = DOM.append(settingsEditorElement, $('.settings-editor-right')); + const settingsEditorRightElement = DOM.append(this.rootElement, $('.settings-editor-right')); this.createHeader(settingsEditorRightElement); this.createBody(settingsEditorRightElement); } @@ -465,7 +466,7 @@ export class SettingsEditor2 extends BaseEditor { } private toggleSearchMode(): void { - DOM.toggleClass(this.getContainer(), 'search-mode', !!this.searchResultModel); + DOM.toggleClass(this.rootElement, 'search-mode', !!this.searchResultModel); } private onConfigUpdate(): TPromise { @@ -474,9 +475,10 @@ export class SettingsEditor2 extends BaseEditor { const commonlyUsed = resolveSettingsTree(commonlyUsedData, groups); resolvedSettingsRoot.children.unshift(commonlyUsed); - this.settingsTreeModel = this.instantiationService.createInstance(SettingsTreeModel, this.viewState, resolvedSettingsRoot); - - if (!this.searchResultModel) { + if (this.settingsTreeModel) { + this.settingsTreeModel.update(resolvedSettingsRoot); + } else { + this.settingsTreeModel = this.instantiationService.createInstance(SettingsTreeModel, this.viewState, resolvedSettingsRoot); this.settingsTree.setInput(this.settingsTreeModel.root); this.tocTree.setInput(this.settingsTreeModel.root); } @@ -492,18 +494,22 @@ export class SettingsEditor2 extends BaseEditor { (document.activeElement).selectionStart : null; - return this.settingsTree.refresh().then(() => { - if (focusedRowId) { - const rowSelector = `.setting-item#${focusedRowId}`; - const inputElementToFocus: HTMLElement = this.settingsTreeContainer.querySelector(`${rowSelector} input, ${rowSelector} select, ${rowSelector} a`); - if (inputElementToFocus) { - inputElementToFocus.focus(); - if (typeof selection === 'number') { - (inputElementToFocus).setSelectionRange(selection, selection); + return this.settingsTree.refresh() + .then(() => { + if (focusedRowId) { + const rowSelector = `.setting-item#${focusedRowId}`; + const inputElementToFocus: HTMLElement = this.settingsTreeContainer.querySelector(`${rowSelector} input, ${rowSelector} select, ${rowSelector} a`); + if (inputElementToFocus) { + inputElementToFocus.focus(); + if (typeof selection === 'number') { + (inputElementToFocus).setSelectionRange(selection, selection); + } } } - } - }); + }) + .then(() => { + return this.tocTree.refresh(); + }); } private onSearchInputChanged(): void { diff --git a/src/vs/workbench/parts/preferences/browser/settingsTree.ts b/src/vs/workbench/parts/preferences/browser/settingsTree.ts index 8ba77cf74a37e260718175b008b5a62a750690cd..b24e857cb9755cb0bd5bd72eabc80212e1830b26 100644 --- a/src/vs/workbench/parts/preferences/browser/settingsTree.ts +++ b/src/vs/workbench/parts/preferences/browser/settingsTree.ts @@ -77,7 +77,7 @@ export interface ITOCEntry { } export class SettingsTreeModel { - private _root: SettingsTreeElement; + private _root: SettingsTreeGroupElement; private _treeElementsById = new Map(); constructor( @@ -85,13 +85,22 @@ export class SettingsTreeModel { tocRoot: ITOCEntry, @IConfigurationService private configurationService: IConfigurationService ) { - this._root = this.createSettingsTreeGroupElement(tocRoot); + this.update(tocRoot); } get root(): SettingsTreeElement { return this._root; } + update(newTocRoot: ITOCEntry): void { + const newRoot = this.createSettingsTreeGroupElement(newTocRoot); + if (this._root) { + this._root.children = newRoot.children; + } else { + this._root = newRoot; + } + } + getElementById(id: string): SettingsTreeElement { return this._treeElementsById.get(id); } @@ -119,9 +128,13 @@ export class SettingsTreeModel { } } +function sanitizeId(id: string): string { + return id.replace(/[\.\/]/, '_'); +} + function createSettingsTreeSettingElement(setting: ISetting, parent: any, settingsTarget: SettingsTarget, configurationService: IConfigurationService): SettingsTreeSettingElement { const element = new SettingsTreeSettingElement(); - element.id = parent.id + '_' + setting.key; + element.id = sanitizeId(parent.id + '_' + setting.key); element.parent = parent; const { isConfigured, inspected, targetSelector } = inspectSetting(setting.key, settingsTarget, configurationService); @@ -522,7 +535,6 @@ export class SettingsRenderer implements IRenderer { template.descriptionElement.textContent = element.description; this.renderValue(element, isSelected, template); - const resetButton = new Button(template.valueElement); const resetText = localize('resetButtonTitle', "reset"); resetButton.label = resetText;