HealthyMovieNight

By jhclaura in Blog, Mashups Web APIs, Spring 2014 0 Comment

Eat wo Quilt

(click pic to enter)

Idea:

  1. choose your movie
  2. choose your food
  3. give me your weight
  4. movie length * calories burn by exercising per min = calories of food in certain amount you have.

Issues:

  1. hard to find regular food calories API
    • right now just use the first item in the array
  2. pizza has no serving size unit(null)
  3. id –> name

API:

  1. The Movie Database API
  2. Nutritionix

Source:

 

html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<title> FanGuide </title>
		<link rel="stylesheet" type="text/css" href="style.css"/>

		<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
		<script type="text/javascript" src="http://underscorejs.org/underscore-min.js"></script>

	</head>
	<body>
		<p>The Movie Tonight
		<input id="movie" type="text"/></p>
		<p>The Food Tonight
		<input id="food" type="text"/></p>
		<p>Feel Like
		<button id="saw">Forestry</button> 
		<button id="fish">Fishing</button>
		<button id="dance">Ballet</button>
		<button id="jog">Water Jogging</button>
		Tonight</p>
		<p>Your Weight
		<input id="weight" type="text"/>
		<button id="kgButton">kg</button>
		<button id="lbsButton">lbs</button>
		</p>

		<button id="searchButton">Search</button>
		<!-- <button onClick="getFoodData();return false;">ARMS Surveys</button>
		<div id="divResultARMS"></div> -->
		<!-- <button id="update">UPDATE</button> -->
		<div id="articles"></div>
		<div id="articles2"></div>

	</body>
		<script type="text/javascript" src="script_new.js"></script>
</html>

js

var idMovie;
var movieTitle;
var duration;

var idFood;
var nameFood;
var calories;
var servingSize;
var servingSizeUnit;

var weightUnit;
var exerciseType;	// int
var exerciseTypeText;
var caloriesExercise;

var caloriesBurnAfterExersice;
var amountToEat;

var base_url = "http://image.tmdb.org/t/p/w500";

function getDuration(){
	var url = 'https://api.themoviedb.org/3/',
		mode = 'movie/',
		key = '?api_key=YourKey';

	$.ajax({
		url: url + mode + idMovie + key,
		dataType: 'jsonp',
		success: function(data){
			console.log(data);
			console.log("<img srt="" + base_url + data.backdrop_path + "">");

			movieTitle = data.original_title;

			duration = data.runtime;
			$('#articles').append("<div class='articleBox'>");
			//$('#articles').append("<p>" + movieTitle + "'s runtime: " + duration +"min" + "</p>");
			//$('#articles').append("<img src="" + base_url + data.backdrop_path + "">");
			$('#articles').append("</div>");

			$('#articles').css({
				"color": "white"
			});

			$('body').css({
				"background-image": "url("" + base_url + data.backdrop_path + "")",
				"color": "white"
			});
			getFoodID();
		}
	});

}

function getFoodID(){
	var url = 'https://api.nutritionix.com/v1_1/',
		search = 'search/',
		appId = '&appId=YourId',
		appKey = '&appKey=YourKey',
		setUp = 'results=0%3A10&cal_min=0&cal_max=50000&fields=item_name%2Cbrand_name%2Citem_id%2Cbrand_id';

	var input = $('#food').val(),
		foodName = encodeURI(input);

	$.ajax({
		url: url + search + foodName + '?' + setUp + appId + appKey,
		dataType: 'json',

		error: function(data){
			console.log("Something wrong!");
		},
		success: function(data){
			console.log(data);

			idFood = data.hits[0]._id;
			nameFood = data.hits[0].fields.brand_name + "'s " + data.hits[0].fields.item_name;

			console.log(idFood + nameFood);

			getNutrition();
		}
	});

}

function getNutrition(){
	var url = 'https://api.nutritionix.com/v1_1/',
		item = 'item?',
		appId = '&appId=YourId',
		appKey = '&appKey=YourKey';

	// nutrition search
	$.ajax({
		url: url + item + 'id=' + idFood + appId + appKey,
		dataType: 'json',

		error: function(data){
			console.log("Something wrong!");
		},
		success: function(data){
			console.log(data);

			// calories = data.nf_calories;
			// servingSize = data.nf_serving_size_qty;
			if(data.nf_serving_size_unit !== null){
				servingSizeUnit = data.nf_serving_size_unit;
			}

			if(data.nf_serving_size_qty !== null){
				calories = data.nf_calories / data.nf_serving_size_qty;
			} else {
				calories = data.nf_calories;
			}

			$('#articles').append("<div class='articleBox'>");
			//$('#articles').append("<p>" + nameFood + "'s calories: " + calories + " per 1 " + servingSizeUnit + "</p>");
			$('#articles').append("</div>");

			calculateEat();
		}
	});
}

function caloriesSetUp(){

	$('#jog').click(function(){
		exerciseType = 363;
		exerciseTypeText = "jog in water";
	});

	$('#saw').click(function(){
		exerciseType = 318;
		exerciseTypeText = "saw trees";
	});

	$('#fish').click(function(){
		exerciseType = 114;
		exerciseTypeText = "fish";
	});

	$('#dance').click(function(){
		exerciseType = 205;
		exerciseTypeText = "dance ballet";
	});

	// unit set-up
	$('#kgButton').click(function(){
		weightUnit = "kg";
	});

	$('#lbsButton').click(function(){
		weightUnit = "lbs";
	});

}

function caloriesBurn(){

	var input = $('#weight').val();
	if (weightUnit == "lbs") {
		caloriesExercise = exerciseType / 100 * input;
	} else {
		caloriesExercise = exerciseType / 100 * (input*2.20462);
	}

	return caloriesExercise;
}

function calculateEat(){

	caloriesBurn();

	// how many calories it will burn after exercising
	caloriesBurnAfterExersice = caloriesExercise / 60 * duration;

	// for certain calories, how many I can eat(per 1 serving size)
	amountToEat = caloriesBurnAfterExersice / calories;
	amountToEat = Math.round( amountToEat *10)/10;

	console.log(amountToEat);

	$('#articles2').append("<div class='articleBox'>");
	if(servingSizeUnit !== null){
		$('#articles2').append("<p>During " + movieTitle + ", if you " + exerciseTypeText + " all the way through it, you can eat " + amountToEat + " " + servingSizeUnit + " of " + nameFood + " without worrying gaining any weights!</p>");
	} else {
		$('#articles2').append("<p>During " + movieTitle + ", if you " + exerciseTypeText + " all the way through it, you can eat " + amountToEat + " " + nameFood + " without worrying gaining any weights!</p>");
	}
	$('#articles2').append("<p>Calories burnnnnnn.</p>");
	// $('#articles').append("<img src="" + base_url + data.backdrop_path + "">");
	$('#articles2').append("</div>");
}

$(document).ready(function(){
	var url = 'https://api.themoviedb.org/3/',
		mode = 'search/movie',
		input,
		movieName,
		//var url = "https://api.themoviedb.org/3/movie/550?api_key=";
		key = '?api_key=YourKey';

	caloriesSetUp();

	$('#searchButton').click(function(){
		var input = $('#movie').val(),
			movieName = encodeURI(input);

		$.ajax({
			url: url + mode + key + '&query=' + movieName,
			dataType: 'jsonp',
			success: function(data){
				console.log(data);

				idMovie = data.results[0].id;

				getDuration();

			}
		});

	});

});

css

.searchButton{
	width: 100px;
	height: 50px;
	text-align: center
}

.articles {
	text-align: center;

}

Related Articles.

Leave a Comment.