From af4e54bfc938bb1b898705d7a3c67ad2f754b6a2 Mon Sep 17 00:00:00 2001 From: Bastien Nocera Date: Mon, 1 Feb 2021 10:20:48 +0100 Subject: [PATCH] =?UTF-8?q?welcomeDialog:=20Add=20=E2=80=9Cwelcome?= =?UTF-8?q?=E2=80=9D=20dialog?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit As designed at: https://gitlab.gnome.org/Teams/Design/os-mockups/-/blob/master/greeter/welcome-dialog.png Closes: https://gitlab.gnome.org/GNOME/gnome-shell/-/issues/3632 Part-of: --- data/gnome-shell-theme.gresource.xml | 1 + .../gnome-shell-sass/widgets/_dialogs.scss | 9 + data/theme/gnome-shell-start.svg | 343 ++++++++++++++++++ js/js-resources.gresource.xml | 1 + js/ui/main.js | 11 + js/ui/welcomeDialog.js | 59 +++ po/POTFILES.in | 1 + 7 files changed, 425 insertions(+) create mode 100644 data/theme/gnome-shell-start.svg create mode 100644 js/ui/welcomeDialog.js diff --git a/data/gnome-shell-theme.gresource.xml b/data/gnome-shell-theme.gresource.xml index 1f6908827..038c87cf0 100644 --- a/data/gnome-shell-theme.gresource.xml +++ b/data/gnome-shell-theme.gresource.xml @@ -10,6 +10,7 @@ dash-placeholder.svg gnome-shell.css gnome-shell-high-contrast.css + gnome-shell-start.svg message-indicator-symbolic.svg no-events.svg no-notifications.svg diff --git a/data/theme/gnome-shell-sass/widgets/_dialogs.scss b/data/theme/gnome-shell-sass/widgets/_dialogs.scss index 0f568b73a..6eb1cc10a 100644 --- a/data/theme/gnome-shell-sass/widgets/_dialogs.scss +++ b/data/theme/gnome-shell-sass/widgets/_dialogs.scss @@ -162,3 +162,12 @@ .audio-selection-device-icon { icon-size: $base_icon_size * 4; } + +/* Welcome dialog */ +.welcome-dialog-image { + background-image: url("resource:///org/gnome/shell/theme/gnome-shell-start.svg"); + background-size: contain; + /* Reasonable maximum dimensions */ + height: 300px; + width: 300px; +} diff --git a/data/theme/gnome-shell-start.svg b/data/theme/gnome-shell-start.svg new file mode 100644 index 000000000..af139cf0d --- /dev/null +++ b/data/theme/gnome-shell-start.svg @@ -0,0 +1,343 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/js/js-resources.gresource.xml b/js/js-resources.gresource.xml index a51ff9542..30582aad0 100644 --- a/js/js-resources.gresource.xml +++ b/js/js-resources.gresource.xml @@ -106,6 +106,7 @@ ui/unlockDialog.js ui/userWidget.js ui/viewSelector.js + ui/welcomeDialog.js ui/windowAttentionHandler.js ui/windowMenu.js ui/windowManager.js diff --git a/js/ui/main.js b/js/ui/main.js index bff730c5b..f488279d0 100644 --- a/js/ui/main.js +++ b/js/ui/main.js @@ -29,6 +29,7 @@ const PadOsd = imports.ui.padOsd; const Panel = imports.ui.panel; const Params = imports.misc.params; const RunDialog = imports.ui.runDialog; +const WelcomeDialog = imports.ui.welcomeDialog; const Layout = imports.ui.layout; const LoginManager = imports.misc.loginManager; const LookingGlass = imports.ui.lookingGlass; @@ -58,6 +59,7 @@ var panel = null; var overview = null; var runDialog = null; var lookingGlass = null; +var welcomeDialog = null; var wm = null; var messageTray = null; var screenShield = null; @@ -120,6 +122,8 @@ function _sessionUpdated() { runDialog.close(); if (lookingGlass) lookingGlass.close(); + if (welcomeDialog) + welcomeDialog.close(); } let remoteAccessController = global.backend.get_remote_access_controller(); @@ -642,6 +646,13 @@ function openRunDialog() { runDialog.open(); } +function openWelcomeDialog() { + if (welcomeDialog === null) + welcomeDialog = new WelcomeDialog.WelcomeDialog(); + + welcomeDialog.open(); +} + /** * activateWindow: * @param {Meta.Window} window: the window to activate diff --git a/js/ui/welcomeDialog.js b/js/ui/welcomeDialog.js new file mode 100644 index 000000000..0b6dc4939 --- /dev/null +++ b/js/ui/welcomeDialog.js @@ -0,0 +1,59 @@ +// -*- mode: js; js-indent-level: 4; indent-tabs-mode: nil -*- +/* exported WelcomeDialog */ + +const { Clutter, GObject, Shell, St } = imports.gi; + +const Config = imports.misc.config; +const Dialog = imports.ui.dialog; +const ModalDialog = imports.ui.modalDialog; + +var DialogResponse = { + NO_THANKS: 0, + TAKE_TOUR: 1, +}; + +var WelcomeDialog = GObject.registerClass( +class WelcomeDialog extends ModalDialog.ModalDialog { + _init() { + super._init({ styleClass: 'welcome-dialog' }); + + const appSystem = Shell.AppSystem.get_default(); + this._tourAppInfo = appSystem.lookup_app('org.gnome.Tour.desktop'); + + this._buildLayout(); + } + + open() { + if (!this._tourAppInfo) + return; + + super.open(); + } + + _buildLayout() { + const [majorVersion] = Config.PACKAGE_VERSION.split('.'); + const title = _('Welcome to GNOME %s'.format(majorVersion)); + const description = _('If you want to learn your way around, check out the tour.'); + const content = new Dialog.MessageDialogContent({ title, description }); + + const icon = new St.Widget({ style_class: 'welcome-dialog-image' }); + content.insert_child_at_index(icon, 0); + + this.contentLayout.add_child(content); + + this.addButton({ label: _('No Thanks'), + action: () => { + this._sendResponse(DialogResponse.NO_THANKS); + }, + key: Clutter.KEY_Escape }); + this.addButton({ label: _('Take Tour'), + action: () => this._sendResponse(DialogResponse.TAKE_TOUR) }); + } + + _sendResponse(response) { + if (response === DialogResponse.TAKE_TOUR) + this._tourAppInfo.launch(0, -1, Shell.AppLaunchGpu.APP_PREF); + + this.close(); + } +}); diff --git a/po/POTFILES.in b/po/POTFILES.in index 745ea58f1..4f83b62cf 100644 --- a/po/POTFILES.in +++ b/po/POTFILES.in @@ -67,6 +67,7 @@ js/ui/status/volume.js js/ui/switchMonitor.js js/ui/unlockDialog.js js/ui/viewSelector.js +js/ui/welcomeDialog.js js/ui/windowAttentionHandler.js js/ui/windowManager.js js/ui/windowMenu.js