Модератор: [mweb team]
Padonak писал(а):Скай занимался, насколько я помню. Хз как его выцепить, у меня не осталось контакта, хотя раньше был...
Muerto писал(а):Кстати, если форум восстанавливать, то неплохо бы SSL-сертификат установить. Кто хостингом занимается у нас?
VoicE писал(а):... Читаю свои старые сообщения, диву даюсь...
skreets писал(а):Я за чатик в телеге, если что.
skreets писал(а):... индус крестики нолики верстает...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>❌ vs ⚪</title>
<style>
table{
margin-top: 50px;
}
tr{
background-color: #f1f3f4;
}
td{
width: 50px !important;
height: 50px !important;
text-align: center;
cursor: pointer;
font-size: 30px;
border: 1px solid #ccc;
border-radius: 5px;
}
td span{
font-size: 12px;
}
th{
background-color: #fff;
padding: 15px 0px;
}
th b{
font-size: 18px;
color: crimson;
}
.cross{
background-color: #045;
}
.zero{
background-color: #abc;
}
</style>
<script>
let turn = 'cross',
flag = 0;
/* padonakQuery ;)) */
function _(attr){
return !arguments[1] ? document.querySelector(attr) : document.querySelectorAll(attr);
}
function fieldSize(){
const n = +( prompt('Введите количество рядов/ячеек игрового поля', '10')?.replace( /[^\d]+/g, '' ) );
return n >= 6 ? n : 6;
}
function checkVH(val){
/*
Если передан индекс(number), проверяем вертикаль
В противном случае(коллекция) - горизонталь
*/
const row = typeof val == 'number' ? _(`td:nth-child(${val + 1})`, 1) : val,
res = [...row].find( (n, i, A) => i >= 2 && n.className !== '' && n.className == A[i - 1].className && n.className == A[i - 2].className );
if( res ){
_('#game tbody').insertAdjacentHTML('afterbegin', `<tr><th colspan="${row.length}">Игрок <b>${turn == 'zero' ? 'Крестики' : 'Нолики'}</b> победил!</th></tr>` );
_('#game th').scrollIntoView({block: 'center', behavior: 'smooth'});
flag++;
}
}
function checkDiag(fsize, turn, rownum, ind){
const ltrDiag = [], /* left to right */
rtlDiag = []; /* right to left */
/* сперва проверяем диагональ слева-направо */
let [x, y] = [ind, rownum];
/* стартовые позиции для цикла */
while( x > 0 && y > 0 ){ x--; y--; }
/* массив классНеймов(если есть или прочерков) ячеек "по диагонали" */
for(let i = y, j = x; i < fsize; i++, j++){
ltrDiag.push( _('#game').rows[i]?.cells[j]?.className || '-' );
}
/* ищем три классНейма подряд в массиве */
const resLTR = ltrDiag.find( (n, i, A) => i >= 2 && n !== '-' && n == A[i - 1] && n == A[i - 2] );
if( resLTR ){
_('#game tbody').insertAdjacentHTML('afterbegin', `<tr><th colspan="${fsize}">Игрок <b>${turn == 'zero' ? 'Нолики' : 'Крестики'}</b> победил!</th></tr>` );
_('#game th').scrollIntoView({block: 'center', behavior: 'smooth'});
flag++;
/* если нашлось, то выходим из функции */
return;
}
/* если первая диагональ не дала результата, проверяем справа-налево */
let [c, r] = [ind, rownum];
/* стартовые позиции для цикла */
while( c < fsize - 1 && r > 0 ){ c++; r--; }
// console.log( [c, r] );
/* массив классНеймов(если есть или прочерков) ячеек "по диагонали" */
for(let i = r, j = c; i < fsize && j >= 0; i++, j--){
rtlDiag.push( _('#game').rows[i].cells[j].className || '-' );
//console.log(`row ${i} cell ${j}`);
}
//console.log( rtlDiag );
/* ищем три классНейма подряд в массиве */
const resRTL = rtlDiag.find( (n, i, A) => i >= 2 && n !== '-' && n == A[i - 1] && n == A[i - 2] );
if( resRTL ){
_('#game tbody').insertAdjacentHTML('afterbegin', `<tr><th colspan="${fsize}">Игрок <b>${turn == 'zero' ? 'Нолики' : 'Крестики'}</b> победил!</th></tr>` );
_('#game th').scrollIntoView({block: 'center', behavior: 'smooth'});
flag++;
}
}
function buildTab(){
const n = Array( fieldSize() ).fill(0);
_('body').insertAdjacentHTML('afterbegin', `<table id="game" align="center" border="0">
<tbody>
${ n.map( tr => `<tr>
${ n.map( td => `<td> </td>` ).join('') }
</tr>` ).join('') }
</tbody></table>`);
_('#game').addEventListener('click', e => {
const trg = e.target,
cls = ['cross','zero'];
if(flag > 0 || trg.tagName !== 'TD' || cls.includes( trg.className )) return;
trg.classList.add(turn);
turn == 'zero' ?
[trg.innerHTML = '⚪', turn = 'cross'] :
[trg.innerHTML = '❌', turn = 'zero'];
/* проверка по горизонтали */
flag == 0 ? checkVH(trg.closest('tr').cells) : null;
/* проверка по вертикали */
flag == 0 ? checkVH([...trg.closest('tr').cells].indexOf(trg)) : null;
/* проверка по диагонали */
flag == 0 ? checkDiag(
n.length,
trg.className,
[..._('#game').rows].indexOf(trg.closest('tr')),
[...trg.closest('tr').cells].indexOf(trg)
) :
null;
});
}
onload = buildTab;
</script>
</head>
<body>
</body>
</html>
Сейчас этот форум просматривают: нет зарегистрированных пользователей и гости: 3