{% load i18n static ra_admin_tags %}
<!DOCTYPE html>
<html lang="{{ LANGUAGE_CODE|default:"en-us" }}" {% if LANGUAGE_BIDI %}dir="rtl"{% endif %}>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>{% block title %}{% endblock %}</title>
    <!-- Tell the browser to be responsive to screen width -->
    {% block responsive %}
        <meta name="viewport" content="width=device-width, initial-scale=1">
    {% endblock %}

    {% block extrastyle %}{% endblock %}
    {% block extrahead %}{% endblock %}

    <!-- Font Awesome -->
    <link rel="stylesheet" href="{% static 'adminlte/plugins/fontawesome-free/css/all.min.css' %}">
    <!-- Ionicons -->
    <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
    <link rel="stylesheet"
          href="{% static 'adminlte/plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css' %}">
    <!-- iCheck -->
    <link rel="stylesheet" href="{% static 'adminlte/plugins/icheck-bootstrap/icheck-bootstrap.min.css' %}">
    <!-- JQVMap -->
    {#    <link rel="stylesheet" href="plugins/jqvmap/jqvmap.min.css">#}

    <!-- overlayScrollbars -->
    <link rel="stylesheet" href="{% static 'adminlte/css/adminlte.min.css' %}">

    <link rel="stylesheet" href="{% static 'adminlte/plugins/overlayScrollbars/css/OverlayScrollbars.min.css' %}">
{#    <!-- Daterange picker -->#}
{#    <link rel="stylesheet" href="{% static 'adminlte/plugins/daterangepicker/daterangepicker.css' %}">#}

    <link href="{{ STATIC_URL }}ra/css/animate.min.css" rel="stylesheet"
          type="text/css">
    <link rel="stylesheet" href="{{ STATIC_URL }}ra/css/ra_foreignkey_widget.css"/>
    <link rel="stylesheet" href="{{ STATIC_URL }}ra/plugins/datatables/datatables.css"/>
    <link rel="stylesheet"
          href="{{ STATIC_URL }}ra/plugins/datatables/DataTables-1.10.20/css/dataTables.bootstrap4.css"/>
    <link rel="stylesheet" href="{% static "adminlte/plugins/select2/css/select2.min.css" %}">
    <link rel="stylesheet" href="{% static "adminlte/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css" %}">
{#    <link rel="stylesheet" href="{% static 'adminlte/plugins/daterangepicker/daterangepicker.css' %}">#}
    <!-- Google Font: Source Sans Pro -->
    <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
    {% block blockbots %}
        <meta name="robots" content="NONE,NOARCHIVE">{% endblock %}

    <style>


        #changelist-form .results {
            overflow-x: initial;
        }

        td.details-control {
            background: url('{{ STATIC_URL}}ra/images/details_open.png') no-repeat center center;
            cursor: pointer;
        }

        tr.shown td.details-control {
            background: url('{{ STATIC_URL}}ra/images/details_close.png') no-repeat center center;
        }

        html[dir=rtl] .dataTables_wrapper .dataTables_length {
            /*float: right;*/
            display: block;
        }

        .report-chart {
            margin: 5px;
        }

        .groupChartControllers {
            margin: 5px;
            text-align: center;
        }

        .filters-section {
            margin-top: 1em;
        }
    </style>
</head>
<body class="hold-transition sidebar-mini {% if is_popup %}popup {% endif %}{% block bodyclass %} {% endblock %} {% block bodyclass_sidebar_collapse %}sidebar-collapse {% endblock %}"
      data-admin-utc-offset="{% now "Z" %}">
{% block wrapper %}
    <div class="wrapper">
        <!-- Navbar -->
        {% if not is_popup and not is_print %}
            {% block nav_bar_header %}
                <nav class="main-header navbar navbar-expand navbar-dark navbar-primary border-bottom-0">
                    <!-- Left navbar links -->
                    <ul class="navbar-nav">
                        <li class="nav-item">
                            <a class="nav-link" data-widget="pushmenu" href="#"><i class="fas fa-bars"></i></a>
                        </li>
                    </ul>

                    {% block usertools %}
                        {% if has_permission %}
                            <ul class="navbar-nav ml-auto">
                                <!-- Messages Dropdown Menu -->
                                <li class="nav-item dropdown">
                                    <a class="nav-link" data-toggle="dropdown" href="#">
                                        {% block welcome-msg %}
                                            {% trans 'Welcome,' %}
                                            <strong>{% firstof user.get_short_name user.get_username %}</strong>.
                                        {% endblock %}
                                    </a>
                                    <div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
                                        {#                                <span class="dropdown-item dropdown-header">15 Notifications</span>#}
                                        {#                                <div class="dropdown-divider"></div>#}
                                        {% if user.has_usable_password %}
                                            <a href="{% url 'admin:password_change' %}" class="dropdown-item">
                                                {#                                        <i class="fas fa-envelope mr-2"></i> 4 new messages#}
                                                {% trans 'Change password' %}
                                                {#                                        <span class="float-right text-muted text-sm">3 mins</span>#}
                                            </a>
                                        {% endif %}
                                        {#                                <div class="dropdown-divider"></div>#}
                                        {#                                <a href="{% url 'admin:logout' %}" class="dropdown-item">#}
                                        {#                                    <i class="fas fa-users mr-2"></i> 8 friend requests#}
                                        {#                                    <span class="float-right text-muted text-sm">12 hours</span>#}
                                        {#                                </a>#}
                                        <div class="dropdown-divider"></div>
                                        <a href="{% url 'admin:logout' %}" class="dropdown-item">
                                            {#                                    <i class="fas fa-file mr-2"></i> 3 new reports#}
                                            {% trans 'Log out' %}
                                            {#                                    <span class="float-right text-muted text-sm">2 days</span>#}
                                        </a>
                                        {#                                <div class="dropdown-divider"></div>#}
                                        {#                                <a href="#" class="dropdown-item dropdown-footer">See All Notifications</a>#}
                                    </div>
                                </li>
                                {#                        <li class="nav-item">#}
                                {#                            <a class="nav-link" data-widget="control-sidebar" data-slide="true" href="#">#}
                                {#                                <i class="fas fa-th-large"></i>#}
                                {#                            </a>#}
                                {#                        </li>#}
                                {% block nav-global %}{% endblock %}
                            </ul>
                        {% endif %}
                    {% endblock %}
                </nav>
        <!-- /.navbar -->
            {% endblock %}
            {% block main_sidebar %}
                {% if not is_popup and not is_print %}
                    <aside class="main-sidebar sidebar-dark-primary elevation-4">
                        <!-- Brand Logo -->
                        <a href="{% url 'ra_admin:index' %}" class="brand-link">
                            <img src="{% static 'ra/images/ra_systems.png' %}"
                                 alt="Logo"
                                 class="brand-image img-circle elevation-3"
                                 style="opacity: .8">
                            <span class="brand-text font-weight-light">Ra</span>
                        </a>

                        <!-- Sidebar -->
                        <div class="sidebar">
                            <nav class="mt-2">

                                <ul class="nav nav-pills nav-sidebar flex-column nav-collapse-hide-child nav-flat nav-legacy"
                                    data-widget="treeview" role="menu"
                                    data-accordion="false">
                                    <!-- Add icons to the links using the .nav-icon class
                                         with font-awesome or any other icon font library -->
                                    {% render_navigation_menu %}
                                    {% if user.is_authenticated %}
                                        {% render_reports_menu %}
                                    {% endif %}
                                </ul>
                            </nav>
                            <!-- /.sidebar-menu -->
                        </div>
                        <!-- /.sidebar -->
                    </aside>
                {% endif %}
            {% endblock %}
        {% endif %}
        <!-- Content Wrapper. Contains page content -->
        <div class="content-wrapper">
            <!-- Content Header (Page header) -->
            <section class="content-header">
                <div class="container-fluid">
                    {% block pretitle %}{% endblock %}
                    <div class="row mb-2">

                        {% block content_title %}{% if title %}
                            <div class="col-sm-6">
                                <h1>{{ title }}</h1>
                            </div>
                        {% endif %}{% endblock %}

                        {% if not is_print %}
                            <div class="col-sm-6">
                                <ol class="breadcrumb float-sm-right">
                                    {% block breadcrumbs %}

                                        <li class="breadcrumb-item">
                                            <a href="{% url 'admin:index' %}">{% trans 'Home' %}</a>
                                        </li>
                                        <li class="breadcrumb-item active">{{ title }}</li>
                                    {% endblock %}
                                </ol>
                            </div>
                        {% endif %}
                    </div>
                </div><!-- /.container-fluid -->
            </section>

            <!-- Main content -->
            <section class="content">
                {% block messages %}
                    {% if messages %}
                        <ul class="messagelist">{% for message in messages %}
                            <li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message|capfirst }}</li>
                        {% endfor %}</ul>
                    {% endif %}
                {% endblock messages %}

                <div id="content" class="{% block coltype %}colM{% endblock %}">
                    {% block content %}
                        {% block object-tools %}{% endblock %}
                        {{ content }}
                    {% endblock %}
                    {% block sidebar %}{% endblock %}
                    <br class="clear">
                </div>


            </section>
            <!-- /.content -->
        </div>
        <!-- /.content-wrapper -->
        {% block footer %}

        {% endblock %}
        <!-- Control Sidebar -->

        <!-- /.control-sidebar -->
    </div>
{% endblock %}

<!-- jQuery -->
<script src="{% static 'adminlte/plugins/jquery/jquery.min.js' %}"></script>
<script src="{% static 'adminlte/plugins/jquery-ui/jquery-ui.min.js' %}"></script>
<script>
    $.widget.bridge('uibutton', $.ui.button)
</script>
<script src="{% static 'adminlte/plugins/moment/moment.min.js' %}"></script>
{#<script src="{% static 'adminlte/plugins/daterangepicker/daterangepicker.js' %}"></script>#}

<!-- Bootstrap 4 -->
<script src="{% static 'adminlte/plugins/bootstrap/js/bootstrap.bundle.min.js' %}"></script>
<script src="{% static 'adminlte/plugins/select2/js/select2.full.min.js' %}"></script>
<script src="{% static 'adminlte/plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js' %}"></script>
<script src="{% static 'adminlte/plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js' %}"></script>


<script type="text/javascript"
        src="{{ STATIC_URL }}ra/js/vendor/plugins/loaders/blockui.min.js"></script>

<script src="{% static 'adminlte/js/adminlte.min.js' %}"></script>

{#<script src="{% static 'adminlte/plugins/summernote/summernote-bs4.min.js' %}"></script>#}
{#<script src="{% static 'adminlte/plugins/jquery-knob/jquery.knob.min.js' %}"></script>#}

<script type="text/javascript" src="{{ STATIC_URL }}ra/js/ra.js"></script>

<script>
    $.ra.rtl = {% if LANGUAGE_BIDI %} true ;{% else %} false; {% endif %}
    $.ra.defaults.messages = {
        DoneMessage: '{% trans "Done..."  %}',
        RedirectionMessage: "{% trans 'Redirecting...' %}",
        SuccessMessage: '{% trans "Done..."  %}',
        ErrorMessage: '{% trans "An error happened :( " %}',
        WaitMessage: '{% trans 'Just a moment...'  %}',
        LoadingMessage: '{% trans 'loading...'|capfirst  %}',
        slug_verbose: '{% trans  'slug'|capfirst   %}',
        title_verbose: '{% trans  'title'|capfirst   %}',
        choose: '{% trans  'choose'|capfirst   %}',
        choice: '{% trans  'choice'|capfirst    %}',
        to_code: '{% trans 'to code'|capfirst   %}',
        from_code: '{% trans 'from code'|capfirst   %}',
        select_all: '{% trans  'Select All'  %}',
        select_none: '{% trans  'Select None'  %}',
        inverse: '{% trans  'Inverse'  %}',
        apply: '{% trans  'Apply'  %}',
        choiceBeenMade: '{% trans  'Choice made'  %}',
        total: '{% trans  'total'|capfirst  %}',
        percentage: '{% trans 'percentage'|capfirst  %}',
        pertoTotal: '{% trans 'per. to total' %}',
        Total: '{% trans  'Total'  %}',
        Percentage: '{% trans 'Percentage' %}',
        availableCharts: "{% trans 'charts'|capfirst %}"
    };
</script>

<script type="text/javascript" charset="utf8"
        src="{{ STATIC_URL }}ra/plugins/datatables/datatables.js"></script>
<script type="text/javascript" charset="utf8"
        src="{{ STATIC_URL }}ra/plugins/datatables/DataTables-1.10.20/js/dataTables.bootstrap4.js"></script>
{#<script type="text/javascript" charset="utf8"#}
{#        src="{{ STATIC_URL }}ra/js/vendor/datatables/extensions/FixedHeader/js/dataTables.fixedHeader.min.js"></script>#}
{#<script type="text/javascript" src="{{ STATIC_URL }}ra/js/vendor/daterangepicker.js"></script>#}
<script src="{% static 'ra/plugins/chartsjs/src/Chart.js' %}"></script>

<script src="{{ STATIC_URL }}ra/js/vendor/string-format.js"></script>
<script>format.extend(String.prototype)</script>

<script type="text/javascript" charset="utf8"
        src="{% static 'ra/js/vendor/noty/lib/noty.min.js' %}"></script>
<script type="text/javascript" src="{% static 'ra/js/ra.autocomplete.js' %}"></script>
<script type="text/javascript" src="{% static 'ra/js/ra.report_loader.js' %}"></script>
<script type="text/javascript" src="{% static 'ra/js/ra.dataComprehension.js' %}"></script>

<script src="{% static 'ra/js/ra_main_js.js' %}"></script>
<script src="{% static 'ra/js/ra.chartsjs.js' %}"></script>
<script src="{% static 'ra/js/ra.datatable.js' %}"></script>

{% block date_range_default_js %}
    <script>
        var DEFAULT_DATE_PICKER_OBJ;

        function setDatePickerObj() {
            var range_start = new Date();
            var range_end = new Date();
            range_start.setHours(0);
            range_start.setMinutes(0);
            range_end.setDate(range_start.getDate() + 1);
            range_end.setHours(0);
            range_end.setMinutes(0);

            DEFAULT_DATE_PICKER_OBJ = {
                {#                startDate: startDate,#}
                {#                endDate: endDate,#}
                minDate: '01/01/2015',

                {#                maxDate: endDate,#}
                autoUpdateInput: false,
                timePicker: true,
                dateLimit: {years: 3},
                timePicker24Hour: true,
                timePickerIncrement: 10,
                autoApply: true,

                ranges: {
                    '{% trans "Today" %}': [range_start, range_end],
                    '{% trans "Yesterday" %}': [moment(range_start).subtract('days', 1), moment(range_end).subtract('days', 1)],
                    '{% trans "Last 7 Days" %}': [moment(range_start).subtract('days', 6), moment(range_end)],
                    '{% trans "This Month" %}': [moment(range_start).startOf('month'), moment(range_end).endOf('month')],
                    '{% trans "Last Month" %}': [moment(range_start).subtract('month', 1).startOf('month'), moment(range_end).subtract('month', 1).endOf('month')]
                },

                opens: 'right',
                showDropdowns: true,
                linkedCalendars: false,
                buttonClasses: ['btn'],
                applyClass: 'btn-small btn-info btn-block',
                cancelClass: 'btn-small btn-default btn-block',
                locale: {
                    direction: {% if LANGUAGE_BIDI %} 'rtl' {% else %}'ltr'{% endif %},
                    format: 'YYYY-MM-DD',
                    applyLabel: '{% trans "Apply" %}',
                    fromLabel: '{% trans "From" %}',
                    toLabel: '{% trans "To" %}',
                    startLabel: '{% trans "start date"|capfirst %}:',
                    endLabel: '{% trans "end date"|capfirst %}:',
                    cancelLabel: '{% trans "Cancel" %}',
                    customRangeLabel: '{% trans "choose"|capfirst %}',
                    firstDay: 1
                }
            };
        }

        setDatePickerObj();
    </script>
{% endblock %}
{% block js_defaults_and_init %}
    <script>
        $.extend($.fn.dataTable.defaults, {
            "oLanguage": {

                "oAria": {
                    "sSortDescending": ": activate to sort column descending"
                },
                "oPaginate": {
                    "sFirst": "{% trans "First" %}",
                    "sLast": "{% trans "Last" %}",
                    "sNext": "{% trans "Next" %}",
                    "sPrevious": "{% trans "Previous" %}"
                },
                "sEmptyTable": "{% trans "No data available here yet." %}",
                {% if LANGUAGE_BIDI %}
                    "sInfo": '',
                {% else %}
                    "sInfo": "{% trans "Showing _START_ to _END_ of _TOTAL_ entries" %}",
                {% endif %}
                "sInfoEmpty": "{% trans "Nothing found" %}",
                "sInfoFiltered": "{% trans "(filtered from _MAX_ total entries)" %}",
                "sInfoPostFix": "",
                "sInfoThousands": ",",
                "sLengthMenu": "{% trans "Show _MENU_ entries" %}",
                "sLoadingRecords": "{% trans "Loading..." %}",
                "sProcessing": "{% trans "Processing..." %}",
                "sSearch": "{% trans "Search" %}:",
                "sUrl": "",
                "sZeroRecords": "{% trans "No matching records found" %}"
            },

            {#        // added by theme #}
            autoWidth: false,
            columnDefs: [{
                orderable: false,
                width: '100px',
                {#            targets: [ 5 ]#}
            }],
            dom: '<"datatable-header"fl><"datatable-scroll"t><"datatable-footer"ip>',
            language: {
                search: '<span>{% trans 'Filter' %}:</span> _INPUT_',
                searchPlaceholder: '{% trans "Type to filter" %}...',
                lengthMenu: '<span>{% trans 'Show' %}:</span> _MENU_',
                paginate: {'first': 'First', 'last': 'Last', 'next': '&rarr;', 'previous': '&larr;'}
            },
            drawCallback: function () {
                $(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').addClass('dropup');
            },
            preDrawCallback: function () {
                $(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').removeClass('dropup');
            }
        });

        $.ra.autocomplete.defaults.autocomplete_url = '{{ autocomplete_base_url }}';
        {#RA_SEARCH_URL = '{% url "site_wide_search" %}';#}


        jQuery(document).ready(function () {
            $('.page-container').show();
            RA_Main.init();
            $.ra.report_loader.loadChartWidgets();
            if (typeof (Storage) !== "undefined") {
                // Code for localStorage/sessionStorage.
                var check = localStorage.getItem("ra-intro");
                if (check == null) {
                    setTimeout(function () {
                        $('#ra-help').trigger('click');
                    }, 500);

                    localStorage.setItem('ra-intro', true);
                }
            } else {
                // Sorry! No Web Storage support..
            }

            $('.alert.bg-success').not('.noAutoHide').delay(3000).fadeOut()

        });
    </script>
{% endblock %}

{% block extra_js %}
{% endblock %}
{% block bottom_script %}
{% endblock %}
</body>
</html>
