<!DOCTYPE HTML>

<html>
<head>
    <meta charset="UTF-8"/>
    <meta http-equiv="Content-Language" content="pl"/>
    <meta http-equiv="pragma" content="no-cache"/>
    <meta http-equiv="cache-control" content="no-cache"/>
    <meta name="distribution" content="global"/>

    <title>Pitbull</title>


    <link rel="stylesheet" href="css/semantic.css">
    <link rel="stylesheet" href="css/icon.css">
    <link href="css/lightbox.css" rel="stylesheet"/>

    <link rel="stylesheet" href="css/style.css"/>
    <link rel="stylesheet" href="css/animate.css">
    <link rel="stylesheet" href="css/sticky.css">
    <link href="css/chosen.css" rel="stylesheet">
    <link href="css/flatpickr.min.css" rel="stylesheet">
    <link href="css/select2.css" rel="stylesheet">
    <link href="css/drukarka.css" type="text/css" rel="stylesheet" media="print" />
    <link href="datatables/datatables.css" rel="stylesheet">



    <style>
        input[type="search"] {
            margin-bottom: 10px;
            max-width: 200px;
        }

        .paginate_button {
            background: transparent !important;
            color: black !important;
            border: 0 !important;
        }

        .tdAction:hover {
            color: red;
            cursor: pointer;
        }

        table.dataTable tbody th,
        table.dataTable tbody td {
            white-space: nowrap;
        }

    </style>


</head>

<body>
<div id="loader"><img style="width: 150px; z-index: 10001; position: fixed;  top: 40%;" src="img/loader.gif"/></div>
<div class="ui basic modal delete">
    <div class="ui icon header">
        <i class="trash outline icon"></i>
        Usuwanie
    </div>
    <div class="content">
        <p></p>
    </div>
    <div class="actions">
        <div class="ui red cancel inverted button">
            <i class="remove icon"></i>
            Nie
        </div>
        <div class="ui green ok inverted button">
            <i class="checkmark icon"></i>
            Tak
        </div>
    </div>
</div>

<div id="infoModal" class="ui modal">
    <i class="close icon"></i>
    <div id="infoModalHeader" class="header">

    </div>
    <div id="infoModalContent" class="content">

    </div>
    <div class="actions">

        <div class="ui positive right labeled icon button">
            OK
            <i class="checkmark icon"></i>
        </div>
    </div>
</div>

<div id="content">
    {% block body %}
        {% include 'orders/filters.html.twig' %}
        {% include 'orders/main.html.twig' %}
    {% endblock %}
</div>


<script src='js/jquery.min.js'></script>
<script src="js/jquery.animate-colors-min.js"></script>
<script src="js/semantic.js"></script>
<script src="js/scrollreveal.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script src="datatables/datatables.js"></script>
<script src="js/sticky.min.js"></script>
<script src="js/chosen.jquery.js"></script>
<script src="js/flatpickr.js"></script>
<script src="js/pl.js"></script>
<script src="js/autoNumeric.js"></script>
<script src="js/select2.js"></script>
<script src="js/printThis.js"></script>
<script>

    var $myFilters = {{ filters | json_encode | raw }};
    var $magazyny = {{ magazynyNazwy | json_encode | raw }};

</script>

<script src="js/App/OrdersApp.js"></script>

</body>
</html>
{% block javascript %}
{%endblock%}
<script>


    $(document).ready(function () {
        var $wrapper = $('#content');
        var ordersApp = new OrdersApp($wrapper);

        $('tr').on('mouseenter', function(){
            var id = $(this).attr('data-id');
            $('td[data-id="' + id + '"]').css('background', '#ADD8E6');
        });

        $('tr').on('mouseleave', function(){
            var id = $(this).attr('data-id');
            $('td[data-id="' + id + '"]').css('background', 'white');
            $('.grey').css('background', '#D3D3D3');
        });

    });

</script>


