Можете контруктивно прокритиковать код и сто надо выучить что бы это исправить?
Я понимаю что код ужасен, но что именно нет, помогите пожалуйста.
Это ajax вывод, сортировкаб пагинация.
Вот код -
// идентифицируем select
let select = document.querySelector(".select-css");
let vval = document.querySelector(".forfor");
let pagiArea = document.querySelector('.pagination');
function getSelectInfo(){
let sql = '';
if (select.value == "dateNew") {
sql = 'SELECT * FROM "modScheme"."mod" ORDER BY "date_time" DESC';
}
if (select.value == "dateOld") {
sql = 'SELECT * FROM "modScheme"."mod" ORDER BY "date_time"';
}
if (select.value == "size") {
sql = 'SELECT * FROM "modScheme"."mod" ORDER BY "modSize" DESC';
}
return sql;
}
function showPagination(pages, currentPage) {
let pagi = '<a href="javascript://" onclick="duol(1)" class="firstPagiHref"><div id="pagiFirst">1</div></a><a class="firstPagiHref2"><div id="pagiTypical">..</div></a>';
if (Number(currentPage) == 1) {
pagi = pagi + '<a class="firstPagiHref" href="javascript://" onclick="duol(1)"><div id="pagiTypical" class="currentPagiPage">1</div></a>';
if (pages >= Number(currentPage) + 1) {
pagi = pagi + '<a class="firstPagiHref" href="javascript://" onclick="duol(2)"><div id="pagiTypical">2</div></a>';
}
if (pages >= Number(currentPage) + 2) {
alert(pages);
alert(Number(currentPage) + 2);
pagi = pagi + '<a class="firstPagiHref" href="javascript://" onclick="duol(3)"><div id="pagiTypical">3</div></a>';
}
if (pages >= Number(currentPage) + 3) {
pagi = pagi + '<a class="firstPagiHref" hhref="javascript://" onclick="duol(4)"><div id="pagiTypical">4</div></a>';
}
if (pages >= Number(currentPage) + 4) {
pagi = pagi + '<a class="firstPagiHref" href="javascript://" onclick="duol(5)"><div id="pagiTypical">5</div></a>';
}
} else if (Number(currentPage) == 2) {
pagi = pagi + '<a class="firstPagiHref" href="javascript://" onclick="duol('+(Number(currentPage) - 1)+')"><div id="pagiTypical">' + (Number(currentPage) - 1) + '</div></a>';
pagi = pagi + '<a class="firstPagiHref" href="javascript://" onclick="duol('+Number(currentPage)+')"><div id="pagiTypical" class="currentPagiPage">'+Number(currentPage)+'</div></a>';
if (pages >= Number(currentPage) + 1) {
pagi = pagi + '<a class="firstPagiHref" href="javascript://" onclick="duol('+(Number(currentPage) + 1)+')"><div id="pagiTypical">'+(Number(currentPage) + 1)+'</div></a>';
}
if (pages >= Number(currentPage) + 2) {
pagi = pagi + '<a class="firstPagiHref" href="javascript://" onclick="duol('+(Number(currentPage) + 2)+')"><div id="pagiTypical">'+(Number(currentPage) + 2)+'</div></a>';
}
if (pages >= Number(currentPage) + 3) {
pagi = pagi + '<a class="firstPagiHref" href="javascript://" onclick="duol('+(Number(currentPage) + 3)+')"><div id="pagiTypical">'+(Number(currentPage) + 3)+'</div></a>';
}
} else {
if (pages >= Number(currentPage) -2) pagi = pagi + '<a class="firstPagiHref" href="javascript://" onclick="duol('+(Number(currentPage) - 2)+')"><div id="pagiTypical">'+(Number(currentPage) - 2)+'</div></a>';
if (pages >= Number(currentPage) -1) {
pagi = pagi + '<a class="firstPagiHref" href="javascript://" onclick="duol('+(Number(currentPage) - 1)+')"><div id="pagiTypical">'+(Number(currentPage) - 1)+'</div></a>';
}
pagi = pagi + '<a class="firstPagiHref" href="javascript://" onclick="duol('+Number(currentPage)+')"><div id="pagiTypical" class="currentPagiPage">'+Number(currentPage)+'</div></a>';
if (pages >= Number(currentPage) + 1) {
pagi = pagi + '<a class="firstPagiHref"href="javascript://" onclick="duol('+(Number(currentPage) + 2)+')"><div id="pagiTypical" >'+(Number(currentPage) + 2)+'</div></a>';
}
if (pages >= Number(currentPage) + 2) {
pagi = pagi + '<a class="firstPagiHref" href="javascript://" onclick="duol('+(Number(currentPage) + 3)+')"><div id="pagiTypical" >'+(Number(currentPage) + 3)+'</div></a>';
}
}
pagi = pagi + '<a class="firstPagiHref2"><div id="pagiTypical">..</div></a>'+'<a href="javascript://" onclick="duol('+pages+')" class="firstPagiHref"><div id="pagiEnd">'+pages+'</div></a>';
pagiArea.innerHTML = pagi;
return (currentPage * 7) - 7;
document.querySelector('#ya1').scrollIntoView({
behavior: 'smooth',
block: 'start'
})
}
function getPagiInfo() {
return new Promise(function (resolve, reject) {
var request = new XMLHttpRequest();
// Настройка запроса
request.open('GET','/pagi/',true);
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
//Подписка на событие onreadystatechange и обработка его с помощью анонимной функции
request.addEventListener('readystatechange', function() {
// если состояния запроса 4 и статус запроса 200 (OK)
if ((request.readyState==4) && (request.status==200)) {
let objects = request.responseText;
objects = Math.ceil(objects);
let currentPage = document.querySelector('.currentPagiPage').innerHTML;
let result = showPagination(objects, currentPage);
resolve(result);
}
});
// Отправка запроса на сервер
request.send();
});
}
function show(obj) {
// расшифровываем json
vval.innerHTML = "";
let obj1 = JSON.parse(obj);
for (let i=0; i<obj1.length; i++) {
vval.innerHTML= vval.innerHTML + '<a href="#" class="hrefCar">'+'<div class="blockTypicalCar">'+'<div class="blockTitle">МОД '+obj1[i]['title']+' ДЛЯ BEAMNG.DRIVE</div>'+'<img src="/asset/other/images/beam.jpg" id="imageCarTipical">'+'<div class="otherContentCar">'+'<div class="someText">'+obj1[i]['textAbout']+'</div>'+'<hr>'+'<div class="infoIcons">'+'<div class="viewsCar"><img src="/asset/other/images/svg/preview.svg"> '+obj1[i]['watches']+'</div>'+'<div class="commentsCar"><img src="/asset/other/images/svg/comment.svg"> '+obj1[i]['comments']+'</div>'+'<div class="downloadsCar"><img src="/asset/other/images/svg/download.svg"> '+obj1[i]['downloads']+'</div>'+'</div>'+'<hr>'+'<a href="#" id="downloadHref" download><div class="donateHeaderButt secondButt"><button>Скачать</button></div></a>'+'</div>'+'</div>'+'</a>';
}
}
function getObjects(query, limit, offset) {
var request = new XMLHttpRequest();
// Настройка запроса
request.open('GET','/search/?query='+query+' LIMIT '+limit+' OFFSET '+offset,true);
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
//Подписка на событие onreadystatechange и обработка его с помощью анонимной функции
request.addEventListener('readystatechange', function() {
// если состояния запроса 4 и статус запроса 200 (OK)
if ((request.readyState==4) && (request.status==200)) {
let objects = request.responseText;
show(objects);
}
});
// Отправка запроса на сервер
request.send();
}
select.onchange = function () {
let sql = getSelectInfo();
let a = getPagiInfo();
let promiseResult = a.then(result => {b = result}).then(() => getObjects(sql, 7, b));
}
window.onload = function () {
// собираем sql
var request = new XMLHttpRequest();
// Настройка запроса
request.open('GET','/pagi/',true);
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
//Подписка на событие onreadystatechange и обработка его с помощью анонимной функции
request.addEventListener('readystatechange', function() {
// если состояния запроса 4 и статус запроса 200 (OK)
if ((request.readyState==4) && (request.status==200)) {
let objects = request.responseText;
objects = Math.ceil(objects);
showPagination(objects, 1);
}
});
// Отправка запроса на сервер
request.send();
let sql = 'SELECT * FROM "modScheme"."mod" ORDER BY "date_time" DESC';
getObjects(sql, 7, 0);
}
function duol(aaa) {
let sql = getSelectInfo();
if (aaa != 1) {
aaa = (aaa * 7) - 7;
} else {
aaa = 0;
}
getObjects(sql, 7, aaa);
if (aaa == 0) {
aaa = 1;
} else {
aaa = (aaa / 7) + 1;
}
var request = new XMLHttpRequest();
// Настройка запроса
request.open('GET','/pagi/',true);
//request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
//Подписка на событие onreadystatechange и обработка его с помощью анонимной функции
request.addEventListener('readystatechange', function() {
// если состояния запроса 4 и статус запроса 200 (OK)
if ((request.readyState==4) && (request.status==200)) {
let objects = request.responseText;
objects = Math.ceil(objects);
showPagination(objects, aaa);
}
});
request.send();
}