[MIG] web_translate_dialog

pull/1801/head
Antonio Espinosa 2016-07-21 09:37:53 +02:00 committed by fshah
parent 536d96010b
commit f307c83510
6 changed files with 335 additions and 261 deletions

View File

@ -1,7 +1,15 @@
.. image:: https://img.shields.io/badge/licence-AGPL--3-blue.svg
:target: http://www.gnu.org/licenses/agpl-3.0-standalone.html
:alt: License: AGPL-3
====================
Web Translate Dialog Web Translate Dialog
==================== ====================
This module replaces the standard translation view by an easy-to-use pop-up view where you can translate all the fields of the object in all the installed languages (for long-time users, it may remind them the translation pop-up of OpenERP 6.1). This module replaces the standard translation view by an easy-to-use pop-up
view where you can translate all the fields of the object in all the installed
languages (for long-time users, it may remind them the translation pop-up of
OpenERP 6.1).
This module also features: This module also features:
@ -12,25 +20,53 @@ This module also features:
Usage Usage
===== =====
Go to an object that has translatable fields (*Products* for example) and select *More > Translate* (or click on *Edit* and then click on the flag at the top-right of one of the translatable fields): the translation view will pop-up on your screen. This translation view contains all the translatable fields of the object. Go to an object that has translatable fields (*Products* for example) and
select *More > Translate* (or click on *Edit* and then click on the flag at
the top-right of one of the translatable fields): the translation view will
pop-up on your screen. This translation view contains all the translatable
fields of the object.
If you click in the standard translate icon then the translation view will
pop-up with this field only.
.. image:: https://odoo-community.org/website/image/ir.attachment/5784_f2813bd/datas
:alt: Try me on Runbot
:target: https://runbot.odoo-community.org/runbot/162/9.0
Bug Tracker
===========
Bugs are tracked on `GitHub Issues
<https://github.com/OCA/web/issues>`_. In case of trouble, please
check there if your issue has already been reported. If you spotted it first,
help us smashing it by providing a detailed and welcomed feedback.
Credits Credits
======= =======
Images
------
* Odoo Community Association: `Icon <https://github.com/OCA/maintainer-tools/blob/master/template/module/static/description/icon.svg>`_.
Contributors Contributors
------------ ------------
* Guewen Baconnier (Camptocamp) * Guewen Baconnier (Camptocamp)
* Antonio Espinosa <antonio.espinosa@tecnativa.com>
Maintainer Maintainer
---------- ----------
.. image:: http://odoo-community.org/logo.png .. image:: https://odoo-community.org/logo.png
:alt: Odoo Community Association :alt: Odoo Community Association
:target: http://odoo-community.org :target: https://odoo-community.org
This module is maintained by the OCA. This module is maintained by the OCA.
OCA, or the Odoo Community Association, is a nonprofit organization whose mission is to support the collaborative development of Odoo features and promote its widespread use. OCA, or the Odoo Community Association, is a nonprofit organization whose
mission is to support the collaborative development of Odoo features and
promote its widespread use.
To contribute to this module, please visit http://odoo-community.org. To contribute to this module, please visit https://odoo-community.org.

View File

@ -1,32 +1,26 @@
# -*- coding: utf-8 -*- # -*- coding: utf-8 -*-
############################################################################## # Copyright 2012 Guewen Baconnier (Camptocamp SA)
# # Copyright 2016 Antonio Espinosa <antonio.espinosa@tecnativa.com>
# Author: Guewen Baconnier # License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl).
# Copyright 2012 Camptocamp SA {
# "name": "Web Translate Dialog",
# This program is free software: you can redistribute it and/or modify "summary": "Easy-to-use pop-up to translate fields in several languages",
# it under the terms of the GNU Affero General Public License as "version": "9.0.1.0.0",
# published by the Free Software Foundation, either version 3 of the "category": "Web",
# License, or (at your option) any later version. "website": "https://odoo-community.org/",
# "author": "Camptocamp, "
# This program is distributed in the hope that it will be useful, "Tecnativa, "
# but WITHOUT ANY WARRANTY; without even the implied warranty of "Odoo Community Association (OCA)",
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the "license": "AGPL-3",
# GNU Affero General Public License for more details. "application": False,
# "installable": True,
# You should have received a copy of the GNU Affero General Public License "depends": [
# along with this program. If not, see <http://www.gnu.org/licenses/>. "web",
# ],
############################################################################## "data": [
"view/web_translate.xml",
{"name": "Web Translate Dialog", ],
"category": "Web", "qweb": [
"summary": "Easy-to-use pop-up to translate fields in several languages", "static/src/xml/base.xml",
"license": "AGPL-3", ]
"author": "Camptocamp,Odoo Community Association (OCA)", }
"version": "8.0.1.0.0",
"depends": ['web'],
'data': ['view/web_translate.xml'],
'qweb': ["static/src/xml/base.xml"],
'installable': False,
}

View File

@ -1,3 +1,6 @@
/* Copyright 2012 Guewen Baconnier (Camptocamp SA)
* License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl). */
.openerp .oe_translation_field { .openerp .oe_translation_field {
width: 95%; width: 95%;
} }

View File

@ -1,209 +1,228 @@
openerp.web_translate_dialog = function (instance) { /* Copyright 2012 Guewen Baconnier (Camptocamp SA)
Copyright 2016 Antonio Espinosa <antonio.espinosa@tecnativa.com>
* License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl). */
"use strict"; odoo.define('web_translate_dialog.translate_dialog', function(require){
"use strict";
var QWeb = instance.web.qweb, var _ = require('_');
_t = instance.web._t, var $ = require('$');
_lt = instance.web._lt;
instance.web.FormView.include({ var core = require('web.core');
load_form: function(data) { var data = require('web.data');
var self = this; var common = require('web.form_common');
this._super(data);
if (this.sidebar) {
this.sidebar.add_items('other', _.compact([
self.is_action_enabled('edit') && { label: _t('Translate'), callback: self.on_button_translate },
]));
}
},
on_button_translate: function() {
var self = this;
$.when(this.has_been_loaded).then(function() {
self.open_translate_dialog(this);
});
},
});
instance.web.View.include({ var FormView = require('web.FormView');
open_translate_dialog: function() { var View = require('web.View');
new instance.web_translate_dialog.TranslateDialog(this).open(); var Dialog = require('web.Dialog');
var _t = core._t;
var QWeb = core.qweb;
var translateDialog = Dialog.extend({
template: "TranslateDialog",
init: function(parent, field, content) {
this._super(parent,
{title: _t("Translations"),
width: '90%',
height: '80%'},
content);
this.view_language = this.session.user_context.lang;
this.view = parent;
this.view_type = parent.fields_view.type || '';
this.$view_form = null;
this.$sidebar_form = null;
if (!!field) {
this.translatable_fields_keys = [field];
this.translatable_fields = _.filter(
this.view.translatable_fields || [],
function(i) {return i.name == field;}
);
} else {
this.translatable_fields_keys = _.map(
this.view.translatable_fields || [],
function(i) {return i.name;}
);
this.translatable_fields = this.view.translatable_fields.slice(0);
} }
}); this.languages = null;
this.languages_loaded = $.Deferred();
(new data.DataSetSearch(this, 'res.lang', this.view.dataset.get_context(),
[['translatable', '=', '1']]))
.read_slice(['code', 'name'], { sort: 'id' })
.then(this.on_languages_loaded);
},
on_languages_loaded: function(langs) {
this.languages = langs;
this.languages_loaded.resolve();
},
open: function() {
var self = this,
sup = this._super;
// the template needs the languages
$.when(this.languages_loaded).then(function() {
return sup.call(self);
});
},
start: function() {
var self = this;
this.$el.find('.oe_translation_field').change(function() {
$(this).toggleClass('touched', ($(this).val() != $(this).attr('data-value')));
});
this.$footer.html(QWeb.render("TranslateDialog.buttons"));
this.$footer.find(".oe_form_translate_dialog_save_button").click(function(){
self.on_button_save();
self.on_button_close();
});
this.$footer.find(".oe_form_translate_dialog_cancel_button").click(function(){
self.on_button_close();
});
instance.web_translate_dialog.TranslateDialog = instance.web.Dialog.extend({ this.do_load_fields_values();
template: "TranslateDialog", },
init: function(parent, options, content) { initialize_html_fields: function(lang) {
this._super(parent, var self = this;
{title: _t("Translations"), _.each(this.translatable_fields_keys, function(f) {
width: '90%', // Initialize summernote if HTML field
height: '80%'}, self.$el.find('.oe_form_field_html .oe_translation_field[name="' + lang.code + '-' + f + '"]').each(function() {
content); var $parent = $(this).summernote({
this.view_language = this.session.user_context.lang; 'focus': false,
this.view = parent; 'toolbar': [
this.view_type = parent.fields_view.type || ''; ['style', ['style']],
this.$view_form = null; ['font', ['bold', 'italic', 'underline', 'clear']],
this.$sidebar_form = null; ['fontsize', ['fontsize']],
this.translatable_fields_keys = _.map(this.view.translatable_fields || [], function(i) { return i.name;}); ['color', ['color']],
this.languages = null; ['para', ['ul', 'ol', 'paragraph']],
this.languages_loaded = $.Deferred(); ['table', ['table']],
(new instance.web.DataSetSearch(this, ['insert', ['link', 'picture']],
'res.lang', ['history', ['undo', 'redo']]
this.view.dataset.get_context(), ],
[['translatable', '=', '1']])) 'prettifyHtml': false,
.read_slice(['code', 'name'], { sort: 'id' }) 'styleWithSpan': false,
.then(this.on_languages_loaded); 'inlinemedia': ['p'],
}, 'lang': "odoo",
on_languages_loaded: function(langs) { 'onChange': function (value) {
this.languages = langs; $(this).toggleClass('touched', (value != $(this).attr('data-value')));
this.languages_loaded.resolve();
},
open: function() {
var self = this,
sup = this._super;
// the template needs the languages
$.when(this.languages_loaded).then(function() {
return sup.call(self);
});
},
start: function() {
var self = this;
this.$el.find('.oe_translation_field').change(function() {
$(this).toggleClass('touched', ($(this).val() != $(this).attr('data-value')));
});
this.$buttons.html(QWeb.render("TranslateDialog.buttons"));
this.$buttons.find(".oe_form_translate_dialog_save_button").click(function(){
self.on_button_save();
self.on_button_close();
});
this.$buttons.find(".oe_form_translate_dialog_cancel_button").click(function(){
self.on_button_close();
});
this.initialize_html_fields();
this.do_load_fields_values();
},
initialize_html_fields: function() {
this.$el.find('.oe_form_field_html textarea').each(function() {
var $textarea = $(this);
var width = 100; // forced to fixed size on initialization
// will be changed to percentage right after
// the creation
var height = 250;
$textarea.cleditor({
width: width, // width not including margins, borders or padding
height: height, // height not including margins, borders or padding
controls: // controls to add to the toolbar
"bold italic underline strikethrough " +
"| removeformat | bullets numbering | outdent " +
"indent | link unlink | source",
bodyStyle: // style to assign to document body contained within the editor
"margin:4px; color:#4c4c4c; font-size:13px; font-family:'Lucida Grande',Helvetica,Verdana,Arial,sans-serif; cursor:text"
});
var $cleditor = $textarea.cleditor()[0];
// Down to -- end, this is a workaround for the bug
// https://bugs.launchpad.net/openerp-web/+bug/1258463
// The editor is initially created with a fixed size so
// the buggy event is not bound to $(window), then we restore
// a percentage width and bind the "normal" event without the
// CHM's buggy change.
$cleditor.$main.width('95%');
$cleditor.options.width = '95%';
$(window).resize(function() {
//Forcefully blurred iframe contentWindow, chrome, IE, safari doesn't trigger blur on window resize and due to which text disappears
var contentWindow = $cleditor.$frame[0].contentWindow;
if(!$.browser.mozilla && contentWindow){
$(contentWindow).trigger('blur');
} }
}); }).parent();
$cleditor.refresh(); // Triggers a mouseup to refresh the editor toolbar
// -- end $parent.find('.note-editable').trigger('mouseup');
$parent.find('.note-editing-area').css({
$cleditor.change(function() { minHeight:'100px',
this.updateTextArea(); minWidth:'260px',
this.$area.toggleClass('touched',
(this.$area.val() != this.$area.attr('data-value')));
}); });
}); });
}, });
set_fields_values: function(lang, values) { },
var self = this; set_fields_values: function(lang, values) {
_.each(this.translatable_fields_keys, function(f) { var self = this;
self.$el.find('.oe_translation_field[name="' + lang.code + '-' + f + '"]') _.each(this.translatable_fields_keys, function(f) {
.val(values[f] || '') self.$el.find('.oe_translation_field[name="' + lang.code + '-' + f + '"]')
.attr('data-value', values[f] || ''); .val(values[f] || '')
.attr('data-value', values[f] || '');
});
this.$el.find('textarea.oe_translation_field').css({
minHeight:'100px',
});
$(window).resize(); // triggers the autosize
this.initialize_html_fields(lang);
},
do_load_fields_values: function() {
var self = this,
deferred = [];
var $tarea = self.$el.find('.oe_form_field_html .oe_translation_field[name="' + lang.code + '-' + f + '"]'); this.$el.find('.oe_translation_field').val('').removeClass('touched');
if ($tarea.length) { _.each(self.languages, function(lg) {
$tarea.cleditor()[0].updateFrame(); var deff = $.Deferred();
} deferred.push(deff);
}); if (lg.code === self.view_language) {
var $textarea = this.$el.find('textarea.oe_translation_field'); var values = {};
$textarea.css({minHeight:'100px'}); _.each(self.translatable_fields_keys, function(field) {
$textarea.autosize(); values[field] = self.view.fields[field].get_value();
$(window).resize(); // triggers the autosize });
}, self.set_fields_values(lg, values);
do_load_fields_values: function() { deff.resolve();
var self = this, } else {
deferred = []; self.view.dataset.call(
'read',
this.$el.find('.oe_translation_field').val('').removeClass('touched'); [[self.view.datarecord.id],
_.each(self.languages, function(lg) { self.translatable_fields_keys,
var deff = $.Deferred(); self.view.dataset.get_context({
deferred.push(deff); 'lang': lg.code
if (lg.code === self.view_language) { })]).done(function (rows) {
var values = {}; self.set_fields_values(lg, rows[0]);
_.each(self.translatable_fields_keys, function(field) { deff.resolve();
values[field] = self.view.fields[field].get_value();
}); });
self.set_fields_values(lg, values); }
deff.resolve(); });
} else { return deferred;
self.view.dataset.call( },
'read', on_button_save: function() {
[[self.view.datarecord.id], var translations = {},
self.translatable_fields_keys, self = this,
self.view.dataset.get_context({ translation_mutex = new $.Mutex();
'lang': lg.code self.$el.find('.oe_translation_field.touched').each(function() {
})]).done(function (rows) { var field = $(this).attr('name').split('-');
self.set_fields_values(lg, rows[0]); if (!translations[field[0]]) {
deff.resolve(); translations[field[0]] = {};
}); }
}; translations[field[0]][field[1]] = $(this).val();
});
_.each(translations, function(text, code) {
if (code === self.view_language) {
self.view.set_values(text);
}
translation_mutex.exec(function() {
return new data.DataSet(self, self.view.dataset.model,
self.view.dataset.get_context())
.write(self.view.datarecord.id, text,
{ context : { 'lang': code }});
}); });
return deferred; });
}, this.close();
on_button_save: function() { },
var translations = {}, on_button_close: function() {
self = this, this.close();
translation_mutex = new $.Mutex(); },
self.$el.find('.oe_translation_field.touched').each(function() {
var field = $(this).attr('name').split('-');
if (!translations[field[0]]) {
translations[field[0]] = {};
}
translations[field[0]][field[1]] = $(this).val();
});
_.each(translations, function(data, code) {
if (code === self.view_language) {
self.view.set_values(data);
}
translation_mutex.exec(function() {
return new instance.web.DataSet(self, self.view.dataset.model, self.view.dataset.get_context()).write(self.view.datarecord.id, data, { context : { 'lang': code }});
});
});
this.close();
},
on_button_close: function() {
this.close();
},
}); });
instance.web.form.AbstractField.include({ FormView.include({
on_translate: function() { render_sidebar: function($node) {
// the image next to the fields opens the translate dialog this._super($node);
this.view.open_translate_dialog(); if (this.sidebar) {
}, this.sidebar.add_items('other', _.compact([
}); this.is_action_enabled('edit') &&
this.translatable_fields.length > 0 && {
label: _t('Translate'),
callback: this.on_button_translate
},
]));
}
},
on_button_translate: function() {
var self = this;
$.when(this.has_been_loaded).then(function() {
self.open_translate_dialog();
});
},
});
View.include({
open_translate_dialog: function(field) {
new translateDialog(this, field).open();
}
});
common.AbstractField.include({
on_translate: function() {
// the image next to the fields opens the translate dialog
this.view.open_translate_dialog(this.name);
},
});
return {
translateDialog: translateDialog,
}; };
}); // odoo.define

View File

@ -1,34 +1,51 @@
<templates> <?xml version="1.0" encoding="UTF-8"?>
<!-- Copyright 2012 Guewen Baconnier (Camptocamp SA)
Copyright 2016 Antonio Espinosa <antonio.espinosa@tecnativa.com>
License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl). -->
<template>
<t t-name="TranslateDialog"> <t t-name="TranslateDialog">
<table t-if="widget.view.translatable_fields" class="oe_frame oe_forms oe_translation_form" border="0" cellpadding="0" cellspacing="0" width="100%"> <div class="modal-body">
<tr> <table t-if="widget.view.translatable_fields"
<td class="oe_form_separator" width="1%" nowrap="nowrap"> class="oe_frame oe_forms oe_translation_form"
<div class="separator horizontal">Field</div> border="0" cellpadding="0" cellspacing="0" width="100%">
</td> <tr>
<th t-foreach="widget.languages" align="left"> <td class="oe_form_separator" width="1%" nowrap="nowrap">
<div class="separator horizontal"><t t-esc="name"/></div> <div class="separator horizontal">Field</div>
</th> </td>
</tr> <th t-foreach="widget.languages" align="left">
<tr t-foreach="widget.view.translatable_fields" t-as="field" t-att-data-field="field.name"> <div class="separator horizontal"><t t-esc="name"/></div>
<td class="oe_form_frame_cell" width="1%" nowrap="nowrap"> </th>
<label class="oe_label"><t t-esc="field.string"/>:</label> </tr>
</td> <tr t-foreach="widget.translatable_fields" t-as="field"
<td t-foreach="widget.languages" t-as="lg" class="oe_form_frame_cell"> t-att-data-field="field.name">
<input t-if="field.field.type == 'char' || field.field.type == 'url'" type="text" t-attf-name="#{lg.code}-#{field.name}" value="" data-value="" class="oe_translation_field"/> <td class="oe_form_frame_cell" width="1%" nowrap="nowrap">
<textarea t-if="field.field.type == 'text'" t-attf-name="#{lg.code}-#{field.name}" data-value="" class="oe_translation_field" ></textarea> <label class="oe_label"><t t-esc="field.string"/>:</label>
<div t-if="field.field.type == 'html'" class="oe_form_field_html"> </td>
<textarea class="oe_translation_field oe_form_field" t-attf-name="#{lg.code}-#{field.name}" data-value=""/> <td t-foreach="widget.languages" t-as="lg" class="oe_form_frame_cell">
</div> <input t-if="field.field.type == 'char' || field.field.type == 'url'"
</td> type="text" t-attf-name="#{lg.code}-#{field.name}"
</tr> value="" data-value="" class="oe_translation_field"/>
</table> <textarea t-if="field.field.type == 'text'"
t-attf-name="#{lg.code}-#{field.name}" data-value=""
class="oe_translation_field" ></textarea>
<div t-if="field.field.type == 'html'" class="oe_form_field_html">
<textarea class="oe_translation_field oe_form_field"
t-attf-name="#{lg.code}-#{field.name}" data-value=""/>
</div>
</td>
</tr>
</table>
</div>
</t> </t>
<t t-name="TranslateDialog.buttons"> <t t-name="TranslateDialog.buttons">
<button class="oe_form_translate_dialog_save_button oe_button oe_highlight">Save</button> <button class="btn btn-sm oe_button btn-primary oe_form_translate_dialog_save_button">
<button class="oe_form_translate_dialog_cancel_button oe_button">Cancel</button> <span>Save</span>
</button>
<button class="btn btn-sm oe_button btn-default oe_form_translate_dialog_cancel_button">
<span>Cancel</span>
</button>
</t> </t>
</templates> </template>

View File

@ -1,11 +1,16 @@
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<!-- Copyright 2012 Guewen Baconnier (Camptocamp SA)
License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl). -->
<openerp> <openerp>
<data> <data>
<template id="assets_backend" name="web_translate_dialog assets" inherit_id="web.assets_backend"> <template id="assets_backend" name="web_translate_dialog assets"
inherit_id="web.assets_backend">
<xpath expr="." position="inside"> <xpath expr="." position="inside">
<script type="text/javascript" src="/web_translate_dialog/static/src/js/web_translate_dialog.js"></script> <script type="text/javascript"
<link rel="stylesheet" href="/web_translate_dialog/static/src/css/base.css" id="translate-dialog-stylesheet"/> src="/web_translate_dialog/static/src/js/web_translate_dialog.js"/>
<link rel="stylesheet" id="translate-dialog-stylesheet"
href="/web_translate_dialog/static/src/css/base.css"/>
</xpath> </xpath>
</template> </template>