//startingDate:16-07-2019
var TwoZeroFourEight = {};
var Utils = {};
Utils.Path = "";
Utils.mobileDeviceFlag = false;
var questionId = 0, startTime = 0, scoredMarks = 0, totalMarks = 10, resId = 0, level = 1, label = '';
var src;
var deltaX, deltaY, touchX, touchY, randNum;
$(document).ready(function () {
  $(".se-pre-con").fadeOut("slow");
  if ((navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i)) && !(window.location.href.includes('http')))
    Utils.mobileDeviceFlag = true;
  /* if(Utils.mobileDeviceFlag) 
		Utils.Path=Android.getMediaPath("TwoZeroFourEight");  */
  setTimeout(function () {
    TwoZeroFourEight.init();
    src = document.getElementById("grid");
  }, 100);
});
var clientX, clientY;

TwoZeroFourEight.init = function () {
  document.title = Object.values(TwoZeroFourEight.AcknowledgementPageData)[0];
  $("#coverPage").show();
  $("#instructionDiv").hide();
  $("#gamePage").hide();
  $(".header").not("#logo")
    .css("visibility", "hidden");
  document.body.style.backgroundImage = "url(" + Utils.Path + "images/skin/" + TwoZeroFourEight.hardCodedData.coverPage;
  //document.body.style.backgroundColor = "#333";
  //document.body.style.backgroundColor="white";
  TwoZeroFourEight.initializeVariables();
  TwoZeroFourEight.setAllImages();
  TwoZeroFourEight.createGridDivs();
};

TwoZeroFourEight.initializeVariables = function () {
  TwoZeroFourEight.firstFlag = true;
  TwoZeroFourEight.storeArr = [];
  TwoZeroFourEight.refArr = [];
  TwoZeroFourEight.iterationCtr = 0;
  TwoZeroFourEight.colorArr = ["#d6cfc9", "#ece2d8", "#ebdfc7", "#f2b078", "#f29762", "#f37659", "#f65c3c", "#ebcd70", "#eccb60", "#ebc74f", "#eac440", "#e6c136", "#f0676c", "#eb4d5c", "#f3403c", "#75b3d8", "#5ba0db"];
  TwoZeroFourEight.colorArr = ["#5a595a", "#d442b0", "#09d26a", "#ec6a12", "#f7544d", "#f8bc4c", "#10b2e1", "#1d3eab", "#a245f9", "#a19ca1", "#00d0a1", "#33e860"]
  TwoZeroFourEight.newNumArr = [2, 4, 8, 16, 32, 64, 128, 256, 512, 1024, 2048];
  TwoZeroFourEight.score = 0;
  TwoZeroFourEight.highScore = 0;
  TwoZeroFourEight.traverseArr = [-4, 1, 4, -1];
  TwoZeroFourEight.vanishArr = [-5, -4, -3, 1, 3, 4, 5, -1];
  TwoZeroFourEight.deleteFlag = false;
};

TwoZeroFourEight.setAllImages = function () {
  document.getElementById("homeImage").src = Utils.Path + "images/skin/home.png";
  document.getElementById("logoImage").src = Utils.Path + "images/skin/logo.png";
  document.getElementById("playImg").src = Utils.Path + "images/skin/play.png";
  document.getElementById("img1").src = Utils.Path + "images/skin/2048_1.png";
  document.getElementById("img2").src = Utils.Path + "images/skin/2048_2.png";
  document.getElementById("playGameImg").src = Utils.Path + "images/skin/play.png";
  document.getElementById("replayImg").src = Utils.Path + "images/skin/replay.png";
  document.getElementById("creditImg").src = Utils.Path + "images/skin/credits.png";
  document.getElementById("heading").innerHTML = TwoZeroFourEight.hardCodedData.heading;
  document.getElementById("text1").innerHTML = TwoZeroFourEight.hardCodedData.instruction1;
  document.getElementById("text2").innerHTML = TwoZeroFourEight.hardCodedData.instruction2;
  document.getElementById("gameOver").innerHTML = TwoZeroFourEight.hardCodedData.gameOver;
  document.getElementById("delete").style.backgroundImage = "url(" + Utils.Path + 'images/skin/dustbin.png' + ")";
  document.getElementById("scoreDiv").style.backgroundImage = "url(" + Utils.Path + 'images/skin/score.png' + ")";
  document.getElementById("newNum").style.backgroundImage = "url(" + Utils.Path + 'images/skin/block1.png' + ")";


  // document.getElementById("scoreText").innerHTML =
  //   TwoZeroFourEight.hardCodedData.scoreText;
  document.getElementById("currScore").innerHTML = 0;
  document.getElementById("deletePara").innerHTML = 0;
};
TwoZeroFourEight.createAcknowledgementDivs = function () {
  var i = 0, div;
  for (i = 0; i < Object.keys(TwoZeroFourEight.AcknowledgementPageData).length; i++) {
    div = document.createElement('div');
    div.className = "fontClass firstLetter col-xs-12 col-sm-12 col-md-12 col-lg-12";
    div.innerHTML = Object.keys(TwoZeroFourEight.AcknowledgementPageData)[i] + " : " + Object.values(TwoZeroFourEight.AcknowledgementPageData)[i];
    acknowledgementDiv.appendChild(div);
  }
  div = document.createElement('div');
  div.className = "fontClass firstLetter col-xs-12 col-sm-12 col-md-12 col-lg-12";
  div.innerHTML = TwoZeroFourEight.hardCodedData.createdOn;
  div.style.marginBottom = "2vh";
  acknowledgementDiv.appendChild(div);
}
TwoZeroFourEight.createGridDivs = function () {
  var parentDiv, i, j, gridDiv, container, counter = 0;
  parentDiv = document.getElementById("grid");
  for (i = 1; i <= 4; i++) {
    container = document.createElement("DIV");
    container.setAttribute("id", "container" + i);
    container.setAttribute("class", "nopadding col-xs-12 col-md-12 col-lg-12 col-sm-12");
    for (j = 1; j <= 4; j++) {
      counter++;
      gridDiv = document.createElement("div");
      gridDiv.setAttribute("id", "gridDiv" + counter);
      gridDiv.setAttribute("class", "numbers nopadding col-xs-2 col-md-2 col-lg-2 col-sm-2");
      gridDiv.style.backgroundImage = "url(" + Utils.Path + 'images/skin/block.png' + ")";
      gridDiv.setAttribute("number", counter);
      container.appendChild(gridDiv);
    }
    parentDiv.appendChild(container);
  }
  TwoZeroFourEight.createAcknowledgementDivs();
};

TwoZeroFourEight.showInstruction = function () {
  $("#coverPage").hide();
  $("#instructionDiv").show();
  document.body.style.backgroundImage = "url(" + Utils.Path + 'images/skin/Bg.png' + ")";
}

TwoZeroFourEight.playGame = function () {
  var d;
  $("#coverPage").hide();
  $("#instructionDiv").hide();
  $("#gamePage").show();
  $(".header").css("visibility", "visible");
  document.body.style.backgroundImage = "url(" + Utils.Path + 'images/skin/Bg.png' + ")";
  d = new Date();
  startTime = d.getDate() + "-" + (d.getMonth() + 1) + "-" + d.getFullYear() + " " + d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds();
  $("#newNum").draggable({
    revert: "invalid", helper: "clone", containment: "html", start: function (event, ui) {
      $(ui.helper).addClass("ui-helper");
    }
  });

  $(".numbers").not("#newNum").droppable({
    drop: TwoZeroFourEight.checkNumber
  });
  // $(".numbers").not("newNum").droppable("enable");
  TwoZeroFourEight.placeNum();
};

TwoZeroFourEight.placeNum = function () {
  var number = 0,
    maxNum = 0;
  if (TwoZeroFourEight.firstFlag) {
    TwoZeroFourEight.firstFlag = false;
    randNum = Math.floor(Math.random() * 3);
    number = TwoZeroFourEight.newNumArr[randNum];
  } else {
    for (i = 1; i <= 16; i++) {
      number = parseInt($("#gridDiv" + i).text());
      if (number > maxNum) maxNum = number;
    }
    randNum = Math.floor(Math.random() * TwoZeroFourEight.newNumArr.length);
    number = TwoZeroFourEight.newNumArr[randNum];
    while (number > maxNum) {
      randNum = Math.floor(Math.random() * TwoZeroFourEight.newNumArr.length);
      number = TwoZeroFourEight.newNumArr[randNum];
    }
  }

  document.getElementById("newPara").innerHTML = number;
  document.getElementById("newNum").style.backgroundColor =
    TwoZeroFourEight.colorArr[randNum + 1];
  if (number >= 1024)
    document.getElementById("newPara").style.fontSize = "3vw";
  else
    document.getElementById("newPara").style.fontSize = "4vw";
};

TwoZeroFourEight.checkNumber = function (event, ui) {
  var div = ui.draggable.children().text();
  //var newDiv=div.context.style='';
  var ele = $(this).prop("id");
  // $("#" + ele).css({
  //   "background-color": TwoZeroFourEight.colorArr[randNum + 1]
  // });
  $("#" + ele).css("background-image", "url(" + Utils.Path + 'images/skin/block1.png' + ")");
  $(this).append(div);
  $(this).droppable("disable");
  $(this).position({
    at: "center",
    of: this
  });

  TwoZeroFourEight.placeNum();
  TwoZeroFourEight.addNumbers(ele);
};

TwoZeroFourEight.addNumbers = function (ele) {
  var i = 0,
    divNo,
    matchCounter = 0, deleteCtr = 0, soundFlag = false;
  number = 0;
  TwoZeroFourEight.deleteFlag = false;
  TwoZeroFourEight.iterationCtr = 0;
  TwoZeroFourEight.traverseArr = [-4, 1, 4, -1];
  TwoZeroFourEight.vanishArr = [-5, -4, -3, 1, 5, 4, 3, -1];
  divNo = parseInt(document.getElementById(ele).getAttribute("number"));
  if (divNo % 4 == 0) {
    index = TwoZeroFourEight.traverseArr.indexOf(1);
    TwoZeroFourEight.traverseArr.splice(index, 1);
    index = TwoZeroFourEight.vanishArr.indexOf(1);
    TwoZeroFourEight.vanishArr.splice(index, 1);
    index = TwoZeroFourEight.vanishArr.indexOf(-3);
    TwoZeroFourEight.vanishArr.splice(index, 1);
    index = TwoZeroFourEight.vanishArr.indexOf(5);
    TwoZeroFourEight.vanishArr.splice(index, 1);
  }
  if (divNo % 4 == 1) {
    index = TwoZeroFourEight.traverseArr.indexOf(-1);
    TwoZeroFourEight.traverseArr.splice(index, 1);
    index = TwoZeroFourEight.vanishArr.indexOf(-1);
    TwoZeroFourEight.vanishArr.splice(index, 1);
    index = TwoZeroFourEight.vanishArr.indexOf(-5);
    TwoZeroFourEight.vanishArr.splice(index, 1);
    index = TwoZeroFourEight.vanishArr.indexOf(3);
    TwoZeroFourEight.vanishArr.splice(index, 1);


  }
  if (divNo <= 4) {
    index = TwoZeroFourEight.traverseArr.indexOf(-4);
    TwoZeroFourEight.traverseArr.splice(index, 1);
    index = TwoZeroFourEight.vanishArr.indexOf(-4);
    TwoZeroFourEight.vanishArr.splice(index, 1);
    index = TwoZeroFourEight.vanishArr.indexOf(-3);
    TwoZeroFourEight.vanishArr.splice(index, 1);
    index = TwoZeroFourEight.vanishArr.indexOf(-5);
    TwoZeroFourEight.vanishArr.splice(index, 1);


  }
  if (divNo > 12) {
    index = TwoZeroFourEight.traverseArr.indexOf(4);
    TwoZeroFourEight.traverseArr.splice(index, 1);
    index = TwoZeroFourEight.vanishArr.indexOf(4);
    TwoZeroFourEight.vanishArr.splice(index, 1);
    index = TwoZeroFourEight.vanishArr.indexOf(5);
    TwoZeroFourEight.vanishArr.splice(index, 1);
    index = TwoZeroFourEight.vanishArr.indexOf(3);
    TwoZeroFourEight.vanishArr.splice(index, 1);

  }
  console.log(TwoZeroFourEight.traverseArr);
  while (TwoZeroFourEight.iterationCtr < 4) {
    TwoZeroFourEight.iterationCtr++;
    number = parseInt(document.getElementById(ele).innerHTML);

    for (i = 0; i < TwoZeroFourEight.traverseArr.length; i++) {
      if (parseInt(document.getElementById("gridDiv" + (divNo + TwoZeroFourEight.traverseArr[i])).innerHTML) == number) {
        matchCounter++;
        document.getElementById("gridDiv" + (divNo + TwoZeroFourEight.traverseArr[i])).innerHTML = "";
        document.getElementById("gridDiv" + (divNo + TwoZeroFourEight.traverseArr[i])).style.backgroundColor = "";
        document.getElementById("gridDiv" + (divNo + TwoZeroFourEight.traverseArr[i])).style.backgroundImage = "url(" + Utils.Path + 'images/skin/block.png' + ")";
        $("#gridDiv" + (divNo + TwoZeroFourEight.traverseArr[i])).droppable("enable");
      }
    }
    if (matchCounter > 0) {
      soundFlag = true;
      deleteCtr = deleteCtr + matchCounter;
      if (matchCounter >= 3) {
        num = parseInt(document.getElementById("deletePara").innerHTML);
        document.getElementById("deletePara").innerHTML = (num + 1);
        TwoZeroFourEight.deleteFlag = true;
      }
      matchCounter = 0;
      number = number * 2;
      document.getElementById(ele).innerHTML = number;
      TwoZeroFourEight.score = TwoZeroFourEight.score + number;
      if (TwoZeroFourEight.score >= 100000) {
        document.getElementById("currScore").style.fontSize = "4vw";
        document.getElementById("currScore").style.marginTop = "15vh";
      }
      document.getElementById("currScore").innerHTML = TwoZeroFourEight.score;
    }
  }
  if (!TwoZeroFourEight.deleteFlag) {
    if (deleteCtr >= 3) {
      num = parseInt(document.getElementById("deletePara").innerHTML);
      document.getElementById("deletePara").innerHTML = (num + 1);
    }
  }
  for (i = 0; i < TwoZeroFourEight.newNumArr.length; i++) {
    if (number == TwoZeroFourEight.newNumArr[i]) {
      document.getElementById(ele).style.backgroundColor = TwoZeroFourEight.colorArr[i + 1];
      document.getElementById(ele).style.transition = "0.5s ease-in";
      // transition: easeIn 2s;
      if (number >= 1024) {

        document.getElementById(ele).style.fontSize = "3vw";
        document.getElementById(ele).style.lineHeight = "15vh";
        if (number == 2048) {
          TwoZeroFourEight.vanishNumbers(ele);
        }
      }
      else {
        document.getElementById(ele).style.fontSize = "4vw";
      }

      break;
    }
  }
  if (number != 2048) {
    if (soundFlag)
      document.getElementById("playSound").src = Utils.Path + "sounds/instructions/glassBreak.mp3";
    else
      document.getElementById("playSound").src = Utils.Path + "sounds/instructions/ting.mp3";
    document.getElementById("playSound").play();
  }
  TwoZeroFourEight.exitCriteria();

};

TwoZeroFourEight.vanishNumbers = function (ele) {
  var i = 0, currDiv;
  currDiv = parseInt(document.getElementById(ele).getAttribute("number"));
  // TwoZeroFourEight.vanishArr.push(0);
  console.log(TwoZeroFourEight.vanishArr);
  document.getElementById("playSound").src = Utils.Path + "sounds/instructions/originalSingle.mp3";
  document.getElementById("playSound").play();
  TwoZeroFourEight.vanishTimer = setInterval(function () {
    if (i >= TwoZeroFourEight.vanishArr.length) {
      clearInterval(TwoZeroFourEight.vanishTimer);
      document.getElementById(ele).innerHTML = "";
      //document.getElementById(ele).style.backgroundColor = "#5a595a";
      document.getElementById(ele).style.backgroundImage = "url(" + Utils.Path + 'images/skin/block.png' + ")";
      $("#" + ele).droppable("enable");
    }
    else {
      document.getElementById("gridDiv" + (currDiv + TwoZeroFourEight.vanishArr[i])).innerHTML = "";
      //document.getElementById("gridDiv" + (currDiv + TwoZeroFourEight.vanishArr[i])).style.backgroundColor = "#5a595a";
      document.getElementById("gridDiv" + (currDiv + TwoZeroFourEight.vanishArr[i])).style.backgroundImage = "url(" + Utils.Path + 'images/skin/block.png' + ")";
      $("#gridDiv" + (currDiv + TwoZeroFourEight.vanishArr[i])).droppable("enable");
      i++;
    }
  }, 200);
}

TwoZeroFourEight.storeNumbers = function () {
  var i;
  TwoZeroFourEight.refArr = [];
  TwoZeroFourEight.refArr = TwoZeroFourEight.storeArr.slice(0);
  TwoZeroFourEight.storeArr = [];
  for (i = 1; i <= 16; i++) {
    TwoZeroFourEight.storeArr.push(
      document.getElementById("gridDiv" + i).innerHTML
    );
  }
  console.log(TwoZeroFourEight.refArr);
  console.log(TwoZeroFourEight.storeArr);
};

TwoZeroFourEight.undo = function () {
  var i;
  for (i = 1; i <= 16; i++) {
    document.getElementById("gridDiv" + i).innerHTML =
      TwoZeroFourEight.refArr[i - 1];
    TwoZeroFourEight.storeArr = TwoZeroFourEight.refArr.slice(0);
    TwoZeroFourEight.giveColors();
  }
};

TwoZeroFourEight.giveColors = function () {
  var i,
    num,
    ctr = 0;
  for (i = 1; i <= 16; i++) {
    num = document.getElementById("gridDiv" + i).innerHTML;
    if (parseInt(num) <= 4)
      document.getElementById("gridDiv" + i).style.color = "#696868";
    else document.getElementById("gridDiv" + i).style.color = "white";
    if (num == "")
      document.getElementById("gridDiv" + i).style.backgroundColor =
        TwoZeroFourEight.colorArr[0];
    else {
      if (parseInt(num) >= 1024)
        document.getElementById("gridDiv" + i).style.fontSize = "3vw";
      else
        document.getElementById("gridDiv" + i).style.fontSize = "4vw";
      ctr = 1;
      while (parseInt(num / 2) != 1) {
        num = parseInt(num / 2);
        ctr++;
      }
      document.getElementById("gridDiv" + i).style.backgroundColor =
        TwoZeroFourEight.colorArr[ctr];
    }
  }
};

TwoZeroFourEight.reload = function () {
  $(".numbers").empty();
  TwoZeroFourEight.score = 0;
  TwoZeroFourEight.loadFlag = true;
  TwoZeroFourEight.placeNum();
};

TwoZeroFourEight.exitCriteria = function () {
  var i;
  TwoZeroFourEight.emptyFlag = false;
  for (i = 1; i <= 16; i++) {
    if (document.getElementById("gridDiv" + i).innerHTML == "") {
      TwoZeroFourEight.emptyFlag = true;
      break;
    }
  }
  if (TwoZeroFourEight.emptyFlag == false) {

    document.getElementById("delete").style.pointerEvents = "none";
    scoredMarks = TwoZeroFourEight.score;
    console.log(resId, questionId, scoredMarks, totalMarks, level, startTime, label);
    if (Utils.mobileDeviceFlag)
      Android.addScore(resId, questionId, scoredMarks, totalMarks, level, startTime, label);
    setTimeout(function () {
      document.getElementById("playSound").pause();
      $('#gamePage').hide();
      $("#endPage").show();
      document.getElementById("finalScore").innerHTML = TwoZeroFourEight.hardCodedData.finalScore + TwoZeroFourEight.score;
      //alert("Game Over");
    }, 500);
  }
};

TwoZeroFourEight.callHome = function () {
  scoredMarks = TwoZeroFourEight.score;
  console.log(resId, questionId, scoredMarks, totalMarks, level, startTime, label);
  if (Utils.mobileDeviceFlag)
    Android.addScore(resId, questionId, scoredMarks, totalMarks, level, startTime, label);
  location.reload();
}

TwoZeroFourEight.GenerateNum = function () {
  var num;
  num = parseInt(document.getElementById("deletePara").innerHTML);
  if (num > 0) {
    document.getElementById("deletePara").innerHTML = (num - 1);
    TwoZeroFourEight.placeNum();
  }
}

TwoZeroFourEight.showAcknowledgement = function () {
  $("#acknowledgementDiv").show();

}

TwoZeroFourEight.playAgain = function () {
  document.getElementById("delete").style.pointerEvents = "auto";
  document.getElementById("currScore").style.fontSize = "5vw";
  document.getElementById("currScore").style.marginTop = "12vh";
  TwoZeroFourEight.soundFlag = true;
  $("#acknowledgementDiv").hide();
  $("#endPage").hide();
  $("#gamePage").show();
  $(".numbers").not("#newNum").empty();
  $(".numbers").not("#newNum").css("background-color", "");
  $(".numbers").not("#newNum").css("background-image", "url(" + Utils.Path + 'images/skin/block.png' + ")");
  document.getElementById("deletePara").innerHTML = 0;
  TwoZeroFourEight.initializeVariables();
  TwoZeroFourEight.playGame();
  $(".numbers").not("#newNum").droppable("enable");
  document.getElementById("currScore").innerHTML = 0;
}