2 [% INCLUDE 'doc-head-open.inc' %]
3 <title>Koha › Localization</title>
4 [% INCLUDE 'doc-head-close.inc' popup => 1 %]
5 <link rel="stylesheet" type="text/css" href="[% interface %]/[% theme %]/css/datatables.css" />
8 <body id="admin_localization" class="admin">
10 <form id="add_translation" method="post">
11 <input type="hidden" name="entity" value="[% entity %]" />
12 <input type="hidden" name="code" value="[% code %]" />
13 Lang: <select name="lang">
14 [% FOR language IN languages %]
15 [% FOR sublanguage IN language.sublanguages_loop %]
16 [% IF language.plural %]
17 <option value="[% sublanguage.rfc4646_subtag %]">[% sublanguage.native_description %] [% sublanguage.region_description %] ([% sublanguage.rfc4646_subtag %])</option>
19 <option value="[% sublanguage.rfc4646_subtag %]">[% sublanguage.native_description %] ([% sublanguage.rfc4646_subtag %])</option>
24 Translation: <input type="text" name="translation" />
25 <input type="submit" value="Add" />
27 <div id="messages"></div>
28 <table id="localization">
40 [% FOR t IN translations %]
41 <tr id="row_id_[% t.id %]" data-id="[% t.id %]">
43 <td>[% t.entity %]</td>
45 <td class="lang">[% t.lang %]</td>
46 <td class="translation" contenteditable="true">[% t.translation %]</td>
47 <td class="actions"><a href="#" class="delete"><i class="fa fa-trash"></i> Delete</a></td>
54 [% MACRO jsinclude BLOCK %]
55 [% INCLUDE 'datatables.inc' %]
56 <script type="text/javascript">
58 function show_message( params ) {
59 var type = params.type;
60 var data = params.data;
61 var messages = $("#messages");
63 if ( type == 'success_on_update' ) {
64 message = $('<div class="dialog message"></div>');
65 message.text("Entity %s (code %s) for lang %s has correctly been updated with '%s'".format(data.entity, data.code, data.lang, data.translation));
66 } else if ( type == 'error_on_update' ) {
67 message = $('<div class="dialog alert"></div>');
68 if ( data.error_code == 'already_exists' ) {
69 message.text("A translation already exists for this language.");
71 message.text("An error occurred when updating this translation.");
73 } else if ( type == 'success_on_delete' ) {
74 message = $('<div class="dialog message"></div>');
75 message.text("The translation (id %s) has been removed successfully".format(data.id));
76 } else if ( type == 'error_on_delete' ) {
77 message = $('<div class="dialog alert"></div>');
78 message.text("An error occurred when deleting this translation");
79 } else if ( type == 'success_on_insert' ) {
80 message = $('<div class="dialog message"></div>');
81 message.text("Translation (id %s) has been added successfully".format(data.id));
82 } else if ( type == 'error_on_insert' ) {
83 message = $('<div class="dialog alert"></div>');
84 if ( data.error_code == 'already_exists' ) {
85 message.text("A translation already exists for this language.");
87 message.text("An error occurred when adding this translation");
91 $(messages).append(message);
93 setTimeout(function(){
98 function send_update_request( data, cell ) {
102 url: '/cgi-bin/koha/svc/localization',
103 success: function (data) {
105 $(cell).css('background-color', '#FF0000');
106 show_message({ type: 'error_on_update', data: data });
107 } else if ( data.is_changed == 1 ) {
108 $(cell).css('background-color', '#00FF00');
109 show_message({ type: 'success_on_update', data: data });
112 if ( $(cell).hasClass('lang') ) {
113 $(cell).text(data.lang)
114 } else if ( $(cell).hasClass('translation') ) {
115 $(cell).text(data.translation)
118 error: function (data) {
119 $(cell).css('background-color', '#FF0000');
120 if ( $(cell).hasClass('lang') ) {
121 $(cell).text(data.lang)
122 } else if ( $(cell).hasClass('translation') ) {
123 $(cell).text(data.translation)
125 show_message({ type: 'error_on_update', data: data });
130 function send_delete_request( id, cell ) {
133 url: '/cgi-bin/koha/svc/localization/?id='+id,
134 success: function (data) {
135 $("#localization").DataTable().row( '#row_id_' + id ).remove().draw();
136 show_message({ type: 'success_on_delete', data: data });
138 error: function (data) {
139 $(cell).css('background-color', '#FF0000');
140 show_message({ type: 'error_on_delete', data: data });
145 $(document).ready(function() {
148 var table = $("#localization").DataTable($.extend(true, {}, dataTablesDefaults, {
152 var languages_select = $('<select name="lang"></select>');
153 [% FOR language IN languages %]
154 [% FOR sublanguage IN language.sublanguages_loop %]
156 [% IF language.plural %]
157 option = $('<option value="[% sublanguage.rfc4646_subtag %]">[% sublanguage.native_description %] [% sublanguage.region_description %] ([% sublanguage.rfc4646_subtag %])</option>');
158 $(languages_select).append(option);
160 option = $('<option value="[% sublanguage.rfc4646_subtag %]">[% sublanguage.native_description %] ([% sublanguage.rfc4646_subtag %])</option>');
162 $(languages_select).append(option);
166 $("td.translation").on('focus', function(){
167 $(this).css('background-color', '');
169 $("td.lang").on('click', function(){
171 var lang = $(td).text();
172 $(td).css('background-color', '');
173 var my_select = $(languages_select).clone();
174 $(my_select).find('option[value="' + lang + '"]').attr('selected', 'selected');
175 $(my_select).on('click', function(e){
178 $(my_select).on('change', function(){
179 var tr = $(this).parent().parent();
180 var id = $(tr).data('id');
181 var lang = $(this).find('option:selected').val();
182 var data = "id=" + encodeURIComponent(id) + "&lang=" + encodeURIComponent(lang);
183 send_update_request( data, td );
185 $(my_select).on('blur', function(){
188 $(this).html(my_select);
191 $("td.translation").on('blur', function(){
192 var tr = $(this).parent();
193 var id = $(tr).data('id');
194 var translation = $(this).text();
195 var data = "id=" + encodeURIComponent(id) + "&translation=" + encodeURIComponent(translation);
196 send_update_request( data, this );
199 $("a.delete").on('click', function(e){
201 if ( confirm(_("Are you sure you want to delete this translation?")) ) {
202 var td = $(this).parent();
203 var tr = $(td).parent();
204 var id = $(tr).data('id');
205 send_delete_request( id, td );
209 $("#add_translation").on('submit', function(e){
211 var entity = $(this).find('input[name="entity"]').val();
212 var code = $(this).find('input[name="code"]').val();
213 var lang = $(this).find('select[name="lang"] option:selected').val();
214 var translation = $(this).find('input[name="translation"]').val();
215 var data = "entity=" + encodeURIComponent(entity) + "&code=" + encodeURIComponent(code) + "&lang=" + encodeURIComponent(lang) + "&translation=" + encodeURIComponent(translation);
219 url: '/cgi-bin/koha/svc/localization',
220 success: function (data) {
222 show_message({ type: 'error_on_insert', data: data });
224 // FIXME Should append the delete link
225 table.row.add( [ data.id, data.entity, data.code, data.lang, data.translation, "" ] ).draw();
226 show_message({ type: 'success_on_insert', data: data });
229 error: function (data) {
230 show_message({ type: 'error_on_insert', data: data });
238 [% INCLUDE 'popup-bottom.inc' %]