Play
:quality(85)/https://cdn.frvr.ai/682a6b85d51fa11b3dae9e72.png)
:quality(85)/https://cdn.frvr.ai/682a6bb8d51fa11b3dae9e88.png)
#VirtualHangout
#FriendlyCompetition
Creation History
User prompt
Please fix the bug: 'Uncaught TypeError: Cannot read properties of undefined (reading 'trim')' in or related to this line: 'if (roomName !== 'Enter room name...' && roomName.trim() !== '') {' Line Number: 291
User prompt
yes it's good but add main menu create room join add settings and languages and develop more more mini games
User prompt
yes it's good but add main menu create room join add settings and languages and develop more more mini games
Code edit (1 edits merged)
Please save this source code
User prompt
Chat Party Games
Initial prompt
place to chat but basic games can be played
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
var storage = LK.import("@upit/storage.v1", {
username: "Player",
color: "#3498db",
rooms: []
});
/****
* Classes
****/
var Avatar = Container.expand(function () {
var self = Container.call(this);
var avatarGraphic = self.attachAsset('avatar', {
anchorX: 0.5,
anchorY: 0.5
});
self.nameText = new Text2('Player', {
size: 24,
fill: 0xFFFFFF
});
self.nameText.anchor.set(0.5, 0);
self.nameText.y = 80;
self.addChild(self.nameText);
self.setName = function (name) {
self.nameText.setText(name);
};
self.setColor = function (color) {
avatarGraphic.tint = parseInt(color.replace('#', '0x'));
};
self.down = function (x, y, obj) {
LK.getSound('select').play();
};
return self;
});
var Button = Container.expand(function (text, width, height, color) {
var self = Container.call(this);
var buttonWidth = width || 180;
var buttonHeight = height || 60;
var buttonColor = color || 'gameButton';
var buttonGraphic = self.attachAsset(buttonColor, {
anchorX: 0.5,
anchorY: 0.5,
width: buttonWidth,
height: buttonHeight
});
self.label = new Text2(text, {
size: 28,
fill: 0xFFFFFF
});
self.label.anchor.set(0.5, 0.5);
self.addChild(self.label);
self.setLabel = function (newText) {
self.label.setText(newText);
};
self.down = function (x, y, obj) {
tween(buttonGraphic, {
scaleX: 0.95,
scaleY: 0.95
}, {
duration: 100
});
LK.getSound('select').play();
};
self.up = function (x, y, obj) {
tween(buttonGraphic, {
scaleX: 1,
scaleY: 1
}, {
duration: 100
});
};
return self;
});
var ChatBubble = Container.expand(function (message, isUser) {
var self = Container.call(this);
var bubbleGraphic = self.attachAsset('chatBubble', {
anchorX: 0,
anchorY: 0
});
if (isUser) {
bubbleGraphic.tint = 0xDCF8C6; // Light green for user messages
}
self.messageText = new Text2(message, {
size: 24,
fill: 0x333333
});
self.messageText.x = 20;
self.messageText.y = 15;
self.addChild(self.messageText);
// Adjust height based on content
var textHeight = self.messageText.height + 30;
var bubbleHeight = Math.max(textHeight, 60);
bubbleGraphic.height = bubbleHeight;
return self;
});
var ChatPanel = Container.expand(function () {
var self = Container.call(this);
var panelGraphic = self.attachAsset('chatPanel', {
anchorX: 0,
anchorY: 0
});
self.messages = [];
self.messageContainer = new Container();
self.addChild(self.messageContainer);
self.messageContainer.x = 50;
self.messageContainer.y = 20;
self.inputField = self.addChild(LK.getAsset('inputField', {
anchorX: 0,
anchorY: 0
}));
self.inputField.x = 50;
self.inputField.y = panelGraphic.height - 80;
self.inputText = new Text2('Type a message...', {
size: 24,
fill: 0x888888
});
self.inputText.x = self.inputField.x + 20;
self.inputText.y = self.inputField.y + 18;
self.addChild(self.inputText);
var sendButton = new Button('Send', 80, 60, 'sendButton');
sendButton.x = self.inputField.x + self.inputField.width + 40;
sendButton.y = self.inputField.y + 30;
self.addChild(sendButton);
self.addMessage = function (message, isUser) {
var bubble = new ChatBubble(message, isUser);
if (self.messages.length > 0) {
var lastMessage = self.messages[self.messages.length - 1];
bubble.y = lastMessage.y + lastMessage.height + 10;
}
self.messages.push(bubble);
self.messageContainer.addChild(bubble);
// Limit messages and scroll if needed
if (self.messages.length > 8) {
var oldMessage = self.messages.shift();
self.messageContainer.removeChild(oldMessage);
// Adjust positions
for (var i = 0; i < self.messages.length; i++) {
if (i === 0) {
self.messages[i].y = 0;
} else {
self.messages[i].y = self.messages[i - 1].y + self.messages[i - 1].height + 10;
}
}
}
LK.getSound('message').play();
};
self.clearMessages = function () {
for (var i = 0; i < self.messages.length; i++) {
self.messageContainer.removeChild(self.messages[i]);
}
self.messages = [];
};
self.sendMessage = function () {
if (self.inputText.text !== 'Type a message...' && self.inputText.text.trim() !== '') {
var message = self.inputText.text;
self.addMessage(message, true);
self.inputText.setText('Type a message...');
// Simulate response after delay
LK.setTimeout(function () {
var responses = ["That's interesting!", "I see what you mean.", "Let's play a game instead?", "Cool! Want to try tic-tac-toe?", "I agree completely."];
var randomResponse = responses[Math.floor(Math.random() * responses.length)];
self.addMessage(randomResponse, false);
}, 1000 + Math.random() * 1000);
return message;
}
return null;
};
// Input field interaction
self.inputField.down = function () {
if (self.inputText.text === 'Type a message...') {
self.inputText.setText('');
self.inputText.style.fill = "#333333";
}
};
sendButton.down = function () {
sendButton.up();
self.sendMessage();
};
return self;
});
var CreateRoomPanel = Container.expand(function () {
var self = Container.call(this);
var panelGraphic = self.attachAsset('chatPanel', {
anchorX: 0.5,
anchorY: 0.5,
width: 800,
height: 500
});
var titleText = new Text2('Create a New Room', {
size: 40,
fill: 0x2C3E50
});
titleText.anchor.set(0.5, 0);
titleText.y = -panelGraphic.height / 2 + 50;
self.addChild(titleText);
var nameLabel = new Text2('Room Name:', {
size: 28,
fill: 0x2C3E50
});
nameLabel.anchor.set(0, 0.5);
nameLabel.x = -panelGraphic.width / 2 + 50;
nameLabel.y = -50;
self.addChild(nameLabel);
var nameField = self.addChild(LK.getAsset('inputField', {
anchorX: 0,
anchorY: 0.5,
width: 500,
height: 60
}));
nameField.x = -panelGraphic.width / 2 + 200;
nameField.y = -50;
self.nameText = new Text2('Enter room name...', {
size: 24,
fill: 0x888888
});
self.nameText.x = nameField.x + 20;
self.nameText.y = nameField.y - 10;
self.addChild(self.nameText);
var typeLabel = new Text2('Room Type:', {
size: 28,
fill: 0x2C3E50
});
typeLabel.anchor.set(0, 0.5);
typeLabel.x = -panelGraphic.width / 2 + 50;
typeLabel.y = 50;
self.addChild(typeLabel);
var typeOptions = ['Public', 'Private'];
var typeButton = new Button(typeOptions[0], 200, 60);
typeButton.x = -panelGraphic.width / 2 + 250;
typeButton.y = 50;
self.addChild(typeButton);
var createButton = new Button('Create Room', 250, 80);
createButton.x = 0;
createButton.y = 150;
self.addChild(createButton);
var cancelButton = new Button('Cancel', 250, 80);
cancelButton.x = 0;
cancelButton.y = 250;
self.addChild(cancelButton);
// Initialize input field interaction
nameField.down = function () {
if (self.nameText.text === 'Enter room name...') {
self.nameText.setText('');
self.nameText.style.fill = "#333333";
}
};
typeButton.down = function () {
typeButton.up();
// Toggle between public and private
if (typeButton.label.text === 'Public') {
typeButton.setLabel('Private');
} else {
typeButton.setLabel('Public');
}
LK.getSound('select').play();
};
createButton.down = function () {
createButton.up();
var roomName = self.nameText.text;
if (roomName !== 'Enter room name...' && roomName.trim() !== '') {
if (typeof self.onCreateRoom === 'function') {
self.onCreateRoom({
name: roomName,
type: typeButton.label.text
});
}
}
};
cancelButton.down = function () {
cancelButton.up();
if (typeof self.onCancel === 'function') {
self.onCancel();
}
};
self.onCreateRoom = null;
self.onCancel = null;
return self;
});
var JoinRoomPanel = Container.expand(function () {
var self = Container.call(this);
var panelGraphic = self.attachAsset('chatPanel', {
anchorX: 0.5,
anchorY: 0.5,
width: 900,
height: 800
});
var titleText = new Text2('Join a Room', {
size: 40,
fill: 0x2C3E50
});
titleText.anchor.set(0.5, 0);
titleText.y = -panelGraphic.height / 2 + 50;
self.addChild(titleText);
self.roomsContainer = new Container();
self.roomsContainer.x = -panelGraphic.width / 2 + 100;
self.roomsContainer.y = -panelGraphic.height / 2 + 150;
self.addChild(self.roomsContainer);
var refreshButton = new Button('Refresh', 150, 60);
refreshButton.x = panelGraphic.width / 2 - 100;
refreshButton.y = -panelGraphic.height / 2 + 100;
self.addChild(refreshButton);
var backButton = new Button('Back', 250, 80);
backButton.x = 0;
backButton.y = panelGraphic.height / 2 - 100;
self.addChild(backButton);
self.rooms = [];
self.populateRooms = function (roomsData) {
// Clear existing rooms
while (self.roomsContainer.children.length > 0) {
self.roomsContainer.removeChild(self.roomsContainer.children[0]);
}
self.rooms = roomsData;
// Add room list items
for (var i = 0; i < roomsData.length; i++) {
var roomItem = new RoomListItem(roomsData[i].name, roomsData[i].players);
roomItem.y = i * 100;
roomItem.onJoin = function (roomName) {
if (typeof self.onJoinRoom === 'function') {
self.onJoinRoom(roomName);
}
};
self.roomsContainer.addChild(roomItem);
}
};
refreshButton.down = function () {
refreshButton.up();
if (typeof self.onRefresh === 'function') {
self.onRefresh();
}
};
backButton.down = function () {
backButton.up();
if (typeof self.onBack === 'function') {
self.onBack();
}
};
self.onJoinRoom = null;
self.onRefresh = null;
self.onBack = null;
return self;
});
var MainMenu = Container.expand(function () {
var self = Container.call(this);
var titleText = new Text2('Chat Party Games', {
size: 80,
fill: 0x2C3E50
});
titleText.anchor.set(0.5, 0);
titleText.x = 2048 / 2;
titleText.y = 150;
self.addChild(titleText);
var avatar = new Avatar();
avatar.x = 2048 / 2;
avatar.y = 400;
self.addChild(avatar);
var playButton = new Button('Play Now', 300, 100);
playButton.x = 2048 / 2;
playButton.y = 650;
self.addChild(playButton);
var createRoomButton = new Button('Create Room', 300, 100);
createRoomButton.x = 2048 / 2;
createRoomButton.y = 800;
self.addChild(createRoomButton);
var joinRoomButton = new Button('Join Room', 300, 100);
joinRoomButton.x = 2048 / 2;
joinRoomButton.y = 950;
self.addChild(joinRoomButton);
var settingsButton = new Button('Settings', 300, 100);
settingsButton.x = 2048 / 2;
settingsButton.y = 1100;
self.addChild(settingsButton);
self.setUsername = function (name) {
avatar.setName(name);
};
self.setAvatarColor = function (color) {
avatar.setColor(color);
};
self.onPlay = null;
self.onCreateRoom = null;
self.onJoinRoom = null;
self.onSettings = null;
playButton.down = function () {
playButton.up();
if (typeof self.onPlay === 'function') {
self.onPlay();
}
};
createRoomButton.down = function () {
createRoomButton.up();
if (typeof self.onCreateRoom === 'function') {
self.onCreateRoom();
}
};
joinRoomButton.down = function () {
joinRoomButton.up();
if (typeof self.onJoinRoom === 'function') {
self.onJoinRoom();
}
};
settingsButton.down = function () {
settingsButton.up();
if (typeof self.onSettings === 'function') {
self.onSettings();
}
};
return self;
});
var RockPaperScissorsGame = Container.expand(function () {
var self = Container.call(this);
var boardGraphic = self.attachAsset('tictactoeBoard', {
anchorX: 0.5,
anchorY: 0.5
});
self.playerChoice = null;
self.computerChoice = null;
self.gameActive = true;
self.statusText = new Text2("Choose your move", {
size: 32,
fill: 0x333333
});
self.statusText.anchor.set(0.5, 0);
self.statusText.y = boardGraphic.height / 2 + 40;
self.addChild(self.statusText);
// Create choice buttons
var choices = ['Rock', 'Paper', 'Scissors'];
var choiceButtons = [];
for (var i = 0; i < choices.length; i++) {
var button = new Button(choices[i], 180, 60);
button.x = (i - 1) * 200;
button.y = -50;
button.choice = choices[i].toLowerCase();
button.down = function () {
this.up();
if (self.gameActive) {
self.makeChoice(this.choice);
}
};
self.addChild(button);
choiceButtons.push(button);
}
// Result display
self.playerDisplay = new Text2("", {
size: 28,
fill: 0x333333
});
self.playerDisplay.anchor.set(0.5, 0.5);
self.playerDisplay.x = -100;
self.playerDisplay.y = 50;
self.addChild(self.playerDisplay);
self.computerDisplay = new Text2("", {
size: 28,
fill: 0x333333
});
self.computerDisplay.anchor.set(0.5, 0.5);
self.computerDisplay.x = 100;
self.computerDisplay.y = 50;
self.addChild(self.computerDisplay);
self.makeChoice = function (choice) {
self.playerChoice = choice;
self.playerDisplay.setText("You: " + choice);
// Computer makes a choice
var options = ['rock', 'paper', 'scissors'];
self.computerChoice = options[Math.floor(Math.random() * options.length)];
self.computerDisplay.setText("Computer: " + self.computerChoice);
LK.getSound('select').play();
// Determine winner
var result = self.determineWinner();
self.gameActive = false;
if (result === 'win') {
self.statusText.setText("You win!");
} else if (result === 'lose') {
self.statusText.setText("You lose!");
} else {
self.statusText.setText("It's a tie!");
}
LK.getSound('gameover').play();
LK.setTimeout(function () {
if (typeof self.onGameOver === 'function') {
self.onGameOver(result);
}
}, 2000);
};
self.determineWinner = function () {
if (self.playerChoice === self.computerChoice) {
return 'tie';
}
if (self.playerChoice === 'rock' && self.computerChoice === 'scissors' || self.playerChoice === 'paper' && self.computerChoice === 'rock' || self.playerChoice === 'scissors' && self.computerChoice === 'paper') {
return 'win';
}
return 'lose';
};
self.reset = function () {
self.playerChoice = null;
self.computerChoice = null;
self.gameActive = true;
self.statusText.setText("Choose your move");
self.playerDisplay.setText("");
self.computerDisplay.setText("");
};
return self;
});
var RoomListItem = Container.expand(function (roomName, playerCount) {
var self = Container.call(this);
var itemGraphic = self.attachAsset('roomListItem', {
anchorX: 0,
anchorY: 0
});
self.roomNameText = new Text2(roomName, {
size: 28,
fill: 0x333333
});
self.roomNameText.x = 20;
self.roomNameText.y = 15;
self.addChild(self.roomNameText);
self.playerCountText = new Text2(playerCount + " players", {
size: 20,
fill: 0x888888
});
self.playerCountText.x = 20;
self.playerCountText.y = 50;
self.addChild(self.playerCountText);
var joinButton = new Button('Join', 120, 50, 'joinButton');
joinButton.x = itemGraphic.width - 80;
joinButton.y = itemGraphic.height / 2;
self.addChild(joinButton);
self.down = function () {
tween(itemGraphic, {
tint: 0xf0f0f0
}, {
duration: 100
});
};
self.up = function () {
tween(itemGraphic, {
tint: 0xffffff
}, {
duration: 100
});
};
joinButton.down = function () {
joinButton.up();
if (typeof self.onJoin === 'function') {
self.onJoin(roomName);
}
};
return self;
});
var Settings = Container.expand(function () {
var self = Container.call(this);
var titleText = new Text2('Settings', {
size: 60,
fill: 0x2C3E50
});
titleText.anchor.set(0.5, 0);
titleText.x = 2048 / 2;
titleText.y = 150;
self.addChild(titleText);
var usernameLabel = new Text2('Username:', {
size: 32,
fill: 0x2C3E50
});
usernameLabel.anchor.set(0, 0.5);
usernameLabel.x = 600;
usernameLabel.y = 350;
self.addChild(usernameLabel);
var usernameField = self.addChild(LK.getAsset('inputField', {
anchorX: 0,
anchorY: 0.5,
width: 500,
height: 60
}));
usernameField.x = 800;
usernameField.y = 350;
self.usernameText = new Text2('Player', {
size: 24,
fill: 0x333333
});
self.usernameText.x = usernameField.x + 20;
self.usernameText.y = usernameField.y - 10;
self.addChild(self.usernameText);
var colorLabel = new Text2('Avatar Color:', {
size: 32,
fill: 0x2C3E50
});
colorLabel.anchor.set(0, 0.5);
colorLabel.x = 600;
colorLabel.y = 450;
self.addChild(colorLabel);
var colorButtons = [];
var colors = ['#3498db', '#e74c3c', '#2ecc71', '#f39c12', '#9b59b6'];
for (var i = 0; i < colors.length; i++) {
var colorButton = self.addChild(LK.getAsset('avatar', {
anchorX: 0.5,
anchorY: 0.5,
width: 60,
height: 60
}));
colorButton.x = 850 + i * 100;
colorButton.y = 450;
colorButton.tint = parseInt(colors[i].replace('#', '0x'));
colorButton.color = colors[i];
colorButton.interactive = true;
colorButton.down = function () {
self.selectedColor = this.color;
self.updateColorSelection();
LK.getSound('select').play();
};
colorButtons.push(colorButton);
}
var languageLabel = new Text2('Language:', {
size: 32,
fill: 0x2C3E50
});
languageLabel.anchor.set(0, 0.5);
languageLabel.x = 600;
languageLabel.y = 550;
self.addChild(languageLabel);
var languages = ['English', 'Spanish', 'French', 'German', 'Japanese'];
var languageDropdown = new Button(languages[0], 300, 60);
languageDropdown.x = 850;
languageDropdown.y = 550;
self.addChild(languageDropdown);
var saveButton = new Button('Save Changes', 300, 80);
saveButton.x = 2048 / 2;
saveButton.y = 700;
self.addChild(saveButton);
var backButton = new Button('Back', 300, 80);
backButton.x = 2048 / 2;
backButton.y = 800;
self.addChild(backButton);
self.selectedColor = colors[0];
self.updateColorSelection = function () {
for (var i = 0; i < colorButtons.length; i++) {
if (colorButtons[i].color === self.selectedColor) {
colorButtons[i].alpha = 1;
} else {
colorButtons[i].alpha = 0.6;
}
}
};
self.setValues = function (username, color) {
self.usernameText.setText(username);
self.selectedColor = color;
self.updateColorSelection();
};
// Initialize username input field interaction
usernameField.down = function () {
if (self.usernameText.text === 'Player') {
self.usernameText.setText('');
}
};
languageDropdown.down = function () {
languageDropdown.up();
// Cycle through languages
var currentIndex = languages.indexOf(languageDropdown.label.text);
var nextIndex = (currentIndex + 1) % languages.length;
languageDropdown.setLabel(languages[nextIndex]);
LK.getSound('select').play();
};
saveButton.down = function () {
saveButton.up();
if (typeof self.onSave === 'function') {
self.onSave({
username: self.usernameText.text,
color: self.selectedColor,
language: languageDropdown.label.text
});
}
};
backButton.down = function () {
backButton.up();
if (typeof self.onBack === 'function') {
self.onBack();
}
};
self.onSave = null;
self.onBack = null;
self.updateColorSelection();
return self;
});
var TicTacToeGame = Container.expand(function () {
var self = Container.call(this);
var boardGraphic = self.attachAsset('tictactoeBoard', {
anchorX: 0.5,
anchorY: 0.5
});
self.cells = [];
self.gameBoard = [['', '', ''], ['', '', ''], ['', '', '']];
self.currentPlayer = 'X';
self.gameActive = true;
// Create cells
for (var row = 0; row < 3; row++) {
for (var col = 0; col < 3; col++) {
var cell = self.addChild(LK.getAsset('tictactoeCell', {
anchorX: 0.5,
anchorY: 0.5
}));
cell.row = row;
cell.col = col;
cell.x = (col - 1) * 150;
cell.y = (row - 1) * 150;
cell.content = '';
cell.down = function () {
if (self.gameActive && this.content === '') {
self.makeMove(this.row, this.col);
}
};
self.cells.push(cell);
}
}
self.statusText = new Text2("Player X's turn", {
size: 32,
fill: 0x333333
});
self.statusText.anchor.set(0.5, 0);
self.statusText.y = boardGraphic.height / 2 + 40;
self.addChild(self.statusText);
self.makeMove = function (row, col) {
if (!self.gameActive || self.gameBoard[row][col] !== '') {
return;
}
// Update game board
self.gameBoard[row][col] = self.currentPlayer;
// Find the cell and update visually
for (var i = 0; i < self.cells.length; i++) {
var cell = self.cells[i];
if (cell.row === row && cell.col === col) {
cell.content = self.currentPlayer;
if (self.currentPlayer === 'X') {
var x = cell.addChild(LK.getAsset('tictactoeX', {
anchorX: 0.5,
anchorY: 0.5
}));
tween(x, {
scaleX: 1,
scaleY: 1
}, {
duration: 200,
easing: tween.bounceOut,
onStart: function onStart() {
x.scaleX = 0;
x.scaleY = 0;
}
});
} else {
var o = cell.addChild(LK.getAsset('tictactoeO', {
anchorX: 0.5,
anchorY: 0.5
}));
tween(o, {
scaleX: 1,
scaleY: 1
}, {
duration: 200,
easing: tween.bounceOut,
onStart: function onStart() {
o.scaleX = 0;
o.scaleY = 0;
}
});
}
break;
}
}
LK.getSound('select').play();
// Check for winner
var winner = self.checkWinner();
if (winner) {
self.gameActive = false;
self.statusText.setText('Player ' + winner + ' wins!');
LK.getSound('gameover').play();
LK.setTimeout(function () {
if (typeof self.onGameOver === 'function') {
self.onGameOver(winner);
}
}, 2000);
} else if (self.checkDraw()) {
self.gameActive = false;
self.statusText.setText("It's a draw!");
LK.getSound('gameover').play();
LK.setTimeout(function () {
if (typeof self.onGameOver === 'function') {
self.onGameOver(null);
}
}, 2000);
} else {
// Switch player
self.currentPlayer = self.currentPlayer === 'X' ? 'O' : 'X';
self.statusText.setText("Player " + self.currentPlayer + "'s turn");
// If current player is O (AI), make an automated move
if (self.currentPlayer === 'O') {
LK.setTimeout(function () {
self.makeAIMove();
}, 1000);
}
}
};
self.checkWinner = function () {
var lines = [
// Rows
[[0, 0], [0, 1], [0, 2]], [[1, 0], [1, 1], [1, 2]], [[2, 0], [2, 1], [2, 2]],
// Columns
[[0, 0], [1, 0], [2, 0]], [[0, 1], [1, 1], [2, 1]], [[0, 2], [1, 2], [2, 2]],
// Diagonals
[[0, 0], [1, 1], [2, 2]], [[0, 2], [1, 1], [2, 0]]];
for (var i = 0; i < lines.length; i++) {
var _lines$i = _slicedToArray(lines[i], 3),
_lines$i$ = _slicedToArray(_lines$i[0], 2),
a = _lines$i$[0],
b = _lines$i$[1],
_lines$i$2 = _slicedToArray(_lines$i[1], 2),
c = _lines$i$2[0],
d = _lines$i$2[1],
_lines$i$3 = _slicedToArray(_lines$i[2], 2),
e = _lines$i$3[0],
f = _lines$i$3[1];
if (self.gameBoard[a][b] && self.gameBoard[a][b] === self.gameBoard[c][d] && self.gameBoard[a][b] === self.gameBoard[e][f]) {
return self.gameBoard[a][b];
}
}
return null;
};
self.checkDraw = function () {
for (var row = 0; row < 3; row++) {
for (var col = 0; col < 3; col++) {
if (self.gameBoard[row][col] === '') {
return false;
}
}
}
return true;
};
self.makeAIMove = function () {
if (!self.gameActive) return;
// Find empty cells
var emptyCells = [];
for (var row = 0; row < 3; row++) {
for (var col = 0; col < 3; col++) {
if (self.gameBoard[row][col] === '') {
emptyCells.push({
row: row,
col: col
});
}
}
}
if (emptyCells.length > 0) {
var randomCell = emptyCells[Math.floor(Math.random() * emptyCells.length)];
self.makeMove(randomCell.row, randomCell.col);
}
};
self.reset = function () {
// Clear the board
for (var row = 0; row < 3; row++) {
for (var col = 0; col < 3; col++) {
self.gameBoard[row][col] = '';
}
}
// Reset cell visuals
for (var i = 0; i < self.cells.length; i++) {
var cell = self.cells[i];
cell.content = '';
// Remove all children (X or O graphics)
while (cell.children.length > 0) {
cell.removeChild(cell.children[0]);
}
}
self.currentPlayer = 'X';
self.gameActive = true;
self.statusText.setText("Player X's turn");
};
return self;
});
var WordGuessingGame = Container.expand(function () {
var self = Container.call(this);
var boardGraphic = self.attachAsset('tictactoeBoard', {
anchorX: 0.5,
anchorY: 0.5,
width: 700,
height: 500
});
var words = ["APPLE", "BANANA", "ORANGE", "GRAPE", "CHERRY", "LEMON", "KIWI", "MELON", "PEACH", "PLUM"];
var currentWord = "";
var guessedLetters = [];
var remainingGuesses = 6;
var gameActive = true;
self.statusText = new Text2("Guess the fruit!", {
size: 32,
fill: 0x333333
});
self.statusText.anchor.set(0.5, 0);
self.statusText.y = -boardGraphic.height / 2 + 40;
self.addChild(self.statusText);
self.wordDisplay = new Text2("", {
size: 48,
fill: 0x333333
});
self.wordDisplay.anchor.set(0.5, 0.5);
self.wordDisplay.y = -50;
self.addChild(self.wordDisplay);
self.guessesText = new Text2("Remaining guesses: 6", {
size: 28,
fill: 0x333333
});
self.guessesText.anchor.set(0.5, 0.5);
self.guessesText.y = 50;
self.addChild(self.guessesText);
// Create letter buttons
var letters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var letterButtons = [];
var buttonSize = 60;
var buttonsPerRow = 7;
for (var i = 0; i < letters.length; i++) {
var button = new Button(letters[i], buttonSize, buttonSize);
var row = Math.floor(i / buttonsPerRow);
var col = i % buttonsPerRow;
button.x = (col - 3) * (buttonSize + 10);
button.y = 120 + row * (buttonSize + 10);
button.letter = letters[i];
button.down = function () {
this.up();
if (gameActive && guessedLetters.indexOf(this.letter) === -1) {
self.makeGuess(this.letter);
this.alpha = 0.5;
}
};
self.addChild(button);
letterButtons.push(button);
}
self.init = function () {
currentWord = words[Math.floor(Math.random() * words.length)];
guessedLetters = [];
remainingGuesses = 6;
gameActive = true;
// Reset letter buttons
for (var i = 0; i < letterButtons.length; i++) {
letterButtons[i].alpha = 1;
}
self.updateWordDisplay();
self.guessesText.setText("Remaining guesses: " + remainingGuesses);
self.statusText.setText("Guess the fruit!");
};
self.updateWordDisplay = function () {
var display = "";
for (var i = 0; i < currentWord.length; i++) {
if (guessedLetters.indexOf(currentWord[i]) !== -1) {
display += currentWord[i] + " ";
} else {
display += "_ ";
}
}
self.wordDisplay.setText(display);
};
self.makeGuess = function (letter) {
guessedLetters.push(letter);
LK.getSound('select').play();
if (currentWord.indexOf(letter) === -1) {
remainingGuesses--;
self.guessesText.setText("Remaining guesses: " + remainingGuesses);
if (remainingGuesses <= 0) {
gameActive = false;
self.statusText.setText("Game Over! The word was: " + currentWord);
LK.getSound('gameover').play();
LK.setTimeout(function () {
if (typeof self.onGameOver === 'function') {
self.onGameOver(false);
}
}, 2000);
}
} else {
self.updateWordDisplay();
// Check if all letters have been guessed
var won = true;
for (var i = 0; i < currentWord.length; i++) {
if (guessedLetters.indexOf(currentWord[i]) === -1) {
won = false;
break;
}
}
if (won) {
gameActive = false;
self.statusText.setText("You won!");
LK.getSound('gameover').play();
LK.setTimeout(function () {
if (typeof self.onGameOver === 'function') {
self.onGameOver(true);
}
}, 2000);
}
}
};
self.reset = function () {
self.init();
};
self.init();
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0xf5f7fa
});
/****
* Game Code
****/
// Main app state
function _slicedToArray(r, e) {
return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest();
}
function _nonIterableRest() {
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
function _unsupportedIterableToArray(r, a) {
if (r) {
if ("string" == typeof r) return _arrayLikeToArray(r, a);
var t = {}.toString.call(r).slice(8, -1);
return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
}
}
function _arrayLikeToArray(r, a) {
(null == a || a > r.length) && (a = r.length);
for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
return n;
}
function _iterableToArrayLimit(r, l) {
var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
if (null != t) {
var e,
n,
i,
u,
a = [],
f = !0,
o = !1;
try {
if (i = (t = t.call(r)).next, 0 === l) {
if (Object(t) !== t) return;
f = !1;
} else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
} catch (r) {
o = !0, n = r;
} finally {
try {
if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return;
} finally {
if (o) throw n;
}
}
return a;
}
}
function _arrayWithHoles(r) {
if (Array.isArray(r)) return r;
}
var currentScreen = 'main'; // 'main', 'lobby', 'room', 'game', 'settings', 'createRoom', 'joinRoom'
var currentGame = null; // 'tictactoe', 'rockpaper', 'wordguess'
var username = storage.username || 'Player';
var avatarColor = storage.color || '#3498db';
var language = 'English';
var currentRoomName = '';
// Create UI containers for different screens
var mainMenuScreen = new Container();
var lobbyScreen = new Container();
var roomScreen = new Container();
var gameScreen = new Container();
var settingsScreen = new Container();
var createRoomScreen = new Container();
var joinRoomScreen = new Container();
// Setup main menu
var mainMenu = new MainMenu();
mainMenu.x = 0;
mainMenu.y = 0;
mainMenu.setUsername(username);
mainMenu.setAvatarColor(avatarColor);
mainMenuScreen.addChild(mainMenu);
// Setup settings
var settings = new Settings();
settings.x = 0;
settings.y = 0;
settings.setValues(username, avatarColor);
settingsScreen.addChild(settings);
// Setup create room panel
var createRoomPanel = new CreateRoomPanel();
createRoomPanel.x = 2048 / 2;
createRoomPanel.y = 2732 / 2;
createRoomScreen.addChild(createRoomPanel);
// Setup join room panel
var joinRoomPanel = new JoinRoomPanel();
joinRoomPanel.x = 2048 / 2;
joinRoomPanel.y = 2732 / 2;
joinRoomScreen.addChild(joinRoomPanel);
// Set up lobby screen
var lobbyTitle = new Text2('Chat Party Games', {
size: 80,
fill: 0x2C3E50
});
lobbyTitle.anchor.set(0.5, 0);
lobbyTitle.x = 2048 / 2;
lobbyTitle.y = 100;
lobbyScreen.addChild(lobbyTitle);
var usernameText = new Text2('Your Name: ' + username, {
size: 32,
fill: 0x666666
});
usernameText.anchor.set(0.5, 0);
usernameText.x = 2048 / 2;
usernameText.y = 250;
lobbyScreen.addChild(usernameText);
var avatar = new Avatar();
avatar.x = 2048 / 2;
avatar.y = 400;
avatar.setName(username);
avatar.setColor(avatarColor);
lobbyScreen.addChild(avatar);
var roomListTitle = new Text2('Available Rooms', {
size: 40,
fill: 0x2C3E50
});
roomListTitle.anchor.set(0.5, 0);
roomListTitle.x = 2048 / 2;
roomListTitle.y = 600;
lobbyScreen.addChild(roomListTitle);
// Create room list
var roomList = new Container();
roomList.x = (2048 - 700) / 2;
roomList.y = 680;
lobbyScreen.addChild(roomList);
var lobbyButtonsContainer = new Container();
lobbyButtonsContainer.x = 2048 / 2;
lobbyButtonsContainer.y = 2500;
lobbyScreen.addChild(lobbyButtonsContainer);
var createRoomButton = new Button('Create Room', 250, 80);
createRoomButton.x = 0;
createRoomButton.y = 0;
lobbyButtonsContainer.addChild(createRoomButton);
var joinRoomButton = new Button('Join Room', 250, 80);
joinRoomButton.x = 0;
joinRoomButton.y = 100;
lobbyButtonsContainer.addChild(joinRoomButton);
var backToMainButton = new Button('Main Menu', 250, 80);
backToMainButton.x = 0;
backToMainButton.y = 200;
lobbyButtonsContainer.addChild(backToMainButton);
// Setup room screen
var roomTitle = new Text2('Room: Lobby', {
size: 40,
fill: 0x2C3E50
});
roomTitle.anchor.set(0.5, 0);
roomTitle.x = 2048 / 2;
roomTitle.y = 50;
roomScreen.addChild(roomTitle);
var chatPanel = new ChatPanel();
chatPanel.x = (2048 - 800) / 2;
chatPanel.y = 120;
roomScreen.addChild(chatPanel);
var gameButtonsContainer = new Container();
gameButtonsContainer.x = 2048 / 2;
gameButtonsContainer.y = 1800;
roomScreen.addChild(gameButtonsContainer);
var tictactoeButton = new Button('Tic-Tac-Toe', 250, 80);
tictactoeButton.x = 0;
tictactoeButton.y = 0;
gameButtonsContainer.addChild(tictactoeButton);
var rockpaperButton = new Button('Rock Paper Scissors', 250, 80);
rockpaperButton.x = 0;
rockpaperButton.y = 100;
gameButtonsContainer.addChild(rockpaperButton);
var wordguessButton = new Button('Word Guessing', 250, 80);
wordguessButton.x = 0;
wordguessButton.y = 200;
gameButtonsContainer.addChild(wordguessButton);
var backToLobbyButton = new Button('Back to Lobby', 250, 80);
backToLobbyButton.x = 0;
backToLobbyButton.y = 350;
gameButtonsContainer.addChild(backToLobbyButton);
// Setup game screen
var gameTitle = new Text2('Game', {
size: 40,
fill: 0x2C3E50
});
gameTitle.anchor.set(0.5, 0);
gameTitle.x = 2048 / 2;
gameTitle.y = 50;
gameScreen.addChild(gameTitle);
// Create game instances
var ticTacToeGame = new TicTacToeGame();
ticTacToeGame.x = 2048 / 2;
ticTacToeGame.y = 2732 / 2 - 200;
ticTacToeGame.visible = false;
gameScreen.addChild(ticTacToeGame);
var rockPaperScissorsGame = new RockPaperScissorsGame();
rockPaperScissorsGame.x = 2048 / 2;
rockPaperScissorsGame.y = 2732 / 2 - 200;
rockPaperScissorsGame.visible = false;
gameScreen.addChild(rockPaperScissorsGame);
var wordGuessingGame = new WordGuessingGame();
wordGuessingGame.x = 2048 / 2;
wordGuessingGame.y = 2732 / 2 - 200;
wordGuessingGame.visible = false;
gameScreen.addChild(wordGuessingGame);
var backToRoomButton = new Button('Back to Room', 250, 80);
backToRoomButton.x = 2048 / 2;
backToRoomButton.y = 2500;
gameScreen.addChild(backToRoomButton);
// Add all screens to game
game.addChild(mainMenuScreen);
game.addChild(lobbyScreen);
game.addChild(roomScreen);
game.addChild(gameScreen);
game.addChild(settingsScreen);
game.addChild(createRoomScreen);
game.addChild(joinRoomScreen);
// Initially hide all screens except main menu
lobbyScreen.visible = false;
roomScreen.visible = false;
gameScreen.visible = false;
settingsScreen.visible = false;
createRoomScreen.visible = false;
joinRoomScreen.visible = false;
// Function to switch between screens
function showScreen(screenName, gameType) {
mainMenuScreen.visible = false;
lobbyScreen.visible = false;
roomScreen.visible = false;
gameScreen.visible = false;
settingsScreen.visible = false;
createRoomScreen.visible = false;
joinRoomScreen.visible = false;
currentScreen = screenName;
if (screenName === 'main') {
mainMenuScreen.visible = true;
mainMenu.setUsername(username);
mainMenu.setAvatarColor(avatarColor);
} else if (screenName === 'lobby') {
lobbyScreen.visible = true;
usernameText.setText('Your Name: ' + username);
avatar.setName(username);
avatar.setColor(avatarColor);
populateRoomList();
} else if (screenName === 'room') {
roomScreen.visible = true;
roomTitle.setText('Room: ' + currentRoomName);
chatPanel.clearMessages();
chatPanel.addMessage('Welcome to ' + currentRoomName + '!', false);
} else if (screenName === 'game') {
gameScreen.visible = true;
// Hide all games
ticTacToeGame.visible = false;
rockPaperScissorsGame.visible = false;
wordGuessingGame.visible = false;
// Show the selected game
if (gameType === 'tictactoe') {
currentGame = 'tictactoe';
gameTitle.setText('Tic-Tac-Toe');
ticTacToeGame.visible = true;
ticTacToeGame.reset();
} else if (gameType === 'rockpaper') {
currentGame = 'rockpaper';
gameTitle.setText('Rock Paper Scissors');
rockPaperScissorsGame.visible = true;
rockPaperScissorsGame.reset();
} else if (gameType === 'wordguess') {
currentGame = 'wordguess';
gameTitle.setText('Word Guessing');
wordGuessingGame.visible = true;
wordGuessingGame.reset();
}
} else if (screenName === 'settings') {
settingsScreen.visible = true;
settings.setValues(username, avatarColor);
} else if (screenName === 'createRoom') {
createRoomScreen.visible = true;
} else if (screenName === 'joinRoom') {
joinRoomScreen.visible = true;
// Populate rooms in join panel
var rooms = getAvailableRooms();
joinRoomPanel.populateRooms(rooms);
}
}
// Get available rooms
function getAvailableRooms() {
// Sample rooms
var rooms = [{
name: 'Game Night',
players: 4
}, {
name: 'Casual Fun',
players: 2
}, {
name: 'Board Game Lovers',
players: 7
}, {
name: 'Quick Games',
players: 3
}];
// Add stored rooms if any
if (storage.rooms && storage.rooms.length > 0) {
for (var i = 0; i < storage.rooms.length; i++) {
rooms.push({
name: storage.rooms[i],
players: Math.floor(Math.random() * 5) + 1
});
}
}
return rooms;
}
// Populate the room list
function populateRoomList() {
// Clear existing rooms
while (roomList.children.length > 0) {
roomList.removeChild(roomList.children[0]);
}
var rooms = getAvailableRooms();
for (var i = 0; i < rooms.length; i++) {
var roomItem = new RoomListItem(rooms[i].name, rooms[i].players);
roomItem.y = i * 100;
roomList.addChild(roomItem);
roomItem.onJoin = function (roomName) {
currentRoomName = roomName;
showScreen('room');
};
}
}
// Event Handlers for Main Menu
mainMenu.onPlay = function () {
showScreen('lobby');
};
mainMenu.onCreateRoom = function () {
showScreen('createRoom');
};
mainMenu.onJoinRoom = function () {
showScreen('joinRoom');
};
mainMenu.onSettings = function () {
showScreen('settings');
};
// Event Handlers for Settings
settings.onSave = function (data) {
username = data.username;
avatarColor = data.color;
language = data.language;
// Save to storage
storage.username = username;
storage.color = avatarColor;
// Update UI
mainMenu.setUsername(username);
mainMenu.setAvatarColor(avatarColor);
showScreen('main');
};
settings.onBack = function () {
showScreen('main');
};
// Event Handlers for Create Room
createRoomPanel.onCreateRoom = function (roomData) {
var roomName = roomData.name;
// Store new room
if (!storage.rooms) storage.rooms = [];
storage.rooms.push(roomName);
// Join the new room
currentRoomName = roomName;
showScreen('room');
};
createRoomPanel.onCancel = function () {
showScreen('main');
};
// Event Handlers for Join Room
joinRoomPanel.onJoinRoom = function (roomName) {
currentRoomName = roomName;
showScreen('room');
};
joinRoomPanel.onRefresh = function () {
var rooms = getAvailableRooms();
joinRoomPanel.populateRooms(rooms);
};
joinRoomPanel.onBack = function () {
showScreen('main');
};
// Event handlers for lobby
createRoomButton.down = function () {
createRoomButton.up();
showScreen('createRoom');
};
joinRoomButton.down = function () {
joinRoomButton.up();
showScreen('joinRoom');
};
backToMainButton.down = function () {
backToMainButton.up();
showScreen('main');
};
// Event handlers for room
tictactoeButton.down = function () {
tictactoeButton.up();
showScreen('game', 'tictactoe');
};
rockpaperButton.down = function () {
rockpaperButton.up();
showScreen('game', 'rockpaper');
};
wordguessButton.down = function () {
wordguessButton.up();
showScreen('game', 'wordguess');
};
backToLobbyButton.down = function () {
backToLobbyButton.up();
showScreen('lobby');
};
// Event handlers for game screen
backToRoomButton.down = function () {
backToRoomButton.up();
showScreen('room');
};
// Game over handlers
ticTacToeGame.onGameOver = function (winner) {
if (winner) {
chatPanel.addMessage('You ' + (winner === 'X' ? 'won' : 'lost') + ' the Tic-Tac-Toe game!', false);
} else {
chatPanel.addMessage('The Tic-Tac-Toe game ended in a draw!', false);
}
LK.setTimeout(function () {
showScreen('room');
}, 1000);
};
rockPaperScissorsGame.onGameOver = function (result) {
if (result === 'win') {
chatPanel.addMessage('You won the Rock Paper Scissors game!', false);
} else if (result === 'lose') {
chatPanel.addMessage('You lost the Rock Paper Scissors game!', false);
} else {
chatPanel.addMessage('The Rock Paper Scissors game ended in a tie!', false);
}
LK.setTimeout(function () {
showScreen('room');
}, 1000);
};
wordGuessingGame.onGameOver = function (won) {
if (won) {
chatPanel.addMessage('You guessed the word correctly!', false);
} else {
chatPanel.addMessage('You ran out of guesses in the Word Guessing game!', false);
}
LK.setTimeout(function () {
showScreen('room');
}, 1000);
};
// Initialize the game
LK.playMusic('bgmusic');
// Update loop
game.update = function () {
// Nothing needed in update loop for this game
};
// Initial setup
showScreen('main'); ===================================================================
--- original.js
+++ change.js
@@ -180,114 +180,209 @@
self.sendMessage();
};
return self;
});
-var LanguageMenu = Container.expand(function () {
+var CreateRoomPanel = Container.expand(function () {
var self = Container.call(this);
- // Background for language menu
- var langBg = self.attachAsset('chatPanel', {
+ var panelGraphic = self.attachAsset('chatPanel', {
anchorX: 0.5,
anchorY: 0.5,
- width: 600,
- height: 800
+ width: 800,
+ height: 500
});
- // Title
- var title = new Text2('Language Settings', {
- size: 50,
+ var titleText = new Text2('Create a New Room', {
+ size: 40,
fill: 0x2C3E50
});
- title.anchor.set(0.5, 0);
- title.y = -350;
- self.addChild(title);
- // Language options
- var languages = [{
- code: 'en',
- name: 'English'
- }, {
- code: 'es',
- name: 'Español'
- }, {
- code: 'fr',
- name: 'Français'
- }, {
- code: 'de',
- name: 'Deutsch'
- }, {
- code: 'zh',
- name: '中文'
- }, {
- code: 'ja',
- name: '日本語'
- }];
- var langButtons = [];
- for (var i = 0; i < languages.length; i++) {
- var langButton = new Button(languages[i].name, 400, 80);
- langButton.y = -250 + i * 100;
- langButton.langCode = languages[i].code;
- langButton.down = function () {
- var btn = this;
- btn.up();
- if (typeof self.onLanguageSelect === 'function') {
- self.onLanguageSelect(btn.langCode);
- }
- };
- langButtons.push(langButton);
- self.addChild(langButton);
- }
- var backButton = new Button('Back', 200, 80);
- backButton.y = 350;
- self.addChild(backButton);
- backButton.down = function () {
- backButton.up();
- if (typeof self.onBack === 'function') {
- self.onBack();
+ titleText.anchor.set(0.5, 0);
+ titleText.y = -panelGraphic.height / 2 + 50;
+ self.addChild(titleText);
+ var nameLabel = new Text2('Room Name:', {
+ size: 28,
+ fill: 0x2C3E50
+ });
+ nameLabel.anchor.set(0, 0.5);
+ nameLabel.x = -panelGraphic.width / 2 + 50;
+ nameLabel.y = -50;
+ self.addChild(nameLabel);
+ var nameField = self.addChild(LK.getAsset('inputField', {
+ anchorX: 0,
+ anchorY: 0.5,
+ width: 500,
+ height: 60
+ }));
+ nameField.x = -panelGraphic.width / 2 + 200;
+ nameField.y = -50;
+ self.nameText = new Text2('Enter room name...', {
+ size: 24,
+ fill: 0x888888
+ });
+ self.nameText.x = nameField.x + 20;
+ self.nameText.y = nameField.y - 10;
+ self.addChild(self.nameText);
+ var typeLabel = new Text2('Room Type:', {
+ size: 28,
+ fill: 0x2C3E50
+ });
+ typeLabel.anchor.set(0, 0.5);
+ typeLabel.x = -panelGraphic.width / 2 + 50;
+ typeLabel.y = 50;
+ self.addChild(typeLabel);
+ var typeOptions = ['Public', 'Private'];
+ var typeButton = new Button(typeOptions[0], 200, 60);
+ typeButton.x = -panelGraphic.width / 2 + 250;
+ typeButton.y = 50;
+ self.addChild(typeButton);
+ var createButton = new Button('Create Room', 250, 80);
+ createButton.x = 0;
+ createButton.y = 150;
+ self.addChild(createButton);
+ var cancelButton = new Button('Cancel', 250, 80);
+ cancelButton.x = 0;
+ cancelButton.y = 250;
+ self.addChild(cancelButton);
+ // Initialize input field interaction
+ nameField.down = function () {
+ if (self.nameText.text === 'Enter room name...') {
+ self.nameText.setText('');
+ self.nameText.style.fill = "#333333";
}
};
- self.setActiveLanguage = function (langCode) {
- for (var i = 0; i < langButtons.length; i++) {
- if (langButtons[i].langCode === langCode) {
- langButtons[i].label.style.fill = "#27ae60"; // Green for selected
- } else {
- langButtons[i].label.style.fill = "#FFFFFF"; // White for unselected
+ typeButton.down = function () {
+ typeButton.up();
+ // Toggle between public and private
+ if (typeButton.label.text === 'Public') {
+ typeButton.setLabel('Private');
+ } else {
+ typeButton.setLabel('Public');
+ }
+ LK.getSound('select').play();
+ };
+ createButton.down = function () {
+ createButton.up();
+ var roomName = self.nameText.text;
+ if (roomName !== 'Enter room name...' && roomName.trim() !== '') {
+ if (typeof self.onCreateRoom === 'function') {
+ self.onCreateRoom({
+ name: roomName,
+ type: typeButton.label.text
+ });
}
}
};
+ cancelButton.down = function () {
+ cancelButton.up();
+ if (typeof self.onCancel === 'function') {
+ self.onCancel();
+ }
+ };
+ self.onCreateRoom = null;
+ self.onCancel = null;
return self;
});
-var MainMenu = Container.expand(function () {
+var JoinRoomPanel = Container.expand(function () {
var self = Container.call(this);
- // Background for menu
- var menuBg = self.attachAsset('chatPanel', {
+ var panelGraphic = self.attachAsset('chatPanel', {
anchorX: 0.5,
anchorY: 0.5,
- width: 600,
+ width: 900,
height: 800
});
- // Title
- var menuTitle = new Text2('Main Menu', {
- size: 50,
+ var titleText = new Text2('Join a Room', {
+ size: 40,
fill: 0x2C3E50
});
- menuTitle.anchor.set(0.5, 0);
- menuTitle.y = -350;
- self.addChild(menuTitle);
- // Create buttons
- var playButton = new Button('Play', 400, 80);
- playButton.y = -200;
+ titleText.anchor.set(0.5, 0);
+ titleText.y = -panelGraphic.height / 2 + 50;
+ self.addChild(titleText);
+ self.roomsContainer = new Container();
+ self.roomsContainer.x = -panelGraphic.width / 2 + 100;
+ self.roomsContainer.y = -panelGraphic.height / 2 + 150;
+ self.addChild(self.roomsContainer);
+ var refreshButton = new Button('Refresh', 150, 60);
+ refreshButton.x = panelGraphic.width / 2 - 100;
+ refreshButton.y = -panelGraphic.height / 2 + 100;
+ self.addChild(refreshButton);
+ var backButton = new Button('Back', 250, 80);
+ backButton.x = 0;
+ backButton.y = panelGraphic.height / 2 - 100;
+ self.addChild(backButton);
+ self.rooms = [];
+ self.populateRooms = function (roomsData) {
+ // Clear existing rooms
+ while (self.roomsContainer.children.length > 0) {
+ self.roomsContainer.removeChild(self.roomsContainer.children[0]);
+ }
+ self.rooms = roomsData;
+ // Add room list items
+ for (var i = 0; i < roomsData.length; i++) {
+ var roomItem = new RoomListItem(roomsData[i].name, roomsData[i].players);
+ roomItem.y = i * 100;
+ roomItem.onJoin = function (roomName) {
+ if (typeof self.onJoinRoom === 'function') {
+ self.onJoinRoom(roomName);
+ }
+ };
+ self.roomsContainer.addChild(roomItem);
+ }
+ };
+ refreshButton.down = function () {
+ refreshButton.up();
+ if (typeof self.onRefresh === 'function') {
+ self.onRefresh();
+ }
+ };
+ backButton.down = function () {
+ backButton.up();
+ if (typeof self.onBack === 'function') {
+ self.onBack();
+ }
+ };
+ self.onJoinRoom = null;
+ self.onRefresh = null;
+ self.onBack = null;
+ return self;
+});
+var MainMenu = Container.expand(function () {
+ var self = Container.call(this);
+ var titleText = new Text2('Chat Party Games', {
+ size: 80,
+ fill: 0x2C3E50
+ });
+ titleText.anchor.set(0.5, 0);
+ titleText.x = 2048 / 2;
+ titleText.y = 150;
+ self.addChild(titleText);
+ var avatar = new Avatar();
+ avatar.x = 2048 / 2;
+ avatar.y = 400;
+ self.addChild(avatar);
+ var playButton = new Button('Play Now', 300, 100);
+ playButton.x = 2048 / 2;
+ playButton.y = 650;
self.addChild(playButton);
- var createRoomButton = new Button('Create Room', 400, 80);
- createRoomButton.y = -100;
+ var createRoomButton = new Button('Create Room', 300, 100);
+ createRoomButton.x = 2048 / 2;
+ createRoomButton.y = 800;
self.addChild(createRoomButton);
- var joinRoomButton = new Button('Join Room', 400, 80);
- joinRoomButton.y = 0;
+ var joinRoomButton = new Button('Join Room', 300, 100);
+ joinRoomButton.x = 2048 / 2;
+ joinRoomButton.y = 950;
self.addChild(joinRoomButton);
- var settingsButton = new Button('Settings', 400, 80);
- settingsButton.y = 100;
+ var settingsButton = new Button('Settings', 300, 100);
+ settingsButton.x = 2048 / 2;
+ settingsButton.y = 1100;
self.addChild(settingsButton);
- var langButton = new Button('Language', 400, 80);
- langButton.y = 200;
- self.addChild(langButton);
- // Event handlers (to be set from outside)
+ self.setUsername = function (name) {
+ avatar.setName(name);
+ };
+ self.setAvatarColor = function (color) {
+ avatar.setColor(color);
+ };
+ self.onPlay = null;
+ self.onCreateRoom = null;
+ self.onJoinRoom = null;
+ self.onSettings = null;
playButton.down = function () {
playButton.up();
if (typeof self.onPlay === 'function') {
self.onPlay();
@@ -310,110 +405,79 @@
if (typeof self.onSettings === 'function') {
self.onSettings();
}
};
- langButton.down = function () {
- langButton.up();
- if (typeof self.onLanguage === 'function') {
- self.onLanguage();
- }
- };
return self;
});
var RockPaperScissorsGame = Container.expand(function () {
var self = Container.call(this);
- var choices = ['rock', 'paper', 'scissors'];
- self.playerChoice = null;
- self.computerChoice = null;
- self.gameActive = true;
- // Create game board background
var boardGraphic = self.attachAsset('tictactoeBoard', {
anchorX: 0.5,
- anchorY: 0.5,
- width: 500,
- height: 400
+ anchorY: 0.5
});
- // Status text
- self.statusText = new Text2("Choose rock, paper, or scissors", {
+ self.playerChoice = null;
+ self.computerChoice = null;
+ self.gameActive = true;
+ self.statusText = new Text2("Choose your move", {
size: 32,
fill: 0x333333
});
self.statusText.anchor.set(0.5, 0);
- self.statusText.y = -150;
+ self.statusText.y = boardGraphic.height / 2 + 40;
self.addChild(self.statusText);
// Create choice buttons
- var buttonContainer = new Container();
- buttonContainer.y = 0;
- self.addChild(buttonContainer);
- var rockButton = new Button('Rock', 150, 60);
- rockButton.x = -200;
- buttonContainer.addChild(rockButton);
- var paperButton = new Button('Paper', 150, 60);
- paperButton.x = 0;
- buttonContainer.addChild(paperButton);
- var scissorsButton = new Button('Scissors', 150, 60);
- scissorsButton.x = 200;
- buttonContainer.addChild(scissorsButton);
- // Results display
- self.playerDisplay = new Text2("Your choice: ", {
+ var choices = ['Rock', 'Paper', 'Scissors'];
+ var choiceButtons = [];
+ for (var i = 0; i < choices.length; i++) {
+ var button = new Button(choices[i], 180, 60);
+ button.x = (i - 1) * 200;
+ button.y = -50;
+ button.choice = choices[i].toLowerCase();
+ button.down = function () {
+ this.up();
+ if (self.gameActive) {
+ self.makeChoice(this.choice);
+ }
+ };
+ self.addChild(button);
+ choiceButtons.push(button);
+ }
+ // Result display
+ self.playerDisplay = new Text2("", {
size: 28,
fill: 0x333333
});
- self.playerDisplay.anchor.set(0, 0);
- self.playerDisplay.x = -200;
- self.playerDisplay.y = 100;
+ self.playerDisplay.anchor.set(0.5, 0.5);
+ self.playerDisplay.x = -100;
+ self.playerDisplay.y = 50;
self.addChild(self.playerDisplay);
- self.computerDisplay = new Text2("Computer: ", {
+ self.computerDisplay = new Text2("", {
size: 28,
fill: 0x333333
});
- self.computerDisplay.anchor.set(0, 0);
- self.computerDisplay.x = -200;
- self.computerDisplay.y = 140;
+ self.computerDisplay.anchor.set(0.5, 0.5);
+ self.computerDisplay.x = 100;
+ self.computerDisplay.y = 50;
self.addChild(self.computerDisplay);
- self.resultDisplay = new Text2("", {
- size: 36,
- fill: 0x333333
- });
- self.resultDisplay.anchor.set(0.5, 0);
- self.resultDisplay.y = 200;
- self.addChild(self.resultDisplay);
- // Button handlers
- rockButton.down = function () {
- rockButton.up();
- if (self.gameActive) self.makeChoice('rock');
- };
- paperButton.down = function () {
- paperButton.up();
- if (self.gameActive) self.makeChoice('paper');
- };
- scissorsButton.down = function () {
- scissorsButton.up();
- if (self.gameActive) self.makeChoice('scissors');
- };
- // Game logic
self.makeChoice = function (choice) {
- if (!self.gameActive) return;
self.playerChoice = choice;
- self.playerDisplay.setText("Your choice: " + choice);
- // Computer makes random choice
- self.computerChoice = choices[Math.floor(Math.random() * choices.length)];
+ self.playerDisplay.setText("You: " + choice);
+ // Computer makes a choice
+ var options = ['rock', 'paper', 'scissors'];
+ self.computerChoice = options[Math.floor(Math.random() * options.length)];
self.computerDisplay.setText("Computer: " + self.computerChoice);
LK.getSound('select').play();
// Determine winner
var result = self.determineWinner();
+ self.gameActive = false;
if (result === 'win') {
- self.resultDisplay.setText("You win!");
- self.resultDisplay.style.fill = "#27ae60";
+ self.statusText.setText("You win!");
} else if (result === 'lose') {
- self.resultDisplay.setText("You lose!");
- self.resultDisplay.style.fill = "#e74c3c";
+ self.statusText.setText("You lose!");
} else {
- self.resultDisplay.setText("It's a tie!");
- self.resultDisplay.style.fill = "#f39c12";
+ self.statusText.setText("It's a tie!");
}
- self.gameActive = false;
- // Reset after delay
+ LK.getSound('gameover').play();
LK.setTimeout(function () {
if (typeof self.onGameOver === 'function') {
self.onGameOver(result);
}
@@ -431,12 +495,11 @@
self.reset = function () {
self.playerChoice = null;
self.computerChoice = null;
self.gameActive = true;
- self.playerDisplay.setText("Your choice: ");
- self.computerDisplay.setText("Computer: ");
- self.resultDisplay.setText("");
- self.statusText.setText("Choose rock, paper, or scissors");
+ self.statusText.setText("Choose your move");
+ self.playerDisplay.setText("");
+ self.computerDisplay.setText("");
};
return self;
});
var RoomListItem = Container.expand(function (roomName, playerCount) {
@@ -484,141 +547,139 @@
}
};
return self;
});
-var SettingsMenu = Container.expand(function () {
+var Settings = Container.expand(function () {
var self = Container.call(this);
- // Background for settings
- var settingsBg = self.attachAsset('chatPanel', {
- anchorX: 0.5,
- anchorY: 0.5,
- width: 600,
- height: 800
+ var titleText = new Text2('Settings', {
+ size: 60,
+ fill: 0x2C3E50
});
- // Title
- var title = new Text2('Settings', {
- size: 50,
+ titleText.anchor.set(0.5, 0);
+ titleText.x = 2048 / 2;
+ titleText.y = 150;
+ self.addChild(titleText);
+ var usernameLabel = new Text2('Username:', {
+ size: 32,
fill: 0x2C3E50
});
- title.anchor.set(0.5, 0);
- title.y = -350;
- self.addChild(title);
- // Settings options
- var userNameTitle = new Text2('Change Username:', {
- size: 30,
- fill: 0x333333
- });
- userNameTitle.anchor.set(0, 0);
- userNameTitle.x = -250;
- userNameTitle.y = -250;
- self.addChild(userNameTitle);
- var userNameInput = self.addChild(LK.getAsset('inputField', {
- anchorX: 0.5,
+ usernameLabel.anchor.set(0, 0.5);
+ usernameLabel.x = 600;
+ usernameLabel.y = 350;
+ self.addChild(usernameLabel);
+ var usernameField = self.addChild(LK.getAsset('inputField', {
+ anchorX: 0,
anchorY: 0.5,
width: 500,
- height: 60,
- x: 0,
- y: -200
+ height: 60
}));
- self.userNameText = new Text2(storage.username || 'Player', {
- size: 28,
+ usernameField.x = 800;
+ usernameField.y = 350;
+ self.usernameText = new Text2('Player', {
+ size: 24,
fill: 0x333333
});
- self.userNameText.x = userNameInput.x;
- self.userNameText.y = userNameInput.y - 10;
- self.addChild(self.userNameText);
- var colorTitle = new Text2('Change Avatar Color:', {
- size: 30,
- fill: 0x333333
+ self.usernameText.x = usernameField.x + 20;
+ self.usernameText.y = usernameField.y - 10;
+ self.addChild(self.usernameText);
+ var colorLabel = new Text2('Avatar Color:', {
+ size: 32,
+ fill: 0x2C3E50
});
- colorTitle.anchor.set(0, 0);
- colorTitle.x = -250;
- colorTitle.y = -120;
- self.addChild(colorTitle);
- // Color options
- var colors = ['#3498db', '#2ecc71', '#e74c3c', '#f39c12', '#9b59b6', '#1abc9c', '#d35400', '#34495e'];
- var colorButtons = new Container();
- colorButtons.y = -50;
- self.addChild(colorButtons);
+ colorLabel.anchor.set(0, 0.5);
+ colorLabel.x = 600;
+ colorLabel.y = 450;
+ self.addChild(colorLabel);
+ var colorButtons = [];
+ var colors = ['#3498db', '#e74c3c', '#2ecc71', '#f39c12', '#9b59b6'];
for (var i = 0; i < colors.length; i++) {
- var colorBtn = new Container();
- var colorSwatch = colorBtn.addChild(LK.getAsset('avatar', {
+ var colorButton = self.addChild(LK.getAsset('avatar', {
anchorX: 0.5,
anchorY: 0.5,
width: 60,
height: 60
}));
- colorSwatch.tint = parseInt(colors[i].replace('#', '0x'));
- colorBtn.color = colors[i];
- colorBtn.x = (i - colors.length / 2 + 0.5) * 70;
- colorBtn.down = function () {
- var btn = this;
- if (typeof self.onColorChange === 'function') {
- self.onColorChange(btn.color);
- }
+ colorButton.x = 850 + i * 100;
+ colorButton.y = 450;
+ colorButton.tint = parseInt(colors[i].replace('#', '0x'));
+ colorButton.color = colors[i];
+ colorButton.interactive = true;
+ colorButton.down = function () {
+ self.selectedColor = this.color;
+ self.updateColorSelection();
+ LK.getSound('select').play();
};
- colorButtons.addChild(colorBtn);
+ colorButtons.push(colorButton);
}
- // Volume controls
- var volumeTitle = new Text2('Sound Volume:', {
- size: 30,
- fill: 0x333333
+ var languageLabel = new Text2('Language:', {
+ size: 32,
+ fill: 0x2C3E50
});
- volumeTitle.anchor.set(0, 0);
- volumeTitle.x = -250;
- volumeTitle.y = 50;
- self.addChild(volumeTitle);
- var volumeDownBtn = new Button('-', 60, 60);
- volumeDownBtn.x = -150;
- volumeDownBtn.y = 100;
- self.addChild(volumeDownBtn);
- self.volumeText = new Text2('100%', {
- size: 28,
- fill: 0x333333
- });
- self.volumeText.anchor.set(0.5, 0.5);
- self.volumeText.y = 100;
- self.addChild(self.volumeText);
- var volumeUpBtn = new Button('+', 60, 60);
- volumeUpBtn.x = 150;
- volumeUpBtn.y = 100;
- self.addChild(volumeUpBtn);
- var saveButton = new Button('Save Settings', 300, 80);
- saveButton.y = 200;
+ languageLabel.anchor.set(0, 0.5);
+ languageLabel.x = 600;
+ languageLabel.y = 550;
+ self.addChild(languageLabel);
+ var languages = ['English', 'Spanish', 'French', 'German', 'Japanese'];
+ var languageDropdown = new Button(languages[0], 300, 60);
+ languageDropdown.x = 850;
+ languageDropdown.y = 550;
+ self.addChild(languageDropdown);
+ var saveButton = new Button('Save Changes', 300, 80);
+ saveButton.x = 2048 / 2;
+ saveButton.y = 700;
self.addChild(saveButton);
- var backButton = new Button('Back', 200, 80);
- backButton.y = 300;
+ var backButton = new Button('Back', 300, 80);
+ backButton.x = 2048 / 2;
+ backButton.y = 800;
self.addChild(backButton);
- // Button handlers
- userNameInput.down = function () {
- if (typeof self.onChangeName === 'function') {
- self.onChangeName();
+ self.selectedColor = colors[0];
+ self.updateColorSelection = function () {
+ for (var i = 0; i < colorButtons.length; i++) {
+ if (colorButtons[i].color === self.selectedColor) {
+ colorButtons[i].alpha = 1;
+ } else {
+ colorButtons[i].alpha = 0.6;
+ }
}
};
- volumeDownBtn.down = function () {
- volumeDownBtn.up();
- if (typeof self.onVolumeDown === 'function') {
- self.onVolumeDown();
- }
+ self.setValues = function (username, color) {
+ self.usernameText.setText(username);
+ self.selectedColor = color;
+ self.updateColorSelection();
};
- volumeUpBtn.down = function () {
- volumeUpBtn.up();
- if (typeof self.onVolumeUp === 'function') {
- self.onVolumeUp();
+ // Initialize username input field interaction
+ usernameField.down = function () {
+ if (self.usernameText.text === 'Player') {
+ self.usernameText.setText('');
}
};
+ languageDropdown.down = function () {
+ languageDropdown.up();
+ // Cycle through languages
+ var currentIndex = languages.indexOf(languageDropdown.label.text);
+ var nextIndex = (currentIndex + 1) % languages.length;
+ languageDropdown.setLabel(languages[nextIndex]);
+ LK.getSound('select').play();
+ };
saveButton.down = function () {
saveButton.up();
if (typeof self.onSave === 'function') {
- self.onSave();
+ self.onSave({
+ username: self.usernameText.text,
+ color: self.selectedColor,
+ language: languageDropdown.label.text
+ });
}
};
backButton.down = function () {
backButton.up();
if (typeof self.onBack === 'function') {
self.onBack();
}
};
+ self.onSave = null;
+ self.onBack = null;
+ self.updateColorSelection();
return self;
});
var TicTacToeGame = Container.expand(function () {
var self = Container.call(this);
@@ -814,142 +875,128 @@
return self;
});
var WordGuessingGame = Container.expand(function () {
var self = Container.call(this);
- var words = ["GAME", "PLAY", "FUN", "CHAT", "PARTY", "BOARD", "CARD", "DICE", "TEAM", "WIN"];
- var currentWord = "";
- var guessedLetters = [];
- var maxAttempts = 6;
- var attemptsLeft = maxAttempts;
- self.gameActive = true;
- // Create game board background
var boardGraphic = self.attachAsset('tictactoeBoard', {
anchorX: 0.5,
anchorY: 0.5,
width: 700,
height: 500
});
- // Status text
- self.statusText = new Text2("Word Guessing Game", {
- size: 36,
+ var words = ["APPLE", "BANANA", "ORANGE", "GRAPE", "CHERRY", "LEMON", "KIWI", "MELON", "PEACH", "PLUM"];
+ var currentWord = "";
+ var guessedLetters = [];
+ var remainingGuesses = 6;
+ var gameActive = true;
+ self.statusText = new Text2("Guess the fruit!", {
+ size: 32,
fill: 0x333333
});
self.statusText.anchor.set(0.5, 0);
- self.statusText.y = -200;
+ self.statusText.y = -boardGraphic.height / 2 + 40;
self.addChild(self.statusText);
- // Word display
self.wordDisplay = new Text2("", {
size: 48,
fill: 0x333333
});
- self.wordDisplay.anchor.set(0.5, 0);
- self.wordDisplay.y = -120;
+ self.wordDisplay.anchor.set(0.5, 0.5);
+ self.wordDisplay.y = -50;
self.addChild(self.wordDisplay);
- // Attempts display
- self.attemptsDisplay = new Text2("Attempts left: " + attemptsLeft, {
+ self.guessesText = new Text2("Remaining guesses: 6", {
size: 28,
fill: 0x333333
});
- self.attemptsDisplay.anchor.set(0.5, 0);
- self.attemptsDisplay.y = -50;
- self.addChild(self.attemptsDisplay);
- // Letter buttons
- var lettersContainer = new Container();
- self.addChild(lettersContainer);
- lettersContainer.y = 50;
- // Create keyboard
- var alphabet = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
+ self.guessesText.anchor.set(0.5, 0.5);
+ self.guessesText.y = 50;
+ self.addChild(self.guessesText);
+ // Create letter buttons
+ var letters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
+ var letterButtons = [];
var buttonSize = 60;
var buttonsPerRow = 7;
- for (var i = 0; i < alphabet.length; i++) {
- var letter = alphabet[i];
- var letterButton = new Button(letter, buttonSize, buttonSize);
+ for (var i = 0; i < letters.length; i++) {
+ var button = new Button(letters[i], buttonSize, buttonSize);
var row = Math.floor(i / buttonsPerRow);
var col = i % buttonsPerRow;
- letterButton.x = (col - 3) * (buttonSize + 10);
- letterButton.y = row * (buttonSize + 10);
- letterButton.letter = letter;
- letterButton.down = function () {
- var button = this;
- button.up();
- if (self.gameActive) self.guessLetter(button.letter);
+ button.x = (col - 3) * (buttonSize + 10);
+ button.y = 120 + row * (buttonSize + 10);
+ button.letter = letters[i];
+ button.down = function () {
+ this.up();
+ if (gameActive && guessedLetters.indexOf(this.letter) === -1) {
+ self.makeGuess(this.letter);
+ this.alpha = 0.5;
+ }
};
- lettersContainer.addChild(letterButton);
+ self.addChild(button);
+ letterButtons.push(button);
}
- // Result display
- self.resultDisplay = new Text2("", {
- size: 36,
- fill: 0x333333
- });
- self.resultDisplay.anchor.set(0.5, 0);
- self.resultDisplay.y = 200;
- self.addChild(self.resultDisplay);
- // Game logic
- self.startNewGame = function () {
+ self.init = function () {
currentWord = words[Math.floor(Math.random() * words.length)];
guessedLetters = [];
- attemptsLeft = maxAttempts;
- self.gameActive = true;
+ remainingGuesses = 6;
+ gameActive = true;
+ // Reset letter buttons
+ for (var i = 0; i < letterButtons.length; i++) {
+ letterButtons[i].alpha = 1;
+ }
self.updateWordDisplay();
- self.attemptsDisplay.setText("Attempts left: " + attemptsLeft);
- self.resultDisplay.setText("");
+ self.guessesText.setText("Remaining guesses: " + remainingGuesses);
+ self.statusText.setText("Guess the fruit!");
};
self.updateWordDisplay = function () {
var display = "";
for (var i = 0; i < currentWord.length; i++) {
- if (guessedLetters.includes(currentWord[i])) {
+ if (guessedLetters.indexOf(currentWord[i]) !== -1) {
display += currentWord[i] + " ";
} else {
display += "_ ";
}
}
self.wordDisplay.setText(display);
};
- self.guessLetter = function (letter) {
- if (!self.gameActive || guessedLetters.includes(letter)) return;
+ self.makeGuess = function (letter) {
guessedLetters.push(letter);
LK.getSound('select').play();
- // Check if letter is in word
- if (currentWord.includes(letter)) {
- self.updateWordDisplay();
- // Check if word is complete
- var isComplete = true;
- for (var i = 0; i < currentWord.length; i++) {
- if (!guessedLetters.includes(currentWord[i])) {
- isComplete = false;
- break;
- }
- }
- if (isComplete) {
- self.resultDisplay.setText("You won!");
- self.resultDisplay.style.fill = "#27ae60";
- self.gameActive = false;
+ if (currentWord.indexOf(letter) === -1) {
+ remainingGuesses--;
+ self.guessesText.setText("Remaining guesses: " + remainingGuesses);
+ if (remainingGuesses <= 0) {
+ gameActive = false;
+ self.statusText.setText("Game Over! The word was: " + currentWord);
+ LK.getSound('gameover').play();
LK.setTimeout(function () {
if (typeof self.onGameOver === 'function') {
- self.onGameOver('win');
+ self.onGameOver(false);
}
}, 2000);
}
} else {
- attemptsLeft--;
- self.attemptsDisplay.setText("Attempts left: " + attemptsLeft);
- if (attemptsLeft <= 0) {
- self.resultDisplay.setText("You lost! The word was: " + currentWord);
- self.resultDisplay.style.fill = "#e74c3c";
- self.gameActive = false;
+ self.updateWordDisplay();
+ // Check if all letters have been guessed
+ var won = true;
+ for (var i = 0; i < currentWord.length; i++) {
+ if (guessedLetters.indexOf(currentWord[i]) === -1) {
+ won = false;
+ break;
+ }
+ }
+ if (won) {
+ gameActive = false;
+ self.statusText.setText("You won!");
+ LK.getSound('gameover').play();
LK.setTimeout(function () {
if (typeof self.onGameOver === 'function') {
- self.onGameOver('lose');
+ self.onGameOver(true);
}
}, 2000);
}
}
};
self.reset = function () {
- self.startNewGame();
+ self.init();
};
- // Initialize
- self.startNewGame();
+ self.init();
return self;
});
/****
@@ -1010,40 +1057,45 @@
}
function _arrayWithHoles(r) {
if (Array.isArray(r)) return r;
}
-// App state
-var currentScreen = 'mainMenu'; // 'mainMenu', 'lobby', 'room', 'game', 'settings', 'language', 'createRoom', 'joinRoom'
+var currentScreen = 'main'; // 'main', 'lobby', 'room', 'game', 'settings', 'createRoom', 'joinRoom'
+var currentGame = null; // 'tictactoe', 'rockpaper', 'wordguess'
var username = storage.username || 'Player';
var avatarColor = storage.color || '#3498db';
+var language = 'English';
var currentRoomName = '';
-var volumeLevel = 100;
-var currentLanguage = 'en';
-var currentGameType = 'tictactoe'; // 'tictactoe', 'rockpaperscissors', 'wordguessing'
// Create UI containers for different screens
var mainMenuScreen = new Container();
var lobbyScreen = new Container();
var roomScreen = new Container();
var gameScreen = new Container();
var settingsScreen = new Container();
-var languageScreen = new Container();
var createRoomScreen = new Container();
var joinRoomScreen = new Container();
-// Create main menu
+// Setup main menu
var mainMenu = new MainMenu();
-mainMenu.x = 2048 / 2;
-mainMenu.y = 2732 / 2;
+mainMenu.x = 0;
+mainMenu.y = 0;
+mainMenu.setUsername(username);
+mainMenu.setAvatarColor(avatarColor);
mainMenuScreen.addChild(mainMenu);
-// Create settings menu
-var settingsMenu = new SettingsMenu();
-settingsMenu.x = 2048 / 2;
-settingsMenu.y = 2732 / 2;
-settingsScreen.addChild(settingsMenu);
-// Create language menu
-var languageMenu = new LanguageMenu();
-languageMenu.x = 2048 / 2;
-languageMenu.y = 2732 / 2;
-languageScreen.addChild(languageMenu);
+// Setup settings
+var settings = new Settings();
+settings.x = 0;
+settings.y = 0;
+settings.setValues(username, avatarColor);
+settingsScreen.addChild(settings);
+// Setup create room panel
+var createRoomPanel = new CreateRoomPanel();
+createRoomPanel.x = 2048 / 2;
+createRoomPanel.y = 2732 / 2;
+createRoomScreen.addChild(createRoomPanel);
+// Setup join room panel
+var joinRoomPanel = new JoinRoomPanel();
+joinRoomPanel.x = 2048 / 2;
+joinRoomPanel.y = 2732 / 2;
+joinRoomScreen.addChild(joinRoomPanel);
// Set up lobby screen
var lobbyTitle = new Text2('Chat Party Games', {
size: 80,
fill: 0x2C3E50
@@ -1073,9 +1125,9 @@
roomListTitle.anchor.set(0.5, 0);
roomListTitle.x = 2048 / 2;
roomListTitle.y = 600;
lobbyScreen.addChild(roomListTitle);
-// Create sample room list
+// Create room list
var roomList = new Container();
roomList.x = (2048 - 700) / 2;
roomList.y = 680;
lobbyScreen.addChild(roomList);
@@ -1083,15 +1135,19 @@
lobbyButtonsContainer.x = 2048 / 2;
lobbyButtonsContainer.y = 2500;
lobbyScreen.addChild(lobbyButtonsContainer);
var createRoomButton = new Button('Create Room', 250, 80);
-createRoomButton.x = -150;
+createRoomButton.x = 0;
createRoomButton.y = 0;
lobbyButtonsContainer.addChild(createRoomButton);
-var backToMenuButton = new Button('Main Menu', 250, 80);
-backToMenuButton.x = 150;
-backToMenuButton.y = 0;
-lobbyButtonsContainer.addChild(backToMenuButton);
+var joinRoomButton = new Button('Join Room', 250, 80);
+joinRoomButton.x = 0;
+joinRoomButton.y = 100;
+lobbyButtonsContainer.addChild(joinRoomButton);
+var backToMainButton = new Button('Main Menu', 250, 80);
+backToMainButton.x = 0;
+backToMainButton.y = 200;
+lobbyButtonsContainer.addChild(backToMainButton);
// Setup room screen
var roomTitle = new Text2('Room: Lobby', {
size: 40,
fill: 0x2C3E50
@@ -1105,28 +1161,28 @@
chatPanel.y = 120;
roomScreen.addChild(chatPanel);
var gameButtonsContainer = new Container();
gameButtonsContainer.x = 2048 / 2;
-gameButtonsContainer.y = 2000;
+gameButtonsContainer.y = 1800;
roomScreen.addChild(gameButtonsContainer);
var tictactoeButton = new Button('Tic-Tac-Toe', 250, 80);
-tictactoeButton.x = -280;
+tictactoeButton.x = 0;
tictactoeButton.y = 0;
gameButtonsContainer.addChild(tictactoeButton);
-var rpsButton = new Button('Rock-Paper-Scissors', 250, 80);
-rpsButton.x = 0;
-rpsButton.y = 0;
-gameButtonsContainer.addChild(rpsButton);
-var wordButton = new Button('Word Game', 250, 80);
-wordButton.x = 280;
-wordButton.y = 0;
-gameButtonsContainer.addChild(wordButton);
+var rockpaperButton = new Button('Rock Paper Scissors', 250, 80);
+rockpaperButton.x = 0;
+rockpaperButton.y = 100;
+gameButtonsContainer.addChild(rockpaperButton);
+var wordguessButton = new Button('Word Guessing', 250, 80);
+wordguessButton.x = 0;
+wordguessButton.y = 200;
+gameButtonsContainer.addChild(wordguessButton);
var backToLobbyButton = new Button('Back to Lobby', 250, 80);
backToLobbyButton.x = 0;
-backToLobbyButton.y = 100;
+backToLobbyButton.y = 350;
gameButtonsContainer.addChild(backToLobbyButton);
// Setup game screen
-var gameTitle = new Text2('Tic-Tac-Toe', {
+var gameTitle = new Text2('Game', {
size: 40,
fill: 0x2C3E50
});
gameTitle.anchor.set(0.5, 0);
@@ -1136,137 +1192,101 @@
// Create game instances
var ticTacToeGame = new TicTacToeGame();
ticTacToeGame.x = 2048 / 2;
ticTacToeGame.y = 2732 / 2 - 200;
+ticTacToeGame.visible = false;
gameScreen.addChild(ticTacToeGame);
-var rpsGame = new RockPaperScissorsGame();
-rpsGame.x = 2048 / 2;
-rpsGame.y = 2732 / 2 - 200;
-rpsGame.visible = false;
-gameScreen.addChild(rpsGame);
-var wordGame = new WordGuessingGame();
-wordGame.x = 2048 / 2;
-wordGame.y = 2732 / 2 - 200;
-wordGame.visible = false;
-gameScreen.addChild(wordGame);
+var rockPaperScissorsGame = new RockPaperScissorsGame();
+rockPaperScissorsGame.x = 2048 / 2;
+rockPaperScissorsGame.y = 2732 / 2 - 200;
+rockPaperScissorsGame.visible = false;
+gameScreen.addChild(rockPaperScissorsGame);
+var wordGuessingGame = new WordGuessingGame();
+wordGuessingGame.x = 2048 / 2;
+wordGuessingGame.y = 2732 / 2 - 200;
+wordGuessingGame.visible = false;
+gameScreen.addChild(wordGuessingGame);
var backToRoomButton = new Button('Back to Room', 250, 80);
backToRoomButton.x = 2048 / 2;
backToRoomButton.y = 2500;
gameScreen.addChild(backToRoomButton);
-// Create Room screen
-var createRoomTitle = new Text2('Create a New Room', {
- size: 60,
- fill: 0x2C3E50
-});
-createRoomTitle.anchor.set(0.5, 0);
-createRoomTitle.x = 2048 / 2;
-createRoomTitle.y = 300;
-createRoomScreen.addChild(createRoomTitle);
-var roomNameInput = createRoomScreen.addChild(LK.getAsset('inputField', {
- anchorX: 0.5,
- anchorY: 0.5,
- width: 700,
- height: 80,
- x: 2048 / 2,
- y: 500
-}));
-var roomNameText = new Text2('Room Name', {
- size: 32,
- fill: 0x888888
-});
-roomNameText.x = roomNameInput.x - 340;
-roomNameText.y = roomNameInput.y - 10;
-createRoomScreen.addChild(roomNameText);
-var createButton = new Button('Create', 250, 80);
-createButton.x = 2048 / 2 - 150;
-createButton.y = 650;
-createRoomScreen.addChild(createButton);
-var cancelCreateButton = new Button('Cancel', 250, 80);
-cancelCreateButton.x = 2048 / 2 + 150;
-cancelCreateButton.y = 650;
-createRoomScreen.addChild(cancelCreateButton);
-// Add main container to game
+// Add all screens to game
game.addChild(mainMenuScreen);
game.addChild(lobbyScreen);
game.addChild(roomScreen);
game.addChild(gameScreen);
game.addChild(settingsScreen);
-game.addChild(languageScreen);
game.addChild(createRoomScreen);
game.addChild(joinRoomScreen);
// Initially hide all screens except main menu
lobbyScreen.visible = false;
roomScreen.visible = false;
gameScreen.visible = false;
settingsScreen.visible = false;
-languageScreen.visible = false;
createRoomScreen.visible = false;
joinRoomScreen.visible = false;
// Function to switch between screens
-function showScreen(screenName) {
+function showScreen(screenName, gameType) {
mainMenuScreen.visible = false;
lobbyScreen.visible = false;
roomScreen.visible = false;
gameScreen.visible = false;
settingsScreen.visible = false;
- languageScreen.visible = false;
createRoomScreen.visible = false;
joinRoomScreen.visible = false;
currentScreen = screenName;
- if (screenName === 'mainMenu') {
+ if (screenName === 'main') {
mainMenuScreen.visible = true;
+ mainMenu.setUsername(username);
+ mainMenu.setAvatarColor(avatarColor);
} else if (screenName === 'lobby') {
lobbyScreen.visible = true;
- populateRoomList();
usernameText.setText('Your Name: ' + username);
avatar.setName(username);
avatar.setColor(avatarColor);
+ populateRoomList();
} else if (screenName === 'room') {
roomScreen.visible = true;
roomTitle.setText('Room: ' + currentRoomName);
chatPanel.clearMessages();
chatPanel.addMessage('Welcome to ' + currentRoomName + '!', false);
} else if (screenName === 'game') {
gameScreen.visible = true;
- // Set game title and show appropriate game
- if (currentGameType === 'tictactoe') {
+ // Hide all games
+ ticTacToeGame.visible = false;
+ rockPaperScissorsGame.visible = false;
+ wordGuessingGame.visible = false;
+ // Show the selected game
+ if (gameType === 'tictactoe') {
+ currentGame = 'tictactoe';
gameTitle.setText('Tic-Tac-Toe');
ticTacToeGame.visible = true;
- rpsGame.visible = false;
- wordGame.visible = false;
ticTacToeGame.reset();
- } else if (currentGameType === 'rockpaperscissors') {
- gameTitle.setText('Rock-Paper-Scissors');
- ticTacToeGame.visible = false;
- rpsGame.visible = true;
- wordGame.visible = false;
- rpsGame.reset();
- } else if (currentGameType === 'wordguessing') {
- gameTitle.setText('Word Guessing Game');
- ticTacToeGame.visible = false;
- rpsGame.visible = false;
- wordGame.visible = true;
- wordGame.reset();
+ } else if (gameType === 'rockpaper') {
+ currentGame = 'rockpaper';
+ gameTitle.setText('Rock Paper Scissors');
+ rockPaperScissorsGame.visible = true;
+ rockPaperScissorsGame.reset();
+ } else if (gameType === 'wordguess') {
+ currentGame = 'wordguess';
+ gameTitle.setText('Word Guessing');
+ wordGuessingGame.visible = true;
+ wordGuessingGame.reset();
}
} else if (screenName === 'settings') {
settingsScreen.visible = true;
- settingsMenu.userNameText.setText(username);
- settingsMenu.volumeText.setText(volumeLevel + '%');
- } else if (screenName === 'language') {
- languageScreen.visible = true;
- languageMenu.setActiveLanguage(currentLanguage);
+ settings.setValues(username, avatarColor);
} else if (screenName === 'createRoom') {
createRoomScreen.visible = true;
} else if (screenName === 'joinRoom') {
joinRoomScreen.visible = true;
+ // Populate rooms in join panel
+ var rooms = getAvailableRooms();
+ joinRoomPanel.populateRooms(rooms);
}
}
-// Populate the room list with sample rooms
-function populateRoomList() {
- // Clear existing rooms
- while (roomList.children.length > 0) {
- roomList.removeChild(roomList.children[0]);
- }
+// Get available rooms
+function getAvailableRooms() {
// Sample rooms
var rooms = [{
name: 'Game Night',
players: 4
@@ -1288,8 +1308,17 @@
players: Math.floor(Math.random() * 5) + 1
});
}
}
+ return rooms;
+}
+// Populate the room list
+function populateRoomList() {
+ // Clear existing rooms
+ while (roomList.children.length > 0) {
+ roomList.removeChild(roomList.children[0]);
+ }
+ var rooms = getAvailableRooms();
for (var i = 0; i < rooms.length; i++) {
var roomItem = new RoomListItem(rooms[i].name, rooms[i].players);
roomItem.y = i * 100;
roomList.addChild(roomItem);
@@ -1298,121 +1327,98 @@
showScreen('room');
};
}
}
-// Main Menu Event Handlers
+// Event Handlers for Main Menu
mainMenu.onPlay = function () {
showScreen('lobby');
};
mainMenu.onCreateRoom = function () {
showScreen('createRoom');
};
mainMenu.onJoinRoom = function () {
- showScreen('lobby');
+ showScreen('joinRoom');
};
mainMenu.onSettings = function () {
showScreen('settings');
};
-mainMenu.onLanguage = function () {
- showScreen('language');
+// Event Handlers for Settings
+settings.onSave = function (data) {
+ username = data.username;
+ avatarColor = data.color;
+ language = data.language;
+ // Save to storage
+ storage.username = username;
+ storage.color = avatarColor;
+ // Update UI
+ mainMenu.setUsername(username);
+ mainMenu.setAvatarColor(avatarColor);
+ showScreen('main');
};
-// Settings Event Handlers
-settingsMenu.onChangeName = function () {
- var newName = prompt("Enter your new username:", username);
- if (newName && newName.trim() !== '') {
- username = newName.trim();
- storage.username = username;
- settingsMenu.userNameText.setText(username);
- }
+settings.onBack = function () {
+ showScreen('main');
};
-settingsMenu.onColorChange = function (color) {
- avatarColor = color;
- storage.color = color;
- LK.getSound('select').play();
-};
-settingsMenu.onVolumeDown = function () {
- volumeLevel = Math.max(0, volumeLevel - 10);
- settingsMenu.volumeText.setText(volumeLevel + '%');
-};
-settingsMenu.onVolumeUp = function () {
- volumeLevel = Math.min(100, volumeLevel + 10);
- settingsMenu.volumeText.setText(volumeLevel + '%');
-};
-settingsMenu.onSave = function () {
- showScreen('mainMenu');
-};
-settingsMenu.onBack = function () {
- showScreen('mainMenu');
-};
-// Language Menu Event Handlers
-languageMenu.onLanguageSelect = function (langCode) {
- currentLanguage = langCode;
- languageMenu.setActiveLanguage(langCode);
- LK.getSound('select').play();
-};
-languageMenu.onBack = function () {
- showScreen('mainMenu');
-};
-// Create Room Event Handlers
-createButton.down = function () {
- createButton.up();
- var roomName = roomNameText.text;
- if (roomName === 'Room Name' || roomName.trim() === '') {
- // Generate random room name
- var adjectives = ['Cool', 'Fun', 'Happy', 'Super', 'Amazing'];
- var nouns = ['Gamers', 'Players', 'Friends', 'Squad', 'Team'];
- roomName = adjectives[Math.floor(Math.random() * adjectives.length)] + ' ' + nouns[Math.floor(Math.random() * nouns.length)];
- }
+// Event Handlers for Create Room
+createRoomPanel.onCreateRoom = function (roomData) {
+ var roomName = roomData.name;
// Store new room
if (!storage.rooms) storage.rooms = [];
storage.rooms.push(roomName);
// Join the new room
currentRoomName = roomName;
showScreen('room');
};
-cancelCreateButton.down = function () {
- cancelCreateButton.up();
- showScreen('lobby');
+createRoomPanel.onCancel = function () {
+ showScreen('main');
};
-roomNameInput.down = function () {
- if (roomNameText.text === 'Room Name') {
- roomNameText.setText('');
- roomNameText.style.fill = "#333333";
- }
+// Event Handlers for Join Room
+joinRoomPanel.onJoinRoom = function (roomName) {
+ currentRoomName = roomName;
+ showScreen('room');
};
-// Other Event Handlers
+joinRoomPanel.onRefresh = function () {
+ var rooms = getAvailableRooms();
+ joinRoomPanel.populateRooms(rooms);
+};
+joinRoomPanel.onBack = function () {
+ showScreen('main');
+};
+// Event handlers for lobby
createRoomButton.down = function () {
createRoomButton.up();
showScreen('createRoom');
};
-backToMenuButton.down = function () {
- backToMenuButton.up();
- showScreen('mainMenu');
+joinRoomButton.down = function () {
+ joinRoomButton.up();
+ showScreen('joinRoom');
};
+backToMainButton.down = function () {
+ backToMainButton.up();
+ showScreen('main');
+};
+// Event handlers for room
tictactoeButton.down = function () {
tictactoeButton.up();
- currentGameType = 'tictactoe';
- showScreen('game');
+ showScreen('game', 'tictactoe');
};
-rpsButton.down = function () {
- rpsButton.up();
- currentGameType = 'rockpaperscissors';
- showScreen('game');
+rockpaperButton.down = function () {
+ rockpaperButton.up();
+ showScreen('game', 'rockpaper');
};
-wordButton.down = function () {
- wordButton.up();
- currentGameType = 'wordguessing';
- showScreen('game');
+wordguessButton.down = function () {
+ wordguessButton.up();
+ showScreen('game', 'wordguess');
};
backToLobbyButton.down = function () {
backToLobbyButton.up();
showScreen('lobby');
};
+// Event handlers for game screen
backToRoomButton.down = function () {
backToRoomButton.up();
showScreen('room');
};
-// Game Over Event Handlers
+// Game over handlers
ticTacToeGame.onGameOver = function (winner) {
if (winner) {
chatPanel.addMessage('You ' + (winner === 'X' ? 'won' : 'lost') + ' the Tic-Tac-Toe game!', false);
} else {
@@ -1421,25 +1427,25 @@
LK.setTimeout(function () {
showScreen('room');
}, 1000);
};
-rpsGame.onGameOver = function (result) {
+rockPaperScissorsGame.onGameOver = function (result) {
if (result === 'win') {
- chatPanel.addMessage('You won the Rock-Paper-Scissors game!', false);
+ chatPanel.addMessage('You won the Rock Paper Scissors game!', false);
} else if (result === 'lose') {
- chatPanel.addMessage('You lost the Rock-Paper-Scissors game!', false);
+ chatPanel.addMessage('You lost the Rock Paper Scissors game!', false);
} else {
- chatPanel.addMessage('The Rock-Paper-Scissors game ended in a tie!', false);
+ chatPanel.addMessage('The Rock Paper Scissors game ended in a tie!', false);
}
LK.setTimeout(function () {
showScreen('room');
}, 1000);
};
-wordGame.onGameOver = function (result) {
- if (result === 'win') {
- chatPanel.addMessage('You won the Word Guessing game!', false);
+wordGuessingGame.onGameOver = function (won) {
+ if (won) {
+ chatPanel.addMessage('You guessed the word correctly!', false);
} else {
- chatPanel.addMessage('You lost the Word Guessing game!', false);
+ chatPanel.addMessage('You ran out of guesses in the Word Guessing game!', false);
}
LK.setTimeout(function () {
showScreen('room');
}, 1000);
@@ -1450,5 +1456,5 @@
game.update = function () {
// Nothing needed in update loop for this game
};
// Initial setup
-showScreen('mainMenu');
\ No newline at end of file
+showScreen('main');
\ No newline at end of file
Showing 1 to 6 of 6
Used plugins
@upit/tween@upit/storage
