User prompt
The designs that I add in the game should reflect in the preview
User prompt
When pressing again in game over, it saves the previous high score
User prompt
When you press again in game over, it shows your previous high score
User prompt
Show high score under the score
User prompt
Fix Bug: 'Uncaught TypeError: Cannot read properties of undefined (reading 'getItem')' in this line: 'var highScore = localStorage.getItem('highScore') || 0;' Line Number: 92
User prompt
High score of a player is shown
User prompt
Add design to score text
User prompt
The score don't is bold
User prompt
Increase size of dot, snake, and snake body
Remix started
Copy Snake
var Dot = Container.expand(function () {
var self = Container.call(this);
var dotGraphics = self.createAsset('dot', 'Dot Graphics', .5, .5);
self.eaten = false;
});
var Snake = Container.expand(function () {
var self = Container.call(this);
var gridSize = 100;
var snakeGraphics = self.createAsset('snake', 'Snake Graphics', .5, .5);
self.length = 1;
self.direction = 'right';
self.body = [];
self.move = function () {
var gridSize = 100;
var oldHeadPosition = {
x: snakeGraphics.x,
y: snakeGraphics.y
};
var marginX = 2048 % gridSize / 2;
var marginY = 2732 % gridSize / 2;
switch (self.direction) {
case 'right':
snakeGraphics.x = Math.round((snakeGraphics.x + gridSize - marginX) / gridSize) * gridSize + marginX;
break;
case 'left':
snakeGraphics.x = Math.round((snakeGraphics.x - gridSize - marginX) / gridSize) * gridSize + marginX;
break;
case 'down':
snakeGraphics.y = Math.round((snakeGraphics.y + gridSize - marginY) / gridSize) * gridSize + marginY;
break;
case 'up':
snakeGraphics.y = Math.round((snakeGraphics.y - gridSize - marginY) / gridSize) * gridSize + marginY;
break;
}
for (var i = self.body.length - 1; i > 0; i--) {
self.body[i].x = self.body[i - 1].x;
self.body[i].y = self.body[i - 1].y;
}
if (self.body.length > 0) {
self.body[0].x = oldHeadPosition.x;
self.body[0].y = oldHeadPosition.y;
}
};
self.eat = function (dot) {
self.length++;
var newSegment = self.createAsset('snakeBody', 'Snake Body Segment', .5, .5);
self.body.push(newSegment);
self.addChild(newSegment);
if (self.body.length > 1) {
var lastSegment = self.body[self.body.length - 2];
newSegment.x = lastSegment.x;
newSegment.y = lastSegment.y;
}
};
self.checkCollision = function () {
var maxX = 2000;
var maxY = 2700;
var marginX = 2048 % gridSize / 2;
var marginY = 2732 % gridSize / 2;
if (snakeGraphics.x <= marginX) snakeGraphics.x = maxX - gridSize + marginX;
if (snakeGraphics.x >= maxX + marginX) snakeGraphics.x = marginX;
if (snakeGraphics.y <= marginY) snakeGraphics.y = maxY - gridSize + marginY;
if (snakeGraphics.y >= maxY + marginY) snakeGraphics.y = marginY;
for (var i = 0; i < self.body.length; i++) {
if (snakeGraphics.x === self.body[i].x && snakeGraphics.y === self.body[i].y) {
LK.showGameOver();
break;
}
}
};
});
var Game = Container.expand(function () {
var gridSize = 100;
var self = Container.call(this);
var gridSize = 100;
var marginX = 2048 % gridSize / 2;
var marginY = 2732 % gridSize / 2;
var background = self.createAsset('background', 'Game Background', 0, 0);
background.width = 2048 - 2048 % gridSize;
background.height = 2732 - 2732 % gridSize;
background.x = marginX;
background.y = marginY;
self.addChild(background);
self.x = marginX;
self.y = marginY;
var dots = [];
var snake = self.addChild(new Snake());
var score = 0;
var scoreTxt = new Text2(score.toString(), {
size: 150,
fill: "#1a2314",
font: "'Courier New', monospace"
});
scoreTxt.anchor.set(.5, 0);
LK.gui.topCenter.addChild(scoreTxt);
var isGameOver = false;
var tickCounter = 0;
var moveFrequency = 7;
LK.on('tick', function () {
tickCounter++;
if (tickCounter % moveFrequency == 0) {
snake.move();
snake.checkCollision();
}
if (isGameOver) {
LK.showGameOver();
}
for (var i = 0; i < dots.length; i++) {
if (snake.intersects(dots[i]) && !dots[i].eaten) {
snake.eat(dots[i]);
dots[i].eaten = true;
score++;
if (score % 10 == 0 && moveFrequency > 1) {
moveFrequency = Math.max(1, moveFrequency - 1);
}
scoreTxt.setText(score.toString());
self.removeChild(dots[i]);
dots.splice(i, 1);
spawnDot();
}
}
});
var startSwipePos = null;
stage.on('down', function (obj) {
startSwipePos = obj.event.getLocalPosition(self);
});
stage.on('up', function (obj) {
if (!startSwipePos) return;
var endSwipePos = obj.event.getLocalPosition(self);
var dx = endSwipePos.x - startSwipePos.x;
var dy = endSwipePos.y - startSwipePos.y;
if (Math.abs(dx) > Math.abs(dy)) {
if (snake.direction !== 'up' && snake.direction !== 'down') return;
snake.direction = dx > 0 ? 'right' : 'left';
} else {
if (snake.direction !== 'right' && snake.direction !== 'left') return;
snake.direction = dy > 0 ? 'down' : 'up';
}
startSwipePos = null;
});
var gridSize = 100;
var spawnDot = function () {
var dot = new Dot();
dot.x = Math.floor(Math.random() * ((2048 - 2 * marginX - gridSize) / gridSize)) * gridSize + marginX + gridSize;
dot.y = Math.floor(Math.random() * ((2732 - 2 * marginY - gridSize) / gridSize)) * gridSize + marginY + gridSize;
dots.push(dot);
self.addChild(dot);
};
spawnDot();
});