diff --git a/src/vs/workbench/contrib/welcomeGettingStarted/browser/gettingStarted.ts b/src/vs/workbench/contrib/welcomeGettingStarted/browser/gettingStarted.ts index 5fac7866..f1543d23 100644 --- a/src/vs/workbench/contrib/welcomeGettingStarted/browser/gettingStarted.ts +++ b/src/vs/workbench/contrib/welcomeGettingStarted/browser/gettingStarted.ts @@ -144,6 +144,7 @@ export class GettingStartedPage extends EditorPane { private hasScrolledToFirstCategory = false; private recentlyOpenedList?: GettingStartedIndexList; private startList?: GettingStartedIndexList; + private tipsList?: GettingStartedIndexList; private gettingStartedList?: GettingStartedIndexList; private stepsSlide!: HTMLElement; @@ -373,6 +374,10 @@ export class GettingStartedPage extends EditorPane { } break; } + case 'installExtension':{ + this.commandService.executeCommand('workbench.extensions.action.installVSIX'); + break; + } case 'selectCategory': { const selectedCategory = this.gettingStartedCategories.find(category => category.id === argument); if (!selectedCategory) { throw Error('Could not find category with ID ' + argument); } @@ -753,6 +758,7 @@ export class GettingStartedPage extends EditorPane { const rightColumn = $('.categories-column.categories-column-right', {},); const startList = this.buildStartList(); + const tipsList = this.buildTipsList(); const recentList = this.buildRecentlyOpenedList(); const gettingStartedList = this.buildGettingStartedWalkthroughsList(); @@ -765,13 +771,13 @@ export class GettingStartedPage extends EditorPane { const layoutLists = () => { if (gettingStartedList.itemCount) { this.container.classList.remove('noWalkthroughs'); - reset(leftColumn, startList.getDomElement(), recentList.getDomElement()); + reset(leftColumn, startList.getDomElement(), tipsList.getDomElement(),recentList.getDomElement()); reset(rightColumn, gettingStartedList.getDomElement()); recentList.setLimit(5); } else { this.container.classList.add('noWalkthroughs'); - reset(leftColumn, startList.getDomElement()); + reset(leftColumn, startList.getDomElement(),tipsList.getDomElement()); reset(rightColumn, recentList.getDomElement()); recentList.setLimit(10); } @@ -918,6 +924,42 @@ export class GettingStartedPage extends EditorPane { return recentlyOpenedList; } + /** + *build tips List + *RecentEntry here is meaningless, just borrowed to display the contents of empty. + *If you really want to display the tipslist as a list later, you need to create an entry to render the HTMLElement. + */ + private buildTipsList(): GettingStartedIndexList { + //This code doesn't make sense + const renderTips = (entry: RecentEntry) => { + const li = $('li'); + const span = $('span'); + span.innerText = 'test'; + span.title = 'test2'; + li.appendChild(span); + return li; + }; + + if (this.tipsList) { this.tipsList.dispose(); } + const tipsList = this.tipsList = new GettingStartedIndexList(// fit GettingStartedIndexList class + { + title: localize('tipsTitle', "Tips"), + klass: 'tips-container', + limit: 2,//Meaningless code + empty: $('.empty-tips', {}, + localize('tipsMsg', "If the system creates a new user, some extensions of the new user cannot be installed. In this case, you need to manually install them.Yon can "), + $('button.button-link', { 'x-dispatch': 'installExtension' }, localize('installExtension', "install extension")), + localize('directory',"to choose extensions path:/usr/share/code-oss/vsix/")), + renderElement: renderTips,//Meaningless code + contextService: this.contextService + }); + //register button click event + tipsList.onDidChange(() => this.registerDispatchListeners()); + //Parameter array is empty, only display empty content + tipsList.setEntries([]); + return tipsList; + } + private buildStartList(): GettingStartedIndexList { const renderStartEntry = (entry: IWelcomePageStartEntry): HTMLElement => $('li', @@ -1036,6 +1078,7 @@ export class GettingStartedPage extends EditorPane { this.detailsPageScrollbar?.scanDomNode(); this.startList?.layout(size); + this.tipsList?.layout(size); this.gettingStartedList?.layout(size); this.recentlyOpenedList?.layout(size); diff --git a/src/vs/workbench/contrib/welcomeGettingStarted/common/gettingStartedContent.ts b/src/vs/workbench/contrib/welcomeGettingStarted/common/gettingStartedContent.ts index a091be87..71c963aa 100644 --- a/src/vs/workbench/contrib/welcomeGettingStarted/common/gettingStartedContent.ts +++ b/src/vs/workbench/contrib/welcomeGettingStarted/common/gettingStartedContent.ts @@ -3,6 +3,7 @@ * Licensed under the MIT License. See License.txt in the project root for license information. *--------------------------------------------------------------------------------------------*/ +import 'vs/workbench/contrib/welcomeGettingStarted/common/media/extension_install'; import 'vs/workbench/contrib/welcomeGettingStarted/common/media/theme_picker'; import 'vs/workbench/contrib/welcomeGettingStarted/common/media/notebookProfile'; import { localize } from 'vs/nls'; @@ -190,6 +191,13 @@ export const walkthroughs: GettingStartedWalkthroughContent = [ content: { type: 'steps', steps: [ + { + id: 'extensionTips', + title: localize('gettingStarted.extensionTips.title', "Manual Extension Installation"), + description: localize('gettingStarted.extensionTips.description', "If the system creates a new user, some extensions of the new user cannot be installed. In this case, you need to manually install them.\n{0}", Button(localize('installExtension', "Install Extension"), 'command:workbench.extensions.action.installVSIX')), + completionEvents:['onCommand:workbench.extensions.action.installVSIX'], + media: { type: 'markdown', path: 'extension_install', } + }, { id: 'pickColorTheme', title: localize('gettingStarted.pickColor.title', "Choose the look you want"), diff --git a/src/vs/workbench/contrib/welcomeGettingStarted/common/media/extension_install.ts b/src/vs/workbench/contrib/welcomeGettingStarted/common/media/extension_install.ts new file mode 100644 index 00000000..6c98965f --- /dev/null +++ b/src/vs/workbench/contrib/welcomeGettingStarted/common/media/extension_install.ts @@ -0,0 +1,19 @@ +/*--------------------------------------------------------------------------------------------- + * Copyright (c) Microsoft Corporation. All rights reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + *--------------------------------------------------------------------------------------------*/ + +import { escape } from 'vs/base/common/strings'; +import { localize } from 'vs/nls'; + +export default () => ` + + ${escape(localize('directory', "Yon can install extensions path:/usr/share/code-oss/vsix/*.vsix"))} + +

+ ${escape(localize('install', "You can use command install extension:"))} +

+

+ ${escape('code --install-extension /usr/share/code-oss/vsix/*.vsix')} +

+`;