diff --git a/call_apply_bind_exercise/callApplyBind.js b/call_apply_bind_exercise/callApplyBind.js
index e69de29b..7aecb951 100644
--- a/call_apply_bind_exercise/callApplyBind.js
+++ b/call_apply_bind_exercise/callApplyBind.js
@@ -0,0 +1,136 @@
+// Fix the following code:
+
+var obj = {
+ fullName: "Harry Potter",
+ person: {
+ sayHi: function(){
+ return "This person's name is " + this.fullName
+ }
+ }
+}
+obj.person.sayHi.call(obj)
+
+
+
+var obj = {
+ fullName: "Harry Potter",
+ sayHi: function(){
+ return "This person's name is " + this.fullName
+ }
+}
+
+
+
+
+
+
+// Write a function called sumEvenArguments which takes all of the arguments passed to a function and returns the sum of the even ones.
+// sumEvenArguments(1,2,3,4) // 6
+// sumEvenArguments(1,2,6) // 8
+// sumEvenArguments(1,2) // 2
+
+//I feel like there should be an easier way to do this with less code ....
+function sumEvenArguments() {
+ var arr = [].slice.call(arguments)
+ var evens = []
+ arr.forEach(function(element) {
+ if (element % 2===0) {
+ evens.push(element)
+ }
+ })
+
+ var sum = 0
+ evens.forEach(function(element) {
+ sum = sum + element
+ })
+ return sum
+}
+
+
+// Write a function called arrayFrom which converts an array-like-object into an array.
+// function sample(){
+// var arr = arrayFrom(arguments)
+// if(!arr.reduce) throw "This is not an array!"
+// return arr.reduce(function(acc,next){
+// return acc+next;
+// },0)
+// }
+
+function arrayFrom() {
+ var arr = [].slice.call(arguments)
+ return arr
+}
+
+
+// Write a function called invokeMax which accepts a function and a maximum amount. invokeMax should return a function that when called increments a counter. If the counter is greater than the maximum amount, the inner function should return "Maxed Out"
+
+// function add(a,b){
+// return a+b
+// }
+
+// var addOnlyThreeTimes = invokeMax(add,3);
+// addOnlyThreeTimes(1,2) // 3
+// addOnlyThreeTimes(2,2) // 4
+// addOnlyThreeTimes(1,2) // 3
+// addOnlyThreeTimes(1,2) // "Maxed Out!"
+
+function invokeMax(fn, max) {
+ // var outerArgs = [].slice.call(arguments)
+ var counter = 0
+
+ return function() {
+ if (counter === max) {
+ return "Maxed Out!"
+ } else {
+ counter++
+ return fn.apply(this,arguments) //ES 5
+ // return fn(...arguments) //ES2015
+ }
+ }
+}
+
+
+
+// Write a function called guessingGame which takes in one parameter amount. The function should return another function that takes in a parameter called guess. In the outer function, you should create a variable called answer which is the result of a random number between 0 and 10 as well as a variable called guesses which should be set to 0.
+
+// In the inner function, if the guess passed in is the same as the random number (defined in the outer function) - you should return the string "You got it!". If the guess is too high return "You're too high!" and if it is too low, return "You're too low!". You should stop the user from guessing if the amount of guesses they have made is greater than the initial amount passed to the outer function.
+
+// You will have to make use of closure to solve this problem.
+
+// var game = guessingGame(5)
+// game(1) // "You're too low!"
+// game(8) // "You're too high!"
+// game(5) // "You're too low!"
+// game(7) // "You got it!"
+// game(1) // "You are all done playing!"
+
+// var game2 = guessingGame(3)
+// game2(5) // "You're too low!"
+// game2(3) // "You're too low!"
+// game2(1) // "No more guesses the answer was 0"
+// game2(1) // "You are all done playing!"
+
+
+function guessingGame(amount) {
+ var answer = (Math.floor(Math.random() *11))
+ var guesses = 0
+ return function() {
+ var guess = [].slice.call(arguments);
+ // var guess = args[0]
+ guesses++
+ if (guesses > amount) {
+ return "No more guesses, the answer was " + answer
+ } else if (guess > answer) {
+ return "You're too high!"
+ } else if (guess < answer) {
+ return "You're too low!"
+ } else {
+ return "You got it!"
+ }
+
+ }
+
+}
+
+
+
diff --git a/canvas_exercise/shapes_game/index.js b/canvas_exercise/shapes_game/index.js
index 0de5f18a..cdfce004 100644
--- a/canvas_exercise/shapes_game/index.js
+++ b/canvas_exercise/shapes_game/index.js
@@ -1,15 +1,67 @@
window.addEventListener("load", function() {
- function clear(ctx, width, heigt) {
+
+ function clear(ctx, width, height) {
+ ctx.clearRect(0,0,canvas.width,canvas.height)
+ }
+
+ function createTriangle(x,y) {
+ ctx.beginPath();
+ ctx.moveTo(x,y);
+ ctx.lineTo(x+100,y+100);
+ ctx.lineTo(x,y+100);
+ ctx.fill();
+ ctx.closePath();
}
+
function drawRandomShape(ctx, width, height) {
+ var shape = (Math.floor(Math.random() *4))+1 //number from 1-4
+ var x = (Math.floor(Math.random() * 700))+1 //wont go out of bounds on x axis
+ var y = (Math.floor(Math.random() * 650))+1 //wont go out of bounds on y axis
+
+
+ if (shape === 1) {
+ ctx.fillStyle = "white"
+ createTriangle(x,y)
+ expectedKey = 38
+
+ } else if (shape === 2) {
+ ctx.fillStyle = "red"
+ ctx.fillRect(x,y,100,100)
+ expectedKey = 40
+
+ } else if (shape === 3) {
+ ctx.fillStyle = "red"
+ createTriangle(x,y)
+ expectedKey = 37
+
+ } else if (shape === 4) {
+ ctx.fillStyle = "white"
+ ctx.fillRect(x,y,100,100)
+ expectedKey = 39
+
+ }
}
- function drawGameStartText(ctx, width, height, score) {
+ function drawGameStartText(ctx, width, height) {
+
+ ctx.fillStyle = "white"
+ ctx.font = "38px serif"
+ ctx.fillText("Press the space bar to start a new game",100, 350)
+}
+
+ function restartGame(ctx, width, height, score) {
+
+ drawGameStartText(ctx,width,height)
+ ctx.font = "25px serif"
+ ctx.fillText("Score: " + score, 350,400)
+
}
- function restartGame(ctx, width, height) {
+ function clearAndShow(ctx,width,height) {
+ clear(ctx,width,height)
+ drawRandomShape(ctx,width,height)
}
var canvas = document.getElementById("shapes-game"),
@@ -23,14 +75,42 @@ window.addEventListener("load", function() {
expectedKeysMap = {white0: 38, red1: 40, red0: 37, white1: 39},
timerSpan = document.getElementById("time-remaining"),
scoreSpan = document.getElementById("score-val"),
- seconds = 3,
+ seconds = 0,
intervalId;
canvas.width = width;
canvas.height = height;
- document.addEventListener("keyup", function() {
-
+ drawGameStartText(ctx, width, height)
+
+ document.addEventListener("keyup", function(e) {
+ //I feel like this nested if statements can be condensed.
+ if (timerSpan.innerHTML > 29) {
+ if (e.keyCode === 32) {
+ clearAndShow(ctx,width,height) // when space is first pressed, clear the words and show the first shape.
+ var decreaseTimerId = setInterval(function(){
+ timerSpan.innerHTML --; // decrease timer span
+ seconds ++ // variable to check when 30 seconds has elapsed ... somehow I could not use timerSpan.innerHTML to check??
+ if (seconds === 30) {
+ clearInterval(decreaseTimerId);
+ clear(ctx, width, height)
+ //show score on the screen and reset all the variables.
+ restartGame(ctx,width,height,scoreSpan.innerHTML)
+ seconds = 0;
+ timerSpan.innerHTML = 30
+ scoreSpan.innerHTML = 0
+ }
+ },1000)
+ }
+ //^ everything above checks if the space key is pressed and do some action based on a condition.
+ } else if (e.keyCode === expectedKey) {
+ scoreSpan.innerHTML ++
+ } else {
+ scoreSpan.innerHTML --
+ }
+
+ clearAndShow(ctx,width,height)
});
+
});
diff --git a/es2015_exercise/readme.md b/es2015_exercise/readme.md
index 9e482efa..defe5e67 100644
--- a/es2015_exercise/readme.md
+++ b/es2015_exercise/readme.md
@@ -12,17 +12,31 @@ var person = {
}
}
```
+var person = {
+ fullName: "Harry Potter",
+ sayHi(){
+ setTimeout(() => console.log("Your name is " + this.fullName).bind(this),1000)
+ }
+}
+
```javascript
var name = "Josie"
console.log("When " + name + " comes home, so good")
```
+var name = "Josie"
+console.log(`When ${name} comes home, so good`)
+
+
```javascript
var DO_NOT_CHANGE = 42;
DO_NOT_CHANGE = 50; // stop me from doing this!
```
+const DO_NOT_CHANGE = 42;
+DO_NOT_CHANGE = 50; // stop me from doing this!
+
```javascript
var arr = [1,2]
var temp = arr[0]
@@ -30,6 +44,11 @@ arr[0] = arr[1]
arr[1] = temp
```
+var [b,a] = arr
+-- or --
+var [a,b] = arr
+var arr = [b,a]
+
```javascript
function double(arr){
return arr.map(function(val){
@@ -38,6 +57,10 @@ function double(arr){
}
```
+var double = (arr) => arr.map(val => val*2);
+
+
+
```javascript
var obj = {
numbers: {
@@ -50,6 +73,10 @@ var a = obj.numbers.a;
var b = obj.numbers.b;
```
+var{a,b} = obj.numbers
+
+
+
```javascript
function add(a,b){
if(a === 0) a = 0
@@ -64,12 +91,18 @@ function add(a,b){
}
```
+var add = (a=10, b=10) => a+b
+
+
+
+
+
Research the following functions - what do they do?
-`Array.from` -
+`Array.from` - Creates an array from an array-like object
-`Object.assign` -
+`Object.assign` - Creates a new object with key-value pairs copied from another array.
-`Array.includes` -
+`Array.includes` - checks if a value is in the array but does not return the index
-`String.startsWith` -
+`String.startsWith` - returns true or false based on whether the string begins with the argument passed.
diff --git a/jquery_exercise/app.js b/jquery_exercise/app.js
new file mode 100644
index 00000000..2a149800
--- /dev/null
+++ b/jquery_exercise/app.js
@@ -0,0 +1,67 @@
+$(document).ready(function(){
+
+ var $article = $("#articles")
+
+ //the form is toggling on and off
+ var $addNew = $('#addNew')
+ var $formToggle = $('#formToggle')
+ $addNew.click(function() {
+ $form.toggle('form-inline-block form-inline')
+ })
+
+ var $favToggle = $('#fav')
+ var $notFavorites = $('.glyphicon-star-empty')
+ $favToggle.click(function() {
+ //this does not work yet.
+
+ $notFavorites.parent().toggle('hidden block')
+
+ // for (var i = 0; i < $notFavorites.length; i++) {
+ // $notFavorites.eq(i).next().addClass('hidden')
+ // }
+ //add class of hidden to li
+ // add something to ol tag that makes it unordered.
+
+ })
+
+ var $form = $('.form-inline')
+ var $title = $('#title')
+ var $url = $('#url')
+
+ $form.on('submit', function(e) { // adds a new list item when the submit button is pressed.
+ e.preventDefault(); //prevents the form from refreshing the page
+
+
+ var $newLi = $('