Play
:quality(85)/https://cdn.frvr.ai/68856a0f58e29470afcbbd2e.png)
:quality(85)/https://cdn.frvr.ai/68856a0958e29470afcbbd2c.png)
#battleship
#strategy
#naval
#tactical
#classic
Creation History
User prompt
oyun tahtaları biraz daha büyük olmalı çok küçükl gözüküyor ayrıca gemileri dikene yada yatay olarak yerleştirebilmeliyiz. yerleştirdiğim gemileri oyuna başla butonuna basana kadar tekrar yerleştirebilmeliyim. ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
gemiler oyun başlamadan önce kenarda durmalı sürükleyerek ve çevirerek istediğmiiz yere koymalıyız. ayrıca vurduğumuz kısımlar için kutular olmalı soldan aşağı doğru harf harf yukarıdan soldan sağa doğru sayı olmak üzere ↪💡 Consider importing and using the following plugins: @upit/tween.v1
Code edit (1 edits merged)
Please save this source code
User prompt
Battleship Commander
Initial prompt
amiral battı oyunu yapmak istiyorum
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
/****
* Classes
****/
var DraggableShip = Container.expand(function (length, id) {
var self = Container.call(this);
self.length = length;
self.shipId = id;
self.isHorizontal = true;
self.isBeingDragged = false;
self.isPlaced = false;
self.shipCells = [];
// Create visual representation of ship
for (var i = 0; i < length; i++) {
var shipCell = self.attachAsset('ship', {
anchorX: 0,
anchorY: 0
});
shipCell.x = i * CELL_SIZE;
shipCell.y = 0;
self.shipCells.push(shipCell);
}
self.rotate = function () {
self.isHorizontal = !self.isHorizontal;
for (var i = 0; i < self.shipCells.length; i++) {
if (self.isHorizontal) {
self.shipCells[i].x = i * CELL_SIZE;
self.shipCells[i].y = 0;
} else {
self.shipCells[i].x = 0;
self.shipCells[i].y = i * CELL_SIZE;
}
}
};
self.canBePlacedAt = function (gridX, gridY) {
for (var i = 0; i < self.length; i++) {
var x = self.isHorizontal ? gridX + i : gridX;
var y = self.isHorizontal ? gridY : gridY + i;
if (x >= GRID_SIZE || y >= GRID_SIZE || x < 0 || y < 0) {
return false;
}
if (playerGrid[x][y].hasShip) {
return false;
}
}
return true;
};
self.placeOnGrid = function (gridX, gridY) {
if (self.canBePlacedAt(gridX, gridY)) {
for (var i = 0; i < self.length; i++) {
var x = self.isHorizontal ? gridX + i : gridX;
var y = self.isHorizontal ? gridY : gridY + i;
playerGrid[x][y].setShip(self.shipId);
}
self.isPlaced = true;
self.visible = false;
return true;
}
return false;
};
self.down = function (x, y, obj) {
if (!self.isPlaced && gameState === 'placement') {
self.isBeingDragged = true;
draggedShip = self;
tween(self, {
alpha: 0.7
}, {
duration: 200
});
}
};
self.up = function (x, y, obj) {
if (self.isBeingDragged && !self.isPlaced) {
self.isBeingDragged = false;
tween(self, {
alpha: 1
}, {
duration: 200
});
// Try to place ship on grid
var gridX = Math.floor((self.x - GRID_OFFSET_X) / CELL_SIZE);
var gridY = Math.floor((self.y - PLAYER_GRID_Y) / CELL_SIZE);
if (self.placeOnGrid(gridX, gridY)) {
placedShipsCount++;
if (placedShipsCount >= shipLengths.length) {
statusText.setText('All ships placed! Press START GAME to begin');
startButton.visible = true;
} else {
statusText.setText('Place remaining ships (' + (shipLengths.length - placedShipsCount) + ' left)');
}
} else {
// Return to original position if can't place
tween(self, {
x: self.originalX,
y: self.originalY
}, {
duration: 300,
easing: tween.easeOut
});
}
}
};
return self;
});
var GridCell = Container.expand(function (x, y, isPlayer) {
var self = Container.call(this);
self.gridX = x;
self.gridY = y;
self.isPlayer = isPlayer;
self.hasShip = false;
self.isHit = false;
self.isMiss = false;
self.shipId = -1;
var cellGraphics = self.attachAsset('water', {
anchorX: 0,
anchorY: 0
});
self.setShip = function (shipId) {
self.hasShip = true;
self.shipId = shipId;
if (self.isPlayer) {
cellGraphics.tint = 0x808080;
}
};
self.markHit = function () {
self.isHit = true;
cellGraphics.tint = 0xFF0000;
};
self.markMiss = function () {
self.isMiss = true;
cellGraphics.tint = 0xFFFFFF;
};
self.markSunk = function () {
cellGraphics.tint = 0x2F2F2F;
};
self.down = function (x, y, obj) {
if (gameState === 'playing' && !self.isPlayer && !self.isHit && !self.isMiss) {
playerShoot(self.gridX, self.gridY);
}
};
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x87CEEB
});
/****
* Game Code
****/
var Ship = function Ship(length, id) {
this.length = length;
this.id = id;
this.hits = 0;
this.cells = [];
this.isSunk = false;
this.addCell = function (x, y) {
this.cells.push({
x: x,
y: y
});
};
this.hit = function () {
this.hits++;
if (this.hits >= this.length) {
this.isSunk = true;
return true;
}
return false;
};
};
var GRID_SIZE = 10;
var CELL_SIZE = 120;
var GRID_OFFSET_X = 150;
var PLAYER_GRID_Y = 1600;
var AI_GRID_Y = 200;
var playerGrid = [];
var aiGrid = [];
var playerShips = [];
var aiShips = [];
var gameState = 'placement'; // 'placement', 'playing', 'gameOver'
var currentPlayer = 'player'; // 'player', 'ai'
var selectedX = -1;
var selectedY = -1;
var currentShipToPlace = 0;
var isHorizontalPlacement = true;
var shipLengths = [5, 4, 3, 3, 2];
var draggableShips = [];
var placedShipsCount = 0;
var draggedShip = null;
// UI Elements
var statusText = new Text2('Drag ships to your grid', {
size: 60,
fill: 0x000000
});
statusText.anchor.set(0.5, 0);
LK.gui.top.addChild(statusText);
var instructionText = new Text2('Double tap ships to rotate, drag to reposition', {
size: 40,
fill: 0x000000
});
instructionText.anchor.set(0.5, 0);
instructionText.y = 100;
LK.gui.top.addChild(instructionText);
var startButton = new Text2('START GAME', {
size: 60,
fill: 0x00FF00
});
startButton.anchor.set(0.5, 0.5);
startButton.x = 2048 / 2;
startButton.y = 800;
startButton.visible = false;
game.addChild(startButton);
startButton.down = function (x, y, obj) {
if (gameState === 'placement' && placedShipsCount >= shipLengths.length) {
gameState = 'playing';
statusText.setText('Fire at enemy positions!');
instructionText.setText('Tap enemy grid to shoot');
startButton.visible = false;
placeAIShips();
}
};
// Initialize grids
function initializeGrids() {
// Player grid
for (var x = 0; x < GRID_SIZE; x++) {
playerGrid[x] = [];
for (var y = 0; y < GRID_SIZE; y++) {
var cell = new GridCell(x, y, true);
cell.x = GRID_OFFSET_X + x * CELL_SIZE;
cell.y = PLAYER_GRID_Y + y * CELL_SIZE;
playerGrid[x][y] = cell;
game.addChild(cell);
}
}
// AI grid
for (var x = 0; x < GRID_SIZE; x++) {
aiGrid[x] = [];
for (var y = 0; y < GRID_SIZE; y++) {
var cell = new GridCell(x, y, false);
cell.x = GRID_OFFSET_X + x * CELL_SIZE;
cell.y = AI_GRID_Y + y * CELL_SIZE;
aiGrid[x][y] = cell;
game.addChild(cell);
}
}
// Add grid labels
var playerLabel = new Text2('Your Fleet', {
size: 50,
fill: 0x000000
});
playerLabel.anchor.set(0.5, 0.5);
playerLabel.x = GRID_OFFSET_X + GRID_SIZE * CELL_SIZE / 2;
playerLabel.y = PLAYER_GRID_Y - 50;
game.addChild(playerLabel);
var aiLabel = new Text2('Enemy Waters', {
size: 50,
fill: 0x000000
});
aiLabel.anchor.set(0.5, 0.5);
aiLabel.x = GRID_OFFSET_X + GRID_SIZE * CELL_SIZE / 2;
aiLabel.y = AI_GRID_Y - 50;
game.addChild(aiLabel);
// Add coordinate labels for player grid
for (var i = 0; i < GRID_SIZE; i++) {
// Letters A-J on the left side
var letterLabel = new Text2(String.fromCharCode(65 + i), {
size: 30,
fill: 0x000000
});
letterLabel.anchor.set(0.5, 0.5);
letterLabel.x = GRID_OFFSET_X - 40;
letterLabel.y = PLAYER_GRID_Y + i * CELL_SIZE + CELL_SIZE / 2;
game.addChild(letterLabel);
// Numbers 1-10 on the top
var numberLabel = new Text2((i + 1).toString(), {
size: 30,
fill: 0x000000
});
numberLabel.anchor.set(0.5, 0.5);
numberLabel.x = GRID_OFFSET_X + i * CELL_SIZE + CELL_SIZE / 2;
numberLabel.y = PLAYER_GRID_Y - 90;
game.addChild(numberLabel);
}
// Add coordinate labels for AI grid
for (var i = 0; i < GRID_SIZE; i++) {
// Letters A-J on the left side
var letterLabel = new Text2(String.fromCharCode(65 + i), {
size: 30,
fill: 0x000000
});
letterLabel.anchor.set(0.5, 0.5);
letterLabel.x = GRID_OFFSET_X - 40;
letterLabel.y = AI_GRID_Y + i * CELL_SIZE + CELL_SIZE / 2;
game.addChild(letterLabel);
// Numbers 1-10 on the top
var numberLabel = new Text2((i + 1).toString(), {
size: 30,
fill: 0x000000
});
numberLabel.anchor.set(0.5, 0.5);
numberLabel.x = GRID_OFFSET_X + i * CELL_SIZE + CELL_SIZE / 2;
numberLabel.y = AI_GRID_Y - 90;
game.addChild(numberLabel);
}
// Create draggable ships
var shipStartY = 1000;
var shipStartX = 100;
for (var i = 0; i < shipLengths.length; i++) {
var ship = new DraggableShip(shipLengths[i], i);
ship.x = shipStartX;
ship.y = shipStartY + i * 120;
ship.originalX = ship.x;
ship.originalY = ship.y;
draggableShips.push(ship);
game.addChild(ship);
}
}
function selectCellForPlacement(x, y) {
selectedX = x;
selectedY = y;
if (canPlaceShip(x, y, shipLengths[currentShipToPlace], isHorizontalPlacement, true)) {
placeShip(x, y, shipLengths[currentShipToPlace], isHorizontalPlacement, true, currentShipToPlace);
currentShipToPlace++;
if (currentShipToPlace >= shipLengths.length) {
gameState = 'playing';
statusText.setText('Fire at enemy positions!');
instructionText.setText('Tap enemy grid to shoot');
placeAIShips();
} else {
statusText.setText('Place ship ' + (currentShipToPlace + 1) + ' (length: ' + shipLengths[currentShipToPlace] + ')');
}
}
}
function canPlaceShip(startX, startY, length, horizontal, isPlayer) {
var grid = isPlayer ? playerGrid : aiGrid;
for (var i = 0; i < length; i++) {
var x = horizontal ? startX + i : startX;
var y = horizontal ? startY : startY + i;
if (x >= GRID_SIZE || y >= GRID_SIZE || x < 0 || y < 0) {
return false;
}
if (grid[x][y].hasShip) {
return false;
}
}
return true;
}
function placeShip(startX, startY, length, horizontal, isPlayer, shipId) {
var grid = isPlayer ? playerGrid : aiGrid;
var ships = isPlayer ? playerShips : aiShips;
var ship = new Ship(length, shipId);
for (var i = 0; i < length; i++) {
var x = horizontal ? startX + i : startX;
var y = horizontal ? startY : startY + i;
grid[x][y].setShip(shipId);
ship.addCell(x, y);
}
ships.push(ship);
}
function placeAIShips() {
for (var i = 0; i < shipLengths.length; i++) {
var placed = false;
var attempts = 0;
while (!placed && attempts < 100) {
var x = Math.floor(Math.random() * GRID_SIZE);
var y = Math.floor(Math.random() * GRID_SIZE);
var horizontal = Math.random() < 0.5;
if (canPlaceShip(x, y, shipLengths[i], horizontal, false)) {
placeShip(x, y, shipLengths[i], horizontal, false, i);
placed = true;
}
attempts++;
}
}
}
function playerShoot(x, y) {
if (currentPlayer !== 'player') return;
var cell = aiGrid[x][y];
var hit = false;
if (cell.hasShip) {
cell.markHit();
hit = true;
LK.getSound('hit').play();
var ship = aiShips[cell.shipId];
var sunk = ship.hit();
if (sunk) {
LK.getSound('sunk').play();
markShipAsSunk(ship, false);
if (checkVictory(false)) {
gameState = 'gameOver';
statusText.setText('Victory! You sank all enemy ships!');
instructionText.setText('');
LK.showYouWin();
return;
}
}
statusText.setText('Hit! Fire again!');
} else {
cell.markMiss();
LK.getSound('miss').play();
currentPlayer = 'ai';
statusText.setText('Miss! Enemy turn...');
LK.setTimeout(function () {
aiTurn();
}, 1000);
}
}
function aiTurn() {
if (currentPlayer !== 'ai') return;
var x, y;
var attempts = 0;
do {
x = Math.floor(Math.random() * GRID_SIZE);
y = Math.floor(Math.random() * GRID_SIZE);
attempts++;
} while ((playerGrid[x][y].isHit || playerGrid[x][y].isMiss) && attempts < 100);
var cell = playerGrid[x][y];
var hit = false;
if (cell.hasShip) {
cell.markHit();
hit = true;
LK.getSound('hit').play();
var ship = playerShips[cell.shipId];
var sunk = ship.hit();
if (sunk) {
LK.getSound('sunk').play();
markShipAsSunk(ship, true);
if (checkVictory(true)) {
gameState = 'gameOver';
statusText.setText('Defeat! Enemy sank all your ships!');
instructionText.setText('');
LK.showGameOver();
return;
}
}
statusText.setText('Enemy hit your ship!');
LK.setTimeout(function () {
aiTurn();
}, 1000);
} else {
cell.markMiss();
LK.getSound('miss').play();
currentPlayer = 'player';
statusText.setText('Enemy missed! Your turn!');
}
}
function markShipAsSunk(ship, isPlayer) {
var grid = isPlayer ? playerGrid : aiGrid;
for (var i = 0; i < ship.cells.length; i++) {
var cellPos = ship.cells[i];
grid[cellPos.x][cellPos.y].markSunk();
}
}
function removeShipFromGrid(ship) {
for (var x = 0; x < GRID_SIZE; x++) {
for (var y = 0; y < GRID_SIZE; y++) {
if (playerGrid[x][y].shipId === ship.shipId) {
playerGrid[x][y].hasShip = false;
playerGrid[x][y].shipId = -1;
var cellGraphics = playerGrid[x][y].children[0];
cellGraphics.tint = 0xFFFFFF;
}
}
}
}
function checkVictory(playerLost) {
var ships = playerLost ? playerShips : aiShips;
for (var i = 0; i < ships.length; i++) {
if (!ships[i].isSunk) {
return false;
}
}
return true;
}
// Double tap to rotate ship during placement
var lastTapTime = 0;
game.down = function (x, y, obj) {
if (gameState === 'placement') {
var currentTime = Date.now();
if (currentTime - lastTapTime < 300) {
// Find ship being rotated - check both unplaced and placed ships
for (var i = 0; i < draggableShips.length; i++) {
var ship = draggableShips[i];
var shipBounds = {
x: ship.x,
y: ship.y,
width: ship.isHorizontal ? ship.length * CELL_SIZE : CELL_SIZE,
height: ship.isHorizontal ? CELL_SIZE : ship.length * CELL_SIZE
};
if (x >= shipBounds.x && x <= shipBounds.x + shipBounds.width && y >= shipBounds.y && y <= shipBounds.y + shipBounds.height) {
if (ship.isPlaced) {
// Remove ship from grid
removeShipFromGrid(ship);
ship.isPlaced = false;
ship.visible = true;
placedShipsCount--;
}
ship.rotate();
break;
}
}
instructionText.setText('Double tap ships to rotate, drag to reposition');
}
lastTapTime = currentTime;
}
};
game.move = function (x, y, obj) {
if (gameState === 'placement' && draggedShip) {
draggedShip.x = x - draggedShip.width / 2;
draggedShip.y = y - draggedShip.height / 2;
}
};
game.up = function (x, y, obj) {
draggedShip = null;
};
// Initialize the game
initializeGrids(); ===================================================================
--- original.js
+++ change.js
@@ -86,12 +86,10 @@
var gridY = Math.floor((self.y - PLAYER_GRID_Y) / CELL_SIZE);
if (self.placeOnGrid(gridX, gridY)) {
placedShipsCount++;
if (placedShipsCount >= shipLengths.length) {
- gameState = 'playing';
- statusText.setText('Fire at enemy positions!');
- instructionText.setText('Tap enemy grid to shoot');
- placeAIShips();
+ statusText.setText('All ships placed! Press START GAME to begin');
+ startButton.visible = true;
} else {
statusText.setText('Place remaining ships (' + (shipLengths.length - placedShipsCount) + ' left)');
}
} else {
@@ -178,12 +176,12 @@
return false;
};
};
var GRID_SIZE = 10;
-var CELL_SIZE = 80;
-var GRID_OFFSET_X = 200;
-var PLAYER_GRID_Y = 1500;
-var AI_GRID_Y = 300;
+var CELL_SIZE = 120;
+var GRID_OFFSET_X = 150;
+var PLAYER_GRID_Y = 1600;
+var AI_GRID_Y = 200;
var playerGrid = [];
var aiGrid = [];
var playerShips = [];
var aiShips = [];
@@ -203,15 +201,33 @@
fill: 0x000000
});
statusText.anchor.set(0.5, 0);
LK.gui.top.addChild(statusText);
-var instructionText = new Text2('Double tap to rotate ships', {
+var instructionText = new Text2('Double tap ships to rotate, drag to reposition', {
size: 40,
fill: 0x000000
});
instructionText.anchor.set(0.5, 0);
instructionText.y = 100;
LK.gui.top.addChild(instructionText);
+var startButton = new Text2('START GAME', {
+ size: 60,
+ fill: 0x00FF00
+});
+startButton.anchor.set(0.5, 0.5);
+startButton.x = 2048 / 2;
+startButton.y = 800;
+startButton.visible = false;
+game.addChild(startButton);
+startButton.down = function (x, y, obj) {
+ if (gameState === 'placement' && placedShipsCount >= shipLengths.length) {
+ gameState = 'playing';
+ statusText.setText('Fire at enemy positions!');
+ instructionText.setText('Tap enemy grid to shoot');
+ startButton.visible = false;
+ placeAIShips();
+ }
+};
// Initialize grids
function initializeGrids() {
// Player grid
for (var x = 0; x < GRID_SIZE; x++) {
@@ -442,8 +458,20 @@
var cellPos = ship.cells[i];
grid[cellPos.x][cellPos.y].markSunk();
}
}
+function removeShipFromGrid(ship) {
+ for (var x = 0; x < GRID_SIZE; x++) {
+ for (var y = 0; y < GRID_SIZE; y++) {
+ if (playerGrid[x][y].shipId === ship.shipId) {
+ playerGrid[x][y].hasShip = false;
+ playerGrid[x][y].shipId = -1;
+ var cellGraphics = playerGrid[x][y].children[0];
+ cellGraphics.tint = 0xFFFFFF;
+ }
+ }
+ }
+}
function checkVictory(playerLost) {
var ships = playerLost ? playerShips : aiShips;
for (var i = 0; i < ships.length; i++) {
if (!ships[i].isSunk) {
@@ -457,16 +485,30 @@
game.down = function (x, y, obj) {
if (gameState === 'placement') {
var currentTime = Date.now();
if (currentTime - lastTapTime < 300) {
- // Find ship being rotated
+ // Find ship being rotated - check both unplaced and placed ships
for (var i = 0; i < draggableShips.length; i++) {
- if (!draggableShips[i].isPlaced) {
- draggableShips[i].rotate();
+ var ship = draggableShips[i];
+ var shipBounds = {
+ x: ship.x,
+ y: ship.y,
+ width: ship.isHorizontal ? ship.length * CELL_SIZE : CELL_SIZE,
+ height: ship.isHorizontal ? CELL_SIZE : ship.length * CELL_SIZE
+ };
+ if (x >= shipBounds.x && x <= shipBounds.x + shipBounds.width && y >= shipBounds.y && y <= shipBounds.y + shipBounds.height) {
+ if (ship.isPlaced) {
+ // Remove ship from grid
+ removeShipFromGrid(ship);
+ ship.isPlaced = false;
+ ship.visible = true;
+ placedShipsCount--;
+ }
+ ship.rotate();
break;
}
}
- instructionText.setText('Double tap to rotate ships');
+ instructionText.setText('Double tap ships to rotate, drag to reposition');
}
lastTapTime = currentTime;
}
};
Images
:quality(85)/https://cdn.frvr.ai/688571e158e29470afcbbd49.png%3F3)
water look on top. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/6885722a58e29470afcbbd5a.png%3F3)
white location icon look on top. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/6885726b58e29470afcbbd65.png%3F3)
explosion look on top. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/688572aa58e29470afcbbd72.png%3F3)
white smoke look on top. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/688575be58e29470afcbbd95.png%3F3)
red point icon. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/68857a4058e29470afcbbdd4.png%3F3)
2d sea mine In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/68857c9258e29470afcbbde3.png%3F3)
warship commander head looking right in game asset. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/68857d5f58e29470afcbbdf9.png%3F3)
warship commander head looking left in game asset. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/6885805258e29470afcbbe0a.png%3F3)
speech bubble 2d. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/6887bd76d11c9a3fcd0ac063.png%3F3)
metal border. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/6887be9cd11c9a3fcd0ac077.png%3F3)
metal line. In-Game asset. 2d. High contrast. No shadows
Sounds & Music
Used plugins
@upit/tween
