Owen Leonard
dfb8982ca7
The item types localization page uses a Glyphicon. This patch converts it to a Font Awesome icon. Also changed in this patch: "Delete" text has been added to the delete link, and a dummy "href" attribute has been added to the link so that it triggers the right kind of cursor. The deletion confirmation JavaScript has been edited to ignore the default click action. To test, apply the patch and go to Administration -> Item types. - Edit any existing item type and click the "Translate into other languages" link. - If there is not an existing translation, add one. Close the modal window and click the "Translate into other languages" link again to redisplay it. - Confirm that there is a "Delete" link next to your translation which is styled correctly. - Confirm that the behavior of the "Delete" link is correct both when confirming and when canceling. Revision adds the "actions" class to the table cell with the delete link to prevent a line break between the icon and the text. Signed-off-by: Marc Véron <veron@veron.ch> Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org> Signed-off-by: Brendan Gallagher brendan@bywatersolutions.com
237 lines
9.7 KiB
Text
237 lines
9.7 KiB
Text
[% INCLUDE 'doc-head-open.inc' %]
|
|
<title>Koha › Localization</title>
|
|
[% INCLUDE 'doc-head-close.inc' popup => 1 %]
|
|
<link rel="stylesheet" type="text/css" href="[% themelang %]/css/datatables.css" />
|
|
[% INCLUDE 'greybox.inc' %]
|
|
[% INCLUDE 'datatables.inc' %]
|
|
<script type="text/javascript">
|
|
//<![CDATA[
|
|
|
|
function show_message( params ) {
|
|
var type = params.type;
|
|
var data = params.data;
|
|
var messages = $("#messages");
|
|
var message;
|
|
if ( type == 'success_on_update' ) {
|
|
message = $('<div class="dialog message"></div>');
|
|
message.text("Entity %s (code %s) for lang %s has correctly been updated with '%s'".format(data.entity, data.code, data.lang, data.translation));
|
|
} else if ( type == 'error_on_update' ) {
|
|
message = $('<div class="dialog alert"></div>');
|
|
if ( data.error_code == 'already_exists' ) {
|
|
message.text("A translation already exists for this language.");
|
|
} else {
|
|
message.text("An error occurred when updating this translation.");
|
|
}
|
|
} else if ( type == 'success_on_delete' ) {
|
|
message = $('<div class="dialog message"></div>');
|
|
message.text("The translation (id %s) has been removed successfully".format(data.id));
|
|
} else if ( type == 'error_on_delete' ) {
|
|
message = $('<div class="dialog alert"></div>');
|
|
message.text("An error occurred when deleting this translation");
|
|
} else if ( type == 'success_on_insert' ) {
|
|
message = $('<div class="dialog message"></div>');
|
|
message.text("Translation (id %s) has been added successfully".format(data.id));
|
|
} else if ( type == 'error_on_insert' ) {
|
|
message = $('<div class="dialog alert"></div>');
|
|
if ( data.error_code == 'already_exists' ) {
|
|
message.text("A translation already exists for this language.");
|
|
} else {
|
|
message.text("An error occurred when adding this translation");
|
|
}
|
|
}
|
|
|
|
$(messages).append(message);
|
|
|
|
setTimeout(function(){
|
|
message.hide()
|
|
}, 3000);
|
|
}
|
|
|
|
function send_update_request( data, cell ) {
|
|
$.ajax({
|
|
data: data,
|
|
type: 'PUT',
|
|
url: '/cgi-bin/koha/svc/localization',
|
|
success: function (data) {
|
|
if ( data.error ) {
|
|
$(cell).css('background-color', '#FF0000');
|
|
show_message({ type: 'error_on_update', data: data });
|
|
} else if ( data.is_changed == 1 ) {
|
|
$(cell).css('background-color', '#00FF00');
|
|
show_message({ type: 'success_on_update', data: data });
|
|
}
|
|
|
|
if ( $(cell).hasClass('lang') ) {
|
|
$(cell).text(data.lang)
|
|
} else if ( $(cell).hasClass('translation') ) {
|
|
$(cell).text(data.translation)
|
|
}
|
|
},
|
|
error: function (data) {
|
|
$(cell).css('background-color', '#FF0000');
|
|
if ( $(cell).hasClass('lang') ) {
|
|
$(cell).text(data.lang)
|
|
} else if ( $(cell).hasClass('translation') ) {
|
|
$(cell).text(data.translation)
|
|
}
|
|
show_message({ type: 'error_on_update', data: data });
|
|
},
|
|
});
|
|
}
|
|
|
|
function send_delete_request( id, cell ) {
|
|
$.ajax({
|
|
type: 'DELETE',
|
|
url: '/cgi-bin/koha/svc/localization/?id='+id,
|
|
success: function (data) {
|
|
$("#localization").DataTable().row( '#row_id_' + id ).remove().draw();
|
|
show_message({ type: 'success_on_delete', data: data });
|
|
},
|
|
error: function (data) {
|
|
$(cell).css('background-color', '#FF0000');
|
|
show_message({ type: 'error_on_delete', data: data });
|
|
},
|
|
});
|
|
}
|
|
|
|
$(document).ready(function() {
|
|
$(".dialog").hide();
|
|
|
|
var table = $("#localization").DataTable($.extend(true, {}, dataTablesDefaults, {
|
|
'bPaginate': false,
|
|
}));
|
|
|
|
var languages_select = $('<select name="lang"></select>');
|
|
[% FOR language IN languages %]
|
|
[% FOR sublanguage IN language.sublanguages_loop %]
|
|
var option;
|
|
[% IF language.plural %]
|
|
option = $('<option value="[% sublanguage.rfc4646_subtag %]">[% sublanguage.native_description %] [% sublanguage.region_description %] ([% sublanguage.rfc4646_subtag %])</option>');
|
|
$(languages_select).append(option);
|
|
[% ELSE %]
|
|
option = $('<option value="[% sublanguage.rfc4646_subtag %]">[% sublanguage.native_description %] ([% sublanguage.rfc4646_subtag %])</option>');
|
|
[% END %]
|
|
$(languages_select).append(option);
|
|
[% END %]
|
|
[% END %]
|
|
|
|
$("td.translation").on('focus', function(){
|
|
$(this).css('background-color', '');
|
|
});
|
|
$("td.lang").on('click', function(){
|
|
var td = this;
|
|
var lang = $(td).text();
|
|
$(td).css('background-color', '');
|
|
var my_select = $(languages_select).clone();
|
|
$(my_select).find('option[value="' + lang + '"]').attr('selected', 'selected');
|
|
$(my_select).on('click', function(e){
|
|
e.stopPropagation();
|
|
});
|
|
$(my_select).on('change', function(){
|
|
var tr = $(this).parent().parent();
|
|
var id = $(tr).data('id');
|
|
var lang = $(this).find('option:selected').val();
|
|
var data = "id=" + encodeURIComponent(id) + "&lang=" + encodeURIComponent(lang);
|
|
send_update_request( data, td );
|
|
});
|
|
$(my_select).on('blur', function(){
|
|
$(td).html(lang);
|
|
});
|
|
$(this).html(my_select);
|
|
});
|
|
|
|
$("td.translation").on('blur', function(){
|
|
var tr = $(this).parent();
|
|
var id = $(tr).data('id');
|
|
var translation = $(this).text();
|
|
var data = "id=" + encodeURIComponent(id) + "&translation=" + encodeURIComponent(translation);
|
|
send_update_request( data, this );
|
|
});
|
|
|
|
$("a.delete").on('click', function(e){
|
|
e.preventDefault();
|
|
if ( confirm(_("Are you sure you want to delete this translation?")) ) {
|
|
var td = $(this).parent();
|
|
var tr = $(td).parent();
|
|
var id = $(tr).data('id');
|
|
send_delete_request( id, td );
|
|
}
|
|
});
|
|
|
|
$("#add_translation").on('submit', function(e){
|
|
e.preventDefault();
|
|
var entity = $(this).find('input[name="entity"]').val();
|
|
var code = $(this).find('input[name="code"]').val();
|
|
var lang = $(this).find('select[name="lang"] option:selected').val();
|
|
var translation = $(this).find('input[name="translation"]').val();
|
|
var data = "entity=" + encodeURIComponent(entity) + "&code=" + encodeURIComponent(code) + "&lang=" + encodeURIComponent(lang) + "&translation=" + encodeURIComponent(translation);
|
|
$.ajax({
|
|
data: data,
|
|
type: 'POST',
|
|
url: '/cgi-bin/koha/svc/localization',
|
|
success: function (data) {
|
|
if ( data.error ) {
|
|
show_message({ type: 'error_on_insert', data: data });
|
|
} else {
|
|
// FIXME Should append the delete link
|
|
table.row.add( [ data.id, data.entity, data.code, data.lang, data.translation, "" ] ).draw();
|
|
show_message({ type: 'success_on_insert', data: data });
|
|
}
|
|
},
|
|
error: function (data) {
|
|
show_message({ type: 'error_on_insert', data: data });
|
|
},
|
|
});
|
|
});
|
|
|
|
});
|
|
//]]>
|
|
</script>
|
|
</head>
|
|
<body id="admin_localization" class="admin">
|
|
<div id="main">
|
|
<form id="add_translation" method="post">
|
|
<input type="hidden" name="entity" value="[% entity %]" />
|
|
<input type="hidden" name="code" value="[% code %]" />
|
|
Lang: <select name="lang">
|
|
[% FOR language IN languages %]
|
|
[% FOR sublanguage IN language.sublanguages_loop %]
|
|
[% IF language.plural %]
|
|
<option value="[% sublanguage.rfc4646_subtag %]">[% sublanguage.native_description %] [% sublanguage.region_description %] ([% sublanguage.rfc4646_subtag %])</option>
|
|
[% ELSE %]
|
|
<option value="[% sublanguage.rfc4646_subtag %]">[% sublanguage.native_description %] ([% sublanguage.rfc4646_subtag %])</option>
|
|
[% END %]
|
|
[% END %]
|
|
[% END %]
|
|
</select>
|
|
Translation: <input type="text" name="translation" />
|
|
<input type="submit" value="Add" />
|
|
</form>
|
|
<div id="messages"></div>
|
|
<table id="localization">
|
|
<thead>
|
|
<tr>
|
|
<th>Id</th>
|
|
<th>Entity</th>
|
|
<th>Code</th>
|
|
<th>Lang</th>
|
|
<th>Translation</th>
|
|
<th></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
[% FOR t IN translations %]
|
|
<tr id="row_id_[% t.id %]" data-id="[% t.id %]">
|
|
<td>[% t.id %]</td>
|
|
<td>[% t.entity %]</td>
|
|
<td>[% t.code %]</td>
|
|
<td class="lang">[% t.lang %]</td>
|
|
<td class="translation" contenteditable="true">[% t.translation %]</td>
|
|
<td class="actions"><a href="#" class="delete"><i class="fa fa-trash"></i> Delete</a></td>
|
|
</tr>
|
|
[% END %]
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</body>
|
|
</html>
|