{% load staticfiles %}
<!-- 남자 -->
<div class="coodiTabContainer" id="boyProduct">
<div class="scrollBlind">
<ul class="coodiTabs">
    {% if boy_shirts %}
        <li class="coodiTabActive" rel="boyShirtsCategory"><img src="{% static 'simulation/images/shirts_on.png' %}" width="35" /><p>상의</p></li>
    {% endif %}
    {% if boy_jacket %}
        <li rel="boyJacketCategory"><img src="{% static 'simulation/images/jacket_off.png' %}" /><p>자켓</p></li>
    {% endif %}
    {% if boy_vest %}
        <li rel="boyVestCategory"><img src="{% static 'simulation/images/vest_off.png' %}" /><p>조끼</p></li>
    {% endif %}
    {% if boy_pants %}
        <li rel="boyPantsCategory"><img src="{% static 'simulation/images/pants_off.png' %}" /><p>바지</p></li>
    {% endif %}
    {% if boy_overall %}
        <li rel="boyOverallCategory"><img src="{% static 'simulation/images/overall_off.png' %}" /><p>오버롤</p></li>
    {% endif %}
    {% if boy_acc %}
        <li rel="boyAccCategory"><img src="{% static 'simulation/images/acc_off.png' %}" /><p>악세사리</p></li>
    {% endif %}
</ul>
</div>
{% if boy_shirts %}
    <div id="boyShirtsCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not boy_shirts == 'nothing' %}
                    {% for item in  boy_shirts %}
                            <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
{% if boy_jacket %}
    <div id="boyJacketCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not boy_jacket == 'nothing' %}
                    {% for item in  boy_jacket %}
                        <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
{% if boy_vest %}
    <div id="boyVestCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not boy_vest == 'nothing' %}
                    {% for item in  boy_vest %}
                        <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
{% if boy_pants %}
    <div id="boyPantsCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not boy_pants == 'nothing' %}
                    {% for item in  boy_pants %}
                        <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
{% if boy_overall %}
    <div id="boyOverallCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not boy_overall == 'nothing' %}
                    {% for item in  boy_overall %}
                        <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
{% if boy_acc %}
    <div id="boyAccCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not boy_acc == 'nothing' %}
                    {% for item in  boy_acc %}
                        <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
</div>

<!-- 여자 -->
<div class="coodiTabContainer" id="girlProduct">
<div class="scrollBlind">
<ul class="coodiTabs">
    {% if girl_shirts %}
        <li class="coodiTabActive" rel="girlShirtsCategory"><img src="{% static 'simulation/images/shirts_on.png' %}" width="35" /><p>상의</p></li>
    {% endif %}
    {% if girl_jacket %}
        <li rel="girlJacketCategory"><img src="{% static 'simulation/images/jacket_off.png' %}" /><p>자켓</p></li>
    {% endif %}
    {% if girl_vest %}
        <li rel="girlVestCategory"><img src="{% static 'simulation/images/vest_off.png' %}" /><p>조끼</p></li>
    {% endif %}
    {% if girl_pants %}
        <li rel="girlPantsCategory"><img src="{% static 'simulation/images/pants_off.png' %}" /><p>바지</p></li>
    {% endif %}
    {% if girl_skirt %}
        <li rel="girlSkirtCategory"><img src="{% static 'simulation/images/skirt_off.png' %}"/><p>치마</p></li>
    {% endif %}
    {% if girl_one_piece %}
        <li rel="girlOnePieceCategory"><img src="{% static 'simulation/images/onepiece_off.png' %}" /><p>원피스</p></li>
    {% endif %}
    {% if girl_overall %}
        <li rel="girlOverallCategory"><img src="{% static 'simulation/images/overall_off.png' %}" /><p>오버롤</p></li>
    {% endif %}
    {% if girl_dress %}
        <li rel="girlDressCategory"><img src="{% static 'simulation/images/dress_off.png' %}" /><p>드레스</p></li>
    {% endif %}
    {% if girl_acc %}
        <li rel="girlAccCategory"><img src="{% static 'simulation/images/acc_off.png' %}" /><p>악세사리</p></li>
    {% endif %}
</ul>
</div>
{% if girl_shirts%}
    <div id="girlShirtsCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not girl_shirts == 'nothing' %}
                    {% for item in  girl_shirts %}
                        <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
{% if girl_jacket%}
    <div id="girlJacketCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not girl_jacket == 'nothing' %}
                    {% for item in  girl_jacket %}
                        <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
{% if girl_vest%}
    <div id="girlVestCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not girl_vest == 'nothing' %}
                    {% for item in  girl_vest %}
                        <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
{% if girl_pants%}
    <div id="girlPantsCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not girl_pants == 'nothing' %}
                    {% for item in  girl_pants %}
                        <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
{% if girl_skirt%}
    <div id="girlSkirtCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not girl_skirt == 'nothing' %}
                    {% for item in  girl_skirt %}
                        <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
{% if girl_one_piece%}
    <div id="girlOnePieceCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not girl_one_piece == 'nothing' %}
                    {% for item in  girl_one_piece %}
                        <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
{% if girl_overall%}
    <div id="girlOverallCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not girl_overall == 'nothing' %}
                    {% for item in  girl_overall %}
                        <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
{% if girl_dress%}
    <div id="girlDressCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not girl_dress == 'nothing' %}
                    {% for item in  girl_dress %}
                        <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
{% if girl_acc%}
    <div id="girlAccCategory" class="coodiTabContent">
        <div class="coodiWrap">
            <ul>
                <li onclick="sc.productDelete(this);"><img src="{% static 'simulation/images/xIcon.jpg' %}"></li>
                {% if not girl_acc == 'nothing' %}
                    {% for item in  girl_acc %}
                        <li data-product-index="{{ item.id  }}" onclick="sc.productClickEvent({{ item.id }}, {{ item.first_fabric.id }}, this);"><img src="{{ item.first_fabric.mapping_thumb.url }}"><p class="productTitle">{{ item.name }}</p></li>
                    {% endfor %}
                {% endif %}
            </ul>
        </div>
    </div>
{% endif %}
</div>