Koha/koha-tmpl/intranet-tmpl/prog/en/modules/admin/localization.tt
Wainui Witika-Park 9174029a8e Bug 27631: admin folder
Changed each of the pages in the admin folder to have one <h1> tag
showing that describes the page, rather than the <h1> describing the
logo.

The hierarchy of heading tags may be broken in many pages, but this
will be dealt with in an additional bug.

To test:
1) Go to the Staff Client
2) Apply patch
3) Go to each of the pages in the admin folder and check that they have
   an obvious and descriptive heading
4) Ensure that the heading in the page is <h1>

Sponsored-by: Catalyst IT

Signed-off-by: Owen Leonard <oleonard@myacpl.org>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Fridolin Somers <fridolin.somers@biblibre.com>
2022-04-20 09:03:38 -10:00

278 lines
12 KiB
Text

[% USE raw %]
[% USE Asset %]
[% SET footerjs = 1 %]
[% INCLUDE 'doc-head-open.inc' %]
<title>Localization &rsaquo; Koha</title>
[% INCLUDE 'doc-head-close.inc' popup => 1 %]
<style>#localization { margin-top: 1em; }</style>
</head>
<body id="admin_localization" class="admin">
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<h1>Localization</h1>
<form id="add_translation" method="post">
<input type="hidden" name="entity" value="[% entity | html %]" />
<input type="hidden" name="code" value="[% code | html %]" />
<input type="hidden" name="interface" value="[% interface_side | html %]" />
<fieldset class="rows clearfix">
<ol>
<li>
<span class="label">Authorized value:</span>
[% code | html %]
</li>
<li>
<label for="lang">Language:</label>
<select name="lang" id="lang">
[% FOR language IN languages %]
[% FOR sublanguage IN language.sublanguages_loop %]
[% IF language.plural %]
<option value="[% sublanguage.rfc4646_subtag | html %]">[% sublanguage.native_description | html %] [% sublanguage.region_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>
[% ELSE %]
<option value="[% sublanguage.rfc4646_subtag | html %]">[% sublanguage.native_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>
[% END %]
[% END %]
[% END %]
</select>
</li>
<li>
<label for="translation">Translation:</label>
<input type="text" size="40" name="translation" id="translation" />
</li>
<li>
<span class="label">&nbsp;</span>
<input type="submit" value="Add" />
</li>
</ol>
</fieldset>
</form>
</div> <!-- /.col-sm-12 -->
</div> <!-- /.row -->
<div class="row">
<div class="col-sm-12">
<div id="messages"></div>
</div> <!-- /.col-sm-12 -->
</div> <!-- /.row -->
<div class="row">
<div class="col-sm-12">
<table id="localization">
<thead>
<tr>
<th>Id</th>
<th>Entity</th>
<th>Code</th>
<th>Language</th>
<th>Translation</th>
<th class="NoSort">&nbsp;</th>
</tr>
</thead>
<tbody>
[% FOR t IN translations %]
<tr id="row_id_[% t.id | html %]" data-id="[% t.id | html %]">
<td>[% t.id | html %]</td>
<td>[% t.entity | html %]</td>
<td>[% t.code | html %]</td>
<td class="lang">[% t.lang | html %]</td>
<td class="translation" contenteditable="true">[% t.translation | html %]</td>
<td class="actions"><a href="#" class="delete"><i class="fa fa-trash"></i> Delete</a></td>
</tr>
[% END %]
</tbody>
</table>
</div> <!-- /.col-sm-12 -->
</div> <!-- /.row -->
</div> <!-- /.container-fluid -->
[% MACRO jsinclude BLOCK %]
[% INCLUDE 'datatables.inc' %]
<script>
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', '#FF9090');
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', '#FF9090');
show_message({ type: 'error_on_delete', data: data });
},
});
}
$(document).ready(function() {
$(".dialog").hide();
var table = $("#localization").DataTable($.extend(true, {}, dataTablesDefaults, {
"dom": 't',
"columnDefs": [
{ 'sortable': false, 'targets': [ 'NoSort' ] }
],
'bPaginate': false,
'autoWidth': false,
}));
var languages_select = $('<select name="lang" id="lang"></select>');
[% FOR language IN languages %]
[% FOR sublanguage IN language.sublanguages_loop %]
var option;
[% IF language.plural %]
option = $('<option value="[% sublanguage.rfc4646_subtag | html %]">[% sublanguage.native_description | html %] [% sublanguage.region_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>');
$(languages_select).append(option);
[% ELSE %]
option = $('<option value="[% sublanguage.rfc4646_subtag | html %]">[% sublanguage.native_description | html %] ([% sublanguage.rfc4646_subtag | html %])</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 );
});
$("body").on("click", "a.delete", 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 {
var new_row = table.row.add( [ data.id, data.entity, data.code, data.lang, data.translation, "<a href=\"#\" class=\"delete\"><i class=\"fa fa-trash\"></i> Delete</a>" ] ).draw().node();
$( new_row ).attr("id", "row_id_" + data.id ).data("id", data.id );
show_message({ type: 'success_on_insert', data: data });
}
},
error: function (data) {
show_message({ type: 'error_on_insert', data: data });
},
});
});
});
</script>
[% END %]
[% INCLUDE 'popup-bottom.inc' %]