Bài 42: Hiển thị câu chào mừng
Có lẽ bạn thấy rằng trò chơi ráp hình vẫn còn "thiêu thiếu", chưa hoàn chỉnh nếu chưa có câu chào mừng khi người chơi giành thắng lợi cuối cùng như trong nhiều trò chơi khác. Khi đó, người chơi đạt đến mục tiêu tái lập chính xác trật tự của các mẩu hình.
Muốn biết người chơi đã đạt đến mục tiêu hay chưa, ta cần kiểm tra ngay sau mỗi lần người chơi di chuyển một mẩu hình, xét xem tất cả mẩu hình đã vào vị trí đúng hay chưa. Muốn biết một mẩu hình đã ở vị trí đúng hay chưa, ta cần xem biến currentx và currenty của từng mẩu hình có trùng với chỉ số cột j và chỉ số hàng i của nó trong dãy tiles hay chưa. Chỉ cần phát hiện một mẩu hình ở sai vị trí, ta kết luận ngay rằng người chơi chưa đạt mục tiêu. Chỉ khi người chơi đạt mục tiêu, ta mới hiển thị câu chào mừng, đại khái như trong nhiều trò chơi khác: "You've won!" (bạn đã thắng). Bạn nhớ rằng ta có thể tùy ý điều khiển nội dung dòng chữ mang tên moves, vì vậy việc hiển thị câu chào mừng rất dễ dàng: chỉ cần sửa nội dung dòng chữ moves, thêm vào câu chào mừng ngay sau số bước giành thắng lợi. Cụ thể, bạn cần viết thêm hàm kiểm tra testForWin và gọi hàm đó trong hàm xử lý tình huống bấm chuột doPress:
...
function doPress() {
if( (Math.abs(this.currentx - blankx) == 1 && this.currenty == blanky) ||
(this.currentx == blankx && Math.abs(this.currenty - blanky) == 1) ) {
steps++;
moveTile(this);
testForWin();
}
}
function testForWin() {
solved = true;
for(i = 0; i < 4; i++) {
for(j = 0; j < 4; j++) {
if(i == 0 && j == 3)
continue;
if(tiles[i][j].currentx != j || tiles[i][j].currenty != i) {
solved = false;
break;
}
}
}
if(solved)
moves.text = steps + " You've won!";
else
moves.text = steps;
}
function moveTile(t) {
...
Với bổ sung như trên, hàm kiểm tra testForWin được gọi mỗi khi người chơi bấm chuột vào một mẩu hình để xê dịch mẩu hình vào vị trí trống. Trong hàm testForWin, ta dùng biến mới gọi là solved và gán trị ban đầu là true. Biến solved có tác dụng như một "cờ hiệu" thể hiện tình trạng trò chơi. Biến solved có trị true trong trường hợp người chơi đã giải được trò chơi. Ngược lại, biến solved có trị false. Hai vòng lặp for dùng để dò tìm lần lượt các mẩu hình trong dãy tiles. Với từng mẩu hình, nếu biến currentx khác với chỉ số cột j hoặc biến currenty khác với chỉ số hàng i, biến solved lập tức nhận trị false, ngụ ý "trò chơi còn dang dở, người chơi chưa đạt được mục tiêu". Sau hai vòng lặp for, ta mới xét đến tình trạng của "cờ hiệu" solved. Nếu trị của solved là true, nội dung của dòng chữ moves gồm số bước đã trải qua của người chơi và câu chào mừng "You've won!". Ngược lại, nếu trị của solved là false, dòng chữ moves chỉ thể hiện số bước. Sau chiến thắng, nếu muốn chơi lại từ đầu, người chơi phải bấm nút Reset. Khi đó, ta phải dẹp bỏ câu chào mừng. Điều này cần được thực hiện trong hàm xử lý tình huống bấm nút Reset:
...
reset.onPress = function() {
shuffleTiles();
steps = 0;
moves.text = steps;
}
...
Hai câu lệnh vừa thêm trong hàm xử lý tình huống onPress của nút bấm Reset nhằm làm cho biến steps trở về trị 0 và dùng biến steps làm nội dung của dòng chữ moves (không còn câu chào mừng nữa). Trò chơi của ta xem như hoàn chỉnh. Bạn chạy thử xem sao nhé. Dưới đây là toàn bộ mã nguồn của trò chơi xếp hình để bạn tiện tham khảo:
tiles = new Array();
n = 0;
blankx = 3;
blanky = 0;
steps = 0;
moves.text = steps;
for(i = 0; i < 4; i++) {
tiles[i] = new Array();
for(j = 0; j < 4; j++) {
if(i == 0 && j == 3)
continue;
r = i + 1;
c = j + 1;
attachMovie("Tile" + r + c, "tile" + i + j, n++);
tiles[i][j] = this["tile" + i + j];
tiles[i][j]._x = 100 * j;
tiles[i][j]._y = 100 * i;
tiles[i][j].currentx = j;
tiles[i][j].currenty = i;
tiles[i][j].onPress = doPress;
}
}
shuffleTiles();
reset.onPress = function() {
shuffleTiles();
steps = 0;
moves.text = steps;
}
solve.onPress = function() {
for(i = 0; i < 4; i++)
for(j = 0; j < 4; j++) {
if(i == 0 && j == 3)
continue;
tiles[i][j]._x = j * 100;
tiles[i][j]._y = i * 100;
}
}
solve.onRelease = function() {
for(i = 0; i < 4; i++)
for(j = 0; j < 4; j++) {
if(i == 0 && j == 3)
continue;
tiles[i][j]._x = tiles[i][j].currentx * 100;
tiles[i][j]._y = tiles[i][j].currenty * 100;
}
}
function shuffleTiles() {
for(k = 0; k < 200; k++) {
rand = getRandom(-1, 1);
if(getRandom(0, 1)) {
changex = blankx + rand;
changey = blanky;
}
else {
changex = blankx;
changey = blanky + rand;
}
if(changex >= 0 && changex <= 3 && changey >= 0 && changey <= 3) {
for(i = 0; i < 4; i++)
for(j = 0; j < 4; j++) {
if(i == 0 && j == 3)
continue;
if(tiles[i][j].currentx == changex && tiles[i][j].currenty == changey)
moveTile(tiles[i][j]);
}
}
}
}
function getRandom(min, max) {
return Math.floor(Math.random()*(max - min + 1) + min);
}
function doPress() {
if( (Math.abs(this.currentx - blankx) == 1 && this.currenty == blanky) ||
(this.currentx == blankx && Math.abs(this.currenty - blanky) == 1) ) {
steps++;
moveTile(this);
testForWin();
}
}
function testForWin() {
solved = true;
for(i = 0; i < 4; i++) {
for(j = 0; j < 4; j++) {
if(i == 0 && j == 3)
continue;
if(tiles[i][j].currentx != j || tiles[i][j].currenty != i) {
solved = false;
break;
}
}
}
if(solved)
moves.text = steps + " You've won!";
else
moves.text = steps;
}
function moveTile(t) {
tempx = blankx;
tempy = blanky;
blankx = t.currentx;
blanky = t.currenty;
t.currentx = tempx;
t.currenty = tempy;
t._x = t.currentx * 100;
t._y = t.currenty * 100;
}
Chia sẻ với bạn bè của bạn: | 
