I'm using a Wordpress plugin that I'm trying to customize for my needs but I'm very new to Javascript. The plugin calculates the distance between two zip codes which is what $distance is. I created a drop down menu with different values based on vehicle size. What I want to do is display the distance multiplied by the value assigned to each vehicle size (which is the cost per mile). Any help would be appreciated. Thank you.
<?php
/**
* Plugin Name: WP Distance Calculator
* Plugin URI: http://phpcodingschool.blogspot.com/
* Description: This plugin claculates distance between two near by locations.
* Version: 1.0.0
* Author: Monika Yadav
* Author URI: http://phpcodingschool.blogspot.com/
* License: GPL2
*/
class DistanceWPCalculator
{
public function __construct()
{ //action definations
add_shortcode( 'distance_calculator', array( &$this, 'distanceWPfrontend' ) );
add_action( 'wp_ajax_nopriv_distancewpcalculator', array( &$this, 'distancewpcalculator_calculate' ) );
add_action( 'wp_ajax_distancewpcalculator', array( &$this, 'distancewpcalculator_calculate' ) );
add_action( 'init', array( &$this, 'init' ) );
}
public function init()
{
wp_enqueue_script( 'distancewpcalculator', plugin_dir_url( __FILE__ ) . 'js/calculatedistance.js', array( 'jquery' ) );
wp_localize_script( 'distancewpcalculator', 'DistanceCalculator', array(
'ajaxurl' => admin_url( 'admin-ajax.php' )
) );
?>
<script>
var ajaxurl = "<?php echo admin_url('admin-ajax.php'); ?>";
</script>
<?php
wp_enqueue_style( 'DistanceWPCalculator-Style', plugin_dir_url( __FILE__ ) . 'css/style.css', array(), '0.1', 'screen' );
}
public function distancewpcalculator_calculate()
{
// The $_POST contains all the data sent via ajax
if ( isset($_POST) ) {
$from = urlencode($_POST['from']);
$to = urlencode($_POST['to']);
$data = file_get_contents("http://maps.googleapis.com/maps/api/distancematrix/json?origins=$from&destinations=$to&language=en-EN&sensor=false");
$data = json_decode($data);
$time = 0;
$distance = 0;
foreach($data->rows[0]->elements as $road) {
$time += $road->duration->value;
$distance += $road->distance->value;
}
$time =$time/60;
$distance =round($distance/1609.344);
//Output
if($distance!=0){
echo "<div id='result_generated'>";
echo "From: ".$data->origin_addresses[0];
echo "<br/>";
echo "To: ".$data->destination_addresses[0];
echo "<br/>";
echo "Time: ".gmdate("H:i", ($time * 60))." hour(s)";
echo "<br/>";
echo "Distance: ".$distance." mile(s)";
echo "</div>";
}else{
echo "Sorry only nearby distance can be calculated.";
}
}
die();
}
//Function to display form on front-end
public function distanceWPfrontend( $atts ) {
?>
<form method ="post" id="calculator" >
<div class="DC_title">Distance Calculator</div>
<input type="text" id="from" name="from" placeholder="From.."></br>
<input type="text" id="to" name="to" placeholder="To.."></br>
<select id="carType" onchange="carsize()">
<option value=".45">Motorcycle</option>
<option value=".6">Small Sedan</option>
<option value=".65">Large Sedan</option>
<option value=".7">Wagon/Hatchback</option>
<option value=".7">Small SUV</option>
<option value=".8">Large SUV</option>
<option value=".8">Minivan</option>
<option value=".75">Small Truck</option>
<option value=".8">Large Truck</option>
</select>
<input type="button" id="calculate" name="calculate" value="Calculate">
</form></br>
<div id="result"></div>
<?php
}
}
$distancewpcalculator = new DistanceWPCalculator();
?>
This is actually PHP. In your distancewpcalculator_calculate()
function you calculate the distance based on the results that the Google Maps API returns. You store the calculated distance in the $distance
variable (specifically $distance =round($distance/1609.344);)
. In that assignment you convert the recorded $distance
value from Km to Mi.
You should modify your HTML select tag and values to something like this:
<select id="carType" name="carType">
<option value=".45">Motorcycle</option>
<option value=".6">Small Sedan</option>
<option value=".65">Large Sedan</option>
<option value=".7">Wagon/Hatchback</option>
<option value=".7">Small SUV</option>
<option value=".8">Large SUV</option>
<option value=".8">Minivan</option>
<option value=".75">Small Truck</option>
<option value=".8">Large Truck</option>
</select>
Doing this will include the "carType" value in the $_POST
data. Now that it is in the post data, you can get the value selected by doing $_POST['carType']
. Now that data is recorded we can multiply the value of the distance by the carType selected.
public function distancewpcalculator_calculate()
{
// The $_POST contains all the data sent via ajax
if (isset($_POST)) {
...
$distance = round($distance / 1609.344);
$carType = $_POST['carType'];
$cost = $carType * $distance;
//Output
if ($distance != 0) {
...
echo "Distance: " . $distance . " mile(s)";
echo "<br />";
echo "Cost: {$cost}";
echo "</div>";
} else {
...
}
}
}
The calculated $cost
is a product of the selected vehicle type ( $carType
) and the calculated distance between the two locations ( $distance
);
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.