Pacman/Firebase

navidmx · Aug 5, 2016 · 962af9a · 962af9a
1 parent 07021b2
commit 962af9a
Show file tree

Hide file tree

Showing 13 changed files with 263 additions and 37 deletions.
diff --git a/Web Dev/Build a Game/assets/Orange Ghost.png b/Web Dev/Build a Game/assets/Orange Ghost.png
diff --git a/Web Dev/Build a Game/index.html b/Web Dev/Build a Game/index.html
@@ -4,12 +4,28 @@
     <link rel="stylesheet" href="style.css">
     <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.2/p5.min.js"></script>
     <script src = "http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
-    <script src = "script.js" type="text/javascript"></script>
+    <script src="https://www.gstatic.com/firebasejs/3.2.1/firebase.js"></script>
+    <script>
+      // Initialize Firebase
+      var config = {
+        apiKey: "AIzaSyAxEcWqSxZ5B0TnfwrEwYWpNEKD0MEuoeE",
+        authDomain: "all-star-code.firebaseapp.com",
+        databaseURL: "https://all-star-code.firebaseio.com",
+        storageBucket: "",
+      };
+      firebase.initializeApp(config);
+    </script>
+
     <script src = "p5.play.js" type="text/javascript"></script>
+    <link href="https://fonts.googleapis.com/css?family=Bungee+Inline" rel="stylesheet">
     <title>Pacman 2.0</title>
 </head>
 <body>
 <center>
+    <div id="pacman"><script src='script.js'></script></div>
+    <div id="highScores"></div>
+    <input placeholder='Name' type='text' id='name'>
+    <button onclick='sendPoints()' id='js'>Submit</button>
 </center>
 </body>
 </html>
diff --git a/Web Dev/Build a Game/script.js b/Web Dev/Build a Game/script.js
@@ -4,16 +4,20 @@ var count,score;
 var pacman,pacmanX,pacmanY;
 var ghostX,ghostY,ghostSpeed;
 var redGhostX,redGhostY,redGhostSpeed;
+var orangeGhostX,orangeGhostY,orangeGhostSpeed;
 var activeGhost = false;
 var redActiveGhost = false;
+var orangeActiveGhost = false;
 var lose=false;
 var startGame=false;
+var database = firebase.database().ref();
 
 function preload(){
     pacman=loadAnimation("http://i.imgur.com/1o2HATt.png", "http://i.imgur.com/1o2HATt.png", "http://i.imgur.com/FqKY7Gv.png", "http://i.imgur.com/FqKY7Gv.png");
     normalpacman=loadAnimation("http://i.imgur.com/1o2HATt.png");
     ghost=loadAnimation("http://i.imgur.com/2dH1SQG.png");
     redGhost=loadAnimation("http://i.imgur.com/XrA4iP3.png");
+    orangeGhost=loadAnimation("http://i.imgur.com/LbXpxZw.png");
 }
 
 function setup(){
@@ -24,8 +28,11 @@ function setup(){
     ghostY=50;
     redGhostX=650;
     redGhostY=50;
+    orangeGhostX=650;
+    orangeGhostY=50;
     ghostSpeed=4;
     redGhostSpeed=4;
+    orangeGhostSpeed=4;
     timer=0;
     masterTimer=0;
     score=0;
@@ -78,9 +85,15 @@ function createGhost(){
     activeGhost=true;
 }
 
+function createOrangeGhost(){
+    orangeGhostY=random(50,450);
+    orangeGhostSpeed=random(3,6);
+    orangeActiveGhost=true;
+}
+
 function createRedGhost(){
     redGhostY=random(50,450);
-    redGhostSpeed=random(3,6);
+    redGhostSpeed=random(4,7);
     redActiveGhost=true;
 }
 
@@ -104,6 +117,12 @@ function logic(){
             ghostX=650;
         }
         if (masterTimer>600){
+            if (orangeGhostX<0){
+                orangeActiveGhost=false;
+                orangeGhostX=650;
+            }
+        }
+        if (masterTimer>1200){
             if (redGhostX<0){
                 redActiveGhost=false;
                 redGhostX=650;
@@ -113,6 +132,10 @@ function logic(){
     animation(ghost,ghostX,ghostY);
     ghostX-=ghostSpeed;
     if (masterTimer>600){
+        animation(orangeGhost,orangeGhostX,orangeGhostY);
+        orangeGhostX-=orangeGhostSpeed;
+    }
+    if (masterTimer>1200){
         animation(redGhost,redGhostX,redGhostY);
         redGhostX-=redGhostSpeed;
     }
@@ -141,6 +164,11 @@ function ghostCollision(){
             ghostX=650;
             activeGhost=false;
         }
+        if (bullet.bulletX > orangeGhostX-20 && bullet.bulletX < orangeGhostX+20 && bullet.bulletY > orangeGhostY-20 && bullet.bulletY < orangeGhostY+25){
+            score+=1;
+            orangeGhostX=650;
+            orangeActiveGhost=false;
+        }
         if (bullet.bulletX > redGhostX-20 && bullet.bulletX < redGhostX+20 && bullet.bulletY > redGhostY-20 && bullet.bulletY < redGhostY+25){
             score+=1;
             redGhostX=650;
@@ -150,6 +178,9 @@ function ghostCollision(){
     if (pacmanX > ghostX-20 && pacmanX < ghostX+20 && pacmanY > ghostY-20 && pacmanY < ghostY+25){
         lose=true;
     }
+    if (pacmanX > orangeGhostX-20 && pacmanX < orangeGhostX+20 && pacmanY > orangeGhostY-20 && pacmanY < orangeGhostY+25){
+        lose=true;
+    }
     if (pacmanX > redGhostX-20 && pacmanX < redGhostX+20 && pacmanY > redGhostY-20 && pacmanY < redGhostY+25){
         lose=true;
     }
@@ -171,12 +202,16 @@ function draw(){
         walls();
         ghostCollision();
         masterTimer+=1;
-        console.log(masterTimer);
         if (lose==false){
             if (activeGhost==false){
                 createGhost();
             }
             if (masterTimer>600){
+                if (orangeActiveGhost==false){
+                    createOrangeGhost();
+                }
+            }
+            if (masterTimer>1200){
                 if (redActiveGhost==false){
                     createRedGhost();
                 }
@@ -196,4 +231,18 @@ function draw(){
             text("Final Score: "+score, 300, 285);
         }
     }
-}
+}
+
+function sendPoints(){
+    var name = $('#name').val();
+    var points = score;
+    database.push({
+        'name':name,
+        'points':points,
+    });
+}
+
+database.orderByChild("points").limitToLast(5).on('child_added',function(dataRow){
+    var row = dataRow.val();
+    $("#highScores").append("<h3>"+": "+row.name+" - "+row.points+"</h3>");
+    })
diff --git a/Web Dev/Build a Game/style.css b/Web Dev/Build a Game/style.css
@@ -10,4 +10,8 @@ body {
   justify-content: center;
 
   align-items: center;
+}
+
+#pacman {
+    font-family: 'Bungee Inline';
 }
diff --git a/Web Dev/Firebase/index.html b/Web Dev/Firebase/index.html
@@ -0,0 +1,29 @@
+<html>
+  <head>
+  </head>
+  <body>
+    <!-- What user will use for input -->
+    <input placeholder='Name' type='text' id='name'>
+    <input placeholder='Message' type='text' id='message'>
+    <!-- button for sending message to message board -->
+    <button onclick='sendMessage()' id='js'>Use Plain JS</button>
+    <!-- Empty div where the messages will show up -->
+    <div id='messageBoard'></div>
+    <script src="https://www.gstatic.com/firebasejs/3.2.1/firebase.js"></script>
+    <script>
+      // Initialize Firebase
+      var config = {
+        apiKey: "AIzaSyAxEcWqSxZ5B0TnfwrEwYWpNEKD0MEuoeE",
+        authDomain: "all-star-code.firebaseapp.com",
+        databaseURL: "https://all-star-code.firebaseio.com",
+        storageBucket: "",
+      };
+      firebase.initializeApp(config);
+    </script>
+
+    <!-- adding jQuery -->
+    <script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
+    <!-- script we'll make dynamic changes with. You'll have to create this file -->
+    <script src='script.js'></script>
+  </body>
+</html>
diff --git a/Web Dev/Firebase/script.js b/Web Dev/Firebase/script.js
@@ -0,0 +1,16 @@
+var database = firebase.database().ref();
+
+function sendMessage(){
+    var name = $('#name').val();
+    var message = $('#message').val();
+    //Sending messages
+    database.push({
+        'name':name,
+        'message':message
+    });
+}
+
+database.on('child_added',function(dataRow){
+    var row = dataRow.val();
+    $("#messageBoard").append("<p>"+row.name+": "+row.message+"</p>");
+})
diff --git a/Web Dev/Group Code/groupCodeAPI.html b/Web Dev/Group Code/groupCodeAPI.html
diff --git a/Web Dev/Group Code/groupCodeAPI.js b/Web Dev/Group Code/groupCodeAPI.js
diff --git a/Web Dev/IMDB API/apiPract.css b/Web Dev/IMDB API/apiPract.css
@@ -0,0 +1,31 @@
+html, body{
+    background-color: cornsilk;
+}
+
+#name{
+    height:50px;
+    font-family: 'Bungee Inline';
+    width:300px;
+    font-size:16pt;
+    text-align: center;
+}
+
+#submit{
+    font-family: 'Bungee Inline';
+    border:none;
+    font-size:14pt;
+    color:white;
+    margin-top:10px;
+    background-color: cornflowerblue;
+    text-align: center;
+    padding: 8px 32px;
+}
+
+#submit:hover{
+    background-color: deepskyblue;
+    cursor: pointer;
+}
+
+#img{
+    margin-top: 50px;
+}
diff --git a/Web Dev/IMDB API/apiPract.html b/Web Dev/IMDB API/apiPract.html
@@ -0,0 +1,16 @@
+<html>
+  <head>
+  </head>
+  <body>
+      <center>
+    <input id='name' placeholder="Movie Name">
+          <br>
+    <button id='submit'>Submit</button>
+    <div id='poster'></div>
+    <div id='content'></div>
+    <script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
+    <script src='apiPract.js'></script>
+    <link rel="stylesheet" type="text/css" href="apiPract.css">
+          </center>
+  </body>
+</html>
diff --git a/Web Dev/IMDB API/apiPract.js b/Web Dev/IMDB API/apiPract.js
@@ -0,0 +1,30 @@
+$("#submit").click(function(){
+    grabData();
+})
+
+function grabData(){
+    var name = $("#name").val();
+    $.ajax({
+        url:"http://www.omdbapi.com/?t="+name,
+        success:function(result){
+            console.log(result);
+        }
+    })
+}
+
+function print(obj){
+    $('#content').text('');
+    $('#poster').text('');
+    for(var prop in obj){
+        if (prop!="Poster"){
+            $('#content').append('<p>'+prop+': '+obj[prop]+'</p>');
+        }
+        if (prop=="Poster"){
+            $('#poster').append('<img src="'+obj[prop]+'">');
+        }
+    }
+}
+
+$('#submit').click(function(){
+    grabData();
+})
diff --git a/Web Dev/Random Song API/index.html b/Web Dev/Random Song API/index.html
@@ -0,0 +1,11 @@
+<html>
+<head>
+</head>
+<body>
+    <center>
+    <button id='submit'>Random Word</button>
+    <script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
+    <script src='script.js'></script>
+    </center>
+</body>
+</html>