Your IP : 3.17.80.242
<style>
.autori {
min-height: 600px;
max-height: 620px;
max-width: 550px;
}
#autor:invalid{
border: 2px solid red;
background-color: rgba(255,0,0,0.1)
}
</style>
<div class="card autori rounded-0 shadow">
<div class="card-header alert-info p-2 h5 rounded-0">Autoři</div>
<div class="card-body">
<div id="btnNovy" class="row">
<div class="col-2 text-left"><button class="btn btn-outline-info rounded-0" onclick="zobrazFiltr(true)"><i class="fas fa-filter"></i></button></div>
<div class="col-2 text-left"><button class="btn btn-outline-info rounded-0" onclick="pretridit()"><i class="fas fa-sort-alpha-down"></i></button></div>
<div class="col-8 text-right">
<button class="btn btn-outline-info rounded-0" onclick="zobrazNovy(true)">Nový autor</button>
</div>
</div>
<div id="novyAutor" class="py-2 d-none">
<div class="form-group row">
<label for="text" class="col-3 col-form-label">Nový autor</label>
<div class="col-9">
<input id="autor" name="autor" placeholder="příjmení jméno autora" type="text" class="form-control rounded-0" required>
</div>
</div>
<div class="form-group row ">
<div class="col-6">
<div class="custom-control custom-checkbox">
<input name="cbDalsiNovy" id="cbDalsiNovy" type="checkbox" class="custom-control-input rounded-0" value="" checked="checked">
<label for="cbDalsiNovy" class="custom-control-label">další nový</label>
</div>
</div>
<div class="col-3 text-right">
<button name="cancelAutor" class="btn btn-outline-warning rounded-0" onclick="zobrazNovy(false)">Storno</button>
</div>
<div class="col-3 text-right">
<button name="ulozAutor" class="btn btn-primary rounded-0" onclick="novyAutor()">Uložit</button>
</div>
</div>
</div>
<div id="filtrDlg" class="py-2 d-none">
<div class="form-group row">
<label for="text" class="col-2 col-form-label">Filtr</label>
<div class="col-5">
<input id="textFiltr" name="textFiltr" placeholder="podmínka" type="text" class="form-control rounded-0">
</div>
<div class="col-3">
<button name="btnFiltr" id="btnFiltr" class="btn btn-primary rounded-0" onclick="autoryFiltruj()">Filtrovat</button>
</div>
<div class="col-">
<button name="btnFiltrStorno" id="btnFiltrStorno"
class="btn btn-outline-primary rounded-0" onclick="zobrazFiltr(false)">Zrušit</button>
</div>
</div>
</div>
<div id="seznamAutori">
<?php
include("autori-seznam.php")
?>
</div>
</div> <!-- card-body -->
</div> <!-- card -->
<script>
autori = [];
naplnAutory();
function zobrazFiltr(bool){
if (bool) {
schovejTlacitka(-1);
$("#autoriSeznam").css("max-height", "390px");
} else {
$("#autoriSeznam").css("max-height", "450px");
}
$('[id^="radek"]').removeClass("d-none");
$("#btnNovy").toggleClass("d-none");
$("#filtrDlg").toggleClass("d-none");
}
function zobrazNovy(bool){
if (bool) {
schovejTlacitka(-1);
$("#autoriSeznam").css("max-height", "390px");
} else {
$("#autoriSeznam").css("max-height", "450px");
}
$("#btnNovy").toggleClass("d-none");
$("#novyAutor").toggleClass("d-none");
if (bool){
$("#autor").focus();
$("#autor").val("");
}
}
function novyAutor(){
let autor = $("#autor").val();
autor = autor.trim();
if (!autor){
$("#autor").focus();
} else {
$.ajax({
url: "knihy/autori-uloz.php",
type: 'POST',
dataType: 'HTML',
data: {
'autor': autor,
'operace': 'n',
'id': 0
},
success: function (result) {
autori.push({'id': result, 'autor': autor, 'e': false, 'd': false});
autori.sort((a, b) => a['autor'].localeCompare(b['autor'], 'cs'));
let novyIndex = autori.findIndex(o => o.id == result);
let vlozHTML = ` <tr id="radek${result}">
<td id="autorJm${result}">${autor}</td>
<td id="autorEd${result}" class="ikonaForm text-info" onclick="zavolejEditaci(${result})"><i class="far fa-edit"></i></td>
<td id="autorDe${result}" class="ikonaForm text-danger" onclick="smazAutora(${result})"><i class="far fa-trash-alt"></i></td>
</tr>
<tr id="radekConfirm${result}">
<td colspan="3" id="delConfirmAlert${result}" class="d-none">
<div class="row mb-4">
<div class="alert alert-warning rounded-0">
<div id="confirm${result}" class="col-7"></div>
<div class="col-2 text-right"><button class="btn btn-outline-primary rounded-0" onclick="stornoDelete(${result})">Storno</button></div>
<div class="col-2 text-right"><button class="btn btn-danger rounded-0" onclick="confirmDelete(${result})">Smazat</button></div>
</div>
</div>
</td>
</tr>`;
if (novyIndex < autori.length-1){
$("#radek" + autori[novyIndex + 1].id).before(vlozHTML);
} else {
$("#radekConfirm" + autori[novyIndex -1].id).after(vlozHTML);
}
if ($("#cbDalsiNovy").prop("checked")){
$("#autor").focus();
$("#autor").val("");
} else {
zobrazNovy(false);
}
}
})
}
}
//xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
function schovejTlacitka(idAkt){
if ($("#filtrDlg").hasClass("d-none")){
if ($("#btnNovy").hasClass("d-none")){
$("#novyAutor").addClass("d-none");
$("#filtrDlg").addClass("d-none");
$("#btnNovy").removeClass("d-none")
}
}
let jeVEditaciIndex = autori.findIndex(o => o.e == true),
jeVDeleteIndex = autori.findIndex(o => o.d == true);
if (jeVEditaciIndex > -1){
stornoEditace(autori[jeVEditaciIndex].id, autori[jeVEditaciIndex].autor);
}
if (jeVDeleteIndex > -1){
stornoDelete(autori[jeVDeleteIndex].id);
}
}
function stornoDelete(id){
const jeVDeleteIndex = autori.findIndex(o => o.d == true);
autori[jeVDeleteIndex].d = !autori[jeVDeleteIndex].d;
$("#delConfirmAlert"+id).addClass("d-none");
}
function zavolejEditaci(id) {
schovejTlacitka(id);
let autorOld = $("#autorJm"+id).text(),
autoriIndex = autori.findIndex(o => o.id == id);
autori[autoriIndex].e = !autori[autoriIndex].e;
if (autori[autoriIndex].e){
$("#autorJm"+id).html(`<input id="autorJmNew${id}" value="${autorOld}" placeholder="příjmení jméno autora" type="text" class="form-control rounded-0" required>`);
$("#autorDe"+id).html(`<span class="text-warning"><i class="fas fa-undo"></i></span>`);
$("#autorEd"+id).html(`<span class="text-success"><i class="far fa-save"></i></span>`);
document.getElementById("autorDe"+id).onclick = new Function(`stornoEditace(${id}, '${autorOld}')`);
document.getElementById("autorEd"+id).onclick = new Function(`ulozEditaci(${id}, '${autorOld}')`);
$("#autorJmNew"+id).focus();
}
// document.getElementById("autorEd"+id).onclick = new Function(`ulozEditace(${id})`);
}
function autoryFiltruj(){
let textFiltr = $("#textFiltr").val();
textFiltr = textFiltr.toLocaleLowerCase().trim();
if (textFiltr > ''){
$('[id^="radek"]').removeClass("d-none");
autori.forEach(obj => {
let a = obj.autor.toLocaleLowerCase();
if (a.indexOf(textFiltr) !== 0) {
let id = obj.id;
$("#radek"+id).addClass("d-none");
}
})
}
}
function smazAutora(id){
schovejTlacitka(id)
$("#delConfirmAlert"+id).removeClass("d-none");
let autoriIndex = autori.findIndex(o => o.id == id);
autori[autoriIndex].d = !autori[autoriIndex].d;
$("#confirm"+id).html('Skutečně smazat (smaže se i u knih)?<br>'+autori[autoriIndex].autor);
}
function confirmDelete(id){
$.ajax({
url: "knihy/autori-delete.php",
type: 'POST',
dataType: 'HTML',
data: {
'id': id
},
success: function (result) {
const index = autori.findIndex(o => o.id == id);
if (index > -1) {
autori.splice(index, 1);
}
$("#radek"+id).remove();
$("#radekConfirm"+id).remove();
}
})
}
function ulozEditaci(id, autorOld){
let autor = $("#autorJmNew"+id).val();
autor = autor.trim();
let jeVEditaciIndex = autori.findIndex(o => o.e == true);
if ((autor != '') && (autor != autorOld)) {
$.ajax({
url: "knihy/autori-uloz.php",
type: 'POST',
dataType: 'HTML',
data: {
'autor': autor,
'operace': 'e',
'id': id
},
success: function (result) {
console.log(result);
pretridit();
}
})
} else {
stornoEditace(id, autorOld);
}
}
function stornoEditace(id, autorOld){
let jeVEditaciIndex = autori.findIndex(o => o.e == true);
autori[jeVEditaciIndex].e = false;
$("#autorJm"+id).html(autorOld);
$("#autorDe"+id).html(`<span class="text-danger"><i class="far fa-trash-alt"></span>`);
$("#autorEd"+id).html(`<span class="text-info"><i class="far fa-edit"></span>`);
document.getElementById("autorDe"+id).onclick = new Function(`smazAutora(${id})`);
document.getElementById("autorEd"+id).onclick = new Function(`zavolejEditaci(${id})`);
}
function pretridit(){
$.ajax({
url: "knihy/autori-seznam.php",
type: 'POST',
dataType: 'HTML',
data: {
},
success: function (result) {
$('#seznamAutori').html(result);
naplnAutory();
}
})
}
/*******************************************************************************/
function naplnAutory(){
autori = [];
$('[id^="autorJm"]').each(function () {
let autorJmID = this.id,
id = autorJmID.substr(7, 10),
autor = $("#autorJm"+id).html();
autori.push({'id':id, 'autor':autor, 'e': false, 'd': false});
});
}
</script>