Minicart - show images in mod_virtuemart_cart - Solution

[AH]

I wanted to have images in the minicart but was not interested in having yet another module from a third party, some of which just did not work if you did not refresh the page!!
There is also a  rendering dependency on base VM code relating to vmprice.js 
I was not interested in breaking this.

Solution below:-

I had to adjust the base code (cannot do override at this point - will submit to svn if they are interested - it will need to have some options added to the module for friendliness!)

com_virtuemart/helpers/cart.php

Get this to return the image for minicart (based on other stuff I have seen on the forums) so:-

Around lin 1565 added the image to the data returned

Code Select Expand


// other possible option to use for display
$this->data->products[$i]['subtotal'] = $this->pricesUnformatted[$priceKey]['subtotal'];
$this->data->products[$i]['subtotal_tax_amount'] = $this->pricesUnformatted[$priceKey]['subtotal_tax_amount'];
$this->data->products[$i]['subtotal_discount'] = $this->pricesUnformatted[$priceKey]['subtotal_discount'];
$this->data->products[$i]['subtotal_with_tax'] = $this->pricesUnformatted[$priceKey]['subtotal_with_tax'];
//quorvia image in minicart

         $this->data->products[$i]['image']= JHTML::_('image', $product->image->file_url_thumb, null);
//


Now get mod_virtuemart_cart.php to load the image helper so images still get displayed when not in a VM page

Code Select Expand


VmConfig::loadConfig();
// QUORVIA Loads VMimage class for minicart.
if (!class_exists( 'VmImage' )) require(JPATH_ADMINISTRATOR . DS . 'components' . DS . 'com_virtuemart'.DS.'helpers'.DS.'image.php');
//end

VmConfig::loadJLang('mod_virtuemart_cart', true);



Then created my override to the mod_virteumart_cart/default.php template

Added display lines and css to the default.php override template.

The css can (of course) be added outside, but it is really up to you!  I put it in here because, if you just do a straight code copy, your thumb images would be huge!

Code Select Expand


<?php // no direct access
defined('_JEXEC') or die('Restricted access');

//dump ($cart,'mod cart');
// Ajax is displayed in vm_cart_products
// ALL THE DISPLAY IS Done by Ajax using "hiddencontainer" ?>
<?php

 // QUORVIA minicart image size style Add styles - have to do this or thumb image is huge adjust as necessary
$style = '.image img {'
        . 'width: 35px; float:left;margin:0 5px 0 0;'
        . '}'; 
$document->addStyleDeclaration($style);
//Quorvia end
?>

<!-- Virtuemart 2 Ajax Card -->
<div class="vmCartModule <?php echo $params->get('moduleclass_sfx'); ?>" id="vmCartModule">
<?php
if ($show_product_list) {
?>
<div id="hiddencontainer" style=" display: none; ">
<div class="container">

<?php if ($show_price and $currencyDisplay->_priceConfig['salesPrice'][0]) { ?>
  <div class="prices" style="float: right;"></div>
<?php } ?>
<!-- QUORVIA Position for image-->
<div class="image"></div>
<div class="product_row">
<span class="quantity"></span>&nbsp;x&nbsp;<span class="product_name"></span>
</div>

<div class="product_attributes"></div>
</div>
</div>
<div class="vm_cart_products">
<div class="container">

<?php
foreach ($data->products as $product)
{
if ($show_price and $currencyDisplay->_priceConfig['salesPrice'][0]) { ?>
  <div class="prices" style="float: right;"><?php echo  $product['prices'] ?></div>
<?php } ?>
<!-- QUORVIA Position for image-->
<div class="image"><?php echo $product['image'] ?></div>
<div class="product_row">

<span class="quantity"><?php echo  $product['quantity'] ?></span>&nbsp;x&nbsp;<span class="product_name"><?php echo  $product['product_name'] ?></span>
</div>
<?php if ( !empty($product['product_attributes']) ) { ?>
<div class="product_attributes"><?php echo $product['product_attributes'] ?></div>

<?php }
}
?>
</div>
</div>
<?php } ?>
<?php if ($data->totalProduct and $show_price and $currencyDisplay->_priceConfig['salesPrice'][0]) { ?>
<div class="total" style="float: right;">
<?php echo $data->billTotal; ?>
</div>
<?php } ?>
<div class="total_products"><?php echo  $data->totalProductTxt ?></div>
<div class="show_cart"rel="nofollow">
<?php if ($data->totalProduct and $show_price) echo  $data->cart_show; ?>
</div>
<div style="clear:both;"></div>

<noscript>
<?php echo JText::_('MOD_VIRTUEMART_CART_AJAX_CART_PLZ_JAVASCRIPT') ?>
</noscript>
</div>




You now have your own minicart with image using that appears when you add a product and does not require you te refresh the page 

VM 2.0.24

[dazmilliom]

I wish I could kiss you on the hands. This is exactly what I need for my cart as I did not want to pay $50 to get yet another module. Thanks buddy

[AH]

 

[Studio 42]

I think, it's not the right solution, but this sould use a sublayout or a ajax call the module using com_ajax.
so not using
index.php?option=com_virtuemart&nosef=1&view=cart&task=viewJS&format=json
but
index.php?option=com_ajax&module=virtuemart_cart&format=raw&moduleId='.$module->id

Code Select Expand

class modVirtuemartCartHelper
{
public static function getAjax()
{
//get products raw
         require JModuleHelper::getLayoutPath('mod_virtuemart_cart','default_raw');
}
}


Using this solution give flexibility on the layout, and you can then add any name,price,customfield ... simplier and without any hacks

[AH]

Thanks Studio42

I agree it is not the best practice to hack the core code in helpers.php.

IMHO The option to provide the thumbnail to the cart view should be implemented in core.  Maybe not in the way shown here, but in whatever way is best practice.

I prefer not to add cart modules just for the purpose of getting an image to the cart (less modules means less dependency on third parties ;-) keeping things up to date )

The original post is from 2013 - things have moved on and the solution for getting the thumb to cart is slightly different in VM3 /J 3.5:-

VM3

com_virtuemart/helpers/cart.php

Code Select Expand


// UPDATE CART / DELETE FROM CART
$data->products[$i]['quantity'] = $product->quantity;
$data->totalProduct += $product->quantity ;
//Quorvia provide image to minicart
$data->products[$i]['image']= $product->images[0]->displayMediaThumb ('', FALSE);

}



Then created an override to the mod_virteumart_cart/default.php template

Code Select Expand


<div id="hiddencontainer" class="hiddencontainer" style=" display: none; ">
<div class="vmcontainer">

<div class="product_row">
                <div class="image"></div>
<div class="quantity">


and

Code Select Expand



<?php
foreach ($data->products as $product){?>
<div class="product_row">
<div class="image"><?php echo $product['image'] ?></div>
<div class="quantity"><?php echo  $product['quantity'] ?




Dont forget to add some CSS if required to reduce the image size ;-)