Opencart Compare Products

Today we will learn about working of Opencart compare products  . In the Opencart customer can add maximum 4 Products for compare at a time. If customer added more products then it shift them from the beginning and kept just last 4 products for compare.

When customer press the product compare button for any particular product it sends an ajax request to the controller product/compare and process it and added the product id to the session in compare index. Lets take a deep look in all these process.

In Opencart at the button of the compare it fired the event onclick which call the add method of common.js file which is already loaded in the document during the header load.

//Calls the add method of the compare object by passing the product id of common.js file whcih is already loaded with the header
 <button type="button" data-toggle="tooltip" class="btn btn-default" title="<?php echo $button_compare; ?>" onclick="compare.add('<?php echo $product_id; ?>');"><i class="fa fa-exchange"></i></button>

In the add method of the common.js file it sends an ajax request to the controller product/compare with the product id   and calls the add method of the controller.

var compare = {
    'add': function(product_id) {
        $.ajax({
            url: 'index.php?route=product/compare/add',
            type: 'post',
            data: 'product_id=' + product_id,
            dataType: 'json',
            success: function(json) {
                $('.alert').remove();
                if (json['success']) {
                    $('#content').parent().before('<div class="alert alert-success"><i class="fa fa-check-circle"></i> ' + json['success'] + ' <button type="button" class="close" data-dismiss="alert">&times;</button></div>');
                    $('#compare-total').html(json['total']);
                    $('html, body').animate({ scrollTop: 0 }, 'slow');
                }
            },

In the controller it first check for the compare index in the sesson array exist or not. If not then it create an index of compare in session of array type. After that get the product inforamtion and check for product id valid.

if (!isset($this->session->data['compare'])) {
    $this->session->data['compare'] = array();
}

After that it get the product information and and if the product find then it check that it is already added for compare or not and if it is not already in compare list then it checks already 4 products are added for compare then it remove the first product and kept only last 4 product for compare in that array.

$product_info = $this->model_catalog_product->getProduct($product_id);

//Check If product exist 
if ($product_info) {
     //Check that product is not already added for compare
	if (!in_array($this->request->post['product_id'], $this->session->data['compare'])) {
           
        //If already 4 product in compare then it shift first product and kept only last 4 prodcut for compare
	    if (count($this->session->data['compare']) >= 4) {
		   array_shift($this->session->data['compare']);
	    }
	    $this->session->data['compare'][] = $this->request->post['product_id'];
	}
	$json['success'] = sprintf($this->language->get('text_success'), $this->url->link('product/product', 'product_id=' . $this->request->post['product_id']), $product_info['name'], $this->url->link('product/compare'));
	$json['total'] = sprintf($this->language->get('text_compare'), (isset($this->session->data['compare']) ? count($this->session->data['compare']) : 0));
}

When click on the comapre list after adding the products it iterate the compare index of the session and fetch the product inforamtion from their product id. It shows the name,image,price,special offer on product,description,model,manufacturer,availability,minimum (how many minimum product can buy),rating,reviews,weight,length,width,height and product attribute of the product during compare the product.