{% extends 'Admin/base.html.twig' %}
{% block title %}
    OceanExpert | Messages 
{% endblock %}
{% block stylesheets %}
    <link rel="stylesheet" type="text/css" href="{{ asset('css/admin-style.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/font-awesome.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/select2.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/select2-bootstrap.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/AdminLTE.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/autocomplete.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/register.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/tipped.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/navbar-login.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/bootstrap3-wysihtml5.min.css') }}">
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/profile.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/zebra_tooltips.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/dataTables.bootstrap.css') }}">


{% endblock %}

{% block body %}
    {% include('navbarlogin.html.twig') %}
    <div class="wrapper">

        {% block sidebar %}
            {% include('Admin/adminSidebar.html.twig') %}
        {% endblock %}

        <div class="content-wrapper">
            <!-- Content Header (Page header) -->
            <section class="content-header">

                <ol class="breadcrumb">
                    <li><a href="{{ path('admin_dashboard') }}"><i class="fa fa-home"></i> Home</a></li>
                    <li class="active"><i class="fa fa-envelope-open fa-fw"></i> Message</li>
                </ol>
            </section>
            {% block content %}
                <div class="box-header">
                    <h3 class="">Message: {{ message.subject }} </h3>
                </div>
                <!-- /.box-header -->

                <div class="box-body">
                    <div class="col-md-9">
                        <table class="table table-responsive">
                            <tbody>
                            <tr>
                                <th scope="row" width="200px;">Sender</th>
                                <td>
                                    <div><a href="{{ path('view_profile', {'user': message.idSender}) }}" target="_blank"><strong>{{ user.fname ~ " "~user.sname }}</strong></a></div>
                                    <div>{{ user.email1 }}</div>
                                    {% if message.sendToSender == 1 %}
                                        (will receive the message too)
                                    {% endif %}
                                </td>
                            </tr>
                            <tr>
                                <th scope="row">Recipient(s)	</th>
                                <td>
                                    {{ data.recipients }} <br/>
                                    {% if data.recipientCount is defined and data.recipientCount != 0 %}
                                        ({{ data.recipientCount }} recipients)
                                    {% endif %}
                                    <a href="{{ data.recipientUrl | raw }}">[ View Recipient(s) ]</a>
                                </td>

                            </tr>
                            <tr>
                                <th scope="row">Subject</th>
                                <td>{{ message.subject }}</td>
                            </tr>
                            <tr>
                                <th scope="row">Message</th>
                                <td>{{ message.message | raw | nl2br }}</td>
                            </tr>
                            <tr>
                                <th scope="row">Status</th>
                                <td>
                                    {% if message.approved is not null %}
                                    {% if message.approved == 0 %}
                                        <span class="text-danger">Awaiting Approval</span>
                                    {% elseif message.approved == 1 %}
                                        <span class="text-success">Approved: About to be Sent</span>
                                    {% elseif message.approved == 2 %}
                                        <span class="text-primary">Sent:</span><span class="text-muted"> at {{ message.datequeued | date('H:i:s') ~ " on "~ message.datequeued| date('M d, Y') }}</span>
                                    {% elseif message.approved == 3 %}
                                        <span class="text-danger">Approval Denied: Message Not Sent</span>
                                    {% endif %}


                                    {% else %}
                                <td></td>
                                {% endif %}
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>

                </div>
                <!-- /.box-body -->
            {% endblock %}
        </div>
    </div>
    {% include "footer.html.twig" %}
    <script src="{{ asset('js/app.min.js') }}"></script>
    <script src="{{asset('js/icheck.min.js')}}" type="text/javascript"></script>
    <script src="{{asset('js/validator.min.js')}}" type="text/javascript"></script>
    <script src="{{asset('js/jquery.inputmask.js')}}" type="text/javascript"></script>
    <script src="{{asset('js/daterangepicker.js')}}" type="text/javascript"></script>
    <script src="{{asset('js/bootstrap-timepicker.min.js')}}" type="text/javascript"></script>
    <script src="{{asset('js/bootstrap-colorpicker.min.js')}}" type="text/javascript"></script>
    <script src="{{asset('js/bootstrap-typeahead.min.js')}}" type="text/javascript"></script>
    <script src="{{asset('js/jquery-ui.js')}}" type="text/javascript"></script>
    <script src="{{asset('js/login.js')}}" type="text/javascript"></script>
    <script src="{{asset('js/jquery.dataTables.min.js')}}" type="text/javascript"></script>
    <script src="{{asset('js/dataTables.bootstrap.min.js')}}" type="text/javascript"></script>

    <script src="{{ asset('js/wysihtml5-0.3.0.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/handlebars.runtime.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/bootstrap3-wysihtml5.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/tipped.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/admin-add-expert.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/jquery.noty.packaged.min.js') }}" type="text/javascript"></script>
    <script type="text/javascript" >

    </script>

{% endblock %}