From 06b89b725bc06064ab684a8d37b9d3521945749c Mon Sep 17 00:00:00 2001 From: Nadine Curry Date: Tue, 5 Jul 2016 13:48:16 -0700 Subject: [PATCH 01/33] baseline --- README.md | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/README.md b/README.md index 40920f6..0819c03 100644 --- a/README.md +++ b/README.md @@ -17,14 +17,32 @@ Recreate as much of the original game as is reasonable in the one week we have a ### Project Baseline - Play a couple games of [2048](http://gabrielecirulli.github.io/2048/). Think about everything that's likely happening in the code to support what's happening on the screen. Once you've got a feel for the game, talk with your pair and answer the following questions: 1. How does scoring work? + point are equivalent to the final tile value + 1. When do tiles enter the game? + after you move a certain direction + 1. How do you know if you've won? + have one tile that has a value of 2048 + 1. How do you know if you've lost? + if all of the slots have tiles + 1. What makes tiles move? + the arrow button + 1. What happens when they move? + if two tiles' values match when going in the direction of the 'move', they will combine values and make one tile. If there are three tiles with matching values, the combination will happen to the two tiles in the opposite direction of the 'move'.(ex: if you click right, the two tiles on the left will combine). Tiles that don't match will move into an empty slot in the direction of the 'move' + 1. How would you know how far a tile should move? + It should move over until there's no empty slot in the direction of the 'move'. It will not move if there is no empty slot. + 1. How would you know if tiles would collide? + if the tile's values are the same + 1. What happens when tiles collide? + they turn into one tile, and add together their values. It also adds the final value as points to the player. + - Document your answers to these questions in this README. - Use your discussion and answers to create tasks for a trello board. Organize those tasks into deliverable components (e.e., _Scoring_, _Tile Collision_, _Win/Loss_). - Open a PR with your discussion notes and answers to the above questions. Include a link to your Trello board. Indicate in the PR which deliverable(s) you are targeting first. From c02a2c04d36ec3e22cab2791826abcbf67783044 Mon Sep 17 00:00:00 2001 From: Nadine Curry Date: Tue, 5 Jul 2016 15:08:22 -0700 Subject: [PATCH 02/33] playing around with jquery --- README.md | 2 +- index.html | 1 + javascripts/2048.js | 14 ++++++++++---- 3 files changed, 12 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 0819c03..a889fb7 100644 --- a/README.md +++ b/README.md @@ -26,7 +26,7 @@ Recreate as much of the original game as is reasonable in the one week we have a have one tile that has a value of 2048 1. How do you know if you've lost? - if all of the slots have tiles + if all of the slots have tiles, and no collisions can happen. 1. What makes tiles move? the arrow button diff --git a/index.html b/index.html index 4740408..0059ee6 100644 --- a/index.html +++ b/index.html @@ -27,6 +27,7 @@
2
+
2
diff --git a/javascripts/2048.js b/javascripts/2048.js index 4b2746c..f14956d 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -2,7 +2,7 @@ var Game = function() { // Game logic and initialization here }; -Game.prototype.moveTile = function(tile, direction) { +Game.prototype.moveTile = function(tiles, direction) { // Game method here switch(direction) { case 38: //up @@ -13,6 +13,7 @@ Game.prototype.moveTile = function(tile, direction) { break; case 37: //left console.log('left'); + this.moveLeft() break; case 39: //right console.log('right'); @@ -20,6 +21,11 @@ Game.prototype.moveTile = function(tile, direction) { } }; +Game.prototype.moveLeft = function(){ + var tiles = $(".tile") + console.log(tiles.data("row")) +}; + $(document).ready(function() { console.log("ready to go!"); // Any interactive jQuery functionality @@ -28,9 +34,9 @@ $(document).ready(function() { $('body').keydown(function(event){ var arrows = [37, 38, 39, 40]; if (arrows.indexOf(event.which) > -1) { - var tile = $('.tile'); - - game.moveTile(tile, event.which); + var tiles = $('.tile'); + // console.log(event.which) + game.moveTile(tiles, event.which); } }); }); From 33b0edf830b434496a344e776edefec57a762365 Mon Sep 17 00:00:00 2001 From: Adriana Date: Tue, 5 Jul 2016 16:42:14 -0700 Subject: [PATCH 03/33] Added functionality so that tiles slide each time an arrow is pushed --- index.html | 2 ++ javascripts/2048.js | 22 ++++++++++++++++++++-- 2 files changed, 22 insertions(+), 2 deletions(-) diff --git a/index.html b/index.html index 0059ee6..b77a392 100644 --- a/index.html +++ b/index.html @@ -28,6 +28,8 @@
2
2
+
2
+ diff --git a/javascripts/2048.js b/javascripts/2048.js index f14956d..dc3f68b 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -7,9 +7,11 @@ Game.prototype.moveTile = function(tiles, direction) { switch(direction) { case 38: //up console.log('up'); + this.moveUp() break; case 40: //down console.log('down'); + this.moveDown() break; case 37: //left console.log('left'); @@ -17,13 +19,29 @@ Game.prototype.moveTile = function(tiles, direction) { break; case 39: //right console.log('right'); + this.moveRight() break; } }; Game.prototype.moveLeft = function(){ var tiles = $(".tile") - console.log(tiles.data("row")) + tiles.attr('data-col', 'c0') +}; + +Game.prototype.moveUp = function(){ + var tiles = $(".tile") + tiles.attr('data-row', 'r0') +}; + +Game.prototype.moveRight = function(){ + var tiles = $(".tile") + tiles.attr('data-col', 'c3') +}; + +Game.prototype.moveDown = function(){ + var tiles = $(".tile") + tiles.attr('data-row', 'r3') }; $(document).ready(function() { @@ -35,7 +53,7 @@ $(document).ready(function() { var arrows = [37, 38, 39, 40]; if (arrows.indexOf(event.which) > -1) { var tiles = $('.tile'); - // console.log(event.which) + // console.log(tiles) game.moveTile(tiles, event.which); } }); From aa3b23db1b126ea089f6b692a9231087fc27e32f Mon Sep 17 00:00:00 2001 From: Adriana Date: Tue, 5 Jul 2016 19:21:28 -0700 Subject: [PATCH 04/33] Made moves into one function --- index.html | 3 --- javascripts/2048.js | 32 +++++++++----------------------- 2 files changed, 9 insertions(+), 26 deletions(-) diff --git a/index.html b/index.html index b77a392..4740408 100644 --- a/index.html +++ b/index.html @@ -27,9 +27,6 @@
2
-
2
-
2
- diff --git a/javascripts/2048.js b/javascripts/2048.js index dc3f68b..fbea0b4 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -7,42 +7,28 @@ Game.prototype.moveTile = function(tiles, direction) { switch(direction) { case 38: //up console.log('up'); - this.moveUp() + this.moves("data-row", "r0") + // this.moveUp() break; case 40: //down console.log('down'); - this.moveDown() + this.moves("data-row", "r3") + // this.moveDown() break; case 37: //left console.log('left'); - this.moveLeft() + this.moves("data-col", "c0") break; case 39: //right console.log('right'); - this.moveRight() + this.moves("data-col", "c3") break; } }; -Game.prototype.moveLeft = function(){ - var tiles = $(".tile") - tiles.attr('data-col', 'c0') -}; - -Game.prototype.moveUp = function(){ - var tiles = $(".tile") - tiles.attr('data-row', 'r0') -}; - -Game.prototype.moveRight = function(){ - var tiles = $(".tile") - tiles.attr('data-col', 'c3') -}; - -Game.prototype.moveDown = function(){ - var tiles = $(".tile") - tiles.attr('data-row', 'r3') -}; +Game.prototype.moves = function (data, space) { + $(".tile").attr(data, space) +} $(document).ready(function() { console.log("ready to go!"); From c96384e976909e17c1b4466510e1f280a1c9be80 Mon Sep 17 00:00:00 2001 From: Adriana Date: Tue, 5 Jul 2016 20:41:20 -0700 Subject: [PATCH 05/33] Can add to the left only 2 tiles, all other tiles move to each side --- index.html | 4 +++- javascripts/2048.js | 43 +++++++++++++++++++++++++++++++++++++------ 2 files changed, 40 insertions(+), 7 deletions(-) diff --git a/index.html b/index.html index 4740408..f472d28 100644 --- a/index.html +++ b/index.html @@ -26,7 +26,9 @@
-
2
+
2
+
2
+
2
diff --git a/javascripts/2048.js b/javascripts/2048.js index fbea0b4..7c22f08 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -7,29 +7,60 @@ Game.prototype.moveTile = function(tiles, direction) { switch(direction) { case 38: //up console.log('up'); - this.moves("data-row", "r0") - // this.moveUp() + this.legit("up") + // this.moves("data-row", "r0") break; case 40: //down console.log('down'); - this.moves("data-row", "r3") - // this.moveDown() + this.legit("down") + // this.moves("data-row", "r3") break; case 37: //left console.log('left'); - this.moves("data-col", "c0") + this.legit("left") + // this.moves("data-col", "c0") break; case 39: //right console.log('right'); - this.moves("data-col", "c3") + this.legit("right") + // this.moves("data-col", "c3") break; } }; Game.prototype.moves = function (data, space) { + this.legit() $(".tile").attr(data, space) } +Game.prototype.legit = function (direction) { + // if left or right use rows + //if up or down use col + if (direction === "left") { + for (var row = 0; row < 4; row++) { + var current = $("div[data-row=r" + row + "]") + if (current.length && ($(current[0]).data("val") == $(current[1]).data("val"))) { //current.length is null check + var tile1 = $(current[0]) + var tile2 = $(current[1]) + var total = tile1.data("val") + tile2.data("val") + tile1.attr("data-val", total) + tile1.html(total) + tile2.remove() + current.attr("data-col", "c0") + } + } + } else if (direction === "right") { + $(".tile").attr("data-col", "c3") + + } else if (direction === "up") { + $(".tile").attr("data-row", "r0") + + } else if (direction === "down") { + $(".tile").attr("data-row", "r3") + + } +} + $(document).ready(function() { console.log("ready to go!"); // Any interactive jQuery functionality From d26c88bbffefee79c0b6d0cbb4cc359bfa6fbd5a Mon Sep 17 00:00:00 2001 From: Adriana Date: Wed, 6 Jul 2016 09:08:38 -0700 Subject: [PATCH 06/33] Added adding function and sliding for left --- index.html | 2 ++ javascripts/2048.js | 32 ++++++++++++++++++++------------ 2 files changed, 22 insertions(+), 12 deletions(-) diff --git a/index.html b/index.html index f472d28..383c819 100644 --- a/index.html +++ b/index.html @@ -27,8 +27,10 @@
2
+
2
2
2
+ diff --git a/javascripts/2048.js b/javascripts/2048.js index 7c22f08..9686762 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -28,9 +28,9 @@ Game.prototype.moveTile = function(tiles, direction) { } }; -Game.prototype.moves = function (data, space) { - this.legit() - $(".tile").attr(data, space) +Game.prototype.moveBoard = function (direction) { + // this.legit() + // $(".tile").attr(data, space) } Game.prototype.legit = function (direction) { @@ -39,15 +39,22 @@ Game.prototype.legit = function (direction) { if (direction === "left") { for (var row = 0; row < 4; row++) { var current = $("div[data-row=r" + row + "]") - if (current.length && ($(current[0]).data("val") == $(current[1]).data("val"))) { //current.length is null check - var tile1 = $(current[0]) - var tile2 = $(current[1]) - var total = tile1.data("val") + tile2.data("val") - tile1.attr("data-val", total) - tile1.html(total) - tile2.remove() - current.attr("data-col", "c0") - } + console.log(current); + current.each(function (key, value) { + if (current[key + 1]) { // edge case, if next thing is not null, go on + console.log($(value).data("val")); + console.log($(current[key + 1]).data("val")); + var curr = $(value) + var next = $(current[key + 1]) + if (curr.data("val") === next.data("val")) { + var total = curr.data("val") + next.data("val") + curr.attr("data-val", total).html(total) + next.attr("data-col", curr.data("col")) + next.remove() + current.splice([key + 1], 1) + } + } + }) } } else if (direction === "right") { $(".tile").attr("data-col", "c3") @@ -59,6 +66,7 @@ Game.prototype.legit = function (direction) { $(".tile").attr("data-row", "r3") } + this.moveBoard(direction) } $(document).ready(function() { From 448f326b70dfe1ce5fac74797be9e675d1a37220 Mon Sep 17 00:00:00 2001 From: Adriana Date: Wed, 6 Jul 2016 09:57:59 -0700 Subject: [PATCH 07/33] troubleshooting adding --- javascripts/2048.js | 21 ++++++++++++++------- 1 file changed, 14 insertions(+), 7 deletions(-) diff --git a/javascripts/2048.js b/javascripts/2048.js index 9686762..2d21785 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -39,22 +39,29 @@ Game.prototype.legit = function (direction) { if (direction === "left") { for (var row = 0; row < 4; row++) { var current = $("div[data-row=r" + row + "]") + console.log(current); - current.each(function (key, value) { - if (current[key + 1]) { // edge case, if next thing is not null, go on - console.log($(value).data("val")); - console.log($(current[key + 1]).data("val")); - var curr = $(value) - var next = $(current[key + 1]) + + current.each(function (i, val) { + if (current[i + 1]) { // edge case, if next thing is not null, go on + + console.log($(val).data("val")); + + console.log($(current[i + 1]).data("val")); + + var curr = $(val) + var next = $(current[i + 1]) if (curr.data("val") === next.data("val")) { var total = curr.data("val") + next.data("val") curr.attr("data-val", total).html(total) next.attr("data-col", curr.data("col")) next.remove() - current.splice([key + 1], 1) + current.splice([i + 1], 1) } } }) + console.log("this is the current"); + console.log(current); } } else if (direction === "right") { $(".tile").attr("data-col", "c3") From 42b634a1ae51e85c696894a34747d5ed953da984 Mon Sep 17 00:00:00 2001 From: Adriana Date: Wed, 6 Jul 2016 11:33:29 -0700 Subject: [PATCH 08/33] Used attr instead of data because data caches results --- javascripts/2048.js | 13 +++---------- 1 file changed, 3 insertions(+), 10 deletions(-) diff --git a/javascripts/2048.js b/javascripts/2048.js index 2d21785..faf29d8 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -40,19 +40,14 @@ Game.prototype.legit = function (direction) { for (var row = 0; row < 4; row++) { var current = $("div[data-row=r" + row + "]") - console.log(current); + // console.log(current); current.each(function (i, val) { if (current[i + 1]) { // edge case, if next thing is not null, go on - - console.log($(val).data("val")); - - console.log($(current[i + 1]).data("val")); - var curr = $(val) var next = $(current[i + 1]) - if (curr.data("val") === next.data("val")) { - var total = curr.data("val") + next.data("val") + if (curr.attr("data-val") === next.attr("data-val")) { + var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) curr.attr("data-val", total).html(total) next.attr("data-col", curr.data("col")) next.remove() @@ -60,8 +55,6 @@ Game.prototype.legit = function (direction) { } } }) - console.log("this is the current"); - console.log(current); } } else if (direction === "right") { $(".tile").attr("data-col", "c3") From b3574695cfff675f671c998d43791e6bacd41c44 Mon Sep 17 00:00:00 2001 From: Adriana Date: Wed, 6 Jul 2016 11:33:38 -0700 Subject: [PATCH 09/33] Cleaned up code --- javascripts/2048.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/javascripts/2048.js b/javascripts/2048.js index faf29d8..2e42172 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -49,7 +49,7 @@ Game.prototype.legit = function (direction) { if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) curr.attr("data-val", total).html(total) - next.attr("data-col", curr.data("col")) + next.attr("data-col", curr.attr("data-col")) next.remove() current.splice([i + 1], 1) } From 74600e97eca433cd032ab32b3d9a12a3210ddb0f Mon Sep 17 00:00:00 2001 From: Adriana Date: Wed, 6 Jul 2016 12:57:43 -0700 Subject: [PATCH 10/33] Cleaned up code --- javascripts/2048.js | 8 -------- 1 file changed, 8 deletions(-) diff --git a/javascripts/2048.js b/javascripts/2048.js index 2e42172..8d86dda 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -8,22 +8,18 @@ Game.prototype.moveTile = function(tiles, direction) { case 38: //up console.log('up'); this.legit("up") - // this.moves("data-row", "r0") break; case 40: //down console.log('down'); this.legit("down") - // this.moves("data-row", "r3") break; case 37: //left console.log('left'); this.legit("left") - // this.moves("data-col", "c0") break; case 39: //right console.log('right'); this.legit("right") - // this.moves("data-col", "c3") break; } }; @@ -39,9 +35,6 @@ Game.prototype.legit = function (direction) { if (direction === "left") { for (var row = 0; row < 4; row++) { var current = $("div[data-row=r" + row + "]") - - // console.log(current); - current.each(function (i, val) { if (current[i + 1]) { // edge case, if next thing is not null, go on var curr = $(val) @@ -78,7 +71,6 @@ $(document).ready(function() { var arrows = [37, 38, 39, 40]; if (arrows.indexOf(event.which) > -1) { var tiles = $('.tile'); - // console.log(tiles) game.moveTile(tiles, event.which); } }); From dcf29b8b6b1e921ac27856a7f3eea09ead8cb426 Mon Sep 17 00:00:00 2001 From: Adriana Date: Wed, 6 Jul 2016 13:28:34 -0700 Subject: [PATCH 11/33] Added a timeout function so slide happened --- javascripts/2048.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/javascripts/2048.js b/javascripts/2048.js index 8d86dda..bdff59d 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -29,9 +29,7 @@ Game.prototype.moveBoard = function (direction) { // $(".tile").attr(data, space) } -Game.prototype.legit = function (direction) { - // if left or right use rows - //if up or down use col +Game.prototype.legit = function (direction) { // if left or right use rows || if up or down use col if (direction === "left") { for (var row = 0; row < 4; row++) { var current = $("div[data-row=r" + row + "]") @@ -41,9 +39,11 @@ Game.prototype.legit = function (direction) { var next = $(current[i + 1]) if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) - curr.attr("data-val", total).html(total) next.attr("data-col", curr.attr("data-col")) - next.remove() + setTimeout(function () { + curr.attr("data-val", total).html(total) + next.remove() + }, 150) current.splice([i + 1], 1) } } From 2740b96800fb328e7671c130c05a23cdf9331f3e Mon Sep 17 00:00:00 2001 From: Adriana Date: Wed, 6 Jul 2016 14:51:40 -0700 Subject: [PATCH 12/33] slowed down process to see all, added a move tile function so all tiles are in the correct area --- javascripts/2048.js | 19 ++++++++++++++++--- stylesheets/2048.css | 2 +- 2 files changed, 17 insertions(+), 4 deletions(-) diff --git a/javascripts/2048.js b/javascripts/2048.js index bdff59d..e815d1c 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -25,11 +25,14 @@ Game.prototype.moveTile = function(tiles, direction) { }; Game.prototype.moveBoard = function (direction) { - // this.legit() - // $(".tile").attr(data, space) + if (direction === "left") { + + } } Game.prototype.legit = function (direction) { // if left or right use rows || if up or down use col + + if (direction === "left") { for (var row = 0; row < 4; row++) { var current = $("div[data-row=r" + row + "]") @@ -43,12 +46,22 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i setTimeout(function () { curr.attr("data-val", total).html(total) next.remove() - }, 150) + }, 925) current.splice([i + 1], 1) } } }) + if (current.length > 0) { + console.log("i'm in"); + for (var j = 0; j < current.length; j++) { + var space = $(current[j]) + console.log(space); + space.attr("data-col", "c" + j) + } + } } + + } else if (direction === "right") { $(".tile").attr("data-col", "c3") diff --git a/stylesheets/2048.css b/stylesheets/2048.css index 2a46a94..bde07d3 100644 --- a/stylesheets/2048.css +++ b/stylesheets/2048.css @@ -23,7 +23,7 @@ html { .tile { position: absolute; top: 0; left: 0; - transition: all 0.2s ease-in-out; + transition: all 1s ease-in-out; color: #f9f6f2; background: #000; From 61b5461112ccc5d731cc2041a36e77199dbe8ee3 Mon Sep 17 00:00:00 2001 From: Adriana Date: Wed, 6 Jul 2016 15:08:01 -0700 Subject: [PATCH 13/33] Added extra tiles to test how the tiles combine --- index.html | 15 +++++++++++++++ javascripts/2048.js | 2 -- 2 files changed, 15 insertions(+), 2 deletions(-) diff --git a/index.html b/index.html index 383c819..26556ee 100644 --- a/index.html +++ b/index.html @@ -31,6 +31,21 @@
2
2
+
2
+
2
+
2
+
2
+ +
2
+
2
+
2
+
2
+ +
2
+
2
+
2
+
2
+ diff --git a/javascripts/2048.js b/javascripts/2048.js index e815d1c..3b364c7 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -52,10 +52,8 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } }) if (current.length > 0) { - console.log("i'm in"); for (var j = 0; j < current.length; j++) { var space = $(current[j]) - console.log(space); space.attr("data-col", "c" + j) } } From eea0d7fd378c34221ea2dea5bdb5eaebd1b24350 Mon Sep 17 00:00:00 2001 From: Nadine Curry Date: Wed, 6 Jul 2016 16:28:36 -0700 Subject: [PATCH 14/33] add tiles almost working --- javascripts/2048.js | 25 +++++++++++++++++++++++++ 1 file changed, 25 insertions(+) diff --git a/javascripts/2048.js b/javascripts/2048.js index bdff59d..d12fc1c 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -16,10 +16,12 @@ Game.prototype.moveTile = function(tiles, direction) { case 37: //left console.log('left'); this.legit("left") + this.addTile() break; case 39: //right console.log('right'); this.legit("right") + // this.addTile() break; } }; @@ -29,6 +31,29 @@ Game.prototype.moveBoard = function (direction) { // $(".tile").attr(data, space) } +Game.prototype.addTile = function () { + var rows = ["r0", "r1", "r2", "r3"] + var columns = ["c0", "c1", "c2", "c3"] + var random = [rows[Math.floor(Math.random() * rows.length)], columns[Math.floor(Math.random() * columns.length)]] + while (status) { + var status = true + var check = $("div[data-row=" + random[0] + "]") + check.each(function (index, value) { + current = $(value) + if (current.attr("data-col") === random[1]){ + status = false + random = [Math.floor(Math.random() * rows.length), Math.floor(Math.random() * columns.length)] + } + }) + } + var thing = $(".tile").clone("
") + console.log(random, "yeah", thing) + thing.attr("data-row", random[0]) + thing.attr("data-col", random[1]) + thing.attr("data-val", "2").html("2") + console.log(thing, "YAAAAY") +} + Game.prototype.legit = function (direction) { // if left or right use rows || if up or down use col if (direction === "left") { for (var row = 0; row < 4; row++) { From afed6dc920c919bf75a7ca6df52aad8a220b7a87 Mon Sep 17 00:00:00 2001 From: Adriana Date: Wed, 6 Jul 2016 16:29:51 -0700 Subject: [PATCH 15/33] Added more tiles for testing --- index.html | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/index.html b/index.html index 26556ee..9572d20 100644 --- a/index.html +++ b/index.html @@ -26,23 +26,24 @@
-
2
+ +
4
2
2
2
2
-
2
+
8
2
2
2
2
-
2
+
16
2
-
2
-
2
+
4
+
8
2
2
From 7fdf04f95ff1b5c37d0a61f593cab84502585d61 Mon Sep 17 00:00:00 2001 From: Adriana Date: Wed, 6 Jul 2016 21:04:07 -0700 Subject: [PATCH 16/33] adding tiles function --- javascripts/2048.js | 76 +++++++++++++++++++++++++++++---------------- 1 file changed, 49 insertions(+), 27 deletions(-) diff --git a/javascripts/2048.js b/javascripts/2048.js index 8810610..8c0a60e 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -16,7 +16,7 @@ Game.prototype.moveTile = function(tiles, direction) { case 37: //left console.log('left'); this.legit("left") - this.addTile() + // this.addTile() break; case 39: //right console.log('right'); @@ -32,35 +32,34 @@ Game.prototype.moveBoard = function (direction) { } } -Game.prototype.addTile = function () { - var rows = ["r0", "r1", "r2", "r3"] - var columns = ["c0", "c1", "c2", "c3"] - var random = [rows[Math.floor(Math.random() * rows.length)], columns[Math.floor(Math.random() * columns.length)]] - while (status) { - var status = true - var check = $("div[data-row=" + random[0] + "]") - check.each(function (index, value) { - current = $(value) - if (current.attr("data-col") === random[1]){ - status = false - random = [Math.floor(Math.random() * rows.length), Math.floor(Math.random() * columns.length)] - } - }) - } - var thing = $(".tile").clone("
") - console.log(random, "yeah", thing) - thing.attr("data-row", random[0]) - thing.attr("data-col", random[1]) - thing.attr("data-val", "2").html("2") - console.log(thing, "YAAAAY") -} +// Game.prototype.addTile = function () { +// var rows = ["r0", "r1", "r2", "r3"] +// var columns = ["c0", "c1", "c2", "c3"] +// var random = [rows[Math.floor(Math.random() * rows.length)], columns[Math.floor(Math.random() * columns.length)]] +// while (status) { +// var status = true +// var check = $("div[data-row=" + random[0] + "]") +// check.each(function (index, value) { +// current = $(value) +// if (current.attr("data-col") === random[1]){ +// status = false +// random = [Math.floor(Math.random() * rows.length), Math.floor(Math.random() * columns.length)] +// } +// }) +// } +// var thing = $(".tile").clone("
") +// console.log(random, "yeah", thing) +// thing.attr("data-row", random[0]) +// thing.attr("data-col", random[1]) +// thing.attr("data-val", "2").html("2") +// console.log(thing, "YAAAAY") +// } Game.prototype.legit = function (direction) { // if left or right use rows || if up or down use col - - if (direction === "left") { for (var row = 0; row < 4; row++) { var current = $("div[data-row=r" + row + "]") + console.log(current); current.each(function (i, val) { if (current[i + 1]) { // edge case, if next thing is not null, go on var curr = $(val) @@ -84,9 +83,32 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } } - } else if (direction === "right") { - $(".tile").attr("data-col", "c3") + for (var row = 3; row > 0; row--) { + var current = $("div[data-row=r" + row + "]") + current.each(function (i, val) { + if (current[i + 1]) { // edge case, if next thing is not null, go on + var curr = $(val) + console.log(curr); + var next = $(current[i + 1]) + if (curr.attr("data-val") === next.attr("data-val")) { + var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) + next.attr("data-col", curr.attr("data-col")) + setTimeout(function () { + curr.attr("data-val", total).html(total) + next.remove() + }, 925) + current.splice([i + 1], 1) + } + } + }) + if (current.length > 0) { + for (var j = 0; j < current.length; j++) { + var space = $(current[j]) + space.attr("data-col", "c" + j) + } + } + } } else if (direction === "up") { $(".tile").attr("data-row", "r0") From cce5f3e4a336923f2dec7f33dda110e0fa4a8719 Mon Sep 17 00:00:00 2001 From: Nadine Curry Date: Thu, 7 Jul 2016 10:36:43 -0700 Subject: [PATCH 17/33] test --- index.html | 2 +- javascripts/2048.js | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index 9572d20..c845098 100644 --- a/index.html +++ b/index.html @@ -26,7 +26,7 @@
- +
4
2
2
diff --git a/javascripts/2048.js b/javascripts/2048.js index 8810610..9ed2584 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -36,7 +36,7 @@ Game.prototype.addTile = function () { var rows = ["r0", "r1", "r2", "r3"] var columns = ["c0", "c1", "c2", "c3"] var random = [rows[Math.floor(Math.random() * rows.length)], columns[Math.floor(Math.random() * columns.length)]] - while (status) { + while (newTile === null) { var status = true var check = $("div[data-row=" + random[0] + "]") check.each(function (index, value) { @@ -47,7 +47,7 @@ Game.prototype.addTile = function () { } }) } - var thing = $(".tile").clone("
") + var thing = $(".cells").after("
") console.log(random, "yeah", thing) thing.attr("data-row", random[0]) thing.attr("data-col", random[1]) From 8a5d9fb8ce8b8563d78088403f4795658e72de9f Mon Sep 17 00:00:00 2001 From: Adriana Date: Thu, 7 Jul 2016 15:35:28 -0700 Subject: [PATCH 18/33] Added move tiles to the right --- index.html | 14 +++++++------- javascripts/2048.js | 29 ++++++++++++++++------------- 2 files changed, 23 insertions(+), 20 deletions(-) diff --git a/index.html b/index.html index 9572d20..4ec2186 100644 --- a/index.html +++ b/index.html @@ -26,13 +26,13 @@
- -
4
-
2
-
2
-
2
-
2
+
2
+
2
+
2
+
2
+ + diff --git a/javascripts/2048.js b/javascripts/2048.js index 8c0a60e..a1588f3 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -59,11 +59,11 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i if (direction === "left") { for (var row = 0; row < 4; row++) { var current = $("div[data-row=r" + row + "]") - console.log(current); current.each(function (i, val) { if (current[i + 1]) { // edge case, if next thing is not null, go on var curr = $(val) var next = $(current[i + 1]) + console.log(current); if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) next.attr("data-col", curr.attr("data-col")) @@ -84,28 +84,31 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } } else if (direction === "right") { - for (var row = 3; row > 0; row--) { + for (var row = 0; row < 4; row++) { var current = $("div[data-row=r" + row + "]") - current.each(function (i, val) { - if (current[i + 1]) { // edge case, if next thing is not null, go on - var curr = $(val) - console.log(curr); - var next = $(current[i + 1]) + var length = current.length - 1 + for (var i = length; i >= 0; i--) { + if (current[i - 1]) { + var curr = $(current[i]) + var next = $(current[i - 1]) if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) next.attr("data-col", curr.attr("data-col")) - setTimeout(function () { + // setTimeout(function () { curr.attr("data-val", total).html(total) next.remove() - }, 925) - current.splice([i + 1], 1) + // }, 925) + current.splice([i - 1], 1) } } - }) + } if (current.length > 0) { - for (var j = 0; j < current.length; j++) { + var k = 3 + console.log(current.length); + for (var j = current.length - 1; j >= 0; j--) { var space = $(current[j]) - space.attr("data-col", "c" + j) + space.attr("data-col", "c" + k) + k-- } } } From 37bfbc293bbeebcc42755609e1f68b3e6c0bc9af Mon Sep 17 00:00:00 2001 From: Nadine Curry Date: Thu, 7 Jul 2016 15:36:26 -0700 Subject: [PATCH 19/33] functionality for adding tiles --- index.html | 16 ++++++++-------- javascripts/2048.js | 38 +++++++++++++++++++++----------------- 2 files changed, 29 insertions(+), 25 deletions(-) diff --git a/index.html b/index.html index c845098..d8db938 100644 --- a/index.html +++ b/index.html @@ -28,24 +28,24 @@
4
-
2
+ -
2
+
2
-
2
-
16
+
2
-
4
+ diff --git a/javascripts/2048.js b/javascripts/2048.js index 8a82c89..172f177 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -8,20 +8,22 @@ Game.prototype.moveTile = function(tiles, direction) { case 38: //up console.log('up'); this.legit("up") + this.addTile() break; case 40: //down console.log('down'); this.legit("down") + this.addTile() break; case 37: //left console.log('left'); this.legit("left") - // this.addTile() + this.addTile() break; case 39: //right console.log('right'); this.legit("right") - // this.addTile() + this.addTile() break; } }; @@ -34,26 +36,28 @@ Game.prototype.moveBoard = function (direction) { Game.prototype.addTile = function () { + var tiles = $(".tile") var rows = ["r0", "r1", "r2", "r3"] var columns = ["c0", "c1", "c2", "c3"] + var value = [2,4] + var randValue= value[Math.floor(Math.random() * value.length)] + var newTile = null var random = [rows[Math.floor(Math.random() * rows.length)], columns[Math.floor(Math.random() * columns.length)]] while (newTile === null) { - var status = true - var check = $("div[data-row=" + random[0] + "]") - check.each(function (index, value) { - current = $(value) - if (current.attr("data-col") === random[1]){ - status = false - random = [Math.floor(Math.random() * rows.length), Math.floor(Math.random() * columns.length)] + tiles.each(function(index, val){ + if ($(val).attr("data-row") === random[0] && $(val).attr("data-col")){ + random = [rows[Math.floor(Math.random() * rows.length)], columns[Math.floor(Math.random() * columns.length)]] + console.log("match", newTile) + newTile = null + } else { + newTile = $("
", {class: "tile", "data-row":random[0], "data-col":random[1], "data-val":randValue, text: randValue}) } }) } - var thing = $(".cells").after("
") - console.log(random, "yeah", thing) - thing.attr("data-row", random[0]) - thing.attr("data-col", random[1]) - thing.attr("data-val", "2").html("2") - console.log(thing, "YAAAAY") + console.log(newTile,"YAAY") + $(".cells").after(newTile) + console.log(randValue) + newTile = null } @@ -61,7 +65,7 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i if (direction === "left") { for (var row = 0; row < 4; row++) { var current = $("div[data-row=r" + row + "]") - console.log(current); + // console.log(current); current.each(function (i, val) { if (current[i + 1]) { // edge case, if next thing is not null, go on var curr = $(val) @@ -91,7 +95,7 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i current.each(function (i, val) { if (current[i + 1]) { // edge case, if next thing is not null, go on var curr = $(val) - console.log(curr); + // console.log(curr); var next = $(current[i + 1]) if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) From cc991607c8df3b697c9b4c36075c4312be3b77ba Mon Sep 17 00:00:00 2001 From: Adriana Date: Thu, 7 Jul 2016 15:53:40 -0700 Subject: [PATCH 20/33] Added functionality for moving left and right --- index.html | 29 ++++++++++------------------- javascripts/2048.js | 15 +++++++-------- 2 files changed, 17 insertions(+), 27 deletions(-) diff --git a/index.html b/index.html index c3a236b..d1b0e8b 100644 --- a/index.html +++ b/index.html @@ -26,7 +26,6 @@
-<<<<<<< HEAD
2
2
@@ -34,28 +33,20 @@
2
- - +
2
+ +
2
+
2
+
2
+
2
2
- -
2
+
2
+
2
+
2
--> - diff --git a/javascripts/2048.js b/javascripts/2048.js index c10d90a..c867708 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -18,20 +18,16 @@ Game.prototype.moveTile = function(tiles, direction) { case 37: //left console.log('left'); this.legit("left") - this.addTile() + // this.addTile() break; case 39: //right console.log('right'); this.legit("right") - this.addTile() + // this.addTile() break; } }; -Game.prototype.moveBoard = function (direction) { -} - - Game.prototype.addTile = function () { var tiles = $(".tile") var rows = ["r0", "r1", "r2", "r3"] @@ -42,7 +38,7 @@ Game.prototype.addTile = function () { var random = [rows[Math.floor(Math.random() * rows.length)], columns[Math.floor(Math.random() * columns.length)]] while (newTile === null) { tiles.each(function(index, val){ - if ($(val).attr("data-row") === random[0] && $(val).attr("data-col")){ + if ($(val).attr("data-row") === random[0] && $(val).attr("data-col") === random[1]){ random = [rows[Math.floor(Math.random() * rows.length)], columns[Math.floor(Math.random() * columns.length)]] console.log("match", newTile) newTile = null @@ -85,6 +81,7 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } } } + this.addTile() } else if (direction === "right") { for (var row = 0; row < 4; row++) { @@ -115,6 +112,9 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } } } + // setTimeout(function () { + this.addTile() + // }, 925) } else if (direction === "up") { $(".tile").attr("data-row", "r0") @@ -123,7 +123,6 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i $(".tile").attr("data-row", "r3") } - this.moveBoard(direction) } $(document).ready(function() { From a9ee06fbfd533fb6154069123a85ad524fb47dba Mon Sep 17 00:00:00 2001 From: Nadine Curry Date: Thu, 7 Jul 2016 16:24:39 -0700 Subject: [PATCH 21/33] added title and score line --- index.html | 2 ++ 1 file changed, 2 insertions(+) diff --git a/index.html b/index.html index d1b0e8b..74f549e 100644 --- a/index.html +++ b/index.html @@ -7,6 +7,8 @@ +

2048

+

Your Score is: 0

From 5ef2590e40fa7382918ed4367e48d426fd89af72 Mon Sep 17 00:00:00 2001 From: Nadine Curry Date: Thu, 7 Jul 2016 16:25:15 -0700 Subject: [PATCH 22/33] made scoring prototype to add points. It's inserted in legit --- javascripts/2048.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/javascripts/2048.js b/javascripts/2048.js index c867708..0c22881 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -1,5 +1,6 @@ var Game = function() { // Game logic and initialization here + this.score = 0 }; Game.prototype.moveTile = function(tiles, direction) { @@ -55,6 +56,7 @@ Game.prototype.addTile = function () { Game.prototype.legit = function (direction) { // if left or right use rows || if up or down use col + var self = this if (direction === "left") { for (var row = 0; row < 4; row++) { var current = $("div[data-row=r" + row + "]") @@ -66,6 +68,7 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) next.attr("data-col", curr.attr("data-col")) + self.scoring(total) setTimeout(function () { curr.attr("data-val", total).html(total) next.remove() @@ -93,6 +96,7 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i var next = $(current[i - 1]) if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) + self.scoring(total) next.attr("data-col", curr.attr("data-col")) // setTimeout(function () { curr.attr("data-val", total).html(total) @@ -125,6 +129,12 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } } +Game.prototype.scoring = function(value){ + console.log("in it") + this.score += value + $("p").text('Your Score is:'+this.score) +} + $(document).ready(function() { console.log("ready to go!"); // Any interactive jQuery functionality From 47ae26ab0a169597e73a4d8cd53f2d3961a2cbdf Mon Sep 17 00:00:00 2001 From: Nadine Curry Date: Thu, 7 Jul 2016 16:25:32 -0700 Subject: [PATCH 23/33] styling for ttitle --- stylesheets/2048.css | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/stylesheets/2048.css b/stylesheets/2048.css index bde07d3..d10e4ac 100644 --- a/stylesheets/2048.css +++ b/stylesheets/2048.css @@ -59,3 +59,9 @@ html { .tile[data-val="512"] { background: #edc850; } .tile[data-val="1024"] { background: #edc53f; } .tile[data-val="2048"] { background: #edc22e; } + +h1 { + color: #776e65; + font-weight: bold; + margin-left: 30%; +} From 9cee9bf83eaef6a15d7ece4a4d6c098914ccfbb4 Mon Sep 17 00:00:00 2001 From: Adriana Date: Fri, 8 Jul 2016 10:34:04 -0700 Subject: [PATCH 24/33] Added up down functionality --- index.html | 4 +-- javascripts/2048.js | 71 ++++++++++++++++++++++++++++++++++++++------- 2 files changed, 63 insertions(+), 12 deletions(-) diff --git a/index.html b/index.html index d1b0e8b..b43715c 100644 --- a/index.html +++ b/index.html @@ -32,7 +32,7 @@
2
2
- +
2
diff --git a/javascripts/2048.js b/javascripts/2048.js index c867708..72c9dd9 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -8,12 +8,12 @@ Game.prototype.moveTile = function(tiles, direction) { case 38: //up console.log('up'); this.legit("up") - this.addTile() + // this.addTile() break; case 40: //down console.log('down'); this.legit("down") - this.addTile() + // this.addTile() break; case 37: //left console.log('left'); @@ -66,10 +66,10 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) next.attr("data-col", curr.attr("data-col")) - setTimeout(function () { + // setTimeout(function () { curr.attr("data-val", total).html(total) next.remove() - }, 925) + // }, 925) current.splice([i + 1], 1) } } @@ -81,7 +81,7 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } } } - this.addTile() + // this.addTile() } else if (direction === "right") { for (var row = 0; row < 4; row++) { @@ -112,15 +112,66 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } } } - // setTimeout(function () { - this.addTile() - // }, 925) + // this.addTile() } else if (direction === "up") { - $(".tile").attr("data-row", "r0") + for (var col = 0; col < 4; col++) { + var current = $("div[data-col=c" + col + "]") + current.each(function (i, val) { + if (current[i + 1]) { // edge case, if next thing is not null, go on + var curr = $(val) + var next = $(current[i + 1]) + console.log(current); + if (curr.attr("data-val") === next.attr("data-val")) { + var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) + next.attr("data-row", curr.attr("data-row")) + // setTimeout(function () { + curr.attr("data-val", total).html(total) + next.remove() + // }, 925) + current.splice([i + 1], 1) + } + } + }) + if (current.length > 0) { + for (var j = 0; j < current.length; j++) { + var space = $(current[j]) + space.attr("data-row", "r" + j) + } + } + } + // this.addTile() } else if (direction === "down") { - $(".tile").attr("data-row", "r3") + for (var col = 0; col < 4; col++) { + var current = $("div[data-col=c" + col + "]") + var length = current.length - 1 + for (var i = length; i >= 0; i--) { + if (current[i - 1]) { + var curr = $(current[i]) + var next = $(current[i - 1]) + if (curr.attr("data-val") === next.attr("data-val")) { + var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) + next.attr("data-row", curr.attr("data-row")) + // setTimeout(function () { + curr.attr("data-val", total).html(total) + next.remove() + // }, 925) + current.splice([i - 1], 1) + } + } + } + if (current.length > 0) { + var k = 3 + console.log(current.length); + for (var j = current.length - 1; j >= 0; j--) { + var space = $(current[j]) + space.attr("data-row", "r" + k) + k-- + } + } + } + // this.addTile() } } From e96b51667190f57a85fb1819d06c7b71ad3b6eb7 Mon Sep 17 00:00:00 2001 From: Nadine Curry Date: Fri, 8 Jul 2016 10:34:15 -0700 Subject: [PATCH 25/33] deleted console.log --- javascripts/2048.js | 1 - 1 file changed, 1 deletion(-) diff --git a/javascripts/2048.js b/javascripts/2048.js index 0c22881..61df772 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -130,7 +130,6 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } Game.prototype.scoring = function(value){ - console.log("in it") this.score += value $("p").text('Your Score is:'+this.score) } From 2b5b1ae73968c4c2e110cde4e2f91fbba780ef7b Mon Sep 17 00:00:00 2001 From: Adriana Date: Fri, 8 Jul 2016 10:54:26 -0700 Subject: [PATCH 26/33] refactored code for all tile movements. tested --- index.html | 33 ++++++++++++++++----------------- javascripts/2048.js | 22 ++++++++++++++-------- 2 files changed, 30 insertions(+), 25 deletions(-) diff --git a/index.html b/index.html index b43715c..5680801 100644 --- a/index.html +++ b/index.html @@ -27,26 +27,25 @@
-
2
-
2
-
2
-
2
- -
2
-
2
-
2
-
2
+
2
+
2
+ -
2
-
2
-
2
-
2
+ diff --git a/javascripts/2048.js b/javascripts/2048.js index 72c9dd9..60f85aa 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -58,9 +58,11 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i if (direction === "left") { for (var row = 0; row < 4; row++) { var current = $("div[data-row=r" + row + "]") - current.each(function (i, val) { + var length = current.length - 1 + + for (var i = 0; i < length; i++) { if (current[i + 1]) { // edge case, if next thing is not null, go on - var curr = $(val) + var curr = $(current[i]) var next = $(current[i + 1]) console.log(current); if (curr.attr("data-val") === next.attr("data-val")) { @@ -73,7 +75,7 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i current.splice([i + 1], 1) } } - }) + } if (current.length > 0) { for (var j = 0; j < current.length; j++) { var space = $(current[j]) @@ -117,9 +119,11 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } else if (direction === "up") { for (var col = 0; col < 4; col++) { var current = $("div[data-col=c" + col + "]") - current.each(function (i, val) { - if (current[i + 1]) { // edge case, if next thing is not null, go on - var curr = $(val) + var length = current.length - 1 + for (var i = 0; i < length; i++) { + // current.each(function (i, val) { + if (current[i + 1]) { + var curr = $(current[i]) var next = $(current[i + 1]) console.log(current); if (curr.attr("data-val") === next.attr("data-val")) { @@ -132,7 +136,7 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i current.splice([i + 1], 1) } } - }) + } if (current.length > 0) { for (var j = 0; j < current.length; j++) { var space = $(current[j]) @@ -149,7 +153,9 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i for (var i = length; i >= 0; i--) { if (current[i - 1]) { var curr = $(current[i]) + console.log("curr ", curr); var next = $(current[i - 1]) + console.log("next ", next); if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) next.attr("data-row", curr.attr("data-row")) @@ -163,7 +169,7 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } if (current.length > 0) { var k = 3 - console.log(current.length); + // console.log(current.length); for (var j = current.length - 1; j >= 0; j--) { var space = $(current[j]) space.attr("data-row", "r" + k) From 77084daf724dc0754a1feb5fd32f4d944545b98d Mon Sep 17 00:00:00 2001 From: Adriana Date: Fri, 8 Jul 2016 11:15:32 -0700 Subject: [PATCH 27/33] working on adding a tile --- javascripts/2048.js | 1 + 1 file changed, 1 insertion(+) diff --git a/javascripts/2048.js b/javascripts/2048.js index 60f85aa..b856ddc 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -180,6 +180,7 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i // this.addTile() } + this.addTile() } $(document).ready(function() { From 8657aa9741e481ab7b1129bdb64cc35577849691 Mon Sep 17 00:00:00 2001 From: Adriana Date: Fri, 8 Jul 2016 11:24:22 -0700 Subject: [PATCH 28/33] Cleaned up code --- javascripts/2048.js | 26 ++------------------------ 1 file changed, 2 insertions(+), 24 deletions(-) diff --git a/javascripts/2048.js b/javascripts/2048.js index 56b7bbf..2184518 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -1,30 +1,24 @@ var Game = function() { - // Game logic and initialization here this.score = 0 }; Game.prototype.moveTile = function(tiles, direction) { - // Game method here switch(direction) { case 38: //up console.log('up'); this.legit("up") - // this.addTile() break; case 40: //down console.log('down'); this.legit("down") - // this.addTile() break; case 37: //left console.log('left'); this.legit("left") - // this.addTile() break; case 39: //right console.log('right'); this.legit("right") - // this.addTile() break; } }; @@ -41,16 +35,13 @@ Game.prototype.addTile = function () { tiles.each(function(index, val){ if ($(val).attr("data-row") === random[0] && $(val).attr("data-col") === random[1]){ random = [rows[Math.floor(Math.random() * rows.length)], columns[Math.floor(Math.random() * columns.length)]] - console.log("match", newTile) newTile = null } else { newTile = $("
", {class: "tile", "data-row":random[0], "data-col":random[1], "data-val":randValue, text: randValue}) } }) } - console.log(newTile,"YAAY") $(".cells").after(newTile) - console.log(randValue) newTile = null } @@ -66,7 +57,6 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i if (current[i + 1]) { // edge case, if next thing is not null, go on var curr = $(current[i]) var next = $(current[i + 1]) - console.log(current); if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) next.attr("data-col", curr.attr("data-col")) @@ -86,8 +76,6 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } } } - // this.addTile() - } else if (direction === "right") { for (var row = 0; row < 4; row++) { var current = $("div[data-row=r" + row + "]") @@ -110,7 +98,6 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } if (current.length > 0) { var k = 3 - console.log(current.length); for (var j = current.length - 1; j >= 0; j--) { var space = $(current[j]) space.attr("data-col", "c" + k) @@ -118,8 +105,6 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } } } - // this.addTile() - } else if (direction === "up") { for (var col = 0; col < 4; col++) { var current = $("div[data-col=c" + col + "]") @@ -129,9 +114,9 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i if (current[i + 1]) { var curr = $(current[i]) var next = $(current[i + 1]) - console.log(current); if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) + self.scoring(total) next.attr("data-row", curr.attr("data-row")) // setTimeout(function () { curr.attr("data-val", total).html(total) @@ -148,8 +133,6 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } } } - // this.addTile() - } else if (direction === "down") { for (var col = 0; col < 4; col++) { var current = $("div[data-col=c" + col + "]") @@ -157,11 +140,10 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i for (var i = length; i >= 0; i--) { if (current[i - 1]) { var curr = $(current[i]) - console.log("curr ", curr); var next = $(current[i - 1]) - console.log("next ", next); if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) + self.scoring(total) next.attr("data-row", curr.attr("data-row")) // setTimeout(function () { curr.attr("data-val", total).html(total) @@ -173,7 +155,6 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } if (current.length > 0) { var k = 3 - // console.log(current.length); for (var j = current.length - 1; j >= 0; j--) { var space = $(current[j]) space.attr("data-row", "r" + k) @@ -181,14 +162,11 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i } } } - // this.addTile() - } this.addTile() } Game.prototype.scoring = function(value){ - console.log("in it") this.score += value $("p").text('Your Score is:'+this.score) } From 0c2383dc18c5ba573b7c5abb77636b1ae4a22a47 Mon Sep 17 00:00:00 2001 From: Nadine Curry Date: Fri, 8 Jul 2016 13:14:00 -0700 Subject: [PATCH 29/33] styling for score --- stylesheets/2048.css | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/stylesheets/2048.css b/stylesheets/2048.css index d10e4ac..166f677 100644 --- a/stylesheets/2048.css +++ b/stylesheets/2048.css @@ -65,3 +65,9 @@ h1 { font-weight: bold; margin-left: 30%; } + +p { + color: #776e65; + font-weight: bold; + margin-left: 30%; +} From ae15d52406c6f65560691352b7da444098e744c5 Mon Sep 17 00:00:00 2001 From: Nadine Curry Date: Fri, 8 Jul 2016 13:14:14 -0700 Subject: [PATCH 30/33] added function for win check --- javascripts/2048.js | 19 ++++++++++++++++++- 1 file changed, 18 insertions(+), 1 deletion(-) diff --git a/javascripts/2048.js b/javascripts/2048.js index 2184518..195f026 100644 --- a/javascripts/2048.js +++ b/javascripts/2048.js @@ -61,6 +61,7 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) next.attr("data-col", curr.attr("data-col")) self.scoring(total) + self.checkWin(total) // setTimeout(function () { curr.attr("data-val", total).html(total) next.remove() @@ -87,6 +88,7 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) self.scoring(total) + self.checkWin(total) next.attr("data-col", curr.attr("data-col")) // setTimeout(function () { curr.attr("data-val", total).html(total) @@ -117,6 +119,7 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) self.scoring(total) + self.checkWin(total) next.attr("data-row", curr.attr("data-row")) // setTimeout(function () { curr.attr("data-val", total).html(total) @@ -144,6 +147,7 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i if (curr.attr("data-val") === next.attr("data-val")) { var total = parseInt(curr.attr("data-val")) + parseInt(next.attr("data-val")) self.scoring(total) + self.checkWin(total) next.attr("data-row", curr.attr("data-row")) // setTimeout(function () { curr.attr("data-val", total).html(total) @@ -168,9 +172,22 @@ Game.prototype.legit = function (direction) { // if left or right use rows || i Game.prototype.scoring = function(value){ this.score += value - $("p").text('Your Score is:'+this.score) + $("p").text('Your Score is: '+this.score) } +Game.prototype.checkWin = function(value){ + if (value === 2048){ + $("p").text('YOU WON!!') + } +} + +// Game.prototype.checkLose = function(){ +// var tiles = $(".tile") +// if (tiles.length === 16 &&) { + +// } +// } + $(document).ready(function() { console.log("ready to go!"); // Any interactive jQuery functionality From 475e8c74ce29b1daad7a13cdf6adc8ef42353c96 Mon Sep 17 00:00:00 2001 From: Adriana Date: Fri, 8 Jul 2016 14:43:08 -0700 Subject: [PATCH 31/33] Will not add extra tiles if there is no valid spot --- index.html | 4 ++-- javascripts/2048.js | 7 +++---- 2 files changed, 5 insertions(+), 6 deletions(-) diff --git a/index.html b/index.html index 45d811f..9ea1617 100644 --- a/index.html +++ b/index.html @@ -31,8 +31,8 @@

2048

2
2
- +
2
+
2