Koha/koha-tmpl/intranet-tmpl/prog/en/modules/admin/localization.tt
Owen Leonard 616eb67d8e
Bug 32068: Consistent classes for primary buttons: Administration
This patch makes changes the button markup in Administration templates
so that all submit buttons and any buttons that should should be styled
as primary buttons have the Bootstrap class "btn btn-primary."

To test, apply the patch and view pages in Administration to confirm
that everything looks correct. In most cases there are no visible
changes.

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
2022-11-02 19:36:41 -03: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" class="btn btn-primary" 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' %]