User prompt
Please fix the bug: 'Uncaught TypeError: Cannot set properties of undefined (setting 'fill')' in or related to this line: 'letterText.style.fill = "#1E3A8A";' Line Number: 73
User prompt
Añade un botón de ajustes donde Al hacer click puedas elegir el idioma
Code edit (1 edits merged)
Please save this source code
User prompt
Palabra Azul - Trilingual Word Game
Initial prompt
Una versión de Wordle en Tres idiomas (Español Latinoamericana Inglés ES y Portugués) Y todo es azul
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
var storage = LK.import("@upit/storage.v1");
/****
* Classes
****/
var GameTile = Container.expand(function (letter, row, col) {
var self = Container.call(this);
self.letter = letter || '';
self.row = row;
self.col = col;
self.state = 'empty'; // empty, filled, correct, wrongPosition, wrong
var tileGraphic = self.attachAsset('tile', {
anchorX: 0.5,
anchorY: 0.5
});
var letterText = new Text2(self.letter, {
size: 60,
fill: 0x1E3A8A
});
letterText.anchor.set(0.5, 0.5);
self.addChild(letterText);
self.setLetter = function (newLetter) {
self.letter = newLetter.toUpperCase();
letterText.setText(self.letter);
};
self.setState = function (newState) {
self.state = newState;
self.removeChild(tileGraphic);
switch (newState) {
case 'correct':
tileGraphic = self.attachAsset('correctTile', {
anchorX: 0.5,
anchorY: 0.5
});
letterText.style.fill = "#FFFFFF";
break;
case 'wrongPosition':
tileGraphic = self.attachAsset('wrongPositionTile', {
anchorX: 0.5,
anchorY: 0.5
});
letterText.style.fill = "#FFFFFF";
break;
case 'wrong':
tileGraphic = self.attachAsset('wrongTile', {
anchorX: 0.5,
anchorY: 0.5
});
letterText.style.fill = "#374151";
break;
default:
tileGraphic = self.attachAsset('tile', {
anchorX: 0.5,
anchorY: 0.5
});
letterText.style.fill = "#1E3A8A";
}
self.addChildAt(tileGraphic, 0);
};
return self;
});
var KeyboardKey = Container.expand(function (letter, isSpecial) {
var self = Container.call(this);
self.letter = letter;
self.isSpecial = isSpecial || false;
self.state = 'normal'; // normal, correct, wrongPosition, wrong
var keyWidth = self.isSpecial ? 160 : 80;
var keyGraphic = LK.getAsset('keyTile', {
anchorX: 0.5,
anchorY: 0.5,
width: keyWidth
});
self.addChild(keyGraphic);
var keyText = new Text2(self.letter, {
size: self.isSpecial ? 24 : 36,
fill: 0x1E3A8A
});
keyText.anchor.set(0.5, 0.5);
self.addChild(keyText);
self.down = function (x, y, obj) {
if (self.letter === 'ENTER') {
game.submitGuess();
} else if (self.letter === 'DEL') {
game.deleteLetter();
} else {
game.addLetter(self.letter);
}
LK.getSound('keyPress').play();
};
self.updateState = function (newState) {
self.state = newState;
switch (newState) {
case 'correct':
keyGraphic.tint = 0x1E3A8A;
keyText.style.fill = "#FFFFFF";
break;
case 'wrongPosition':
keyGraphic.tint = 0x3B82F6;
keyText.style.fill = "#FFFFFF";
break;
case 'wrong':
keyGraphic.tint = 0x9CA3AF;
keyText.style.fill = "#374151";
break;
default:
keyGraphic.tint = 0xFFFFFF;
keyText.style.fill = "#1E3A8A";
}
};
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0xF0F9FF
});
/****
* Game Code
****/
// Word lists for each language
var spanishWords = ['HOLA', 'AMOR', 'VIDA', 'CASA', 'AGUA', 'GATO', 'PERRO', 'FELIZ', 'MUNDO', 'NUEVA', 'BUENO', 'GRANDE', 'NEGRO', 'BLANCO', 'VERDE', 'AZUL', 'ROJO', 'DULCE', 'FUEGO', 'TIERRA'];
var englishWords = ['HELLO', 'WORLD', 'HAPPY', 'WATER', 'HOUSE', 'GREAT', 'SMILE', 'PEACE', 'BRAVE', 'DREAM', 'LIGHT', 'MUSIC', 'STORY', 'MAGIC', 'POWER', 'HEART', 'GRACE', 'TRUTH', 'FAITH', 'SWEET'];
var portugueseWords = ['MUNDO', 'FELIZ', 'AGUA', 'CASA', 'GRANDE', 'VERDE', 'BRAVO', 'DOCE', 'TERRA', 'FOGO', 'VIDA', 'AMOR', 'GATO', 'NOVO', 'BOM', 'NEGRO', 'AZUL', 'LUZ', 'PAZ', 'SONHO'];
var languages = ['spanish', 'english', 'portuguese'];
var currentLanguage = languages[Math.floor(Math.random() * languages.length)];
var targetWord = '';
var currentRow = 0;
var currentCol = 0;
var gameGrid = [];
var keyboard = [];
var gameOver = false;
// Initialize target word based on language
function setTargetWord() {
var wordList;
switch (currentLanguage) {
case 'spanish':
wordList = spanishWords;
break;
case 'english':
wordList = englishWords;
break;
case 'portuguese':
wordList = portugueseWords;
break;
}
targetWord = wordList[Math.floor(Math.random() * wordList.length)];
}
setTargetWord();
// Create game grid (6 rows x 5 columns)
var gridContainer = new Container();
game.addChild(gridContainer);
for (var row = 0; row < 6; row++) {
gameGrid[row] = [];
for (var col = 0; col < 5; col++) {
var tile = new GameTile('', row, col);
tile.x = col * 140 + 70;
tile.y = row * 140 + 70;
gameGrid[row][col] = tile;
gridContainer.addChild(tile);
}
}
// Center the grid
gridContainer.x = (2048 - 700) / 2;
gridContainer.y = 200;
// Create virtual keyboard
var keyboardContainer = new Container();
game.addChild(keyboardContainer);
var keyRows = [['Q', 'W', 'E', 'R', 'T', 'Y', 'U', 'I', 'O', 'P'], ['A', 'S', 'D', 'F', 'G', 'H', 'J', 'K', 'L'], ['ENTER', 'Z', 'X', 'C', 'V', 'B', 'N', 'M', 'DEL']];
for (var row = 0; row < keyRows.length; row++) {
keyboard[row] = [];
var rowWidth = keyRows[row].length * 90;
var startX = (2048 - rowWidth) / 2;
for (var col = 0; col < keyRows[row].length; col++) {
var isSpecial = keyRows[row][col] === 'ENTER' || keyRows[row][col] === 'DEL';
var key = new KeyboardKey(keyRows[row][col], isSpecial);
key.x = startX + col * 90 + (isSpecial ? 40 : 0);
key.y = 1800 + row * 120;
keyboard[row][col] = key;
keyboardContainer.addChild(key);
}
}
// Language indicator
var languageText = new Text2('Language: ' + currentLanguage.toUpperCase(), {
size: 48,
fill: 0x1E3A8A
});
languageText.anchor.set(0.5, 0);
languageText.x = 2048 / 2;
languageText.y = 50;
game.addChild(languageText);
// Game functions
game.addLetter = function (letter) {
if (gameOver || currentRow >= 6 || currentCol >= 5) return;
gameGrid[currentRow][currentCol].setLetter(letter);
currentCol++;
};
game.deleteLetter = function () {
if (gameOver || currentCol <= 0) return;
currentCol--;
gameGrid[currentRow][currentCol].setLetter('');
};
game.submitGuess = function () {
if (gameOver || currentCol !== 5) return;
var guess = '';
for (var col = 0; col < 5; col++) {
guess += gameGrid[currentRow][col].letter;
}
// Check guess against target word
var letterStates = [];
var targetLetterCount = {};
// Count letters in target word
for (var i = 0; i < targetWord.length; i++) {
var letter = targetWord[i];
targetLetterCount[letter] = (targetLetterCount[letter] || 0) + 1;
}
// First pass: mark correct positions
for (var col = 0; col < 5; col++) {
var guessLetter = guess[col];
if (guessLetter === targetWord[col]) {
letterStates[col] = 'correct';
targetLetterCount[guessLetter]--;
}
}
// Second pass: mark wrong positions and wrong letters
for (var col = 0; col < 5; col++) {
if (letterStates[col]) continue; // Already marked as correct
var guessLetter = guess[col];
if (targetLetterCount[guessLetter] > 0) {
letterStates[col] = 'wrongPosition';
targetLetterCount[guessLetter]--;
} else {
letterStates[col] = 'wrong';
}
}
// Update tiles with animation
for (var col = 0; col < 5; col++) {
var tile = gameGrid[currentRow][col];
var delay = col * 200;
LK.setTimeout(function (tile, state) {
return function () {
tile.setState(state);
};
}(tile, letterStates[col]), delay);
}
// Update keyboard colors
LK.setTimeout(function () {
for (var col = 0; col < 5; col++) {
var guessLetter = guess[col];
var state = letterStates[col];
// Find the key in keyboard
for (var row = 0; row < keyboard.length; row++) {
for (var keyCol = 0; keyCol < keyboard[row].length; keyCol++) {
var key = keyboard[row][keyCol];
if (key.letter === guessLetter) {
// Only update if current state is better than existing state
if (state === 'correct' || state === 'wrongPosition' && key.state !== 'correct' || state === 'wrong' && key.state === 'normal') {
key.updateState(state);
}
}
}
}
}
}, 1000);
// Check win condition
if (guess === targetWord) {
gameOver = true;
LK.setTimeout(function () {
LK.getSound('success').play();
LK.setScore(LK.getScore() + 1);
LK.showYouWin();
}, 1200);
return;
}
currentRow++;
currentCol = 0;
// Check lose condition
if (currentRow >= 6) {
gameOver = true;
LK.setTimeout(function () {
LK.getSound('failure').play();
// Show the correct word
var correctWordText = new Text2('The word was: ' + targetWord, {
size: 72,
fill: 0x1E3A8A
});
correctWordText.anchor.set(0.5, 0.5);
correctWordText.x = 2048 / 2;
correctWordText.y = 1400;
game.addChild(correctWordText);
LK.setTimeout(function () {
LK.showGameOver();
}, 2000);
}, 1200);
}
};
// Statistics tracking
var stats = storage.palabraAzulStats || {
gamesPlayed: 0,
gamesWon: 0,
currentStreak: 0,
maxStreak: 0
};
// Update stats on game end
var originalShowYouWin = LK.showYouWin;
var originalShowGameOver = LK.showGameOver;
// Save stats
storage.palabraAzulStats = stats; ===================================================================
--- original.js
+++ change.js
@@ -1,6 +1,314 @@
-/****
+/****
+* Plugins
+****/
+var tween = LK.import("@upit/tween.v1");
+var storage = LK.import("@upit/storage.v1");
+
+/****
+* Classes
+****/
+var GameTile = Container.expand(function (letter, row, col) {
+ var self = Container.call(this);
+ self.letter = letter || '';
+ self.row = row;
+ self.col = col;
+ self.state = 'empty'; // empty, filled, correct, wrongPosition, wrong
+ var tileGraphic = self.attachAsset('tile', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ var letterText = new Text2(self.letter, {
+ size: 60,
+ fill: 0x1E3A8A
+ });
+ letterText.anchor.set(0.5, 0.5);
+ self.addChild(letterText);
+ self.setLetter = function (newLetter) {
+ self.letter = newLetter.toUpperCase();
+ letterText.setText(self.letter);
+ };
+ self.setState = function (newState) {
+ self.state = newState;
+ self.removeChild(tileGraphic);
+ switch (newState) {
+ case 'correct':
+ tileGraphic = self.attachAsset('correctTile', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ letterText.style.fill = "#FFFFFF";
+ break;
+ case 'wrongPosition':
+ tileGraphic = self.attachAsset('wrongPositionTile', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ letterText.style.fill = "#FFFFFF";
+ break;
+ case 'wrong':
+ tileGraphic = self.attachAsset('wrongTile', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ letterText.style.fill = "#374151";
+ break;
+ default:
+ tileGraphic = self.attachAsset('tile', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ letterText.style.fill = "#1E3A8A";
+ }
+ self.addChildAt(tileGraphic, 0);
+ };
+ return self;
+});
+var KeyboardKey = Container.expand(function (letter, isSpecial) {
+ var self = Container.call(this);
+ self.letter = letter;
+ self.isSpecial = isSpecial || false;
+ self.state = 'normal'; // normal, correct, wrongPosition, wrong
+ var keyWidth = self.isSpecial ? 160 : 80;
+ var keyGraphic = LK.getAsset('keyTile', {
+ anchorX: 0.5,
+ anchorY: 0.5,
+ width: keyWidth
+ });
+ self.addChild(keyGraphic);
+ var keyText = new Text2(self.letter, {
+ size: self.isSpecial ? 24 : 36,
+ fill: 0x1E3A8A
+ });
+ keyText.anchor.set(0.5, 0.5);
+ self.addChild(keyText);
+ self.down = function (x, y, obj) {
+ if (self.letter === 'ENTER') {
+ game.submitGuess();
+ } else if (self.letter === 'DEL') {
+ game.deleteLetter();
+ } else {
+ game.addLetter(self.letter);
+ }
+ LK.getSound('keyPress').play();
+ };
+ self.updateState = function (newState) {
+ self.state = newState;
+ switch (newState) {
+ case 'correct':
+ keyGraphic.tint = 0x1E3A8A;
+ keyText.style.fill = "#FFFFFF";
+ break;
+ case 'wrongPosition':
+ keyGraphic.tint = 0x3B82F6;
+ keyText.style.fill = "#FFFFFF";
+ break;
+ case 'wrong':
+ keyGraphic.tint = 0x9CA3AF;
+ keyText.style.fill = "#374151";
+ break;
+ default:
+ keyGraphic.tint = 0xFFFFFF;
+ keyText.style.fill = "#1E3A8A";
+ }
+ };
+ return self;
+});
+
+/****
* Initialize Game
-****/
+****/
var game = new LK.Game({
- backgroundColor: 0x000000
-});
\ No newline at end of file
+ backgroundColor: 0xF0F9FF
+});
+
+/****
+* Game Code
+****/
+// Word lists for each language
+var spanishWords = ['HOLA', 'AMOR', 'VIDA', 'CASA', 'AGUA', 'GATO', 'PERRO', 'FELIZ', 'MUNDO', 'NUEVA', 'BUENO', 'GRANDE', 'NEGRO', 'BLANCO', 'VERDE', 'AZUL', 'ROJO', 'DULCE', 'FUEGO', 'TIERRA'];
+var englishWords = ['HELLO', 'WORLD', 'HAPPY', 'WATER', 'HOUSE', 'GREAT', 'SMILE', 'PEACE', 'BRAVE', 'DREAM', 'LIGHT', 'MUSIC', 'STORY', 'MAGIC', 'POWER', 'HEART', 'GRACE', 'TRUTH', 'FAITH', 'SWEET'];
+var portugueseWords = ['MUNDO', 'FELIZ', 'AGUA', 'CASA', 'GRANDE', 'VERDE', 'BRAVO', 'DOCE', 'TERRA', 'FOGO', 'VIDA', 'AMOR', 'GATO', 'NOVO', 'BOM', 'NEGRO', 'AZUL', 'LUZ', 'PAZ', 'SONHO'];
+var languages = ['spanish', 'english', 'portuguese'];
+var currentLanguage = languages[Math.floor(Math.random() * languages.length)];
+var targetWord = '';
+var currentRow = 0;
+var currentCol = 0;
+var gameGrid = [];
+var keyboard = [];
+var gameOver = false;
+// Initialize target word based on language
+function setTargetWord() {
+ var wordList;
+ switch (currentLanguage) {
+ case 'spanish':
+ wordList = spanishWords;
+ break;
+ case 'english':
+ wordList = englishWords;
+ break;
+ case 'portuguese':
+ wordList = portugueseWords;
+ break;
+ }
+ targetWord = wordList[Math.floor(Math.random() * wordList.length)];
+}
+setTargetWord();
+// Create game grid (6 rows x 5 columns)
+var gridContainer = new Container();
+game.addChild(gridContainer);
+for (var row = 0; row < 6; row++) {
+ gameGrid[row] = [];
+ for (var col = 0; col < 5; col++) {
+ var tile = new GameTile('', row, col);
+ tile.x = col * 140 + 70;
+ tile.y = row * 140 + 70;
+ gameGrid[row][col] = tile;
+ gridContainer.addChild(tile);
+ }
+}
+// Center the grid
+gridContainer.x = (2048 - 700) / 2;
+gridContainer.y = 200;
+// Create virtual keyboard
+var keyboardContainer = new Container();
+game.addChild(keyboardContainer);
+var keyRows = [['Q', 'W', 'E', 'R', 'T', 'Y', 'U', 'I', 'O', 'P'], ['A', 'S', 'D', 'F', 'G', 'H', 'J', 'K', 'L'], ['ENTER', 'Z', 'X', 'C', 'V', 'B', 'N', 'M', 'DEL']];
+for (var row = 0; row < keyRows.length; row++) {
+ keyboard[row] = [];
+ var rowWidth = keyRows[row].length * 90;
+ var startX = (2048 - rowWidth) / 2;
+ for (var col = 0; col < keyRows[row].length; col++) {
+ var isSpecial = keyRows[row][col] === 'ENTER' || keyRows[row][col] === 'DEL';
+ var key = new KeyboardKey(keyRows[row][col], isSpecial);
+ key.x = startX + col * 90 + (isSpecial ? 40 : 0);
+ key.y = 1800 + row * 120;
+ keyboard[row][col] = key;
+ keyboardContainer.addChild(key);
+ }
+}
+// Language indicator
+var languageText = new Text2('Language: ' + currentLanguage.toUpperCase(), {
+ size: 48,
+ fill: 0x1E3A8A
+});
+languageText.anchor.set(0.5, 0);
+languageText.x = 2048 / 2;
+languageText.y = 50;
+game.addChild(languageText);
+// Game functions
+game.addLetter = function (letter) {
+ if (gameOver || currentRow >= 6 || currentCol >= 5) return;
+ gameGrid[currentRow][currentCol].setLetter(letter);
+ currentCol++;
+};
+game.deleteLetter = function () {
+ if (gameOver || currentCol <= 0) return;
+ currentCol--;
+ gameGrid[currentRow][currentCol].setLetter('');
+};
+game.submitGuess = function () {
+ if (gameOver || currentCol !== 5) return;
+ var guess = '';
+ for (var col = 0; col < 5; col++) {
+ guess += gameGrid[currentRow][col].letter;
+ }
+ // Check guess against target word
+ var letterStates = [];
+ var targetLetterCount = {};
+ // Count letters in target word
+ for (var i = 0; i < targetWord.length; i++) {
+ var letter = targetWord[i];
+ targetLetterCount[letter] = (targetLetterCount[letter] || 0) + 1;
+ }
+ // First pass: mark correct positions
+ for (var col = 0; col < 5; col++) {
+ var guessLetter = guess[col];
+ if (guessLetter === targetWord[col]) {
+ letterStates[col] = 'correct';
+ targetLetterCount[guessLetter]--;
+ }
+ }
+ // Second pass: mark wrong positions and wrong letters
+ for (var col = 0; col < 5; col++) {
+ if (letterStates[col]) continue; // Already marked as correct
+ var guessLetter = guess[col];
+ if (targetLetterCount[guessLetter] > 0) {
+ letterStates[col] = 'wrongPosition';
+ targetLetterCount[guessLetter]--;
+ } else {
+ letterStates[col] = 'wrong';
+ }
+ }
+ // Update tiles with animation
+ for (var col = 0; col < 5; col++) {
+ var tile = gameGrid[currentRow][col];
+ var delay = col * 200;
+ LK.setTimeout(function (tile, state) {
+ return function () {
+ tile.setState(state);
+ };
+ }(tile, letterStates[col]), delay);
+ }
+ // Update keyboard colors
+ LK.setTimeout(function () {
+ for (var col = 0; col < 5; col++) {
+ var guessLetter = guess[col];
+ var state = letterStates[col];
+ // Find the key in keyboard
+ for (var row = 0; row < keyboard.length; row++) {
+ for (var keyCol = 0; keyCol < keyboard[row].length; keyCol++) {
+ var key = keyboard[row][keyCol];
+ if (key.letter === guessLetter) {
+ // Only update if current state is better than existing state
+ if (state === 'correct' || state === 'wrongPosition' && key.state !== 'correct' || state === 'wrong' && key.state === 'normal') {
+ key.updateState(state);
+ }
+ }
+ }
+ }
+ }
+ }, 1000);
+ // Check win condition
+ if (guess === targetWord) {
+ gameOver = true;
+ LK.setTimeout(function () {
+ LK.getSound('success').play();
+ LK.setScore(LK.getScore() + 1);
+ LK.showYouWin();
+ }, 1200);
+ return;
+ }
+ currentRow++;
+ currentCol = 0;
+ // Check lose condition
+ if (currentRow >= 6) {
+ gameOver = true;
+ LK.setTimeout(function () {
+ LK.getSound('failure').play();
+ // Show the correct word
+ var correctWordText = new Text2('The word was: ' + targetWord, {
+ size: 72,
+ fill: 0x1E3A8A
+ });
+ correctWordText.anchor.set(0.5, 0.5);
+ correctWordText.x = 2048 / 2;
+ correctWordText.y = 1400;
+ game.addChild(correctWordText);
+ LK.setTimeout(function () {
+ LK.showGameOver();
+ }, 2000);
+ }, 1200);
+ }
+};
+// Statistics tracking
+var stats = storage.palabraAzulStats || {
+ gamesPlayed: 0,
+ gamesWon: 0,
+ currentStreak: 0,
+ maxStreak: 0
+};
+// Update stats on game end
+var originalShowYouWin = LK.showYouWin;
+var originalShowGameOver = LK.showGameOver;
+// Save stats
+storage.palabraAzulStats = stats;
\ No newline at end of file