Adding Fitness Calculator

PHP Fitness Calculator

It is easy to add a fitness calculator to your site. A working example is located at http://ojambo.com/fitness-calculator. This process requires HTML and PHP.

    Tools Required:

  • Web Server
  • PHP
  • HTML
  • CSS
  • Knowledge of the fitness level to be served.

Create PHP file called BMI.php

<?php
/*
* BMI.php
* 
* Copyright 2010 Edward <http://ojambo.com>
* 
* This program is free software; you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation; either version 2 of the License, or
* (at your option) any later version.
* 
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
* GNU General Public License for more details.
* 
* You should have received a copy of the GNU General Public License
* along with this program; if not, write to the Free Software
* Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston,
* MA 02110-1301, USA.
*/


// Metric System Button
if (isset($_POST['metric-system'])) {
	$chosen_system = array();
	$chosen_system = array ('system' =>'metric', 
		'weight' => '(kilograms)',
		'height' => '(centimeters)',
		); 
}
// Standard System Button
if (isset($_POST['standard-system'])) {
	$chosen_system = array();
	$chosen_system = array ('system' =>'standard', 
		'weight' => '(pounds)',
		'height' => '(feet)',
		'height2' => '(inches)',
		); 
}
// Default to Metric System
else if (!isset($chosen_system)) {
	$chosen_system = array ('system' =>'metric', 
		'weight' => '(kilograms)',
		'height' => '(centimeters)',
		); 
}

// Metric System Calculations
if (isset($_POST['metric'])) { 
	if  (preg_match('/^([0-9.]{1,5})$/', $_POST['weight'])) {  
		$weight = $_POST['weight'];
	}
	if  (preg_match('/^([0-9.]{1,5})$/', $_POST['height'])) { 
		$height = ($_POST['height']/100);
		$height = $height * $height;
	}
	$BMI = round($weight/$height, 2); 
}

// Standard System Calculations
if (isset($_POST['standard'])) { 
	// ^ = begin [0-9.] = any number/period {1,5} = must be 1-5 characters
	if (preg_match('/^([0-9.]{1,5})$/', $_POST['weight'])) { 
		$weight = ($_POST['weight'])*703;
	}
	if  ((preg_match('/^([0-9.]{1,5})$/', $_POST['height']))
		&& (preg_match('/^([0-9.]{1,5})$/', $_POST['height2']))) { 
		$height = ((($_POST['height'])*12)+$_POST['height2']);
		$height = $height * $height;
	}
	$BMI = round($weight/$height, 2); 
} 

?>

An Array was utilized to store the specific units for the different measurement systems. The array also allows to easier expansion of the fitness calculator as shown with the http://ojambo.com/fitness-calculator.

Preg_match was used to make sure the user input is a valid number allowing for a decimal. The calculations were simple to allow for future porting to different languages such as javascript or python.

Create a separate html file or add to BMI.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
	<title>Ojambo BMI Calculator</title>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<meta name="generator" content="Geany 0.18" />
	<style type="text/css">
		form { width: 300px; }
		form tr {margin-bottom: 2px; }
		form td.description { width: 100px; }
		form td.description p { font-weight: bold; text-align:right; margin-top: 1px; }
		form td input, form td label { display: block;}
		form td input { width: 40px; }
		form td label { font-size: xx-small; font-weight:bold; }
		table.fitness-results { margin-bottom: 5px; }
		table.fitness-results td.description {text-align:right; padding-right:2px; }
		div.metric { width: 360px; background: lightgray; border: 2px solid blue; }
		div.standard { width: 360px; background: gray; border: 2px solid blue; }
		input#metric-system { background: lightgray; }
		input#standard-system { background: gray; }
	</style>
</head>

<body>
	<div class=<?php echo '"'.$chosen_system['system'].'"'; ?> >
		<form action="" method="POST">
		<input type="submit" value="METRIC" id="metric-system" name="metric-system" />
		<input type="submit" value="STANDARD" id="standard-system" name="standard-system" />
		<h3>Ojambo Fitness Calculator Demo</h3>
		</form>
		<form action="" method="POST">
			<table>
				<tr>
					<td class="description">
						<p>Weight is: </p>
					</td>
					<td>
						<input type="text" maxlength="5" name="weight" />
						<label for="weight"><?php echo $chosen_system['weight']; ?></label>
					</td>
				</tr>
				<tr>
					<td class="description">
						<p>Height is: </p>
					</td>
					<td>
						<input type="text" maxlength="5" name="height" />
						<label for="height"><?php echo $chosen_system['height']; ?></label>
					</td>
					<?php if (isset($chosen_system['height2'])) { ?>
						<td>
							<input type="text" maxlength="5" name="height2" />
							<label for="height2"><?php echo $chosen_system['height2']; ?></label>
						</td>
					<?php } ?>				
				</tr>
				<tr>
					<td class="description">
						<p>Waist is: </p>
					</td>
					<td>
						<input type="text" maxlength="5" name="waist" />
						<label for="waist"><?php echo $chosen_system['waist']; ?></label>
					</td>
				</tr>
			</table>
				
			<span class="bmi-buttons">
				<input type="submit" value="Calculate BMI" name=<?php echo '"'.$chosen_system['system'].'"'; ?> />
				<input type="reset" value="Clear" />
			</span>
		</form>	
		<?php if ($BMI > 0) { ?>
			<table class="fitness-results">
				<tr>
					<td class="description"> Body-Mass Index (BMI) </td>
					<td><?php echo $BMI; ?></td>
				</tr>
			</table>
			<strong>BMI Results:</strong>
			<table class="fitness-results">
				<tr>
					<th> BMI </th>
					<th> Description </th>
				</tr>
				<tr>
					<td class="description"> <18.5 </td>
					<td> Underweight </td>
				</tr>
				<tr>
					<td class="description"> 18.5 - 24.9 </td>
					<td> Normal </td>
				</tr>
				<tr>
					<td class="description"> 25 - 29.9 </td>
					<td> Overweight </td>
				</tr>
				<tr>
					<td class="description"> >30 </td>
					<td> Obese </td>
				</tr>
			</table>
		<?php } ?>
	</div>
</body>
</html>

Forms are used to tab between the metric and standard measurement systems. Tables were used because they allow for easier alignment. The results are displayed only if errors do not exist.

Testing Calculator

Only numbers are allowed with optional decimal “.” point between numbers. Default is the metric system. This example automatically clears errors.

    Recommendations:

  1. Put everything into one BMI.php.
  2. CSS can be put into a separate file.

Tags: , , , , , , , , ,

This entry was posted on Thursday, July 15th, 2010 at 4:53 pm and is filed under Tips & Tricks. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

One Response to “Adding Fitness Calculator”

  1. Adding Fitness Calculator Video 0004 Says:

    July 20th, 2010 at 9:20 pm

    […] Video for the ojambo.com adding fitness calculator article. […]

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>