<?xml version="1.0" encoding="utf-8"?>
<modification>
    <name>So Color Swatch</name>
    <code>So-color-swatch</code>
    <version>1.0.1</version>
    <author>OpenCartWorks</author>
    <link>http://www.opencartworks.com/</link>
    
    <file path="admin/controller/catalog/product.php">
        <operation>
            <search><![CDATA[$data['layouts'] = $this->model_design_layout->getLayouts();]]></search>
            <add position="before"><![CDATA[
                $data['entry_default_image_color'] = $this->language->get('entry_default_image_color');
                $data['entry_color'] = $this->language->get('entry_color');
            ]]></add>
        </operation>
        <operation>
            <search><![CDATA[$data['layouts'] = $this->model_design_layout->getLayouts();]]></search>
            <add position="after"><![CDATA[
                $this->load->model('extension/module/so_color_swatches_pro');
                $data['color_swatch']   = $this->model_extension_module_so_color_swatches_pro->getColorSwatch();
            ]]></add>
        </operation>
        <operation>
			<search><![CDATA[$data['product_images']]]></search>
			<add position="before"><![CDATA[
				if(isset($product_image['default_of_color'])){
					$default_of_color = $product_image['default_of_color'];
				}else{
					$default_of_color = array();
				}           
			]]></add>
		</operation>
		<operation>
			<search><![CDATA['sort_order' => $product_image['sort_order']]]></search>
			<add position="replace"><![CDATA[
				'sort_order' => $product_image['sort_order'],
				'default_of_color' => $default_of_color,                
			]]></add>
		</operation>
    </file>
    <file path="admin/view/template/catalog/product_form.twig">
        <operation>
            <search><![CDATA[<td class="text-right">{{ entry_sort_order }}</td>]]></search>
            <add position="before"><![CDATA[
                <td class="text-right">{{ entry_default_image_color }}</td>
            ]]>
            </add>
        </operation>
        <operation>
            <search><![CDATA[<td class="text-right"><input type="text" name="product_image[{{ image_row }}][sort_order]" value="{{ product_image.sort_order }}" placeholder="{{ entry_sort_order }}" class="form-control"/></td>]]></search>
            <add position="before"><![CDATA[
                <td class="text-right">
                    <select name="product_image[{{ image_row }}][default_of_color]" class="default-color-selector">
                        <option value="0">----------</option>
                        {% for color in color_swatch %}
                            {% if color.option_value_id == product_image.default_of_color %}
                                <option value="{{ color.option_value_id }}" selected="selected">{{ color.name }}</option>
                            {% else %}
                                <option value="{{ color.option_value_id }}">{{ color.name }}</option>
                            {% endif %}
                        {% endfor %}
                    </select>
                </td>
            ]]>
            </add>
        </operation>
        <operation>
            <search><![CDATA[{{ footer }}]]></search>
            <add position="before"><![CDATA[
                <script type="text/javascript"><!--
                    jQuery(document).ready(function($){
                        $('.default-color-selector').change(function(){
                            var value = $(this).val();
                            $('.default-color-selector').not(this).each(function(){
                                if($(this).val()==value)
                                    $(this).val('0');
                            });
                        })
                    });
                //--></script>
            ]]></add>
        </operation>
        <operation>
            <search index="2"><![CDATA[<td colspan="2"></td>]]></search>
            <add position="replace"><![CDATA[
                <td colspan="3"></td>
            ]]></add>
        </operation>
        <operation>
            <search><![CDATA[html += '  <td class="text-right"><input type="text" name="product_image[' + image_row + '][sort_order]" value="" placeholder="{{ entry_sort_order }}" class="form-control" /></td>';]]></search>
            <add position="before"><![CDATA[
                html += '  <td class="text-right">';
                html += '  <select name="product_image[' + image_row + '][default_of_color]" class="default-color-selector">';
                html += '  <option value="0">----------</option>';
                {% for color in color_swatch %}
                    html += '  <option value="{{ color.option_value_id }}>">{{ color.name }}</option>';
                {% endfor %}
                html += '  </select>';
                html += '  </td>';
            ]]></add>
        </operation>
    </file>
    <file path="admin/model/catalog/product.php">
        <operation>
            <search><![CDATA[$this->db->query("INSERT INTO " . DB_PREFIX . "product_image SET product_id = '" . (int)$product_id . "', image = '" . $this->db->escape($product_image['image']) . "', sort_order = '" . (int)$product_image['sort_order'] . "'");]]></search>
            <add position="replace"><![CDATA[
                if ($this->checkProductImageColumnExist()) {
                    $this->db->query("INSERT INTO " . DB_PREFIX . "product_image SET product_id = '" . (int)$product_id . "', image = '" . $this->db->escape($product_image['image']) . "', sort_order = '" . (int)$product_image['sort_order'] . "', default_of_color = '". (int)$product_image['default_of_color'] ."'");
                }
                else {
                    $this->db->query("INSERT INTO " . DB_PREFIX . "product_image SET product_id = '" . (int)$product_id . "', image = '" . $this->db->escape($product_image['image']) . "', sort_order = '" . (int)$product_image['sort_order'] . "'");
                }
            ]]></add>
        </operation>
        <operation>
            <search><![CDATA[public function getTotalProductsByTaxClassId($tax_class_id) {]]></search>
            <add position="before"><![CDATA[
                public function checkProductImageColumnExist() {
                    $sql = "SHOW COLUMNS FROM " .DB_PREFIX. "product_image LIKE 'default_of_color'";
                    $query = $this->db->query($sql);
                    return count($query->rows)>0 ? true : false;
                }
            ]]></add>
        </operation>
    </file>
    <file path="admin/language/*/catalog/product.php">
        <operation>
             <search><![CDATA[// Entry]]></search>
            <add position="after"><![CDATA[
                $_['entry_default_image_color']        = 'Default Image For Color';
                $_['entry_color']        = 'Color';
            ]]></add>
        </operation>
    </file>
    <file path="catalog/controller/product/category.php">
        <operation>
            <search><![CDATA[$data['products'][] = array(]]></search>
            <add position="before"><![CDATA[
                $option_data = array();
                $image_data = array();
                if ($this->config->get('module_so_color_swatches_pro_status') && $this->config->get('module_so_color_swatches_pro_enable_product_list')) {
                    $this->load->model('extension/module/so_color_swatches_pro');
                    $data['width_product_list'] = (int)$this->config->get('module_so_color_swatches_pro_width_product_list');
                    if ($data['width_product_list'] == 0) {
                        $data['width_product_list'] = 15;
                    }
                    $data['height_product_list'] = (int)$this->config->get('module_so_color_swatches_pro_height_product_list');
                    if ($data['height_product_list'] == 0) {
                        $data['height_product_list'] = 15;
                    }
                    $data['colorswatch_type'] = $this->config->get('module_so_color_swatches_pro_type');
                    $this->document->addStyle('catalog/view/javascript/so_color_swatches_pro/css/style.css');

                    $options = $this->model_extension_module_so_color_swatches_pro->getProductOptions($result['product_id']);
                    foreach ($options as $option) {
                        $product_option_value_data = array();
                        foreach ($option['product_option_value'] as $option_value) {
                            if (!$option_value['subtract'] || ($option_value['quantity'] > 0)) {
                                $p_image = $this->model_extension_module_so_color_swatches_pro->getProductImages($result['product_id'], $option_value['option_value_id']);
                                if (isset($p_image['image']) && $p_image['image']) {
                                    $pimage = $this->model_tool_image->resize($p_image['image'], $this->config->get('theme_'.$this->config->get('config_theme') . '_image_product_width'), $this->config->get('theme_'.$this->config->get('config_theme') . '_image_product_height'));
                                } else {
                                    $pimage = '';
                                }
                                if (isset($p_image['product_image_id']) && $p_image['product_image_id']) {
                                    $product_image_id = $p_image['product_image_id'];
                                }
                                else {
                                    $product_image_id = '';
                                }
                                $product_option_value_data[] = array(
                                    'product_option_value_id' => $option_value['product_option_value_id'],
                                    'option_value_id'         => $option_value['option_value_id'],
                                    'name'                    => $option_value['name'],
                                    'image'                   => $this->model_tool_image->resize($option_value['image'], $data['width_product_list'], $data['height_product_list']),
                                    'price'                   => $price,
                                    'price_prefix'            => $option_value['price_prefix'],
                                    'color_image'             => $pimage,
                                    'product_image_id'        => $product_image_id
                                );
                            }
                        }
                        $option_data[] = array(
                            'product_option_id'    => $option['product_option_id'],
                            'product_option_value' => $product_option_value_data,
                            'option_id'            => $option['option_id'],
                            'name'                 => $option['name'],
                            'type'                 => $option['type'],
                            'value'                => $option['value'],
                            'required'             => $option['required']
                        );
                    }
                }
            ]]></add>
        </operation>
        <operation>
            <search><![CDATA[$data['products'][] = array]]></search>
            <add position="after" trim="true" offset="1"><![CDATA[
                'option'      => $option_data,
            ]]></add>
        </operation>
    </file>
    <file path="catalog/controller/product/{search,manufacturer,special}*.php">
        <operation>
            <search><![CDATA[$data['products'][] = array(]]></search>
            <add position="before"><![CDATA[
                $option_data = array();
                $image_data = array();
                if ($this->config->get('module_so_color_swatches_pro_status')) {
                    $this->load->model('extension/module/so_color_swatches_pro');
                    $data['width_product_list'] = (int)$this->config->get('module_so_color_swatches_pro_width_product_list');
                    if ($data['width_product_list'] == 0) {
                        $data['width_product_list'] = 15;
                    }
                    $data['height_product_list'] = (int)$this->config->get('module_so_color_swatches_pro_height_product_list');
                    if ($data['height_product_list'] == 0) {
                        $data['height_product_list'] = 15;
                    }
                    $data['colorswatch_type'] = $this->config->get('module_so_color_swatches_pro_type');
                    $this->document->addStyle('catalog/view/javascript/so_color_swatches_pro/css/style.css');

                    $options = $this->model_extension_module_so_color_swatches_pro->getProductOptions($result['product_id']);
                    foreach ($options as $option) {
                        $product_option_value_data = array();
                        foreach ($option['product_option_value'] as $option_value) {
                            if (!$option_value['subtract'] || ($option_value['quantity'] > 0)) {
                                $p_image = $this->model_extension_module_so_color_swatches_pro->getProductImages($result['product_id'], $option_value['option_value_id']);
                                if (isset($p_image['image']) && $p_image['image']) {
                                    $pimage = $this->model_tool_image->resize($p_image['image'], $this->config->get('theme_'.$this->config->get('config_theme') . '_image_product_width'), $this->config->get('theme_'.$this->config->get('config_theme') . '_image_product_height'));
                                } else {
                                    $pimage = '';
                                }
                                if (isset($p_image['product_image_id']) && $p_image['product_image_id']) {
                                    $product_image_id = $p_image['product_image_id'];
                                }
                                else {
                                    $product_image_id = '';
                                }
                                $product_option_value_data[] = array(
                                    'product_option_value_id' => $option_value['product_option_value_id'],
                                    'option_value_id'         => $option_value['option_value_id'],
                                    'name'                    => $option_value['name'],
                                    'image'                   => $this->model_tool_image->resize($option_value['image'], $data['width_product_list'], $data['height_product_list']),
                                    'price'                   => $price,
                                    'price_prefix'            => $option_value['price_prefix'],
                                    'color_image'             => $pimage,
                                    'product_image_id'        => $product_image_id
                                );
                            }
                        }
                        $option_data[] = array(
                            'product_option_id'    => $option['product_option_id'],
                            'product_option_value' => $product_option_value_data,
                            'option_id'            => $option['option_id'],
                            'name'                 => $option['name'],
                            'type'                 => $option['type'],
                            'value'                => $option['value'],
                            'required'             => $option['required']
                        );
                    }
                }
            ]]></add>
        </operation>
        <operation>
            <search><![CDATA[$data['products'][] = array]]></search>
            <add position="after" trim="true" offset="1"><![CDATA[
                'option'      => $option_data,
            ]]></add>
        </operation>
    </file>
    
    <file path="catalog/view/theme/*/template/soconfig/listing.twig">
        <operation>
            <search><![CDATA[<img  data-sizes="auto" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" data-src="{{ product.thumb }}"  title="{{ product.name }} " class="lazyload img-responsive" />]]></search>
            <add position="replace"><![CDATA[
                <img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" id="product-image-{{ product.product_id }}" />
            ]]></add>
        </operation>
        <operation>
            <search><![CDATA[<h4><a href="{{ product.href }}">{{ product.name }} </a></h4>]]></search>
            <add position="before"><![CDATA[
                {% if product.option %}
                <ul class="so-productlist-colorswatch" id="colorswatch-{{ product.product_id }}">
                    {% for option in product.option %}
                        {% if option.type == 'select' %}
                            {% for option_value in option.product_option_value %}
                                 <li class="colorswatch{{option_value.product_option_value_id~option_value.option_value_id~product.product_id }}">
                                    <a href="javascript:void(0);" title="{{ option_value.name }}" style="width: {{ width_product_list }}px; height: {{ height_product_list }}px; background-image: url('{{ option_value.image }}')"></a>
                                    <script type="text/javascript">
                                        jQuery(document).ready(function($) {
                                            var $window_width = $(window).width();
                                            {% if colorswatch_type == 'click' %}
                                                $(document).on('click', '.so-productlist-colorswatch li.colorswatch{{ option_value.product_option_value_id~option_value.option_value_id~product.product_id }}', function(e) {
                                                    e.preventDefault();
                                                    {% if option_value.color_image %}
                                                        jQuery('img#product-image-{{product.product_id }}').attr('src', '{{ option_value.color_image }}');
                                                    {% endif %}
                                                    
                                                    $('.so-productlist-colorswatch li').removeClass('actived');
                                                    $(this).removeClass('actived').addClass('actived');
                                                });
                                            {% else %}
                                                if ($window_width > 1199) {
                                                    $('.so-productlist-colorswatch li.colorswatch{{ option_value.product_option_value_id~option_value.option_value_id~product.product_id }}').hover(function(e) {
                                                        e.preventDefault();
                                                        {% if option_value.color_image %}
                                                            jQuery('img#product-image-{{product.product_id }}').attr('src', '{{ option_value.color_image }}');
                                                        {% endif %}
                                                        
                                                        $('.so-productlist-colorswatch li').removeClass('actived');
                                                        $(this).removeClass('actived').addClass('actived');
                                                    });
                                                }
                                                else {
                                                    $(document).on('click', '.so-productlist-colorswatch li.colorswatch{{ option_value.product_option_value_id~option_value.option_value_id~product.product_id }}', function(e) {
                                                        e.preventDefault();
                                                        {% if option_value.color_image %}
                                                            jQuery('img#product-image-{{product.product_id }}').attr('src', '{{ option_value.color_image }}');
                                                        {% endif %}
                                                        
                                                        $('.so-productlist-colorswatch li').removeClass('actived');
                                                        $(this).removeClass('actived').addClass('actived');
                                                    });
                                                }
                                            {% endif %}
                                        })
                                    </script>
                                </li>
                            {% endfor %}
                        {% endif %}
                    {% endfor %}
                </ul>
                {% endif %}
            ]]></add>
        </operation>
    </file>
    <file path="catalog/controller/product/product.php">
        <operation>
            <search><![CDATA[$data['products'] = array();]]></search>
            <add position="before"><![CDATA[
                $data['option_data'] = array();
                if ($this->config->get('module_so_color_swatches_pro_status') && $this->config->get('module_so_color_swatches_pro_enable_product_page')) {
                    $data['width_product_page'] = $this->config->get('module_so_color_swatches_pro_width_product_page');
                    if ($data['width_product_page'] == 0) {
                        $data['width_product_page'] = 20;
                    }
                    $data['height_product_page'] = $this->config->get('module_so_color_swatches_pro_height_product_page');
                    if ($data['height_product_page'] == 0) {
                        $data['height_product_page'] = 20;
                    }
                    $data['colorswatch_type'] = $this->config->get('module_so_color_swatches_pro_type');
                    $this->document->addStyle('catalog/view/javascript/so_color_swatches_pro/css/style.css');
                    
                    $this->load->model('extension/module/so_color_swatches_pro');
                    $option_selected = $this->config->get('module_so_color_swatches_pro_option');
                    $product_option = $this->model_extension_module_so_color_swatches_pro->getProductOptionsByOptionId($this->request->get['product_id'], $option_selected);
                    if ($product_option) {
                        $data['product_option_id'] = $product_option['product_option_id'];
                    }
                    $data['option_selected'] = $option_selected;
    
                    $options = $this->model_extension_module_so_color_swatches_pro->getProductOptions($this->request->get['product_id']);
                    foreach ($options as $option) {
                        $product_option_value_data = array();
                        foreach ($option['product_option_value'] as $option_value) {
                            if (!$option_value['subtract'] || ($option_value['quantity'] > 0)) {
                                $p_image = $this->model_extension_module_so_color_swatches_pro->getProductImages($this->request->get['product_id'], $option_value['option_value_id']);
                                if (isset($p_image['image']) && $p_image['image']) {
                                    $pimage = $this->model_tool_image->resize($p_image['image'], $this->config->get('theme_'.$this->config->get('config_theme') . '_image_popup_width'), $this->config->get('theme_'.$this->config->get('config_theme') . '_image_popup_height'));
                                    $p_thumbimage = $this->model_tool_image->resize($p_image['image'], $this->config->get('theme_'.$this->config->get('config_theme') . '_image_thumb_width'), $this->config->get('theme_'.$this->config->get('config_theme') . '_image_thumb_height'));
                                } else {
                                    $pimage = '';
                                    $p_thumbimage = '';
                                }
                                if (isset($p_image['product_image_id']) && $p_image['product_image_id']) {
                                    $product_image_id = $p_image['product_image_id'];
                                }
                                else {
                                    $product_image_id = '';
                                }
                                $product_option_value_data[] = array(
                                    'product_option_value_id' => $option_value['product_option_value_id'],
                                    'option_value_id'         => $option_value['option_value_id'],
                                    'name'                    => $option_value['name'],
                                    'image'                   => $this->model_tool_image->resize($option_value['image'], $data['width_product_page'], $data['height_product_page']),
                                    'price'                   => $price,
                                    'price_prefix'            => $option_value['price_prefix'],
                                    'color_image'             => $pimage,
                                    'color_thumb_image'       => $p_thumbimage,
                                    'product_image_id'        => $product_image_id
                                );
                            }
                        }
                        $data['option_data'][] = array(
                            'product_option_id'    => $option['product_option_id'],
                            'product_option_value' => $product_option_value_data,
                            'option_id'            => $option['option_id'],
                            'name'                 => $option['name'],
                            'type'                 => $option['type'],
                            'value'                => $option['value'],
                            'required'             => $option['required']
                        );
                    }
                }
                $data['option_data'] = array_shift($data['option_data']);
            ]]></add>
        </operation>
    </file>
    <file path="catalog/view/theme/*/template/product/product.twig">
        <operation>
            <search><![CDATA[<h3>{{ text_option }}</h3>]]></search>
            <add position="after"><![CDATA[
                {% if option_data and option_data.product_option_value is defined and option_data.product_option_value %}
                    <ul id="so-colorswatch-selector-{{ product_id }}" class='so-colorswatch-productpage-icons'>
                        {% for option_value in option_data.product_option_value %}
                            <li class="option-item">
                                <a class="" 
                                    data-product-option-value-id="{{ option_value.product_option_value_id }}" 
                                    data-option-value-id="{{ option_value.option_value_id }}" 
                                    data-color-image="{{ option_value.color_image }}" 
                                    data-color-thumb-image="{{ option_value.color_thumb_image }}" 
                                    style="width: {{ width_product_page }}px; height: {{ height_product_page }}px; background-image: url('{{ option_value.image }}')">
                                </a>
                            </li>
                        {% endfor %}
                        <li class="selected-option"><span></span></li>
                    </ul>
                    <script type="text/javascript">
                        var $window_width = $(window).width();
                        var ProductOptionId = '{{ product_option_id }}';
                        var default_image = $('.large-image img').attr('src');
                        jQuery(document).ready(function($) {
                            $('#input-option{{ product_option_id }}').parent().hide();
    
                            $('#input-option{{ product_option_id}} option').each(function(){
                              var text = $(this).text().replace(/\s{2,}/g, ' ');
                              var val = $(this).attr('value');
                              $('.so-colorswatch-productpage-icons li a').each(function(index, el){
                                if($(el).data('product-option-value-id')== val){
                                  $(el).attr('title', text);
                                }
                              })
                            })
                            
                            {% if colorswatch_type == 'click' %}
                                $(document).on('click', '.so-colorswatch-productpage-icons li.option-item', function(e){
                                    e.preventDefault();
                                    var option_value_id = $(this).children('a').data('product-option-value-id');
                                    var option_id = $(this).children('a').data('option-value-id');
        
                                    if ($(this).hasClass('checked')) {
                                        $('.so-colorswatch-productpage-icons li.option-item').removeClass('checked');
                                        $(this).removeClass('checked');
                                        $('#input-option{{ product_option_id }}').val('').trigger('change');
                                        $('.so-colorswatch-productpage-icons li.selected-option > span').html('');
                                        
                                        $('.large-image img').attr('src', default_image);
                                    }
                                    else {
                                        $('.so-colorswatch-productpage-icons li.option-item').removeClass('checked');
                                        $(this).removeClass('checked').addClass('checked');
                                        $('#input-option{{ product_option_id }}').val(option_value_id).trigger('change');
                                        $('.so-colorswatch-productpage-icons li.selected-option > span').html($(this).children('a').attr('title'));
                                        
                                        if ($(this).children('a').data('color-image') != '') {
                                            $('.large-image img').attr('src', $(this).children('a').data('color-image'));
                                        }
                                        else {
                                            $('.large-image img').attr('src', default_image);
                                        }

                                        $('#thumb-slider  a.thumbnail').removeClass('active');
                                    }
                                })
                            {% else %}
                                if ($window_width > 1199) {
                                    $('.so-colorswatch-productpage-icons li.option-item').hover(function(e){
                                        e.preventDefault();
                                        var option_value_id = $(this).children('a').data('product-option-value-id');
                                        var option_id = $(this).children('a').data('option-value-id');
                                        
                                        $('.so-colorswatch-productpage-icons li.option-item').removeClass('checked');
                                        if ($(this).hasClass('checked')) {
                                            $(this).removeClass('checked');
                                            $('#input-option{{ product_option_id }}').val('').trigger('change');
                                            $('.large-image img').attr('src', default_image);
                                           
                                        }
                                        else {
                                            $(this).removeClass('checked').addClass('checked');
                                            $('#input-option{{ product_option_id }}').val(option_value_id).trigger('change');
                                            $('.so-colorswatch-productpage-icons li.selected-option > span').html($(this).children('a').attr('title'));
                                            
                                            if ($(this).children('a').data('color-image') != '') {
	                                            $('.large-image img').attr('src', $(this).children('a').data('color-image'));
	                                        }
	                                        else {
	                                            $('.large-image img').attr('src', default_image);
	                                        }
	                                         $('#thumb-slider  a.thumbnail').removeClass('active');
                                        }
                                    });
                                }
                                else {
                                    $(document).on('click', '.so-colorswatch-productpage-icons li.option-item', function(e){
                                        e.preventDefault();
                                        var option_value_id = $(this).children('a').data('product-option-value-id');
                                        var option_id = $(this).children('a').data('option-value-id');
            
                                        $('.so-colorswatch-productpage-icons li.option-item').removeClass('checked');
                                        if ($(this).hasClass('checked')) {
                                            $(this).removeClass('checked');
                                            $('#input-option{{ product_option_id }}').val('').trigger('change');
                                            $('.large-image img').attr('src', default_image);
                                           
                                        }
                                        else {
                                            $(this).removeClass('checked').addClass('checked');
                                            $('#input-option{{ product_option_id }}').val(option_value_id).trigger('change');
                                            $('.so-colorswatch-productpage-icons li.selected-option > span').html($(this).children('a').attr('title'));
                                            
                                            if ($(this).children('a').data('color-image') != '') {
	                                            $('.large-image img').attr('src', $(this).children('a').data('color-image'));
	                                        }
	                                        else {
	                                            $('.large-image img').attr('src', default_image);
	                                        }
	                                         $('#thumb-slider  a.thumbnail').removeClass('active');
                                        }
                                    })
                                }
                            {% endif %}
                        })                  
                    </script>
                {% endif %}
            ]]></add>
        </operation>
        <operation>
            <search><![CDATA[var element = $('#input-option' + i.replace('_', '-'));]]></search>
            <add position="after"><![CDATA[
				{% if option_data %}
					if(ProductOptionId != undefined && ProductOptionId==i.replace('_', '-')){
						$('.so-colorswatch-productpage-icons').after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
					}
				{% endif %}
            ]]></add>
        </operation>
    </file>
    <file path="catalog/controller/extension/module/featured.php">
        <operation>
            <search><![CDATA[$data['products'][] = array(]]></search>
            <add position="before"><![CDATA[
                $option_data = array();
                $image_data = array();
                if ($this->config->get('module_so_color_swatches_pro_status')) {
                    $data['color_swatch_status'] = $this->config->get('module_so_color_swatches_pro_status');
                    $data['enable_product_list'] = $this->config->get('module_so_color_swatches_pro_enable_product_list');
                    $data['width_product_list'] = (int)$this->config->get('module_so_color_swatches_pro_width_product_list');
                    if ($data['width_product_list'] == 0) {
                        $data['width_product_list'] = 15;
                    }
                    $data['height_product_list'] = (int)$this->config->get('module_so_color_swatches_pro_height_product_list');
                    if ($data['height_product_list'] == 0) {
                        $data['height_product_list'] = 15;
                    }
                    $data['colorswatch_type'] = $this->config->get('module_so_color_swatches_pro_type');
                    $this->document->addStyle('catalog/view/javascript/so_color_swatches_pro/css/style.css');
                
                    $this->load->model('extension/module/so_color_swatches_pro');
                    $options = $this->model_extension_module_so_color_swatches_pro->getProductOptions($product_info['product_id']);
                    foreach ($options as $option) {
                        $product_option_value_data = array();
                        foreach ($option['product_option_value'] as $option_value) {
                            if (!$option_value['subtract'] || ($option_value['quantity'] > 0)) {
                                $p_image = $this->model_extension_module_so_color_swatches_pro->getProductImages($product_info['product_id'], $option_value['option_value_id']);
                                if (isset($p_image['image']) && $p_image['image']) {
                                    $pimage = $this->model_tool_image->resize($p_image['image'], $setting['width'], $setting['height']);
                                } else {
                                    $pimage = '';
                                }
                                if (isset($p_image['product_image_id']) && $p_image['product_image_id']) {
                                    $product_image_id = $p_image['product_image_id'];
                                }
                                else {
                                    $product_image_id = '';
                                }
                                $product_option_value_data[] = array(
                                    'product_option_value_id' => $option_value['product_option_value_id'],
                                    'option_value_id'         => $option_value['option_value_id'],
                                    'name'                    => $option_value['name'],
                                    'image'                   => $this->model_tool_image->resize($option_value['image'], $data['width_product_list'], $data['height_product_list']),
                                    'price'                   => $price,
                                    'price_prefix'            => $option_value['price_prefix'],
                                    'color_image'             => $pimage,
                                    'product_image_id'        => $product_image_id
                                );
                            }
                        }
                        $option_data[] = array(
                            'product_option_id'    => $option['product_option_id'],
                            'product_option_value' => $product_option_value_data,
                            'option_id'            => $option['option_id'],
                            'name'                 => $option['name'],
                            'type'                 => $option['type'],
                            'value'                => $option['value'],
                            'required'             => $option['required']
                        );
                    }
                }
            ]]></add>
        </operation>
        <operation>
            <search><![CDATA['product_id'  => $product_info['product_id'],]]></search>
            <add position="after"><![CDATA[
                'option'      => $option_data,
            ]]></add>
        </operation>
    </file>
    <file path="catalog/controller/extension/module/{bestseller,latest,special}*.php">
        <operation>
            <search><![CDATA[$data['products'][] = array(]]></search>
            <add position="before"><![CDATA[
                $option_data = array();
                $image_data = array();
                if ($this->config->get('module_so_color_swatches_pro_status')) {
                    $data['color_swatch_status'] = $this->config->get('module_so_color_swatches_pro_status');
                    $data['enable_product_list'] = $this->config->get('module_so_color_swatches_pro_enable_product_list');
                    $data['width_product_list'] = (int)$this->config->get('module_so_color_swatches_pro_width_product_list');
                    if ($data['width_product_list'] == 0) {
                        $data['width_product_list'] = 15;
                    }
                    $data['height_product_list'] = (int)$this->config->get('module_so_color_swatches_pro_height_product_list');
                    if ($data['height_product_list'] == 0) {
                        $data['height_product_list'] = 15;
                    }
                    $data['colorswatch_type'] = $this->config->get('module_so_color_swatches_pro_type');
                    $this->document->addStyle('catalog/view/javascript/so_color_swatches_pro/css/style.css');
                
                    $this->load->model('extension/module/so_color_swatches_pro');
                    $options = $this->model_extension_module_so_color_swatches_pro->getProductOptions($result['product_id']);
                    foreach ($options as $option) {
                        $product_option_value_data = array();
                        foreach ($option['product_option_value'] as $option_value) {
                            if (!$option_value['subtract'] || ($option_value['quantity'] > 0)) {
                                $p_image = $this->model_extension_module_so_color_swatches_pro->getProductImages($result['product_id'], $option_value['option_value_id']);
                                if (isset($p_image['image']) && $p_image['image']) {
                                    $pimage = $this->model_tool_image->resize($p_image['image'], $setting['width'], $setting['height']);
                                } else {
                                    $pimage = '';
                                }
                                if (isset($p_image['product_image_id']) && $p_image['product_image_id']) {
                                    $product_image_id = $p_image['product_image_id'];
                                }
                                else {
                                    $product_image_id = '';
                                }
                                $product_option_value_data[] = array(
                                    'product_option_value_id' => $option_value['product_option_value_id'],
                                    'option_value_id'         => $option_value['option_value_id'],
                                    'name'                    => $option_value['name'],
                                    'image'                   => $this->model_tool_image->resize($option_value['image'], $data['width_product_list'], $data['height_product_list']),
                                    'price'                   => $price,
                                    'price_prefix'            => $option_value['price_prefix'],
                                    'color_image'             => $pimage,
                                    'product_image_id'        => $product_image_id
                                );
                            }
                        }
                        $option_data[] = array(
                            'product_option_id'    => $option['product_option_id'],
                            'product_option_value' => $product_option_value_data,
                            'option_id'            => $option['option_id'],
                            'name'                 => $option['name'],
                            'type'                 => $option['type'],
                            'value'                => $option['value'],
                            'required'             => $option['required']
                        );
                    }
                }
            ]]></add>
        </operation>
        <operation>
            <search><![CDATA[$data['products'][] = array]]></search>
            <add position="after" trim="true" offset="1"><![CDATA[
                'option'      => $option_data,
            ]]></add>
        </operation>
    </file>
    <file path="catalog/view/theme/*/template/extension/module/{featured,bestseller,latest,special}*.twig">
        <operation>
            <search><![CDATA[<img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" />]]></search>
            <add position="replace"><![CDATA[
                <img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" id="product-image-{{ product.product_id }}" />
            ]]></add>
        </operation>
        <operation>
            <search><![CDATA[<h4><a href="{{ product.href }}">{{ product.name }}</a></h4>]]></search>
            <add position="after"><![CDATA[
                {% if product.option %}
                <ul class="so-productlist-colorswatch" id="colorswatch-{{ product.product_id }}">
                    {% for option in product.option %}
                        {% if option.type == 'select' %}
                            {% for option_value in option.product_option_value %}
                                 <li class="colorswatch{{option_value.product_option_value_id~option_value.option_value_id~product.product_id }}">
                                    <a href="javascript:void(0);" title="{{ option_value.name }}" style="width: {{ width_product_list }}px; height: {{ height_product_list }}px; background-image: url('{{ option_value.image }}')"></a>
                                    <script type="text/javascript">
                                        jQuery(document).ready(function($) {
                                            var $window_width = $(window).width();
                                            {% if colorswatch_type == 'click' %}
                                                $(document).on('click', '.so-productlist-colorswatch li.colorswatch{{ option_value.product_option_value_id~option_value.option_value_id~product.product_id }}', function(e) {
                                                    e.preventDefault();
                                                    {% if option_value.color_image %}
                                                        jQuery('img#product-image-{{product.product_id }}').attr('src', '{{ option_value.color_image }}');
                                                    {% endif %}
                                                    
                                                    $('.so-productlist-colorswatch li').removeClass('actived');
                                                    $(this).removeClass('actived').addClass('actived');
                                                });
                                            {% else %}
                                                if ($window_width > 1199) {
                                                    $('.so-productlist-colorswatch li.colorswatch{{ option_value.product_option_value_id~option_value.option_value_id~product.product_id }}').hover(function(e) {
                                                        e.preventDefault();
                                                        {% if option_value.color_image %}
                                                            jQuery('img#product-image-{{product.product_id }}').attr('src', '{{ option_value.color_image }}');
                                                        {% endif %}
                                                        
                                                        $('.so-productlist-colorswatch li').removeClass('actived');
                                                        $(this).removeClass('actived').addClass('actived');
                                                    });
                                                }
                                                else {
                                                    $(document).on('click', '.so-productlist-colorswatch li.colorswatch{{ option_value.product_option_value_id~option_value.option_value_id~product.product_id }}', function(e) {
                                                        e.preventDefault();
                                                        {% if option_value.color_image %}
                                                            jQuery('img#product-image-{{product.product_id }}').attr('src', '{{ option_value.color_image }}');
                                                        {% endif %}
                                                        
                                                        $('.so-productlist-colorswatch li').removeClass('actived');
                                                        $(this).removeClass('actived').addClass('actived');
                                                    });
                                                }
                                            {% endif %}
                                        })
                                    </script>
                                </li>
                            {% endfor %}
                        {% endif %}
                    {% endfor %}
                </ul>
                {% endif %}
            ]]></add>
        </operation>
    </file>
    
</modification>