WordPress

{% extends 'base.html.twig' %}
{% block header_class %}{% endblock %}

{% block title %}Sura Images!{% endblock %}

{% block hero_banner %}

{% endblock %}
{% block header %}
    {% include 'dashboard/header.html.twig' %}
{% endblock %}

{% block body %}
    {# @var helper \App\Service\Helper #}
    <div class="app_main_inner">
        <div class="section_stock_detail">

            <div class="wrap">
                <div class="alert alert-success add-to-cart-notif" style="display: none">
                    Item Successfully added to Your {% if app.user %} <a href="{{ path('membershp_membership_index') }}"> Cart!</a> {% else %}
                        <a href="{{ path('membershp_membership_offline') }}"> Cart!</a>
                    {% endif %}
                </div>
                <div class="stock_wrap">
                    <h2 class="stock_title">{{ image.title }}</h2>
                    <div class="stock_detail_left">
                        {% if image.type.title == "video" %}
                            <video class="detail_thumbnail" controls autoplay muted>
                                <source src="{{ asset('uploads/stock/')~ image.previewName }}" type="video/mp4">
                                Your browser does not support videos.
                            </video>
                        {% else %}
                            <img src="{{asset('uploads/stock/'~ image.previewName)}}" class="detail_thumbnail">
                        {% endif %}

                        <div class="thumbnail_int">
                            <a href="{{ path('membershp_member_download_preview',{'id':image.id}) }}" class="download_preview">Download Preview</a>
                        </div>
                        <div class="details_table">
                            <table>
                                <tbody>
                                <tr>
                                    <td>Title</td>
                                    <td>{{ image.title }}</td>
                                </tr>
                                <tr>
                                    <td>Image ID</td>
                                    <td>suraimages-{{ image.formattedId }}</td>
                                </tr>
                                <tr>
                                    <td>Release Information</td>
                                    <td>No</td>
                                </tr>
                                <tr>
                                    <td>License Type</td>
                                    <td>{{ image.licenceType }}</td>
                                </tr>
                                <tr>
                                    <td>Image Type</td>
                                    <td>{{ image.type }}</td>
                                </tr>
                                <tr>
                                    <td>Photographer</td>
                                    <td>
                                        <a href="{{ path('search_contributor', {'id': image.contributor.id, 'stock': image.id}) }}">{{ image.contributor.firstName}}  {{ image.contributor.lastName }}</a>
                                    </td>
                                </tr>
                                <tr>
                                    <td>Categories</td>
                                    <td>
                                        {% for stockCat in image.stocksCats %}
                                            {{ stockCat.categoryStockCat.name|title }}{% if loop.last == false %}, {% else %}.{% endif %}
                                        {% else %}
                                            {{ image.category }}
                                        {% endfor %}
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>

                        <div class="stock_detail_right">
                            <ul class="licence_tabs">
                                <li><a class="nav-link exclusive" data-toggle="tab" href="#exclusive_licence"> Extend Exclusive Licence </a></li>

                            </ul>

                            <div class="tab-content">
                                <div class="alert  alert-danger" style="display: none">
                                </div>
                                <div class="tab_pane active" id="exclusive_licence">
                                    <div class="licence_excerpt">
                                        Exclusive license means that the licensee/ the buyer has exclusive rights to the content (Images, Videos) they buy for a specified period of time. Meaning, the licensee will be the only person to use the content s for the stipulated period of time and within that period the content s will be inactive for purchase from any other licensee until the duration of the license e pires. See our Exclusivity & Control page for more information.
                                    </div>
                                    <label for="1_month_licence" class="selectable_type">
                                        <input type="radio" name="exclusive_one" data-duration="One Month" data-int-duration="1" value="{{ exclusivePricing.photoOneMonth }}" id="1_month_licence" class="selected_tag exclusive_price_tag">
                                        <span class="select_left">
                                    <h4>1 Month</h4>
                                    <p>Exclusive license</p>
                                </span>
                                        <span class="select_right">${{ exclusivePricing.photoOneMonth }}</span>
                                    </label>

                                    <label for="3_month_licence" class="selectable_type">
                                        <input type="radio" name="exclusive_three" data-int-duration="3" data-duration="Three Months" value="{{ exclusivePricing.photoThreeMonth }}" id="3_month_licence" class="selected_tag exclusive_price_tag">
                                        <span class="select_left">
                                    <h4>3 Months</h4>
                                    <p>Exclusive license</p>
                                </span>
                                        <span class="select_right">${{ exclusivePricing.photoThreeMonth }}</span>
                                    </label>

                                    <label for="6_month_licence" class="selectable_type">
                                        <input type="radio" data-duration="Six months" data-int-duration="6" value="{{ exclusivePricing.photoSixMonths }}" name="exclusive_six" id="6_month_licence" class="selected_tag exclusive_price_tag">
                                        <span class="select_left">
                                    <h4>6 Months</h4>
                                    <p>Exclusive license</p>
                                </span>
                                        <span class="select_right">${{ exclusivePricing.photoSixMonths }}</span>
                                    </label>

                                    <label for="12_month_licence" class="selectable_type">
                                        <input type="radio" data-duration="One Year" data-int-duration="12" value="{{ exclusivePricing.photoOneYear }}" name="exclusive_twelve" id="12_month_licence" class="selected_tag exclusive_price_tag">
                                        <span class="select_left">
                                    <h4>1 Year</h4>
                                    <p>Exclusive license</p>
                                </span>
                                        <span class="select_right">${{ exclusivePricing.photoOneYear }}</span>
                                    </label>

                                    <label for="24_month_licence" class="selectable_type">
                                        <input type="radio" data-duration="Two Years" data-int-duration="24" value="{{ exclusivePricing.photoTwoYears }}" name="exclusive_twentyFour" id="24_month_licence" class="selected_tag exclusive_price_tag">
                                        <span class="select_left">
                                    <h4>2 Years</h4>
                                    <p>Exclusive license</p>
                                </span>
                                        <span class="select_right">${{ exclusivePricing.photoTwoYears }}</span>
                                    </label>
                                </div>
                                <div class="total_image_amount">
                                    <h3>License Fee : $ <span class="licence_fee">0.00</span></h3>

                                        <button class="purchase_btn basket_btn renew_btn btn_royalty_free add-to-cart"
                                                data-id="{{ image.id }}"
                                                data-thumb-url="{{asset('uploads/stock/'~ image.thumbName)}}"
                                                data-name="{{ image.title }}"
                                                data-price="{{ image.price }}"
                                                data-small-price="{{ image.priceSmall }}"
                                                data-medium-price="{{ image.price }}"
                                                data-large-price="{{ image.priceLarge }}"
                                                data-exclusive-1-month="{{ exclusivePricing.photoOneMonth }}"
                                                data-exclusive-3-month="{{ exclusivePricing.photoThreeMonth}}"
                                                data-exclusive-6-month="{{ exclusivePricing.photoSixMonths }}"
                                                data-exclusive-12-month="{{ exclusivePricing.photoOneYear }}"
                                                data-exclusive-24-month="{{ exclusivePricing.photoTwoYears }}"
                                                data-has-exclusive="{{ image.contributor.isExclusive ?image.contributor.isExclusive : 0 }}"
                                                data-add-to-cart-url="{{ path('cart_item_new') }}"
                                                data-load-cart-items-url="{{ path('cart_item_index') }}"
                                                data-remove-from-cart-url = "{{ path('cart_item_remove') }}"

                                        >Add to Basket</button>
                                </div>


                            </div>


                        </div>

                </div>
                <div class="search_key">
                    <h4>Keywords</h4>
                    <ul class="tags_wrap">
                        {% set keywords = image.keywords|split(",") %}
                        {% for word in keywords %}
                            <li>
                                <input type="hidden" name="stock" value="{{ image.id }}">
                                <input type="hidden" name="keyword" value="{{ word }}">
                                <a href="{{ path('search_keyword_search', {id: image.id,keyword: word ? word: "null" } ) }}" >{{ word }}</a>
                            </li>
                        {% endfor %}
                    </ul>
                </div>
                <div class="similar_images">
                    <ul class="similar_menu">
                        <li class="active"><a href="#similar_img" data-toggle="tab"  aria-expanded="true">Similar Images</a></li>
                        <li><a href="#similar_shoot" data-toggle="tab" aria-expanded="true">Same Shoot</a></li>
                        <li><a href="#similar_model" data-toggle="tab" aria-expanded="true">Same Model</a></li>
                    </ul>
                    <div class="tab-content">
                        <div class="tab_pane fade show active in" id="similar_img">
                            <ul class="similar_thum">
                                {% for stock in similarStocks|slice(0,7) %}
                                    <li><a href="{{ path('image_details', {id: stock.id}) }}"> <img src="{{asset('uploads/stock/')~stock.thumbName}}" class="similar_thumb"></a></li>
                                {% endfor %}
                                {#                            {% if similarStocks|length > 7 %}#}
                                <li>
                                    <a href="{{ path('home_similar_stock', {id: image.id}) }}" class="similar_link">
                                        View All
                                    </a>
                                </li>
                                {#                            {% endif %}#}
                            </ul>
                        </div>
                        <div class="tab_pane fade" id="similar_shoot">
                            <ul class="similar_thum">
                                {% for stock in sammeShootStock|slice(0,7) %}
                                    <li><a href="{{ path('image_details', {id: stock.id}) }}"> <img src="{{asset('uploads/stock/')~stock.thumbName}}" class="similar_thumb"></a></li>
                                {% else %}
                                    <span>No same shoot stock found</span>
                                {% endfor %}
                                {#                            {% if sammeShootStock|length > 7 %}#}
                                <li>
                                    <a href="{{ path('home_same_shoot', {id: image.id}) }}" class="similar_link">
                                        View All
                                    </a>
                                </li>
                                {#                            {% endif %}#}
                                {#<li><a href=""> <img src="{{asset('images/pexels-photo-1124066.jpeg')}}" class="similar_thumb"></a></li>#}
                            </ul>
                        </div>
                        <div class="tab_pane fade" id="similar_model">
                            <ul class="similar_thum">
                                {% for stock in sameModelStocks|slice(0,7) %}
                                    <li><a href="{{ path('image_details', {id: stock.id}) }}"> <img src="{{asset('uploads/stock/')~stock.thumbName}}" class="similar_thumb"></a></li>
                                {% endfor %}
                                {#                            {% if sameModelStocks|length > 7 %}#}
                                <li>
                                    <a href="{{ path('home_model_stocks', {id: image.id}) }}" class="similar_link">
                                        View All
                                    </a>
                                </li>
                                {#                            {% endif %}#}
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>


    </div>

    <!-- Modal -->
    <div class="modal fade" id="cart" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <a href="" class="close_modal" data-dismiss="modal"></a>
                <h2 class="modal_title">Cart <span class="total-count"></span></h2>
                <div class="modal-body">
                    <div class="datagrid cart_table">
                        <table>
                            <thead>
                            <tr>
                                <th>Image</th>
                                <th>Image ID</th>
                                <th>Size</th>
                                <th>Exclusive licence</th>
                                <th>Price</th>
                                <th>Delete</th>
                            </tr>
                            </thead>
                            <tbody class="show-cart">

                            </tbody>
                            <tfoot>
                            <tr>
                                <td colspan="6" class="total_cart">Total: <span class="total_price"></span>	</td>
                            </tr>
                            </tfoot>
                        </table>
                    </div>
                    <a href="{{ path('membershp_checkout') }}" class="proceed_btn">Proceed to Checkout</a>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <button data-order-url="{{ path('cart_buy') }}" id="btn-order-now" type="button" class="btn btn-primary">Order now</button>
                </div>
            </div>
        </div>
    </div>

{% endblock %}