Skip to content

Commit

Permalink
Split Quick Links section (fixes #22097)
Browse files Browse the repository at this point in the history
  • Loading branch information
@chrmarti
chrmarti committed May 16, 2017
1 parent 087a2d2 commit 50ed5aa
Show file tree
Hide file tree
Showing 4 changed files with 41 additions and 19 deletions.
2 changes: 1 addition & 1 deletion src/vs/platform/telemetry/common/telemetry.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ export interface ITelemetryExperiments {
showNewUserWatermark: boolean;
openUntitledFile: boolean;
enableWelcomePage: boolean;
reorderQuickLinks: boolean;
mergeQuickLinks: boolean;
}

export interface ITelemetryService {
Expand Down
10 changes: 5 additions & 5 deletions src/vs/platform/telemetry/common/telemetryUtils.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ export const defaultExperiments: ITelemetryExperiments = {
showNewUserWatermark: false,
openUntitledFile: true,
enableWelcomePage: true,
reorderQuickLinks: false,
mergeQuickLinks: false,
};

export const NullTelemetryService = {
Expand Down Expand Up @@ -57,7 +57,7 @@ export function loadExperiments(accessor: ServicesAccessor): ITelemetryExperimen
showNewUserWatermark,
openUntitledFile,
enableWelcomePage,
reorderQuickLinks,
mergeQuickLinks,
} = splitExperimentsRandomness();

const newUserDuration = 24 * 60 * 60 * 1000;
Expand All @@ -72,7 +72,7 @@ export function loadExperiments(accessor: ServicesAccessor): ITelemetryExperimen
showNewUserWatermark,
openUntitledFile,
enableWelcomePage,
reorderQuickLinks,
mergeQuickLinks,
});
}

Expand All @@ -95,13 +95,13 @@ function splitExperimentsRandomness(): ITelemetryExperiments {
const random1 = getExperimentsRandomness();
const [random2, showNewUserWatermark] = splitRandom(random1);
const [random3, openUntitledFile] = splitRandom(random2);
const [random4, reorderQuickLinks] = splitRandom(random3);
const [random4, mergeQuickLinks] = splitRandom(random3);
const [, enableWelcomePage] = splitRandom(random4);
return {
showNewUserWatermark,
openUntitledFile,
enableWelcomePage,
reorderQuickLinks,
mergeQuickLinks,
};
}

Expand Down
35 changes: 24 additions & 11 deletions src/vs/workbench/parts/welcome/page/electron-browser/vs_code_welcome_page.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,28 +40,41 @@ export default () => `
<ul>
<li><a href="command:workbench.action.openDocumentationUrl">${escape(localize('welcomePage.productDocumentation', "Product documentation"))}</a></li>
<li><a href="command:workbench.action.openIntroductoryVideosUrl">${escape(localize('welcomePage.introductoryVideos', "Introductory videos"))}</a></li>
<li class="keybindingsReferenceLink"><a href="command:workbench.action.keybindingsReference">${escape(localize('welcomePage.keybindingsReference', "Keyboard shortcuts reference"))}</a></li>
<li><a href="https://github.com/Microsoft/vscode">${escape(localize('welcomePage.gitHubRepository', "GitHub repository"))}</a></li>
<li><a href="http://stackoverflow.com/questions/tagged/vscode?sort=votes&pageSize=50">${escape(localize('welcomePage.stackOverflow', "Stack Overflow"))}</a></li>
</ul>
</div>
<p class="showOnStartup"><input type="checkbox" id="showOnStartup"> <label for="showOnStartup">${escape(localize('welcomePage.showOnStartup', "Show welcome page on startup"))}</label></p>
</div>
<div class="commands">
<h2>${escape(localize('welcomePage.quickLinks', "Quick links"))}</h2>
<ul>
<li class="showInteractivePlayground"><button data-href="command:workbench.action.showInteractivePlayground"><h3>${escape(localize('welcomePage.interactivePlayground', "Interactive playground"))}</h3> <span>${escape(localize('welcomePage.interactivePlaygroundDescription', "Try essential editor features out in a short walkthrough"))}</span></button></li>
<li class="showInterfaceOverview"><button data-href="command:workbench.action.showInterfaceOverview"><h3>${escape(localize('welcomePage.interfaceOverview', "Interface overview"))}</h3> <span>${escape(localize('welcomePage.interfaceOverviewDescription', "Get a visual overlay highlighting the major components of the UI"))}</span></button></li>
<li class="selectTheme"><button data-href="command:workbench.action.selectTheme"><h3>${escape(localize('welcomePage.colorTheme', "Color theme"))}</h3> <span>${escape(localize('welcomePage.colorThemeDescription', "Make the editor and your code look the way you love"))}</span></button></li>
<li class="keybindingsReference"><button data-href="command:workbench.action.keybindingsReference"><h3>${escape(localize('welcomePage.keybindingsReference', "Keyboard shortcuts reference"))}</h3> <span>${escape(localize('welcomePage.keybindingsReferenceDescription', "A printable PDF with the most common keyboard shortcuts"))}</span></button></li>
<li class="showCommands"><button data-href="command:workbench.action.showCommands"><h3>${escape(localize('welcomePage.showCommands', "Find and run all commands"))}</h3> <span>${escape(localize('welcomePage.showCommandsDescription', "Rapidly access and search commands from the control panel ({0})")).replace('{0}', '<span class="shortcut" data-command="workbench.action.showCommands"></span>')}</span></button></li>
<li class="openGlobalSettings"><button data-href="command:workbench.action.openGlobalSettings"><h3>${escape(localize('welcomePage.configureSettings', "Configure settings"))}</h3> <span>${escape(localize('welcomePage.configureSettingsDescription', "Unlock the full power of VS Code by tweaking the settings"))}</span></button></li>
<li class="showRecommendedKeymapExtensions"><button data-href="command:workbench.extensions.action.showRecommendedKeymapExtensions"><h3>${escape(localize('welcomePage.installKeymapDescription', "Install keyboard shortcuts"))}</h3> <span>${escape(localize('welcomePage.installKeymap', "Install the keyboard shortcuts of {0}, {1}, {2} and {3}"))
<div class="section customize">
<h2>${escape(localize('welcomePage.customize', "Customize"))}</h2>
<ul>
<li class="showRecommendedKeymapExtensions"><button data-href="command:workbench.extensions.action.showRecommendedKeymapExtensions"><h3>${escape(localize('welcomePage.installKeymapDescription', "Install keyboard shortcuts"))}</h3> <span>${escape(localize('welcomePage.installKeymap', "Install the keyboard shortcuts of {0}, {1}, {2} and {3}"))
.replace('{0}', `<a class="installKeymap" data-keymap-name="${escape(localize('welcomePage.vim', "Vim"))}" data-keymap="vscodevim.vim" href="javascript:void(0)">${escape(localize('welcomePage.vim', "Vim"))}</a><span class="currentKeymap" data-keymap="vscodevim.vim">${escape(localize('welcomePage.vimCurrent', "Vim (current)"))}</span>`)
.replace('{1}', `<a class="installKeymap" data-keymap-name="${escape(localize('welcomePage.sublime', "Sublime"))}" data-keymap="ms-vscode.sublime-keybindings" href="javascript:void(0)">${escape(localize('welcomePage.sublime', "Sublime"))}</a><span class="currentKeymap" data-keymap="ms-vscode.sublime-keybindings">${escape(localize('welcomePage.sublimeCurrent', "Sublime (current)"))}</span>`)
.replace('{2}', `<a class="installKeymap" data-keymap-name="${escape(localize('welcomePage.atom', "Atom"))}" data-keymap="ms-vscode.atom-keybindings" href="javascript:void(0)">${escape(localize('welcomePage.atom', "Atom"))}</a><span class="currentKeymap" data-keymap="ms-vscode.atom-keybindings">${escape(localize('welcomePage.atomCurrent', "Atom (current)"))}</span>`)
.replace('{3}', `<a href="command:workbench.extensions.action.showRecommendedKeymapExtensions">${escape(localize('welcomePage.others', "others"))}</a>`)}
</span></button></li>
</ul>
</span></button></li>
<li class="selectTheme"><button data-href="command:workbench.action.selectTheme"><h3>${escape(localize('welcomePage.colorTheme', "Color theme"))}</h3> <span>${escape(localize('welcomePage.colorThemeDescription', "Make the editor and your code look the way you love"))}</span></button></li>
<li class="openGlobalSettings"><button data-href="command:workbench.action.openGlobalSettings"><h3>${escape(localize('welcomePage.configureSettings', "Configure settings"))}</h3> <span>${escape(localize('welcomePage.configureSettingsDescription', "Unlock the full power of VS Code by tweaking the settings"))}</span></button></li>
</ul>
</div>
<div class="section learn">
<h2>${escape(localize('welcomePage.learn', "Learn"))}</h2>
<ul>
<li class="showCommands"><button data-href="command:workbench.action.showCommands"><h3>${escape(localize('welcomePage.showCommands', "Find and run all commands"))}</h3> <span>${escape(localize('welcomePage.showCommandsDescription', "Rapidly access and search commands from the control panel ({0})")).replace('{0}', '<span class="shortcut" data-command="workbench.action.showCommands"></span>')}</span></button></li>
<li class="showInterfaceOverview"><button data-href="command:workbench.action.showInterfaceOverview"><h3>${escape(localize('welcomePage.interfaceOverview', "Interface overview"))}</h3> <span>${escape(localize('welcomePage.interfaceOverviewDescription', "Get a visual overlay highlighting the major components of the UI"))}</span></button></li>
<li class="showInteractivePlayground"><button data-href="command:workbench.action.showInteractivePlayground"><h3>${escape(localize('welcomePage.interactivePlayground', "Interactive playground"))}</h3> <span>${escape(localize('welcomePage.interactivePlaygroundDescription', "Try essential editor features out in a short walkthrough"))}</span></button></li>
</ul>
</div>
<div class="section quickLinks">
<h2>${escape(localize('welcomePage.quickLinks', "Quick links"))}</h2>
<ul>
<li class="keybindingsReference"><button data-href="command:workbench.action.keybindingsReference"><h3>${escape(localize('welcomePage.keybindingsReference', "Keyboard shortcuts reference"))}</h3> <span>${escape(localize('welcomePage.keybindingsReferenceDescription', "A printable PDF with the most common keyboard shortcuts"))}</span></button></li>
</ul>
</div>
</div>
</div>
</div>
Expand Down
13 changes: 11 additions & 2 deletions src/vs/workbench/parts/welcome/page/electron-browser/welcomePage.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -195,13 +195,22 @@ class WelcomePage {
});
}).then(null, onUnexpectedError);

if (this.telemetryService.getExperiments().reorderQuickLinks) {
const customize = container.querySelector('.commands .section.customize');
const learn = container.querySelector('.commands .section.learn');
const quickLinks = container.querySelector('.commands .section.quickLinks');
if (this.telemetryService.getExperiments().mergeQuickLinks) {
const ul = quickLinks.querySelector('ul');
reorderedQuickLinks.forEach(clazz => {
const link = container.querySelector(`.commands .${clazz}`);
if (link) {
link.parentElement.appendChild(link);
ul.appendChild(link);
}
});
customize.remove();
learn.remove();
container.querySelector('.keybindingsReferenceLink').remove();
} else {
quickLinks.remove();
}

container.addEventListener('click', event => {
Expand Down

0 comments on commit 50ed5aa

Please sign in to comment.