Fix

js/pytania.json

@@ -0,0 +1,85 @@
+{
+	"test1":{
+		"question": "HT products are Not characterized by:",
+		"answerY": "Longlife",
+		"answerNone": "Technoligical complexity",
+		"answerNtwo": "Small initial number of purchasers",
+		"answerNthree": "Frequent occurrence of technical problems"
+		},
+
+	"test2":{
+		"question": "Choose the TRUE characteristics of HT market",
+		"answerY": "Prices drop rapidly",
+		"answerNone": "The competition among manufactures is not challenging",
+		"answerNtwo": "Customers easily adapt themselves to new solutions",
+		"answerNthree": "Market is secur for long period of time"
+		},
+
+	"test3":{
+		"question": "The uniqueness of HT products is NOT achieved by:",
+		"answerY": "Existence of R&D department",
+		"answerNone": "High invesment",
+		"answerNtwo": "Using newest patents of other parties",
+		"answerNthree": "Introduction of new business models"
+		},
+
+	"test4":{
+		"question": "Choose the feature that does NOT improve productivity",
+		"answerY": "Introducing ads into products usage",
+		"answerNone": "Automatizing simple activities",
+		"answerNtwo": "Speeding up the learning process",
+		"answerNthree": "helping to avoid errors"
+		},
+
+	"test5":{
+		"question": "A HT product may save user`s investment by:",
+		"answerY": "minimizing the cost of switching into new hardwere",
+		"answerNone": "hindering (making hard) migration of data",
+		"answerNtwo": "forcing user to purchase modern hardware",	
+		"answerNthree": "shortening the life of software"
+		},
+
+	"test6":{
+		"question": "Which of these is NOT a tool intended to minimize cost failure",
+		"answerY": "USB",
+		"answerNone": "Bank machine",
+		"answerNtwo": "Firewall",
+		"answerNthree": "antivirus program"
+		},
+			
+	"test7":{
+		"question": "In order to improve the performance - cost factor",
+		"answerY": "We need to improve efficiency AND lower cost",
+		"answerNone": "We need to improve efficiency OR lower cost",
+		"answerNtwo": "We need to lower efficiency AND increase cost",
+		"answerNThree": "We need to lower efficiency OR increase costs"
+		},
+
+	"test8":{
+		"question": "A solution is called scalable if",
+		"answerY": "It can be used for both: amall and big volumes of data",
+		"answerNone": "It can be used in varios scenarios",
+		"answerNtwo": "It can be used only for maning big data",
+		"answerNthree": "It can be used as weight-scale"
+		},
+
+	"test9":{
+		"question": "Methods thet do NOT serve for roviding entertainment",
+		"answerY": "Automatization of repeatable activities",
+		"answerNone": "Gamification",
+		"answerNtwo": "Relating to hobbies",
+		"answerNthree": "Relating to leisure time"
+		},
+
+	"test 10":{
+		"question": "Which of below is NOT a key for success in HT?",
+		"answerY": "High price of the first version",
+		"answerNone": "Noticeable Performance - Cost improvement",
+		"answerNtwo": "Clear message",
+		"answerNthree": "Statisfying of at least 3-4(of 9) success rules" 
+		}
+}
+            
+
+        
+            

js/snake.js

@@ -1,7 +1,15 @@
+
+
 $(document).ready(function () {
 
+                
+           
+   
+    
+ 
+    
 
-
+    
     var canvas = $("#myCanvas")[0];
     var ctx = canvas.getContext("2d");
     var w = $("#myCanvas").width();
@@ -12,12 +20,26 @@ $(document).ready(function () {
     var d = "RIGHT";
     var gameloop;
 
+
     function start(gameloop){
         gameloop = setInterval(update, 100);
         return gameloop
     }
     function reset() {
-        window.location.reload()
+        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);
@@ -29,6 +51,13 @@ $(document).ready(function () {
     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");
@@ -65,10 +94,17 @@ $(document).ready(function () {
          $(this).closest('form').find("input[type=text]").val("");
     });
     
-    $('#option1').click(function(){
+    // $('#accept').click(function(){
+    //     var goodAnswer = $("input[class='yes']");
+    //     console.log(goodAnswer);
+    //     if(goodAnswer.is(':checked')){
+    //         console.log('dobra opdowiedz');
+    //     }
+    //     else{
+    //         console.log('zla odpowiedz');
+    //     }
         
-        
+    // });
-    });
 
     $('#add_question').click(function(){
         var isHidden = localStorage.getItem('isHidden');
@@ -83,7 +119,12 @@ $(document).ready(function () {
             localStorage.setItem('isHidden', 'true');
         }
     })
-
+    $('#restart').click(function(){
+        reset();
+    })
+    $('#try_again').click(function(){
+        tryAgain();
+    })
 
     $('#session').text(getSessionScore())
 
@@ -105,30 +146,131 @@ $(document).ready(function () {
     }
 
     function showQuestionTask() {
+        var pytania ={
+            "test1":{
+                "question": "HT products are Not characterized by:",
+                "answerY": "Longlife",
+                "answerNone": "Technoligical complexity",
+                "answerNtwo": "Small initial number of purchasers",
+                "answerNthree": "Frequent occurrence of technical problems"
+                },
+        
+            "test2":{
+                "question": "Choose the TRUE characteristics of HT market",
+                "answerY": "Prices drop rapidly",
+                "answerNone": "The competition among manufactures is not challenging",
+                "answerNtwo": "Customers easily adapt themselves to new solutions",
+                "answerNthree": "Market is secur for long period of time"
+                },
+        
+            "test3":{
+                "question": "The uniqueness of HT products is NOT achieved by:",
+                "answerY": "Existence of R&D department",
+                "answerNone": "High invesment",
+                "answerNtwo": "Using newest patents of other parties",
+                "answerNthree": "Introduction of new business models"
+                },
+        
+            "test4":{
+                "question": "Choose the feature that does NOT improve productivity",
+                "answerY": "Introducing ads into products usage",
+                "answerNone": "Automatizing simple activities",
+                "answerNtwo": "Speeding up the learning process",
+                "answerNthree": "helping to avoid errors"
+                },
+        
+            "test5":{
+                "question": "A HT product may save user`s investment by:",
+                "answerY": "minimizing the cost of switching into new hardwere",
+                "answerNone": "hindering (making hard) migration of data",
+                "answerNtwo": "forcing user to purchase modern hardware",	
+                "answerNthree": "shortening the life of software"
+                },
+        
+            "test6":{
+                "question": "Which of these is NOT a tool intended to minimize cost failure",
+                "anwerY": "USB",
+                "answerNone": "Bank machine",
+                "answerNtwo": "Firewall",
+                "answerNthree": "antivirus program"
+                },
+                    
+            "test7":{
+                "question": "In order to improve the performance - cost factor",
+                "answerY": "We need to improve efficiency AND lower cost",
+                "answerNone": "We need to improve efficiency OR lower cost",
+                "answerNtwo": "We need to lower efficiency AND increase cost",
+                "answerNThree": "We need to lower efficiency OR increase costs"
+                },
+        
+            "test8":{
+                "question": "A solution is called scalable if",
+                "answerY": "It can be used for both: amall and big volumes of data",
+                "answerNone": "It can be used in varios scenarios",
+                "answerNtwo": "It can be used only for maning big data",
+                "answerNthree": "It can be used as weight-scale"
+                },
+        
+            "test9":{
+                "question": "Methods thet do NOT serve for roviding entertainment",
+                "answerY": "Automatization of repeatable activities",
+                "answerNone": "Gamification",
+                "answerNtwo": "Relating to hobbies",
+                "answerNthree": "Relating to leisure time"
+                },
+        
+            "test10":{
+                "question": "Which of below is NOT a key for success in HT?",
+                "answerY": "High price of the first version",
+                "answerNone": "Noticeable Performance - Cost improvement",
+                "answerNtwo": "Clear message",
+                "answerNthree": "Statisfying of at least 3-4(of 9) success rules" 
+                }
+        }
+        
+        function pickRandomQuestion(pytania){
+            var objKeys = Object.keys(pytania);
+            var randomKey = objKeys[Math.floor(Math.random() *objKeys.length)];
+            var randomQuestion = pytania[randomKey];
+            return randomQuestion;
+        }
+
+        var randomQuestion = pickRandomQuestion(pytania);
+        console.log(randomQuestion);
 
         var current = $('#current').text();
         $('#final').text(current);
+        $('h3').text(randomQuestion["question"]);
+        console.log(randomQuestion["answerY"]);
+        $('#yes').text(randomQuestion["answerY"]);
+        $('#no_one').text(randomQuestion["answerNone"]);
+        $('#no_two').text(randomQuestion["answerNtwo"]);
+        $('#no_three').text(randomQuestion["answerNthree"]);
         $('#popup').fadeIn();
         $('.yes').click(function () {
-            if ($('#yes').is(':checked')) {
+            if ($('.yes').is(':checked')) {
                 $('#correct').fadeIn('slow');
-                $('#no').attr('disabled','disabled').delay(1000);;
+                $('.no').attr('disabled','disabled').delay(1000);;
-                $('#yes').prop('checked', true);
+                $('.yes').prop('checked', true);
                 var sessionScore = getSessionScore();
                 var questionCouter = getQuestionCouter();
                 questionCouter++;
                 sessionScore++;
+                //fixuj ten projekt
                 $('#question_couter').text(questionCouter);
                 $('#session').text(sessionScore);
                 setSessionScore(sessionScore);
                 setQuestionCouter(questionCouter);
+                $('#restart').fadeIn('slow');
+                
             }
         });
         $('.no').click(function(){
-            if($('#no').is(':checked')){
+            if($('.no').is(':checked')){
                 $('#incorrect').fadeIn('slow');
-                $('#yes').attr('disabled','disabled').delay(1000);;
+                $('.yes').attr('disabled','disabled').delay(1000);;
-                $('#no').prop('checked', true);
+                $('.no').prop('checked', true);
+                $('#try_again').fadeIn('slow');
             }
         })
     }
@@ -141,7 +283,7 @@ $(document).ready(function () {
         }
 
     }
-
+    
     function placeFood() {
         food = {
             x: Math.round(Math.random() * (w - cw) / cw),

package-lock.json

@@ -7,10 +7,15 @@
       "resolved": "https://registry.npmjs.org/get-form-data/-/get-form-data-2.0.0.tgz",
       "integrity": "sha512-YUpw0aTWeGliifqMYrTohe/YdqVmKLmaNwuscd2WlRNGfba57JHGuuvvv2c6LiZdFys285POVWANTh6SqcwFag=="
     },
-    "local-storage": {
+    "json-loader": {
-      "version": "1.4.2",
+      "version": "0.5.7",
-      "resolved": "https://registry.npmjs.org/local-storage/-/local-storage-1.4.2.tgz",
+      "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.7.tgz",
-      "integrity": "sha1-fsLT+38eqRqFsWDTp4UFj4e/v6U="
+      "integrity": "sha512-QLPs8Dj7lnf3e3QYS1zkCo+4ZwqOiF9d/nZnYozTISxXWCfNs9yuky5rJw4/W34s7POaNlbZmQGaB5NiXCbP4w=="
+    },
+    "jsonloader": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/jsonloader/-/jsonloader-1.0.1.tgz",
+      "integrity": "sha1-OHc4k03g0kGodkxzNueLhwzp8B4="
     }
   }
 }

snake.css

@@ -12,26 +12,48 @@ body {
 	border: 3px red solid;
 
 }
-
+.accept{
+	font-size: 20px;
+	height: 50px;
+	width: 50px;
+}
 #add_question {
 	position : absolute;
 	top: 100px;
-	left: 1500px;
+	left: 2000px;
 }
 #popup {
-	position : absolute;
+    background-color: rgba(0,0,0,.25);
-	top: 150px;
+    bottom: 0;
-	left: 300px;
+    display: none;
-	font-size: 20px;
+	justify-content: center;
-	text-align: center;
+	align-items: center;
-	color: rgb(100, 219, 223);
+    left: 0;
-	display: none;
+    position: fixed;
+    top: 0;
+	width: 100%;
+	
+}
+#form-popup {
+	
+	position: absolute;
+	justify-content: center;
+	align-items: center;
+	display: flex;
+	top: 20%;
+	left: 40%;
+	background-color: rgb(255,255,255);
+	border-radius: 10px;
+	padding: 0;
+	width: 700px;
+	height: 700px;
+	flex-direction: column;
+	font-family: Arial;
 }
-
 #popup_question {
 	position : absolute;
 	top: 150px;
-	left: 1500px;
+	left: 2000px;
 	font-size: 20px;
 	text-align: center;
 	color: rgb(100, 219, 223);
@@ -42,10 +64,53 @@ body {
     display: none;
 }
 #correct{
-    display: none;
+	display: none;
+	color: #10c878;
 }
 #incorrect{
-    display: none;
+	display: none;
+	color: #c91616;
+}
+#restart{
+	display: none;
+	-moz-box-shadow: 0px 10px 14px -7px #276873;
+	-webkit-box-shadow: 0px 10px 14px -7px #276873;
+	box-shadow: 0px 10px 14px -7px #276873;
+	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #599bb3), color-stop(1, #408c99));
+	background:-moz-linear-gradient(top, #599bb3 5%, #408c99 100%);
+	background:-webkit-linear-gradient(top, #599bb3 5%, #408c99 100%);
+	background:-o-linear-gradient(top, #599bb3 5%, #408c99 100%);
+	background:-ms-linear-gradient(top, #599bb3 5%, #408c99 100%);
+	background:linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
+	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#599bb3', endColorstr='#408c99',GradientType=0);
+	background-color:#599bb3;
+	-moz-border-radius:8px;
+	-webkit-border-radius:8px;
+	border-radius:8px;
+	cursor:pointer;
+	color:#ffffff;
+	font-family:Arial;
+	font-size:20px;
+	font-weight:bold;
+	padding:13px 32px;
+	text-decoration:none;
+	text-shadow:0px 1px 0px #3d768a
+
+}
+#restart:hover{
+	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #408c99), color-stop(1, #599bb3));
+	background:-moz-linear-gradient(top, #408c99 5%, #599bb3 100%);
+	background:-webkit-linear-gradient(top, #408c99 5%, #599bb3 100%);
+	background:-o-linear-gradient(top, #408c99 5%, #599bb3 100%);
+	background:-ms-linear-gradient(top, #408c99 5%, #599bb3 100%);
+	background:linear-gradient(to bottom, #408c99 5%, #599bb3 100%);
+	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#408c99', endColorstr='#599bb3',GradientType=0);
+	background-color:#408c99;
+}
+
+#restart:active{
+	position:relative;
+	top:1px;
 }
 
 #score {
@@ -66,6 +131,49 @@ a {
 	color : #FFFFFF;
 }
 
-span {
+.popup-item{
-	color : #FFFFFF;
+	text-align: center;
-}
+}
+
+#try_again{
+	display: none;
+	-moz-box-shadow: 0px 10px 14px -7px #276873;
+	-webkit-box-shadow: 0px 10px 14px -7px #276873;
+	box-shadow: 0px 10px 14px -7px #276873;
+	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #599bb3), color-stop(1, #408c99));
+	background:-moz-linear-gradient(top, #599bb3 5%, #408c99 100%);
+	background:-webkit-linear-gradient(top, #599bb3 5%, #408c99 100%);
+	background:-o-linear-gradient(top, #599bb3 5%, #408c99 100%);
+	background:-ms-linear-gradient(top, #599bb3 5%, #408c99 100%);
+	background:linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
+	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#599bb3', endColorstr='#408c99',GradientType=0);
+	background-color:#599bb3;
+	-moz-border-radius:8px;
+	-webkit-border-radius:8px;
+	border-radius:8px;
+	cursor:pointer;
+	color:#ffffff;
+	font-family:Arial;
+	font-size:20px;
+	font-weight:bold;
+	padding:13px 32px;
+	text-decoration:none;
+	text-shadow:0px 1px 0px #3d768a
+}
+
+#try_again:hover{
+	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #408c99), color-stop(1, #599bb3));
+	background:-moz-linear-gradient(top, #408c99 5%, #599bb3 100%);
+	background:-webkit-linear-gradient(top, #408c99 5%, #599bb3 100%);
+	background:-o-linear-gradient(top, #408c99 5%, #599bb3 100%);
+	background:-ms-linear-gradient(top, #408c99 5%, #599bb3 100%);
+	background:linear-gradient(to bottom, #408c99 5%, #599bb3 100%);
+	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#408c99', endColorstr='#599bb3',GradientType=0);
+	background-color:#408c99;
+}
+
+#try_again:active{
+	position:relative;
+	top:1px;
+}
+

snake.html

@@ -18,20 +18,24 @@
             <button id="send_question" type="submit">Wyslij</button>
         </form>
         <div id="popup">
-            Odpowiedz na pytanie!
+            <div id="form-popup">
-            <br>
+                <h2>Odpowiedz na pytanie!</h2>
-            <p>Czy lubisz jablka?</p>
-            <input class="yes" type="radio" value="option1" name="yes_no">odpowiedz1<br>
-            <input class="no" type="radio" value="option2" name="yes_no">odpowiedz2<br>
-            <a type="submit" value="submit">
-                <span id="correct">To jest dobra odpowiedz,<br> mozesz grac dalej!</span><br>
-                <!-- <button id="continue_game">Ruszaj dalej!</button> -->
-                <div id="incorrect">To jest zla odpowiedz!Przegrales!<br>
-                        Twoj wynik to: <span id="final"></span>
-                </div>
-
                 <br>
-                <a id="#restart" onClick="window.location.reload()" href="#">Click To Play Again</a>
+                <h3>Czy lubisz jablka?</h3>
+                <input  class="yes" class="popup-item" type="radio" value="option1" name="yes_no"><span id="yes">odpowiedz1</span><br>
+                <input  class="no" class="popup-item" type="radio" value="option2" name="yes_no"><span id="no_one">odpowiedz2</span><br>
+                <input  class="no" class="popup-item" type="radio" value="option3" name="yes_no"><span id="no_two">odpowiedz3</span><br>
+                <input  class="no" class="popup-item" type="radio" value="option4" name="yes_no"><span id="no_three">odpowiedz4</span><br>
+                <!-- <button id="accept" type="submit">DALEJ!</button> -->
+                    <br><span id="correct">To jest dobra odpowiedz, mozesz grac dalej!</span><br>
+                    <!-- <button id="continue_game">Ruszaj dalej!</button> -->
+                    <span id="incorrect">To jest zla odpowiedz! Przegrales!
+                            Twoj wynik to: <span id="final"></span><br>
+                    </span>
+                    <br>
+                    <button id="restart" href="#">Click to Contiune</button>
+                    <button id="try_again" href="#">Try again</button>
+            </div>        
         </div>
         <canvas id="myCanvas" width="600" height="450">
 			Your browser does not support the canvas feature
@@ -41,9 +45,10 @@
             </div>
         </div>
     </div>
-
+    <!-- Json
+    <script src="js/pytania.json" type="text/javascript"></script> -->
     <!-- jQuery -->
-    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
+    <script src="https://code.jquery.com/jquery-3.1.1.min.js" type="text/javascript"></script>
     <!-- Main JS -->
     <script src="js/snake.js"></script>