Commit 802cca45 authored by Cédric Krier's avatar Cédric Krier
Browse files

Use toggle button and label on translate dialog

A toggle button with a label is easier to understand that it should be toggled
to edit.
It is cleaner to only display a fuzzy label than having a column of
checkboxes.

Closes #3125
parent dd9957790a47
Pipeline #61575 passed with stages
in 17 minutes and 31 seconds
* Use toggle button and label on translate dialog
* Support border type of images
* Manage domain on id in single value list as unique
* Do not validate domain and enforce uniqueness for empty fields unless they're required
......
......@@ -50,6 +50,14 @@
z-index: 3;
}
.input-group-addon {
> .label {
position: absolute;
right: 0px;
top: -5px;
}
}
.navbar-inverse {
.close {
color: @navbar-inverse-link-color;
......
......@@ -1313,7 +1313,7 @@
class_: 'form',
init: function(languages, widget) {
var dialog = new Sao.Dialog(
Sao.i18n.gettext('Translate'), this.class_, 'lg');
Sao.i18n.gettext('Translate'), this.class_, 'md');
this.languages = languages;
this.read(widget, dialog);
jQuery('<button/>', {
......@@ -1350,6 +1350,7 @@
function field_value(result) {
return result[0][widget.field_name] || '';
}
dialog.content.addClass('form-horizontal');
this.languages.forEach(lang => {
var value;
var row = jQuery('<div/>', {
......@@ -1353,7 +1354,7 @@
this.languages.forEach(lang => {
var value;
var row = jQuery('<div/>', {
'class':'row form-group'
'class':'form-group'
});
var input = widget.translate_widget();
input.attr('data-lang-id', lang.id);
......@@ -1357,8 +1358,8 @@
});
var input = widget.translate_widget();
input.attr('data-lang-id', lang.id);
var checkbox = jQuery('<input/>', {
'type':'checkbox',
'title': Sao.i18n.gettext('Edit')
});
var edit = jQuery('<button/>', {
'type': 'button',
'class': 'btn btn-default',
}).text(Sao.i18n.gettext('Edit'));
if (widget._readonly) {
......@@ -1364,3 +1365,3 @@
if (widget._readonly) {
checkbox.attr('disabled', true);
edit.attr('disabled', true);
}
......@@ -1366,8 +1367,6 @@
}
var fuzzy_box = jQuery('<input/>', {
'type':'checkbox',
'disabled': true,
'title': Sao.i18n.gettext('Fuzzy')
var fuzzy_label = jQuery('<span>', {
'class': 'label',
});
var prm1 = Sao.rpc({
'method': 'model.' + widget.model.name + '.read',
......@@ -1392,5 +1391,8 @@
jQuery.when(prm1, prm2).done(function(value, fuzzy_value) {
widget.translate_widget_set(input, fuzzy_value);
widget.translate_widget_set_readonly( input, true);
fuzzy_box.attr('checked', value !== fuzzy_value);
if (value !== fuzzy_value) {
fuzzy_label.addClass('label-warning');
fuzzy_label.text(Sao.i18n.gettext("Fuzzy"));
}
});
......@@ -1396,3 +1398,4 @@
});
checkbox.click(function() {
edit.click(function() {
jQuery(this).toggleClass('active');
widget.translate_widget_set_readonly(
......@@ -1398,4 +1401,4 @@
widget.translate_widget_set_readonly(
input, !jQuery(this).prop('checked'));
input, !jQuery(this).hasClass('active'));
});
dialog.body.append(row);
......@@ -1400,6 +1403,8 @@
});
dialog.body.append(row);
row.append(jQuery('<div/>', {
'class':'col-sm-2'
}).append(lang.name));
input.uniqueId();
row.append(jQuery('<label/>', {
'for': input.attr('id'),
'class': 'col-sm-3 control-label',
}).append(' ' + lang.name));
row.append(jQuery('<div/>', {
......@@ -1405,12 +1410,9 @@
row.append(jQuery('<div/>', {
'class':'col-sm-8'
}).append(input));
row.append(jQuery('<div/>', {
'class':'col-sm-1'
}).append(checkbox));
row.append(jQuery('<div/>', {
'class':'col-sm-1'
}).append(fuzzy_box));
'class': 'col-sm-9 input-group',
}).append(input)
.append(jQuery('<span/>', {
'class': 'input-group-addon',
}).append(edit).append(fuzzy_label)));
});
},
write: function(widget, dialog) {
......@@ -2297,5 +2299,5 @@
this.input.prop('readonly', readonly);
},
translate_widget: function() {
return jQuery('<textarea/>', {
var widget = jQuery('<textarea/>', {
'class': 'form-control',
......@@ -2301,3 +2303,3 @@
'class': 'form-control',
'readonly': 'readonly'
'readonly': 'readonly',
});
......@@ -2303,4 +2305,6 @@
});
widget.css('min-height', this.el.height());
return widget;
}
});
......
* Use toggle button and label on translate dialog
* Manage domain on id in single value list as unique
* Do not validate domain and enforce uniqueness for empty fields unless they're required
* Display the number of selected records on xxx2Many
......
......@@ -30,6 +30,9 @@
label.editable {
font-style: italic;
}
label.warning {
color: @warning_color;
}
.window-title, .wizard-title {
font-size: large;
font-weight: bold;
......
......@@ -204,6 +204,6 @@
widget.set_vexpand(self.widget.expand)
widget.set_hexpand(True)
grid.attach(widget, 1, i, 1, 1)
editing = Gtk.CheckButton()
editing = Gtk.ToggleButton(label=_("Edit"))
editing.connect('toggled', self.editing_toggled, widget)
editing.props.sensitive = not readonly
......@@ -208,4 +208,3 @@
editing.connect('toggled', self.editing_toggled, widget)
editing.props.sensitive = not readonly
tooltips.set_tip(editing, _('Edit'))
grid.attach(editing, 2, i, 1, 1)
......@@ -211,10 +210,9 @@
grid.attach(editing, 2, i, 1, 1)
fuzzy = Gtk.CheckButton()
fuzzy.set_active(value != fuzzy_value)
fuzzy.props.sensitive = False
tooltips.set_tip(fuzzy, _('Fuzzy'))
grid.attach(fuzzy, 4, i, 1, 1)
self.widgets[language['code']] = (widget, editing, fuzzy)
if value != fuzzy_value:
fuzzy = Gtk.Label(_("Fuzzy"))
widget_class(fuzzy, 'warning', True)
grid.attach(fuzzy, 4, i, 1, 1)
self.widgets[language['code']] = (widget, editing)
tooltips.enable()
vbox = Gtk.VBox()
......@@ -241,7 +239,7 @@
def response(self, win, response):
if response == Gtk.ResponseType.OK:
for code, widget in self.widgets.items():
widget, editing, fuzzy = widget
widget, editing = widget
if not editing.get_active():
continue
value = self.widget.translate_widget_get(widget)
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment