joyjding/js_om.js

## js_om.js
//The Recipe Card

var recipeCard = {
 "title": "Mac 'n Cheese",
 "servings": 8,
 "ingredients": ["cheese", "pasta", "butter", "flour", "pepper", "broccoli"]
}

// console.log(recipeCard.title);
// console.log('Serves: '+ recipeCard.servings);

// console.log('Ingredients: ')
// for (var ingredients in recipeCard.ingredients) {
//     console.log(recipeCard.ingredients[ingredients])
// }

var recipeCard2 = {
    "title": "Guacamole",
    "servings": 10,
    "ingredients": ["avocados", "pepper", "salt", "lime juice", "sriracha"]
}


var cookBook = [recipeCard, recipeCard2]


function printCookBook(cookBook) {

   for (var i =0; i<cookBook.length; i++){
        console.log(cookBook[i].title);
        console.log('Serves: '+ cookBook[i].servings);

        console.log('Ingredients: ')
        for (var ingredients in cookBook[i].ingredients) {
            console.log(cookBook[i].ingredients[ingredients]);
        }
    }

    console.log(' ')
}

printCookBook(cookBook);

// The Reading List

var book = {
    "title":"Imaginary Girls",
    "author": "N. Ay",
    "alreadyRead": false

}

var book2 = {
    "title": "Eating Animals",
    "author": "Jonathan Safron Foer",
    "alreadyRead": true
}

var bookList = [book, book2]

for (var i = 0;  i < bookList.length; i++) {
    if (bookList[i].alreadyRead) {
        console.log("You've already read " + bookList[i].title + " by " + bookList[i].author)
    }
    else {
        console.log("You still have to read " + bookList[i].title + " by " + bookList[i].author)
    }
    console.log("\n");
}

//Movie database


var movie1 = {
    "title": "ratatouille",
    "duration":"not long enough",
    "stars": ["Cook Dude", "Rat", "Chef that talks from beyond grave", "Token mean person", "Token woman who falls in love with hero"]
}

var movie2 = {
    'title': 'Monster\'s, Inc.',
    'duration': "too short",
    'stars': ['Mike Wazzowski', "Shelley", "Boo"]
}

var movies = [movie1, movie2]

var printMovies = function(movies){
    var starList = "";
    for(var i = 0; i < movies.length; i++){

        for(var j = 0; j<movies[i].stars.length; j++){
            if (j < movies[i].stars.length-1){
                starList = starList + movies[i].stars[j]  + ", "
            } else {
                starList = starList + movies[i].stars[j] + "."
            }
        }

        console.log(movies[i].title + " lasts for " + movies[i].duration + '. ' + "Stars: " + starList)
        starList = ""
    }


}

printMovies(movies);

## the_book_list.html
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<title>My Book List</title>
	</head>
	<body>
		<h1>My Book List</h1>

	</body>
</html>

<script>

var book = {
    "title":"Imaginary Girls",
    "author": "N. Ay",
    "alreadyRead": false

};

var book2 = {
    "title": "Eating Animals",
    "author": "Jonathan Safron Foer",
    "alreadyRead": true
};

var bookList = [book, book2];

var pageNode = document.getElementsByTagName('body')[0];

for (i = 0; i < bookList.length; i++){
	var newParagraphs = document.createElement('p');
	for (j = 0; j<bookList[i].length; j++) {
		var listItem = document.createElement("li");
		var listText = document.createTextNode(bookList[i][j]);
		listItem.appendChild(listText);
		//var paragraphText = document.createTextNode("Title: " + bookList[i].title + ", Author: " + bookList[i].author);
	}
	//newParagraphs.appendChild(paragraphText);
	pageNode.appendChild(newParagraphs);

}

</script>

<!--
Keep track of which books you read and which books you want to read!

Create a webpage with an h1 of "My Book List".
Add a script tag to the bottom of the page, where all your JS will go.
Copy the array of books from the previous exercise.
Iterate through the array of books. For each book, create a p element with the book title and author and append it to the page.
Bonus: Use a ul and li to display the books.
Bonus: add a property to each book with the URL of the book cover, and add an img element for each book on the page.
Bonus: Change the style of the book depending on whether you have read it or not. -->
	//The Recipe Card

	var recipeCard = {
	"title": "Mac 'n Cheese",
	"servings": 8,
	"ingredients": ["cheese", "pasta", "butter", "flour", "pepper", "broccoli"]
	}

	// console.log(recipeCard.title);
	// console.log('Serves: '+ recipeCard.servings);

	// console.log('Ingredients: ')
	// for (var ingredients in recipeCard.ingredients) {
	// console.log(recipeCard.ingredients[ingredients])
	// }

	var recipeCard2 = {
	"title": "Guacamole",
	"servings": 10,
	"ingredients": ["avocados", "pepper", "salt", "lime juice", "sriracha"]
	}


	var cookBook = [recipeCard, recipeCard2]


	function printCookBook(cookBook) {

	for (var i =0; i<cookBook.length; i++){
	console.log(cookBook[i].title);
	console.log('Serves: '+ cookBook[i].servings);

	console.log('Ingredients: ')
	for (var ingredients in cookBook[i].ingredients) {
	console.log(cookBook[i].ingredients[ingredients]);
	}
	}

	console.log(' ')
	}

	printCookBook(cookBook);

	// The Reading List

	var book = {
	"title":"Imaginary Girls",
	"author": "N. Ay",
	"alreadyRead": false

	}

	var book2 = {
	"title": "Eating Animals",
	"author": "Jonathan Safron Foer",
	"alreadyRead": true
	}

	var bookList = [book, book2]

	for (var i = 0; i < bookList.length; i++) {
	if (bookList[i].alreadyRead) {
	console.log("You've already read " + bookList[i].title + " by " + bookList[i].author)
	}
	else {
	console.log("You still have to read " + bookList[i].title + " by " + bookList[i].author)
	}
	console.log("\n");
	}

	//Movie database


	var movie1 = {
	"title": "ratatouille",
	"duration":"not long enough",
	"stars": ["Cook Dude", "Rat", "Chef that talks from beyond grave", "Token mean person", "Token woman who falls in love with hero"]
	}

	var movie2 = {
	'title': 'Monster\'s, Inc.',
	'duration': "too short",
	'stars': ['Mike Wazzowski', "Shelley", "Boo"]
	}

	var movies = [movie1, movie2]

	var printMovies = function(movies){
	var starList = "";
	for(var i = 0; i < movies.length; i++){

	for(var j = 0; j<movies[i].stars.length; j++){
	if (j < movies[i].stars.length-1){
	starList = starList + movies[i].stars[j] + ", "
	} else {
	starList = starList + movies[i].stars[j] + "."
	}
	}

	console.log(movies[i].title + " lasts for " + movies[i].duration + '. ' + "Stars: " + starList)
	starList = ""
	}



	}

	printMovies(movies);
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8"/>
	<title>My Book List</title>
	</head>
	<body>
	<h1>My Book List</h1>

	</body>
	</html>

	<script>

	var book = {
	"title":"Imaginary Girls",
	"author": "N. Ay",
	"alreadyRead": false

	};

	var book2 = {
	"title": "Eating Animals",
	"author": "Jonathan Safron Foer",
	"alreadyRead": true
	};

	var bookList = [book, book2];

	var pageNode = document.getElementsByTagName('body')[0];

	for (i = 0; i < bookList.length; i++){
	var newParagraphs = document.createElement('p');
	for (j = 0; j<bookList[i].length; j++) {
	var listItem = document.createElement("li");
	var listText = document.createTextNode(bookList[i][j]);
	listItem.appendChild(listText);
	//var paragraphText = document.createTextNode("Title: " + bookList[i].title + ", Author: " + bookList[i].author);
	}
	//newParagraphs.appendChild(paragraphText);
	pageNode.appendChild(newParagraphs);

	}

	</script>

	<!--
	Keep track of which books you read and which books you want to read!

	Create a webpage with an h1 of "My Book List".
	Add a script tag to the bottom of the page, where all your JS will go.
	Copy the array of books from the previous exercise.
	Iterate through the array of books. For each book, create a p element with the book title and author and append it to the page.
	Bonus: Use a ul and li to display the books.
	Bonus: add a property to each book with the URL of the book cover, and add an img element for each book on the page.
	Bonus: Change the style of the book depending on whether you have read it or not. -->