Advertisement
Guest User

JQuery version Memory Game

a guest
Jul 4th, 2019
71
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
jQuery 2.46 KB | None | 0 0
  1. var numbers = [1,1,2,2,3,3,4,4,5,5,6,6,7,7,8,8];
  2. var lastClickedButtonNumberId = undefined;
  3. var lastClickedButtonNumber = undefined;
  4. var wait = false;
  5. var matches = 0;
  6.  
  7. shuffle(numbers);
  8.  
  9. $("button").click(function(event) {
  10.     var turnable = $(this).attr("data-turnable");
  11.     console.log(turnable);
  12.     if (turnable == "true" && !wait && lastClickedButtonNumberId == undefined) {//first click`
  13.         $(this).attr(''game2.js'
  14. data-turnable', 'false');
  15.         $(this).text($(this).data("number")).css('background-color', 'orange');
  16.         lastClickedButtonNumberId = this.id;
  17.         lastClickedButtonNumber = $(this).data("number");
  18.     }   else if (turnable == "true" && !wait && lastClickedButtonNumberId != undefined && lastClickedButtonNumberId != this.id) {//second click
  19.         $(this).attr('data-turnable', 'false');
  20.         $(this).text($(this).data("number"));
  21.         if ($(this).data('number') == lastClickedButtonNumber) {//if id matches
  22.             console.log("its a match");
  23.             $(this).css('background-color', 'green');
  24.             $("#" + lastClickedButtonNumberId).css('background-color', 'green');
  25.             lastClickedButtonNumberId = undefined;
  26.             lastClickedButtonNumber = undefined;
  27.             matches++;
  28.             if (matches == 8) {
  29.                 $(".win-container").css('display', 'block');
  30.                 $("#6").hide();
  31.                 $("#7").hide();
  32.                 $("#10").hide();
  33.                 $("#11").hide();
  34.             }
  35.         } else {//if id does not match
  36.             $(this).css('background-color', 'orange');
  37.             console.log("it doesn't match");
  38.             wait = true;
  39.             var thisVar = $(this);
  40.             setTimeout(function () {
  41.                 thisVar.attr('data-turnable', 'true').css('background-color', 'white').text("");
  42.                 $("#" + lastClickedButtonNumberId).attr('data-turnable', 'true').css('background', 'white').text("");
  43.                 lastClickedButtonNumberId = undefined;
  44.                 lastClickedButtonNumber = undefined;
  45.                 wait = false;
  46.             }, 1000);
  47.         }
  48.     }
  49. });
  50.  
  51.  
  52. $("button").each(function(index, el) {
  53.     $(this).attr('data-number',  numbers[index]);
  54. });
  55.  
  56. function shuffle(array) {
  57.     var j, x, i;
  58.     for (i = array.length - 1; i > 0; i--) {
  59.         j = Math.floor(Math.random() * (i + 1));
  60.         x = array[i];
  61.         array[i] = array[j];
  62.         array[j] = x;
  63.     }
  64.     return array;
  65. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement