367 lines
11 KiB
JavaScript
367 lines
11 KiB
JavaScript
|
|
|
|
$(document).ready(function () {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var canvas = $("#myCanvas")[0];
|
|
var ctx = canvas.getContext("2d");
|
|
var w = $("#myCanvas").width();
|
|
var h = $("#myCanvas").height();
|
|
var cw = 15;
|
|
var food;
|
|
var snake;
|
|
var d = "RIGHT";
|
|
var gameloop;
|
|
var id_question;
|
|
|
|
|
|
function start(gameloop){
|
|
gameloop = setInterval(update, 100);
|
|
return gameloop
|
|
}
|
|
function reset() {
|
|
window.location.reload();
|
|
if(localStorage.getItem("life_couter") === null ){
|
|
setLifeCouter(3);
|
|
}
|
|
}
|
|
|
|
function tryAgain(){
|
|
window.location.reload();
|
|
if(localStorage.getItem("life_couter") === null ){
|
|
setLifeCouter(3);
|
|
}else{
|
|
var lifeCouter = getLifeCouter();
|
|
setLifeCouter(--lifeCouter);
|
|
}
|
|
}
|
|
function stop(gameloop){
|
|
clearInterval(gameloop);
|
|
}
|
|
function getQuestionCouter(){
|
|
var questionCouter = localStorage.getItem("question_couter");
|
|
return questionCouter;
|
|
}
|
|
function setQuestionCouter(questionCouter){
|
|
localStorage.setItem("question_couter", questionCouter);
|
|
}
|
|
function getLifeCouter(){
|
|
var lifeCouter = localStorage.getItem("life_couter");
|
|
return lifeCouter;
|
|
}
|
|
function setLifeCouter(lifeCouter){
|
|
localStorage.setItem("life_couter", lifeCouter);
|
|
}
|
|
|
|
function getSessionScore(){
|
|
var sessionScore = localStorage.getItem("session_score");
|
|
return sessionScore;
|
|
}
|
|
function getCurrentScore(){
|
|
var currentScore = localStorage.getItem("current");
|
|
return currentScore;
|
|
}
|
|
function setSessionScore(score){
|
|
localStorage.setItem("session_score", score);
|
|
}
|
|
function setCurrentScore(score){
|
|
localStorage.setItem("current", score);
|
|
}
|
|
function checkScore(score){
|
|
var session = getSessionScore();
|
|
var current = getCurrentScore();
|
|
if(current === null){
|
|
setCurrentScore(score);
|
|
setSessionScore(score);
|
|
}
|
|
if (session < score){
|
|
current = 0;
|
|
setCurrentScore(score);
|
|
setSessionScore(score);
|
|
}
|
|
}
|
|
$('#popup_question').submit(function(e){
|
|
var form = $(this).serializeArray();
|
|
e.preventDefault();
|
|
form = JSON.stringify(form);
|
|
if(localStorage.getItem("new_question") === null){
|
|
localStorage.setItem('id_question', 0);
|
|
localStorage.setItem("new_question",form);
|
|
alert('Dodano pytanie. Wcisnij Ok. Dodaj nastepne pytanie lub wcisnij F5 i graj');
|
|
}
|
|
else{
|
|
id_question = localStorage.getItem('id_question');
|
|
id_question++ ;
|
|
localStorage.setItem(`new_question-${id_question}`,form);
|
|
localStorage.setItem('id_question', id_question);
|
|
alert('Dodano pytanie. Wcisnij Ok. Dodaj nastepne pytanie lub wcisnij F5 i graj');
|
|
}
|
|
$(this).closest('form').find("input[type=text]").val("");
|
|
});
|
|
|
|
// $('#accept').click(function(){
|
|
// var goodAnswer = $("input[class='yes']");
|
|
// console.log(goodAnswer);
|
|
// if(goodAnswer.is(':checked')){
|
|
// console.log('dobra opdowiedz');
|
|
// }
|
|
// else{
|
|
// console.log('zla odpowiedz');
|
|
// }
|
|
|
|
// });
|
|
$('#clear_local_storage').click(function(){
|
|
localStorage.removeItem(`new_question`);
|
|
var numberOfQuestions = localStorage.getItem('id_question');
|
|
for (var i = 0; i <= numberOfQuestions; i++){
|
|
localStorage.removeItem(`new_question-${i}`);
|
|
}
|
|
localStorage.removeItem('id_question');
|
|
})
|
|
$('#restart_game').click(function(){
|
|
setLifeCouter(3);
|
|
setSessionScore(0);
|
|
alert('Zresetowales swoje zycia, wcisnij Ok, a nastepnie F5 zeby zaczac od nowa');
|
|
})
|
|
$('#add_question').click(function(){
|
|
var isHidden = localStorage.getItem('isHidden');
|
|
if(isHidden === null){
|
|
isHidden = 'true';
|
|
}
|
|
if(isHidden === 'true'){
|
|
$('#popup_question').fadeIn();
|
|
localStorage.setItem('isHidden', 'false');
|
|
}else if(isHidden === 'false'){
|
|
$('#popup_question').fadeOut();
|
|
localStorage.setItem('isHidden', 'true');
|
|
}
|
|
})
|
|
$('#restart').click(function(){
|
|
reset();
|
|
})
|
|
$('#try_again').click(function(){
|
|
tryAgain();
|
|
})
|
|
|
|
$('#session').text(getSessionScore());
|
|
$('#lifes').text(localStorage.getItem('life_couter'));
|
|
if(localStorage.getItem('life_couter') == 0){
|
|
alert(`Koniec gry! Twoj wynik to: ${localStorage.getItem('session_score')}. Jezeli chcesz zagrac jeszcze raz wcisnij Ok, nastepnie Resetuj gre, pozniej F5`);
|
|
}
|
|
function update() {
|
|
if (d == "RIGHT")
|
|
snake.x = snake.x + 1;
|
|
else if (d == "LEFT")
|
|
snake.x = snake.x - 1;
|
|
else if (d == "UP")
|
|
snake.y = snake.y - 1;
|
|
else if (d == "DOWN")
|
|
snake.y = snake.y + 1;
|
|
|
|
check_borders();
|
|
check_food();
|
|
blank();
|
|
paint_cell(food.x, food.y, "grey");
|
|
paint_cell(snake.x, snake.y, "green");
|
|
}
|
|
|
|
function randomYes() {
|
|
|
|
var newClass = "yes";
|
|
var randomKey = parseInt(Math.floor(Math.random() * 4));
|
|
$("div").each(function () {
|
|
var inputsArr = $(this).children("input[name='yes_no']")
|
|
var inputYes = $(inputsArr[randomKey]);
|
|
inputYes.attr('class', newClass);
|
|
inputYes.removeClass("no");
|
|
|
|
})
|
|
|
|
}
|
|
function addTextToAnserws(randomQuestion) {
|
|
var i = 0;
|
|
var j = 2;
|
|
console.log(randomQuestion[1].value);
|
|
var inputsArrNo = $(".no");
|
|
var inputNo0 = $(inputsArrNo[0]);
|
|
var inputNo1 = $(inputsArrNo[1]);
|
|
var inputNo2 = $(inputsArrNo[2]);
|
|
inputNo0.next().text(randomQuestion[2].value);
|
|
inputNo1.next().text(randomQuestion[3].value);
|
|
inputNo2.next().text(randomQuestion[4].value);
|
|
|
|
$('h3').text(randomQuestion[0].value);
|
|
$('.yes').next().text(randomQuestion[1].value);
|
|
|
|
}
|
|
function showQuestionTask() {
|
|
|
|
function pickRandomQuestion(){
|
|
var questionKey = 'new_question';
|
|
var id = localStorage.getItem('id_question');
|
|
var randomKey = Math.floor(Math.random() * id);
|
|
if(randomKey === 0){
|
|
var randomQuestion = localStorage.getItem(questionKey);
|
|
randomQuestion = JSON.parse(randomQuestion);
|
|
}else{
|
|
questionKey = `new_question-${randomKey}`;
|
|
var randomQuestion = localStorage.getItem(questionKey);
|
|
randomQuestion = JSON.parse(randomQuestion);
|
|
}
|
|
return randomQuestion;
|
|
}
|
|
|
|
var randomQuestion = pickRandomQuestion();
|
|
console.log(randomQuestion);
|
|
|
|
var current = $('#current').text();
|
|
$('#final').text(current);
|
|
if(randomQuestion === null){
|
|
alert('Pytania nie zostaly dodane. Wcisnij Ok, nastepnie F5 i dodaj pytania');
|
|
}
|
|
randomYes();
|
|
addTextToAnserws(randomQuestion);
|
|
$('#popup').fadeIn();
|
|
|
|
// $(".popup-item").each(function(index){
|
|
// var newId = "yes";
|
|
|
|
|
|
|
|
// });
|
|
$('.yes').click(function () {
|
|
if ($('.yes').is(':checked')) {
|
|
$('#correct').fadeIn('slow');
|
|
$('.no').attr('disabled','disabled').delay(1000);;
|
|
$('.yes').prop('checked', true);
|
|
var sessionScore = getSessionScore();
|
|
var questionCouter = getQuestionCouter();
|
|
questionCouter++;
|
|
sessionScore++;
|
|
//fixuj ten projekt
|
|
$('#question_couter').text(questionCouter);
|
|
$('#session').text(sessionScore);
|
|
$('lifes').text(localStorage.getItem('life_couter'))
|
|
setSessionScore(sessionScore);
|
|
setQuestionCouter(questionCouter);
|
|
$('#restart').fadeIn('slow');
|
|
|
|
}
|
|
});
|
|
$('.no').click(function(){
|
|
if($('.no').is(':checked')){
|
|
$('#incorrect').fadeIn('slow');
|
|
$('.yes').attr('disabled','disabled').delay(1000);;
|
|
$('.no').attr('disabled', 'disabled');
|
|
$('#try_again').fadeIn('slow');
|
|
}
|
|
})
|
|
}
|
|
|
|
function updateHighScore() {
|
|
var current = $("#current").text();
|
|
var highest = $("#highest").text();
|
|
if (parseInt(current) > parseInt(highest)) {
|
|
$('#highest').text(current)
|
|
}
|
|
|
|
}
|
|
|
|
function placeFood() {
|
|
food = {
|
|
x: Math.round(Math.random() * (w - cw) / cw),
|
|
y: Math.round(Math.random() * (h - cw) / cw)
|
|
}
|
|
}
|
|
|
|
function placeSnake() {
|
|
snake = {
|
|
x: Math.round(Math.random() * (w - cw) / cw),
|
|
y: Math.round(Math.random() * (h - cw) / cw)
|
|
}
|
|
}
|
|
|
|
function blank() {
|
|
//Paint The Canvas
|
|
ctx.fillStyle = "black";
|
|
ctx.fillRect(0, 0, w, h);
|
|
ctx.strokeStyle = "white";
|
|
ctx.strokeRect(0, 0, w, h);
|
|
|
|
}
|
|
|
|
function check_borders() {
|
|
if (snake.x < 0 || snake.x > (w - cw) / cw || snake.y < 0 || snake.y > (h - cw) / cw) {
|
|
console.log("sprawdzimy")
|
|
}
|
|
}
|
|
|
|
function paint_cell(x, y, color) {
|
|
ctx.fillStyle = color;
|
|
ctx.fillRect(x * cw, y * cw, cw, cw);
|
|
ctx.strokeStyle = "white";
|
|
ctx.strokeRect(x * cw, y * cw, cw, cw);
|
|
}
|
|
|
|
function check_food() {
|
|
if (food.x == snake.x && food.y == snake.y) {
|
|
// var current = parseInt($('#current').text());
|
|
// current += 1;
|
|
// $('#current').text(current);
|
|
// checkScore(current);
|
|
stop(gameloop);
|
|
showQuestionTask();
|
|
placeFood();
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
gameloop = start();
|
|
|
|
placeFood();
|
|
paint_cell(food.x, food.y, "grey");
|
|
placeSnake();
|
|
paint_cell(snake.x, snake.y, "green");
|
|
|
|
//Keyboard Controller
|
|
$(document).keydown(function (e) {
|
|
//39: RIGHT
|
|
//37: LEFT
|
|
//38: UP
|
|
//40: DOWN
|
|
var key = e.which;
|
|
if (key == "37") {
|
|
snake.x -= 1;
|
|
d = "LEFT";
|
|
} else if (key == "38") {
|
|
snake.y -= 1;
|
|
d = "UP";
|
|
} else if (key == "39") {
|
|
snake.x += 1;
|
|
d = "RIGHT";
|
|
} else if (key == "40") {
|
|
snake.y += 1;
|
|
d = "DOWN";
|
|
}
|
|
|
|
check_food();
|
|
blank();
|
|
color = "grey";
|
|
paint_cell(food.x, food.y);
|
|
color = "green";
|
|
paint_cell(snake.x, snake.y);
|
|
|
|
});
|
|
|
|
});
|