{% extends '@App/base.html.twig' %}
{% block title %}
    spotLIGHT Video Inventory
{% endblock %}
{%  block modal %}
    <!--Watch Selected Modal-->
    <div class="modal modal-primary fade scale in" id="watch_selected_modal">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                    <!--<h4 class="modal-title">
                        Stock #<span id="watch_selected_modal_stock_number" style="display: inline;"></span>
                    </h4>-->
                </div>
                <div class="modal-body">
                    <video id="watch_selected_modal_video" controls="" style="width:100%;">
                        <source id="watch_selected_modal_video_source" src="" type="video/mp4">
                    </video>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-raised btn-primary btn-flat" data-dismiss="modal">
                        CLOSE
                    </button>
                </div>
            </div>
        </div>
    </div>
    <!--End Watch Selected Modal-->
{% endblock %}
{% block body %}
    <div class="row">
        <div class="col-xs-12">
            <div class="widget">
                <div class="row">
                    <div class="col-xs-12">
                        <a href="{{ path('spotlight_video_inventory_new') }}"
                           class="btn btn-success btn-raised btn-lg pull-left" style="margin-right:50px;">
                            ADD VIDEO
                        </a>
                        <table id="used_car_internal_ro_list" class="table table-hover table-striped table-bordered">
                            <thead>
                            <tr>
                                <th>NAME</th>
                                <th>VIDEO</th>
                                <th>DEFAULT NEW CAR</th>
                                <th>DEFAULT USED CAR</th>
                                <th>ACTIVE</th>
                                <th>ACTIONS</th>
                            </tr>
                            </thead>
                            <tbody>
                            {% for video in videos %}
                                <tr>
                                    <td>{{ video.name }}</td>
                                    <td>
                                        <button class="btn btn-success" data-toggle="modal"
                                                data-target="#watch_selected_modal"
                                                data-video="{{ video.video }}"
                                                data-stock_number="stock">
                                            WATCH VIDEO
                                        </button>
                                    </td>
                                    <td>
                                        {% if video.newCarDefault %}
                                            <a href="{{ path('spotlight_video_inventory_make_not_default_new', {'id' : video.id}) }}"
                                               class="btn btn-danger make_not_default_new">
                                                Remove as Default
                                            </a>
                                        {% else %}
                                            <a href="{{ path('spotlight_video_inventory_make_default_new', {'id' : video.id}) }}"
                                               class="btn btn-primary make_default_new">
                                                Make Default
                                            </a>
                                        {% endif %}
                                    </td>
                                    <td>
                                        {% if video.usedCarDefault %}
                                            <a href="{{ path('spotlight_video_inventory_make_not_default_used', {'id' : video.id}) }}"
                                               class="btn btn-danger make_not_default_used">
                                                Remove as Default
                                            </a>
                                        {% else %}
                                            <a href="{{ path('spotlight_video_inventory_make_default_used', {'id' : video.id}) }}"
                                               class="btn btn-primary make_default_used">
                                                Make Default
                                            </a>
                                        {% endif %}
                                    </td>
                                    <td>
                                        {% if video.active %}
                                            Yes
                                        {% else %}
                                            No
                                        {% endif %}
                                    </td>
                                    <td>
                                        {% if video.active %}
                                            <a href="{{ path('spotlight_video_inventory_deactivate', {'id' : video.id}) }}"
                                               class="btn btn-primary deactivate_video">Deactivate</a>
                                        {% else %}
                                            <a href="{{ path('spotlight_video_inventory_activate', {'id' : video.id}) }}"
                                               class="btn btn-success activate_video">Activate</a>
                                        {% endif %}
                                        <a href="{{ path('spotlight_video_inventory_delete', {'id' : video.id}) }}"
                                           class="btn btn-danger delete_video">Delete</a>
                                    </td>
                                </tr>
                            {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

{% endblock %}
{% block javascripts %}
    <script>
        $('body').on('click', '.make_default_new', function (e) {
            e.preventDefault();

            var link = $(this).attr('href');
            if (confirm('Are you sure you want this video as the default video for new cars?')) {
                window.location = link;
            }
        });

        $('body').on('click', '.make_not_default_new', function (e) {
            e.preventDefault();

            var link = $(this).attr('href');
            if (confirm('Are you sure you want to remove this video as the default video for new cars?')) {
                window.location = link;
            }
        });

        $('body').on('click', '.make_default_used', function (e) {
            e.preventDefault();

            var link = $(this).attr('href');
            if (confirm('Are you sure you want this video as the default video for used cars?')) {
                window.location = link;
            }
        });

        $('body').on('click', '.make_not_default_used', function (e) {
            e.preventDefault();

            var link = $(this).attr('href');
            if (confirm('Are you sure you want to remove this video as the default video for used cars?')) {
                window.location = link;
            }
        });

        $('body').on('click', '.deactivate_video', function (e) {
            e.preventDefault();

            var link = $(this).attr('href');
            if (confirm('Are you sure you want to deactivate this video?')) {
                window.location = link;
            }
        });

        $('body').on('click', '.activate_video', function (e) {
            e.preventDefault();

            var link = $(this).attr('href');
            if (confirm('Are you sure you want to activate this video?')) {
                window.location = link;
            }
        });

        $('body').on('click', '.delete_video', function (e) {
            e.preventDefault();

            var link = $(this).attr('href');
            if (confirm('Are you sure you want to delete this video?')) {
                window.location = link;
            }
        });

        $('body').on('show.bs.modal', '#watch_selected_modal', function (e) {
            var video       = $(e.relatedTarget).data('video');
            var $watchSelectedModalVideoSource = $('#watch_selected_modal_video_source');
            var $watchSelectedModalVideo = $('#watch_selected_modal_video');
            $watchSelectedModalVideoSource.attr('src', video);
            $watchSelectedModalVideo.load();
        });

        $('body').on('hide.bs.modal', '#watch_selected_modal', function () {
            var $watchSelectedModalVideoSource = $('#watch_selected_modal_video_source');
            $watchSelectedModalVideoSource.attr('src', '');
        });
    </script>
{% endblock %}