{% extends 'intro_base.html' %}
{% load staticfiles %}
{#{% block extrastyle %}<link rel='stylesheet' href='{% static 'base/css/intro.css' %}'/>{% endblock extrastyle %}#}
{% block extrastyle %}<link rel="stylesheet" href="{% static 'base/css/jquery-confirm.min.css' %}"/>{% endblock extrastyle %}
{% block header_menu %}
    <li class="active"><a href="{% url 'order_contract:ebook_catalog_list' order_id %}">e-book 카탈로그</a></li>
{% endblock header_menu %}
{% block content %}
	<article>
		<div class="introTab">
			<ul>
    			<li class="season">
    				<ul>
    					<li>
                            <a href="{% url 'order_contract:ebook_catalog_list' order_id 'winter' style %}">
                                {% if season == 'winter' %}
                                    <img src="{% static 'base/image/winter_c.png' %}">
                                {% else %}
                                    <img src="{% static 'base/image/winter_b.png' %}">
                                {% endif %}
                                <p>동복</p>
                            </a>
                        </li>
    					<li>
                            <a href="{% url 'order_contract:ebook_catalog_list' order_id 'summer' style %}">
                                {% if season == 'summer' %}
                                    <img src="{% static 'base/image/summer_c.png' %}">
                                {% else %}
                                    <img src="{% static 'base/image/summer_b.png' %}">
                                {% endif %}
                                <p>하복</p>
                            </a>
                        </li>
    				</ul>
    			</li>
    			<li class="type borderN">
    				<ul>
    					<li>
                            <a href="{% url 'order_contract:ebook_catalog_list' order_id season 'formal'%}">
                                {% if style == 'formal' %}
                                    <img src="{% static 'base/image/school_c.png' %}">
                                {% else %}
                                    <img src="{% static 'base/image/school_b.png' %}">
                                {% endif %}
                                <p>정복</p>
                            </a>
                        </li>
    					<li>
                            <a href="{% url 'order_contract:ebook_catalog_list' order_id season 'training' %}">
                                {% if style == 'training' %}
                                    <img src="{% static 'base/image/gym_c.png' %}">
                                {% else %}
                                    <img src="{% static 'base/image/gym_b.png' %}">
                                {% endif %}
                            <p>체육복</p>
                            </a>
                        </li>
    				</ul>
    			</li>
    		</ul>
		</div>
        <p class="ebookText">3가지 디자인만 선택 가능 합니다.</p>
		<div class="flipbook-viewport" style="display: none">
			<div class="container">
				<div class="flipbook">
                    {% if season == 'winter' and style == 'formal' %}
					<div style="background-image: url({% static 'base/image/bro_front.jpg' %})"></div>
                    {% endif %}
                    {% for object in object_list %}
                        <div style="background-image: url({{ object.catalog_image.url }}">
                            <ul class="eBookBtnWrap">
                                <li>
                                    <input class="coupleIndex" type="hidden" value="{{ object.couple.id }}" />
                                    {% if object.favorite_check %}
                                        <img class="eBookStar" src="{% static 'base/image/star_c.png' %}">
                                    {% else %}
                                        <img class="eBookStar" src="{% static 'base/image/star_n.png' %}">
                                    {% endif %}
                                </li>
                                <li>
                                    <input class="coupleIndex" type="hidden" value="{{ object.couple.id }}" />
                                    <a href="{% url 'simulation:extend_mapping:index' order_id object.couple.id %}"><img class="eBookDetail" src="{% static 'base/image/searchIcon.png' %}"></a>
                                </li>
                            </ul>
                        </div>
                    {% endfor %}
				</div>
			</div>
        </div>
	</article>
	<footer>
		<!--<p>COPYRIGHT @ 2017 SMART FNC ALL RIGHT RESERVED</p>-->
        <div class="arrow_left"><a href="{% url 'order_contract:little_smart_list' kindergarten_id %}"><img src="{% static 'base/image/arrow_left.png' %}"/></a></div>
		<div class="arrow_right"><a href="{% url 'simulation:extend_mapping:index' order_id %}"><img src="{% static 'base/image/arrow_right.png' %}"/></a></div>
	</footer>

{% endblock content %}
{% block extrascript %}
    <script type="text/javascript" src="{% static 'base/js/modernizr.2.5.3.min.js' %}"></script>
    <script type="text/javascript" src="{% static 'base/js/jquery-confirm.min.js' %}"></script>
    <script type="text/javascript" src="{% static 'order_contract/js/ebook_catalog.js' %}"></script>
    <script>
        eBookCatalog.orderIndex = '{{ order_id }}';
        eBookCatalog.season = '{{ season }}';
        eBookCatalog.style = '{{ style }}';
    </script>
{% endblock extrascript %}