<?xml version="1.0" encoding="utf-8"?> 
<modification>
    <name>product option image swap zoom</name>
    <id>prod_option_image_swap_z_ocmod</id>
    <version>1.2 prod_option_image_swap_z_ocmod</version>
    <author>ocextensions.co.uk for cancer research</author>
    <link>mailto:support@ocextensions.co.uk</link>
    <code>prod_option_image_swap_z_ocmod</code>
    <file path="catalog/controller/product/product.php">   
        <operation>
            <search><![CDATA[$product_option_value_data[] = array(]]></search>
            <add position="after"><![CDATA[   'imagel'                  => $this->model_tool_image->resize($option_value['image'], $this->config->get('config_image_thumb_width'), $this->config->get('config_image_thumb_height')),
'imagexl'                  => $this->model_tool_image->resize($option_value['image'], $this->config->get('config_image_popup_width'), $this->config->get('config_image_popup_height')),]]></add>
        </operation>
        <operation>
            <search><![CDATA[$this->document->addScript('catalog/view/javascript/jquery/magnific/jquery.magnific-popup.min.js');]]></search>
            <add position="before"><![CDATA[$this->document->addScript('catalog/view/javascript/jquery/jquery.elevateZoom-3.0.8.min.js');]]>
            </add>
        </operation>
    </file>
    <file path="catalog/view/theme/*/template/product/product.tpl">
        <operation> 
            <search><![CDATA[<li><a class="thumbnail"]]></search>
            <add position="replace"><![CDATA[<li style="display:none"><a class="thumbnail"]]></add>
        </operation>
        <operation> 
            <search><![CDATA[<?php if ($thumb) { ?>]]></search>
            <add position="after"><![CDATA[                <li><div class="thumbnail" ><img class='zoom' data-zoom-image="<?php echo $popup; ?>" src="<?php echo $thumb; ?>" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" id="image" /></div></li>]]></add>
        </operation>    
        <operation> 
            <search index="0,1,3"><![CDATA[<?php foreach ($option['product_option_value'] as $option_value)]]></search>
            <add position="after"><![CDATA[ <?php  if (!$option_value['imagel'] || strpos($option_value['imagel'], 'no_image')) $option_value['imagel'] = $thumb; ?>
 <?php if ($option_value['imagexl'] == '') $option_value['imagexl'] = 'no_image'; ?>]]>
            </add>
        </operation>
        <operation> 
            <search><![CDATA[class="form-control"]]></search>
            <add position="replace"><![CDATA[class="thumb form-control"]]></add>
        </operation>
        <operation> 
            <search index="0"><![CDATA[><?php echo $option_value['name']; ?>]]></search>
            <add position="replace"><![CDATA[class="thumb" src="<?php echo $option_value['imagel']; ?>" val="<?php echo $option_value['imagexl']; ?>"><?php echo $option_value['name']; ?>]]></add>
        </operation>
        <operation>
            <search><![CDATA[<input type="radio" name="option[<?php echo $option['product_option_id']; ?>]"]]></search>
            <add position="replace"><![CDATA[                   <input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" class="thumb" src="<?php echo $option_value['imagel']; ?>" val="<?php echo $option_value['imagexl']; ?>"]]></add>
        </operation>
        <operation>
            <search><![CDATA[<?php echo $footer; ?>]]></search>
            <add position="before"><![CDATA[<script type="text/javascript"><!--
 function c() {
    var srcimg;
    var srcim;
        $("option:selected", $(this)).each(function(){
            srcimg = $(this).attr('src');  
            srcim = $(this).attr('val');
    });
        if (srcimg == null || srcim == null) {         
            srcimg = $(this).attr('src');
            srcim = $(this).attr('val');
    }
        if (srcim != null) {  
    var noimage = srcim.indexOf("no_image"); 
    }
        if (srcimg == null || srcim == null || noimage == 0) {
            //srcimg = '<?php echo $thumb; ?>';
            //srcim = '<?php echo $popup; ?>';
            return;
                } 
    $('.zoom').attr('src', srcimg);
    $('.zoom').attr('data-zoom-image', srcim);
    $('.zoomLens, .zoomWindow').css("background-image", "url(" + srcim +")");
    } 
$(document).on("change", ".thumb", c);
//--></script> 
]]></add>
        </operation>   
    </file>
</modification>
