isa/gnome-shell
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

runDialog: Implement the new dialog design

Browse Source 
Implement the new design according to the mockups in
https://gitlab.gnome.org/GNOME/gnome-shell/issues/1343.

https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/960
This commit is contained in:
Jonas Dreßler 2019-12-08 13:09:25 +01:00 committed by Florian Müllner
parent 26b78e7d77
commit 5e08c80857
2 changed files with 32 additions and 64 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
data/theme/gnome-shell-sass/widgets/_dialogs.scss
View File

@ -58,17 +58,15 @@
/* Run Dialog */ /* Run Dialog */
.run-dialog { .run-dialog {
.run-dialog-entry { width: 20em; margin-bottom: 6px; } .modal-dialog-content-box {
.run-dialog-error-box { margin-top: 24px;
padding-top: 16px; margin-bottom: 14px;
spacing: 6px;
} }
.run-dialog-entry { width: 20em; }
.run-dialog-label { .run-dialog-description {
@include fontsize($base_font_size + 1.1); @include fontsize($base_font_size - 1);
font-weight: normal; text-align: center;
color: $fg_color; color: darken($fg_color, 20%);
padding-bottom: .4em;
} }
} }

78
js/ui/runDialog.js
View File

@ -3,6 +3,7 @@
const { Clutter, Gio, GLib, GObject, Meta, Shell, St } = imports.gi; const { Clutter, Gio, GLib, GObject, Meta, Shell, St } = imports.gi;
const Dialog = imports.ui.dialog;
const Main = imports.ui.main; const Main = imports.ui.main;
const ModalDialog = imports.ui.modalDialog; const ModalDialog = imports.ui.modalDialog;
const ShellEntry = imports.ui.shellEntry; const ShellEntry = imports.ui.shellEntry;
@ -18,8 +19,6 @@ const TERMINAL_SCHEMA = 'org.gnome.desktop.default-applications.terminal';
const EXEC_KEY = 'exec'; const EXEC_KEY = 'exec';
const EXEC_ARG_KEY = 'exec-arg'; const EXEC_ARG_KEY = 'exec-arg';
var DIALOG_GROW_TIME = 100;
var RunDialog = GObject.registerClass( var RunDialog = GObject.registerClass(
class RunDialog extends ModalDialog.ModalDialog { class RunDialog extends ModalDialog.ModalDialog {
_init() { _init() {
@ -56,11 +55,10 @@ class RunDialog extends ModalDialog.ModalDialog {
}, },
}; };
let label = new St.Label({ let title = _('Run a Command');
style_class: 'run-dialog-label',
text: _("Enter a Command"), let content = new Dialog.MessageDialogContent({ title });
}); this.contentLayout.add_actor(content);
this.contentLayout.add_child(label);
let entry = new St.Entry({ let entry = new St.Entry({
style_class: 'run-dialog-entry', style_class: 'run-dialog-entry',
@ -68,42 +66,20 @@ class RunDialog extends ModalDialog.ModalDialog {
}); });
ShellEntry.addContextMenu(entry); ShellEntry.addContextMenu(entry);
entry.label_actor = label;
this._entryText = entry.clutter_text; this._entryText = entry.clutter_text;
this.contentLayout.add_child(entry); content.add_child(entry);
this.setInitialKeyFocus(this._entryText); this.setInitialKeyFocus(this._entryText);
this._errorBox = new St.BoxLayout({ style_class: 'run-dialog-error-box' }); let defaultDescriptionText = _('Press ESC to close');
this.contentLayout.add_child(this._errorBox); this._descriptionLabel = new St.Label({
style_class: 'run-dialog-description',
let errorIcon = new St.Icon({ text: defaultDescriptionText,
icon_name: 'dialog-error-symbolic',
icon_size: 24,
style_class: 'run-dialog-error-icon',
y_align: Clutter.ActorAlign.CENTER,
}); });
this._errorBox.add_child(errorIcon); content.add_child(this._descriptionLabel);
this._commandError = false; this._commandError = false;
this._errorMessage = new St.Label({
style_class: 'run-dialog-error-label',
y_align: Clutter.ActorAlign.CENTER,
});
this._errorMessage.clutter_text.line_wrap = true;
this._errorBox.add_child(this._errorMessage);
this._errorBox.hide();
this.setButtons([{
action: this.close.bind(this),
label: _("Close"),
key: Clutter.KEY_Escape,
}]);
this._pathCompleter = new Gio.FilenameCompleter(); this._pathCompleter = new Gio.FilenameCompleter();
this._history = new History.HistoryManager({ this._history = new History.HistoryManager({
@ -136,6 +112,18 @@ class RunDialog extends ModalDialog.ModalDialog {
} }
return Clutter.EVENT_PROPAGATE; return Clutter.EVENT_PROPAGATE;
}); });
this._entryText.connect('text-changed', () => {
this._descriptionLabel.set_text(defaultDescriptionText);
});
}
vfunc_key_release_event(event) {
if (event.keyval === Clutter.KEY_Escape) {
this.close();
return Clutter.EVENT_STOP;
}
return Clutter.EVENT_PROPAGATE;
} }
_getCommandCompletion(text) { _getCommandCompletion(text) {
@ -242,24 +230,7 @@ class RunDialog extends ModalDialog.ModalDialog {
_showError(message) { _showError(message) {
this._commandError = true; this._commandError = true;
this._descriptionLabel.set_text(message);
this._errorMessage.set_text(message);
if (!this._errorBox.visible) {
let [, errorBoxNaturalHeight] = this._errorBox.get_preferred_height(-1);
let parentActor = this._errorBox.get_parent();
let height = parentActor.height + errorBoxNaturalHeight;
parentActor.ease({
height,
duration: DIALOG_GROW_TIME,
mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onComplete: () => {
parentActor.set_height(-1);
this._errorBox.show();
},
});
}
} }
_restart() { _restart() {
@ -274,7 +245,6 @@ class RunDialog extends ModalDialog.ModalDialog {
open() { open() {
this._history.lastItem(); this._history.lastItem();
this._errorBox.hide();
this._entryText.set_text(''); this._entryText.set_text('');
this._commandError = false; this._commandError = false;