diff --git a/frontend/src/views/minigames/Match3Game.vue b/frontend/src/views/minigames/Match3Game.vue index 2864611..e08bb5b 100644 --- a/frontend/src/views/minigames/Match3Game.vue +++ b/frontend/src/views/minigames/Match3Game.vue @@ -106,13 +106,7 @@ @touchstart="onTileMouseDown($event, index)" @touchend="onTileMouseUp($event, index)" @dblclick="handleDoubleClick(index, $event)"> - {{ getTileSymbol(tile.type) }} - - 🚀 - - - 💣 - + {{ getTileSymbol(tile.type) }} @@ -1045,106 +1039,220 @@ export default { const matches = []; // L-Form Matches finden (alle 4 Richtungen) - PRIORITÄT vor regulären Matches - for (let row = 0; row < this.boardHeight - 2; row++) { - for (let col = 0; col < this.boardWidth - 2; col++) { + for (let row = 0; row < this.boardHeight; row++) { + for (let col = 0; col < this.boardWidth; col++) { + // Prüfe ob an dieser Position ein Tile existiert + const centerIndex = this.coordsToIndex(row, col); + if (!centerIndex || !board[centerIndex]) continue; + + const centerType = board[centerIndex].type; + if (this.isPowerUpTile(centerType)) continue; // Power-ups können nicht Teil von L-Formen sein + // L-Form nach rechts unten (┌) if (row + 2 < this.boardHeight && col + 2 < this.boardWidth) { - const verticalIndices = [ - this.coordsToIndex(row, col), - this.coordsToIndex(row + 1, col), - this.coordsToIndex(row + 2, col) - ]; - const horizontalIndices = [ - this.coordsToIndex(row, col), - this.coordsToIndex(row, col + 1), - this.coordsToIndex(row, col + 2) - ]; + // Prüfe vertikale Linie nach unten + let verticalLength = 1; + for (let r = row + 1; r < this.boardHeight; r++) { + const index = this.coordsToIndex(r, col); + if (index && board[index] && board[index].type === centerType && !this.isPowerUpTile(board[index].type)) { + verticalLength++; + } else { + break; + } + } - // Prüfe ob alle Indizes gültig sind und Tiles existieren - if (verticalIndices.every(idx => idx !== null && board[idx]) && - horizontalIndices.every(idx => idx !== null && board[idx]) && - this.isValidMatchForLShape(verticalIndices[0], verticalIndices[1], verticalIndices[2], board) && - this.isValidMatchForLShape(horizontalIndices[0], horizontalIndices[1], horizontalIndices[2], board)) { + // Prüfe horizontale Linie nach rechts + let horizontalLength = 1; + for (let c = col + 1; c < this.boardWidth; c++) { + const index = this.coordsToIndex(row, c); + if (index && board[index] && board[index].type === centerType && !this.isPowerUpTile(board[index].type)) { + horizontalLength++; + } else { + break; + } + } + + // L-Form gefunden wenn beide Linien mindestens 3 Tiles lang sind + if (verticalLength >= 3 && horizontalLength >= 3) { + const lShapeIndices = []; - const cornerIndex = this.coordsToIndex(row, col); - const lShapeIndices = [...new Set([...verticalIndices, ...horizontalIndices])]; - matches.push({ type: 'l-shape', indices: lShapeIndices, corner: cornerIndex, direction: 'bottom-right' }); - if (showDebug) console.log(`🔍 L-Form Match (┌): [${row},${col}] mit 3er vertikal und 3er horizontal`); + // Sammle alle Indizes der vertikalen Linie + for (let r = row; r < row + verticalLength; r++) { + const index = this.coordsToIndex(r, col); + if (index) lShapeIndices.push(index); + } + + // Sammle alle Indizes der horizontalen Linie (ohne den Eckpunkt zu duplizieren) + for (let c = col + 1; c < col + horizontalLength; c++) { + const index = this.coordsToIndex(row, c); + if (index) lShapeIndices.push(index); + } + + matches.push({ + type: 'l-shape', + indices: lShapeIndices, + corner: centerIndex, + direction: 'bottom-right', + verticalLength, + horizontalLength + }); + if (showDebug) console.log(`🔍 L-Form Match (┌): [${row},${col}] mit ${verticalLength}er vertikal und ${horizontalLength}er horizontal`); } } // L-Form nach links unten (┐) if (row + 2 < this.boardHeight && col >= 2) { - const verticalIndices = [ - this.coordsToIndex(row, col), - this.coordsToIndex(row + 1, col), - this.coordsToIndex(row + 2, col) - ]; - const horizontalIndices = [ - this.coordsToIndex(row, col), - this.coordsToIndex(row, col - 1), - this.coordsToIndex(row, col - 2) - ]; + // Prüfe vertikale Linie nach unten + let verticalLength = 1; + for (let r = row + 1; r < this.boardHeight; r++) { + const index = this.coordsToIndex(r, col); + if (index && board[index] && board[index].type === centerType && !this.isPowerUpTile(board[index].type)) { + verticalLength++; + } else { + break; + } + } - if (verticalIndices.every(idx => idx !== null && board[idx]) && - horizontalIndices.every(idx => idx !== null && board[idx]) && - this.isValidMatchForLShape(verticalIndices[0], verticalIndices[1], verticalIndices[2], board) && - this.isValidMatchForLShape(horizontalIndices[0], horizontalIndices[1], horizontalIndices[2], board)) { + // Prüfe horizontale Linie nach links + let horizontalLength = 1; + for (let c = col - 1; c >= 0; c--) { + const index = this.coordsToIndex(row, c); + if (index && board[index] && board[index].type === centerType && !this.isPowerUpTile(board[index].type)) { + horizontalLength++; + } else { + break; + } + } + + // L-Form gefunden wenn beide Linien mindestens 3 Tiles lang sind + if (verticalLength >= 3 && horizontalLength >= 3) { + const lShapeIndices = []; - const cornerIndex = this.coordsToIndex(row, col); - const lShapeIndices = [...new Set([...verticalIndices, ...horizontalIndices])]; - matches.push({ type: 'l-shape', indices: lShapeIndices, corner: cornerIndex, direction: 'bottom-left' }); - if (showDebug) console.log(`🔍 L-Form Match (┐): [${row},${col}] mit 3er vertikal und 3er horizontal`); + // Sammle alle Indizes der vertikalen Linie + for (let r = row; r < row + verticalLength; r++) { + const index = this.coordsToIndex(r, col); + if (index) lShapeIndices.push(index); + } + + // Sammle alle Indizes der horizontalen Linie (ohne den Eckpunkt zu duplizieren) + for (let c = col - 1; c >= col - horizontalLength; c--) { + const index = this.coordsToIndex(row, c); + if (index) lShapeIndices.push(index); + } + + matches.push({ + type: 'l-shape', + indices: lShapeIndices, + corner: centerIndex, + direction: 'bottom-left', + verticalLength, + horizontalLength + }); + if (showDebug) console.log(`🔍 L-Form Match (┐): [${row},${col}] mit ${verticalLength}er vertikal und ${horizontalLength}er horizontal`); } } // L-Form nach rechts oben (└) if (row >= 2 && col + 2 < this.boardWidth) { - const verticalIndices = [ - this.coordsToIndex(row, col), - this.coordsToIndex(row - 1, col), - this.coordsToIndex(row - 2, col) - ]; - const horizontalIndices = [ - this.coordsToIndex(row, col), - this.coordsToIndex(row, col + 1), - this.coordsToIndex(row, col + 2) - ]; + // Prüfe vertikale Linie nach oben + let verticalLength = 1; + for (let r = row - 1; r >= 0; r--) { + const index = this.coordsToIndex(r, col); + if (index && board[index] && board[index].type === centerType && !this.isPowerUpTile(board[index].type)) { + verticalLength++; + } else { + break; + } + } - if (verticalIndices.every(idx => idx !== null && board[idx]) && - horizontalIndices.every(idx => idx !== null && board[idx]) && - this.isValidMatchForLShape(verticalIndices[0], verticalIndices[1], verticalIndices[2], board) && - this.isValidMatchForLShape(horizontalIndices[0], horizontalIndices[1], horizontalIndices[2], board)) { + // Prüfe horizontale Linie nach rechts + let horizontalLength = 1; + for (let c = col + 1; c < this.boardWidth; c++) { + const index = this.coordsToIndex(row, c); + if (index && board[index] && board[index].type === centerType && !this.isPowerUpTile(board[index].type)) { + horizontalLength++; + } else { + break; + } + } + + // L-Form gefunden wenn beide Linien mindestens 3 Tiles lang sind + if (verticalLength >= 3 && horizontalLength >= 3) { + const lShapeIndices = []; - const cornerIndex = this.coordsToIndex(row, col); - const lShapeIndices = [...new Set([...verticalIndices, ...horizontalIndices])]; - matches.push({ type: 'l-shape', indices: lShapeIndices, corner: cornerIndex, direction: 'top-right' }); - if (showDebug) console.log(`🔍 L-Form Match (└): [${row},${col}] mit 3er vertikal und 3er horizontal`); + // Sammle alle Indizes der vertikalen Linie + for (let r = row; r >= row - verticalLength; r--) { + const index = this.coordsToIndex(r, col); + if (index) lShapeIndices.push(index); + } + + // Sammle alle Indizes der horizontalen Linie (ohne den Eckpunkt zu duplizieren) + for (let c = col + 1; c < col + horizontalLength; c++) { + const index = this.coordsToIndex(row, c); + if (index) lShapeIndices.push(index); + } + + matches.push({ + type: 'l-shape', + indices: lShapeIndices, + corner: centerIndex, + direction: 'top-right', + verticalLength, + horizontalLength + }); + if (showDebug) console.log(`🔍 L-Form Match (└): [${row},${col}] mit ${verticalLength}er vertikal und ${horizontalLength}er horizontal`); } } // L-Form nach links oben (┘) if (row >= 2 && col >= 2) { - const verticalIndices = [ - this.coordsToIndex(row, col), - this.coordsToIndex(row - 1, col), - this.coordsToIndex(row - 2, col) - ]; - const horizontalIndices = [ - this.coordsToIndex(row, col), - this.coordsToIndex(row, col - 1), - this.coordsToIndex(row, col - 2) - ]; + // Prüfe vertikale Linie nach oben + let verticalLength = 1; + for (let r = row - 1; r >= 0; r--) { + const index = this.coordsToIndex(r, col); + if (index && board[index] && board[index].type === centerType && !this.isPowerUpTile(board[index].type)) { + verticalLength++; + } else { + break; + } + } - if (verticalIndices.every(idx => idx !== null && board[idx]) && - horizontalIndices.every(idx => idx !== null && board[idx]) && - this.isValidMatchForLShape(verticalIndices[0], verticalIndices[1], verticalIndices[2], board) && - this.isValidMatchForLShape(horizontalIndices[0], horizontalIndices[1], horizontalIndices[2], board)) { + // Prüfe horizontale Linie nach links + let horizontalLength = 1; + for (let c = col - 1; c >= 0; c--) { + const index = this.coordsToIndex(row, c); + if (index && board[index] && board[index].type === centerType && !this.isPowerUpTile(board[index].type)) { + horizontalLength++; + } else { + break; + } + } + + // L-Form gefunden wenn beide Linien mindestens 3 Tiles lang sind + if (verticalLength >= 3 && horizontalLength >= 3) { + const lShapeIndices = []; - const cornerIndex = this.coordsToIndex(row, col); - const lShapeIndices = [...new Set([...verticalIndices, ...horizontalIndices])]; - matches.push({ type: 'l-shape', indices: lShapeIndices, corner: cornerIndex, direction: 'top-left' }); - if (showDebug) console.log(`🔍 L-Form Match (┘): [${row},${col}] mit 3er vertikal und 3er horizontal`); + // Sammle alle Indizes der vertikalen Linie + for (let r = row; r >= row - verticalLength; r--) { + const index = this.coordsToIndex(r, col); + if (index) lShapeIndices.push(index); + } + + // Sammle alle Indizes der horizontalen Linie (ohne den Eckpunkt zu duplizieren) + for (let c = col - 1; c >= col - horizontalLength; c--) { + const index = this.coordsToIndex(row, c); + if (index) lShapeIndices.push(index); + } + + matches.push({ + type: 'l-shape', + indices: lShapeIndices, + corner: centerIndex, + direction: 'top-left', + verticalLength, + horizontalLength + }); + if (showDebug) console.log(`🔍 L-Form Match (┘): [${row},${col}] mit ${verticalLength}er vertikal und ${horizontalLength}er horizontal`); } } } @@ -1278,8 +1386,6 @@ export default { } } - - if (showDebug) { console.log(`🔍 Gefundene Matches: ${matches.length}`, matches); }