brl/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-entry { width: 20em; margin-bottom: 6px; }
.run-dialog-error-box {
padding-top: 16px;
spacing: 6px;
.modal-dialog-content-box {
margin-top: 24px;
margin-bottom: 14px;
}
.run-dialog-label {
@include fontsize($base_font_size + 1.1);
font-weight: normal;
color: $fg_color;
padding-bottom: .4em;
.run-dialog-entry { width: 20em; }
.run-dialog-description {
@include fontsize($base_font_size - 1);
text-align: center;
color: darken($fg_color, 20%);
}
}

78
js/ui/runDialog.js
View File

@ -3,6 +3,7 @@
const { Clutter, Gio, GLib, GObject, Meta, Shell, St } = imports.gi;
const Dialog = imports.ui.dialog;
const Main = imports.ui.main;
const ModalDialog = imports.ui.modalDialog;
const ShellEntry = imports.ui.shellEntry;
@ -18,8 +19,6 @@ const TERMINAL_SCHEMA = 'org.gnome.desktop.default-applications.terminal';
const EXEC_KEY = 'exec';
const EXEC_ARG_KEY = 'exec-arg';
var DIALOG_GROW_TIME = 100;
var RunDialog = GObject.registerClass(
class RunDialog extends ModalDialog.ModalDialog {
_init() {
@ -56,11 +55,10 @@ class RunDialog extends ModalDialog.ModalDialog {
},
};
let label = new St.Label({
style_class: 'run-dialog-label',
text: _("Enter a Command"),
});
this.contentLayout.add_child(label);
let title = _('Run a Command');
let content = new Dialog.MessageDialogContent({ title });
this.contentLayout.add_actor(content);
let entry = new St.Entry({
style_class: 'run-dialog-entry',
@ -68,42 +66,20 @@ class RunDialog extends ModalDialog.ModalDialog {
});
ShellEntry.addContextMenu(entry);
entry.label_actor = label;
this._entryText = entry.clutter_text;
this.contentLayout.add_child(entry);
content.add_child(entry);
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);
let errorIcon = new St.Icon({
icon_name: 'dialog-error-symbolic',
icon_size: 24,
style_class: 'run-dialog-error-icon',
y_align: Clutter.ActorAlign.CENTER,
this._descriptionLabel = new St.Label({
style_class: 'run-dialog-description',
text: defaultDescriptionText,
});
this._errorBox.add_child(errorIcon);
content.add_child(this._descriptionLabel);
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._history = new History.HistoryManager({
@ -136,6 +112,18 @@ class RunDialog extends ModalDialog.ModalDialog {
}
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) {
@ -242,24 +230,7 @@ class RunDialog extends ModalDialog.ModalDialog {
_showError(message) {
this._commandError = true;
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();
},
});
}
this._descriptionLabel.set_text(message);
}
_restart() {
@ -274,7 +245,6 @@ class RunDialog extends ModalDialog.ModalDialog {
open() {
this._history.lastItem();
this._errorBox.hide();
this._entryText.set_text('');
this._commandError = false;