Skip to content

Commit

Permalink
Implement pretranslation request form (#2910)
Browse files Browse the repository at this point in the history 
* Add Request pretranslation button

* When clicked, the button shows a list of available projects that can be selected via checkbox

* When selecting one or more projects, the following text is displayed at the bottom of the list

* Use highlight color for links in the text at the bottom of the list

* This text is followed by a REQUEST PRETRANSLATION button. When clicked, the button’s text changes to ARE YOU SURE?, asking for a confirmation before sending the actual request.

* Add missing spaces

* Fix request pretranslation button condition

* At the end of the process, an email is sent

* Apply suggestions from code review

Co-authored-by: Eemeli Aro <[email protected]>

* Fix prettier

* More modern JS

* Temporarily disable the ability to Request Pretranslation

---------

Co-authored-by: Eemeli Aro <[email protected]>
  • Loading branch information
@mathjazz @eemeli
mathjazz and eemeli authored Jul 20, 2023
1 parent d913a04 commit 6c9ca7e
Show file tree
Hide file tree
Showing 10 changed files with 298 additions and 37 deletions.
5 changes: 3 additions & 2 deletions pontoon/projects/templates/projects/widgets/project_list.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,8 +63,9 @@ <h4>
</table>
{% if request %}
<div id="request-item-note">
<p>The requested projects won’t be enabled automatically: an email will be sent to Pontoon admins and team managers to evaluate the request. We’ll try to respond as soon as possible. Please make sure to get in touch with the <a href="{{ url('pontoon.teams.info', locale.code) }}">localization team</a> if you are a new contributor.</p>
<p class="locale-projects">The requested projects won’t be enabled automatically: an email will be sent to Pontoon admins and team managers to evaluate the request. We’ll try to respond as soon as possible. Please make sure to get in touch with the <a href="{{ url('pontoon.teams.info', locale.code) }}">localization team</a> if you are a new contributor.</p>
<p class="pretranslation">Pretranslation won’t be enabled automatically for the requested projects: an email will be sent to Pontoon admins and team managers to evaluate the request. We’ll try to respond as soon as possible. Note that, if a locale is not using pretranslation yet, this will require additional time to train a custom translation engine.</p>
</div>
<button id="request-item">Request new projects</button>
<button class="request-item">Request new projects</button>
{% endif %}
{% endmacro %}
79 changes: 79 additions & 0 deletions pontoon/settings/base.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,85 @@ def _default_from_email():
# Google Cloud Translation API key
GOOGLE_TRANSLATE_API_KEY = os.environ.get("GOOGLE_TRANSLATE_API_KEY", "")

# Pontoon locale codes supported by Google Cloud AutoML Translation Project ID
#
# Source:
# https://cloud.google.com/translate/automl/docs/languages#supported_codes_for_language_variants
GOOGLE_AUTOML_SUPPORTED_LOCALES = [
"af",
"ar",
"az",
"bg",
"bn",
"ca",
"cs",
"cy",
"da",
"de",
"el",
"es",
"es-AR",
"es-CL",
"es-ES",
"es-MX",
"et",
"fa",
"fi",
"fil",
"fr",
"gl",
"gu-IN",
"he",
"hi",
"hi-IN",
"hr",
"ht",
"hu",
"id",
"is",
"it",
"ja",
"jv",
"ka",
"km",
"ko",
"lt",
"lv",
"mr",
"ms",
"my",
"nb-NO",
"ne-NP",
"nl",
"pa-IN",
"pa-PK",
"pl",
"ps",
"pt",
"pt-BR",
"pt-PT",
"ro",
"ru",
"sk",
"sl",
"sq",
"sr",
"sv-SE",
"sw",
"ta",
"te",
"th",
"tr",
"uk",
"ur",
"uz",
"vi",
"zh-CN",
"zh-HK",
"zh-TW",
"zu",
]

# Google Cloud AutoML Translation Project ID
GOOGLE_AUTOML_PROJECT_ID = os.environ.get("GOOGLE_AUTOML_PROJECT_ID", "")

Expand Down
36 changes: 33 additions & 3 deletions pontoon/teams/static/css/request.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,10 @@
margin-left: 2px;
}

.request-projects {
margin-left: 20px;
}

/* Bug 1468997 */
.request-team {
display: none;
Expand All @@ -23,10 +27,15 @@
content: 'Back to enabled teams';
}

.request-pretranslation:before {
content: 'Request pretranslation';
}

.request-projects:before {
content: 'Request more projects';
}

.request-pretranslation.back:after,
.request-projects.back:after {
content: 'Back to enabled projects';
}
Expand Down Expand Up @@ -61,7 +70,21 @@
display: block;
}

#request-item {
.items.request #request-item-note p.locale-projects,
.items.requesting-pretranslation #request-item-note p.pretranslation {
display: block;
}

.items.request #request-item-note p.pretranslation,
.items.requesting-pretranslation #request-item-note p.locale-projects {
display: none;
}

#request-item-note p a {
color: #7bc876;
}

.request-item {
display: none;
background: #7bc876;
border: none;
Expand All @@ -72,7 +95,7 @@
width: 100%;
}

#request-item.confirmed {
.request-item.confirmed {
background: #fed271;
}

Expand Down Expand Up @@ -118,7 +141,8 @@
display: table-cell;
}

.items.request .item-list th.check {
.items.request .item-list th.check,
.items.requesting-pretranslation .item-list th.check {
text-align: right;
width: auto;
}
Expand All @@ -130,6 +154,7 @@
}

.items.request .item-list .check,
.items.requesting-pretranslation .item-list .check,
.items.request .item-list .radio {
cursor: pointer;
display: block;
Expand Down Expand Up @@ -178,8 +203,13 @@
color: #7bc876;
}

.items.requesting-pretranslation .item-list .deadline,
.items.request .item-list .latest-activity,
.items.request .item-list .progress,
.items.request .item-list .unreviewed-status {
display: none;
}

.items.requesting-pretranslation .item-list .progress {
width: 340px;
}
85 changes: 66 additions & 19 deletions pontoon/teams/static/js/request.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,14 +17,14 @@ var Pontoon = (function (my) {
if (type === 'locale-projects') {
var localeProjects = $('#server').data('locale-projects');

// Hide all projects
// Show/hide all projects
$('.items')
.toggleClass('request', !show)
.find('tbody tr')
.toggleClass('limited', !show)
.toggle(!show);

// Show requested projects
// Hide/show enabled projects
$(localeProjects).each(function () {
$('.items')
.find('td[data-slug="' + this + '"]')
Expand All @@ -38,26 +38,31 @@ var Pontoon = (function (my) {
$('.project-list').toggleClass('hidden', noProject);
$('menu.controls').toggleClass('no-projects', noProject);
$('.no-results').toggle();
} else if (type === 'pretranslation') {
$('.items').toggleClass('requesting-pretranslation', !show);

Pontoon.requestItem.toggleButton(!show, 'locale-projects');
// Hide/show pretranslated projects
$('.items tbody tr.pretranslated')
.toggleClass('limited', show)
.toggle(show);
} else if (type === 'team') {
// Hide all teams and the search bar
$('.team-list').toggle(show);
$('.search-wrapper').toggle(show);

// Show team form
$('#request-team-form').toggle(!show);
Pontoon.requestItem.toggleButton(!show, 'team');
}

Pontoon.requestItem.toggleButton(!show, type);
$('.controls input[type=search]:visible').trigger('input');
},

toggleButton: function (condition, type) {
condition = condition || true;
var show = condition;

if (type === 'locale-projects') {
if (type === 'locale-projects' || type === 'pretranslation') {
show = condition && $('.items td.enabled:visible').length > 0;
} else if (type === 'team') {
show =
Expand All @@ -67,29 +72,35 @@ var Pontoon = (function (my) {
}

$('#request-item-note').toggle(show);
$('#request-item').toggle(show);

const title =
type === 'pretranslation'
? 'Request pretranslation'
: 'Request new projects';
$('.request-item').html(title).removeClass('confirmed').toggle(show);
},

requestProjects: function (locale, projects, type) {
$.ajax({
url: '/' + locale + '/request/',
url: `/${locale}/request/`,
type: 'POST',
data: {
csrfmiddlewaretoken: $('body').data('csrf'),
projects: projects,
},
success: function () {
success() {
Pontoon.endLoader('New ' + type + ' request sent.', '', 5000);
},
error: function () {
error() {
Pontoon.endLoader('Oops, something went wrong.', 'error');
},
complete: function () {
complete() {
$('.items td.check').removeClass('enabled');
$('.items td.radio.enabled').toggleClass(
'far fa fa-circle fa-dot-circle enabled',
);
Pontoon.requestItem.toggleItem(true, 'locale-projects');
$('.controls .request-toggle').show();
window.scrollTo(0, 0);
},
});
Expand All @@ -104,24 +115,47 @@ var Pontoon = (function (my) {
name: name,
code: code,
},
success: function () {
success() {
Pontoon.endLoader('New team request sent.', '', 5000);
},
error: function (res) {
error(res) {
if (res.status === 409) {
Pontoon.endLoader(res.responseText, 'error');
} else {
Pontoon.endLoader('Oops, something went wrong.', 'error');
}
},
complete: function () {
complete() {
$('#request-team-form #id_name').val('');
$('#request-team-form #id_code').val('');
Pontoon.requestItem.toggleButton(true, 'team');
window.scrollTo(0, 0);
},
});
},

requestPretranslation: function (locale, projects) {
$.ajax({
url: `/${locale}/request-pretranslation/`,
type: 'POST',
data: {
csrfmiddlewaretoken: $('body').data('csrf'),
projects: projects,
},
success() {
Pontoon.endLoader('New pretranslation request sent.', '', 5000);
},
error() {
Pontoon.endLoader('Oops, something went wrong.', 'error');
},
complete() {
$('.items td.check').removeClass('enabled');
Pontoon.requestItem.toggleItem(true, 'pretranslation');
$('.controls .request-toggle').show();
window.scrollTo(0, 0);
},
});
},
},
});
})(Pontoon || {});
Expand All @@ -135,16 +169,23 @@ $(function () {
e.stopPropagation();
e.preventDefault();

Pontoon.requestItem.toggleItem($(this).is('.back'), type);
var type_ = $(this).is('.request-pretranslation') ? 'pretranslation' : type;

Pontoon.requestItem.toggleItem($(this).is('.back'), type_);
$(this).siblings('.request-toggle').toggle();
});

// Select projects
container.on('click', '.items td.check', function (e) {
if ($('.controls .request-toggle').is('.back:visible')) {
e.stopPropagation();

var type_ = $('.items').is('.requesting-pretranslation')
? 'pretranslation'
: 'locale-projects';

$(this).toggleClass('enabled');
Pontoon.requestItem.toggleButton(true, (type = 'locale-projects'));
Pontoon.requestItem.toggleButton(true, type_);
}
});

Expand Down Expand Up @@ -199,25 +240,31 @@ $(function () {
);

// Request projects/team
container.on('click', '#request-item', function (e) {
container.on('click', '.request-item', function (e) {
e.preventDefault();
e.stopPropagation();

var locale = '';

if ($(this).is('.confirmed')) {
// Requesting from team page
if (type === 'locale-projects' && $('body').hasClass('locale')) {
if ($('body').hasClass('locale')) {
var projects = $('.items td.check.enabled')
.map(function (val, element) {
return $(element).siblings('.name').data('slug');
})
.get();
locale = $('#server').data('locale') || Pontoon.getSelectedLocale();

Pontoon.requestItem.requestProjects(locale, projects, 'projects');
if ($('.items').is('.request')) {
$(this).html('Request new projects');
Pontoon.requestItem.requestProjects(locale, projects, 'projects');
} else if ($('.items').is('.requesting-pretranslation')) {
$(this).html('Request pretranslation');
Pontoon.requestItem.requestPretranslation(locale, projects);
}

$(this).removeClass('confirmed').html('Request new projects');
$(this).removeClass('confirmed');
}

// Requesting from project page
Expand Down
Loading

0 comments on commit 6c9ca7e

Please sign in to comment.