diff --git a/settings.json.docker b/settings.json.docker index da1d51c13a8a..610993f6388c 100644 --- a/settings.json.docker +++ b/settings.json.docker @@ -643,7 +643,7 @@ "right": [ ["importexport", "timeslider", "savedrevision"], ["settings", "embed"], - ["showusers"] + ["showusers","exit"] ], "timeslider": [ ["timeslider_export", "timeslider_returnToPad"] diff --git a/settings.json.template b/settings.json.template index 2d856f42e4c0..79578398ff78 100644 --- a/settings.json.template +++ b/settings.json.template @@ -642,7 +642,7 @@ "right": [ ["importexport", "timeslider", "savedrevision"], ["settings", "embed"], - ["showusers"] + ["showusers"],["exit"] ], "timeslider": [ ["timeslider_export", "timeslider_returnToPad"] diff --git a/src/locales/en.json b/src/locales/en.json index 5305a7025dec..540deebeb001 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -54,6 +54,7 @@ "pad.toolbar.settings.title": "Settings", "pad.toolbar.embed.title": "Share and Embed this pad", "pad.toolbar.showusers.title": "Show the users on this pad", + "pad.toolbar.help.title": "Exit to Home", "pad.colorpicker.save": "Save", "pad.colorpicker.cancel": "Cancel", diff --git a/src/node/utils/Settings.ts b/src/node/utils/Settings.ts index 4d7b421e1c88..5c3ed2b55bd0 100644 --- a/src/node/utils/Settings.ts +++ b/src/node/utils/Settings.ts @@ -246,7 +246,7 @@ exports.toolbar = { right: [ ['importexport', 'timeslider', 'savedrevision'], ['settings', 'embed'], - ['showusers'], + ['showusers','exit'], ], timeslider: [ ['timeslider_export', 'timeslider_settings', 'timeslider_returnToPad'], diff --git a/src/node/utils/toolbar.ts b/src/node/utils/toolbar.ts index f0ef454791cd..cfbbcbbbacde 100644 --- a/src/node/utils/toolbar.ts +++ b/src/node/utils/toolbar.ts @@ -258,6 +258,11 @@ module.exports = { localizationId: 'timeslider.toolbar.returnbutton', class: 'buttontext', }, + exit:{ + command: 'exit', + localizationId: 'pad.toolbar.exit.title', + class: 'buttonicon buttonicon-exit', + }, }, registerButton(buttonName: string, buttonInfo: any) { diff --git a/src/static/css/pad.css b/src/static/css/pad.css index 5ef192509a71..4bd7f524194f 100644 --- a/src/static/css/pad.css +++ b/src/static/css/pad.css @@ -12,6 +12,7 @@ @import url("pad/gritter.css"); @import url("pad/loadingbox.css"); @import url("pad/form.css"); +@import url("pad/exit-button.css"); html { font-size: 15px; diff --git a/src/static/css/pad/exit-button.css b/src/static/css/pad/exit-button.css new file mode 100644 index 000000000000..20305fa9be3f --- /dev/null +++ b/src/static/css/pad/exit-button.css @@ -0,0 +1,8 @@ +.buttonicon-exit:before { + content: "\2715"; + margin-right: 5px; +} + +#exit-button { + cursor: pointer; +} diff --git a/src/static/js/pad_editbar.ts b/src/static/js/pad_editbar.ts index d98174fe5681..a84deac89018 100644 --- a/src/static/js/pad_editbar.ts +++ b/src/static/js/pad_editbar.ts @@ -381,6 +381,10 @@ exports.padeditbar = new class { $('.exportlink').first().trigger('focus'); } }); + this.registerCommand('exit', () => { + console.log('Exit button clicked'); + window.location.href = '/'; + }); this.registerCommand('showusers', () => { this.toggleDropDown('users'); @@ -478,5 +482,8 @@ exports.padeditbar = new class { .substring(0, document.location.href.lastIndexOf('/')); } }); + + + } }(); diff --git a/src/static/js/pad_editor.ts b/src/static/js/pad_editor.ts index a68217a88d35..ea58717ed0f0 100644 --- a/src/static/js/pad_editor.ts +++ b/src/static/js/pad_editor.ts @@ -217,3 +217,7 @@ exports.focusOnLine = (ace) => { } // End of setSelection / set Y position of editor }; + +// toolbar.registerCommand('exit', () => { +// window.location.href = '/'; +// }); diff --git a/src/tests/frontend-new/helper/padHelper.ts b/src/tests/frontend-new/helper/padHelper.ts index f52cd0a356e2..ce995815bc4d 100644 --- a/src/tests/frontend-new/helper/padHelper.ts +++ b/src/tests/frontend-new/helper/padHelper.ts @@ -25,7 +25,9 @@ export const setUserName = async (page: Page, userName: string) => { await page.click("input[data-l10n-id='pad.userlist.entername']"); await page.keyboard.type(userName); } - +export const exitPad = async (page: Page) => { + await page.locator("button[data-l10n-id='pad.toolbar.exit.title']").click(); +} export const showChat = async (page: Page) => { const chatIcon = page.locator("#chaticon") diff --git a/src/tests/frontend/helper/ui.ts b/src/tests/frontend/helper/ui.ts index 69e6b7d406b8..e05ff322e1ce 100644 --- a/src/tests/frontend/helper/ui.ts +++ b/src/tests/frontend/helper/ui.ts @@ -85,6 +85,14 @@ helper.toggleUserList = async () => { await helper.waitForPromise(() => !isVisible); }; +helper.exitButton = () => helper.padChrome$("button[data-l10n-id='pad.toolbar.exit.title']"); + +helper.exitPad = async () => { + const button = helper.exitButton(); + button.trigger('click'); + await helper.waitForPromise(() => window.location.pathname === '/'); +}; + /** * Gets the user name input field *