script.js - master - diman_sh/tetris1

script.js
312 строк7 KB
s1mdm
virse 1
12 янв 2026, 10:51
12 янв 2026, 10:51212a647
let main = document.querySelector('.main');
const scoreElement = document.getElementById('score');
const levelElement = document.getElementById('level');
const nextFigureElement = document.getElementById('next-figure');
let currentLevel = 1;

let possibleLevels = {
  1: {
    scorePerLine: 10,
    speed: 400,
    nextLevelScore: 20,
  },
  2:  {
    scorePerLine: 15,
    speed: 300,
    nextLevelScore: 50,
  },
  3:  {
    scorePerLine: 20,
    speed: 200,
    nextLevelScore: 50,
  },
  4:  {
    scorePerLine: 30,
    speed: 100,
    nextLevelScore: 50,
  },
  5:  {
    scorePerLine: 50,
    speed: 50,
    nextLevelScore: 50,
  },
}


let playfield = [
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
];


let figures = {
  O: [
    [1, 1],
    [1, 1],
  ],
  I: [
    [0, 0, 0, 0],
    [1, 1, 1, 1],
    [0, 0, 0, 0],
    [0, 0, 0, 0],
  ],
  S: [
    [0, 1, 1],
    [1, 1, 0],
    [0, 0, 0],
  ],
  Z: [
    [1, 1, 0],
    [0, 1, 1],
    [0, 0, 0],
  ],
  T: [
    [1, 1, 1],
    [0, 1, 0],
    [0, 0, 0],
  ],
  L: [
    [1, 0, 0],
    [1, 0, 0],
    [1, 1, 0],
  ],
  J: [
    [0, 0, 1],
    [0, 0, 1],
    [0, 1, 1],
  ]
};

let activeFigure = getNewFigure();
let nextFigure = getNewFigure();

function draw() {
  let mainInnerHTML = '';
  for (let y = 0; y < playfield.length; y++) {
    for (let x = 0; x < playfield[y].length; x++) {
      if (playfield[y][x] === 1) {
        mainInnerHTML += '<div class="cell movingCell"></div>';
      } else if (playfield[y][x] === 2) {
        mainInnerHTML += '<div class="cell fixedCell"></div>';
      } else {
        mainInnerHTML += '<div class="cell"></div>';
      }
        
    }  
  }
  main.innerHTML = mainInnerHTML;
}

function drawNextFigure() {
  let nextFigureInnerHTML = '';
  for (let y = 0; y < nextFigure.figure.length; y++) {
    for (let x = 0; x < nextFigure.figure[y].length; x++) {
      if (nextFigure.figure[y][x]) {
        nextFigureInnerHTML += '<div class="cell fixedCell"></div>';
      } else {
        nextFigureInnerHTML += '<div class="cell"></div>';
      }
    }
    nextFigureInnerHTML += '<br>';
  }
  nextFigureElement.innerHTML = nextFigureInnerHTML;
}

function removePrevFigure() {
  for (let y = 0; y < playfield.length; y++) {
    for (let x = 0; x < playfield[y].length; x++) {
      if (playfield[y][x] === 1) {
        playfield[y][x] = 0;
      }
    }
  }
}

function addActiveFigure() {
  removePrevFigure();
  for (let y = 0; y < activeFigure.figure.length; y++) {
    for (let x = 0; x < activeFigure.figure[y].length; x++) {
      if (activeFigure.figure[y][x]) {
        playfield[y + activeFigure.y][x + activeFigure.x] = activeFigure.figure[y][x];
      }      
    }    
  }
}

function rotateFigure() {
  const temp = activeFigure.figure;
  activeFigure.figure = activeFigure.figure[0].map((val, index) =>
    activeFigure.figure.map(row => row[index]).reverse());
  if (hasCollision()) {
    activeFigure.figure = temp;
  }
}

function hasCollision() {
  for (let y = 0; y < activeFigure.figure.length; y++) {
    for (let x = 0; x < activeFigure.figure[y].length; x++) {
      if (activeFigure.figure[y][x] && 
        (playfield[activeFigure.y+y] === undefined ||
        playfield[activeFigure.y+y][activeFigure.x+x] === undefined ||
        playfield[activeFigure.y+y][activeFigure.x+x] === 2)) {
        return true;
      }
    }
  }
  return false;
}

function removeFullLines() {
  let score = parseInt(scoreElement.textContent);  
  let filedLines = 0;
  let canRemoveLine = true;

  for (let y = 0; y < playfield.length; y++) {
    for (let x = 0; x < playfield[y].length; x++) {
      if (playfield[y][x] !== 2) {
        canRemoveLine = false;
        break;
      }
    }
    if (canRemoveLine) {
      playfield.splice(y, 1);
      playfield.splice(0, 0, [0, 0, 0, 0, 0, 0, 0, 0, 0, 0]);

      filedLines++;
    }
    canRemoveLine = true;
  }
  switch (filedLines) {
    case 1:
      score += possibleLevels[currentLevel].scorePerLine;
      break;
    case 2:
      score += possibleLevels[currentLevel].scorePerLine;
      break;
    case 3:
      score += possibleLevels[currentLevel].scorePerLine;
      break;
    case 4:
      score += possibleLevels[currentLevel].scorePerLine;
      break;
    default:
      score += 0;
      break;
  }
  scoreElement.textContent = score;

  if (score >= possibleLevels[currentLevel].score) {
    currentLevel++;
    levelElement.textContent = currentLevel;
  }
}

function getNewFigure() {
  const possibleFigures = 'IOLJTSZ';
  const rand = Math.floor(Math.random() * 7);
  const newFigure = figures[possibleFigures[rand]];
  return {
    x: Math.floor((10 - newFigure[0].length) / 2),
    y: 0,
    figure: newFigure,
  };
}

function fixFigure() {
  for (let y = 0; y < playfield.length; y++) {
    for (let x = 0; x < playfield[y].length; x++) {
      if (playfield[y][x] === 1) {
        playfield[y][x] = 2;
      }
    }
  }
}

function moveFigureDown() {
  activeFigure.y += 1;
  if (hasCollision()) {
    activeFigure.y -= 1;
    fixFigure();
    removeFullLines(); 
    activeFigure = nextFigure;
    if (hasCollision()) {
      alert("Game over!"),
      location.reload(),
      clearInterval(interval);
    }
    nextFigure = getNewFigure();
  }
}

function dropFigure() {
  for (let y = activeFigure.y; y < playfield.length; y++) {
    activeFigure.y += 1;
    if (hasCollision()) {
      activeFigure.y -= 1;
      break;
    }
  }
}

function keyLog(e) {
  if (e.key === 's') {
    activeFigure.x -= 1;
    if (hasCollision()) {
      activeFigure.x += 1;
    }
  }
  if (e.key === 'f') {
    activeFigure.x += 1;
    if (hasCollision()) {
      activeFigure.x -= 1;
    }
  }
  if (e.key === 'd') {
    moveFigureDown();
  }
  if (e.key === 'e') {
    if (activeFigure.figure.length > 1) {
      rotateFigure();
    }
  }
  if (e.key === ' ') {
    dropFigure();
  }
  addActiveFigure();
  draw();
  drawNextFigure();
}
levelElement.textContent = currentLevel;
document.addEventListener('keydown', keyLog);

addActiveFigure();
draw();
drawNextFigure();

function startGame() {
  moveFigureDown();
  addActiveFigure();
  draw();
  drawNextFigure();
  setTimeout(startGame, possibleLevels[currentLevel].speed);
}

setTimeout(startGame, possibleLevels[currentLevel].speed);