{% extends 'base.html.twig' %}
{% block title %}
    OceanExpert | Document
{% endblock %}
{% block stylesheets %}
    <link rel="stylesheet" type="text/css" href="{{ asset('css/navbar-login.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/bootstrap.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/font-awesome.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/ionicons.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/AdminLTE.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/style.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/square/blue.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/jquery-confirm.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/doclist.css') }}">

{% endblock %}

{% block body %}
    {% include('navbarlogin.html.twig') %}
    <div class="container-fluid top-buffer70">
        <div class="container content justify">
            {% if data.doclist.idDoclist is defined and data.doclist.idDoclist is not null %}
                <div class="box-header">
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="col-sm-8">
                                <h3>{{ data.doclist.title }}</h3>
                            </div>
                            {% if is_granted('ROLE_GLOBAL_EDITOR') %}
                                <div class="col-sm-4 text-right">
                                    <a href="{{ path('edit_doclist',{idDoclist:data.doclist.idDoclist}) }}">[Edit this List/Add Documents]</a><br/>
                                    <a href="javascript:void(0);" id="deleteList" data-iddoclist="{{ data.doclist.idDoclist }}">[Delete this
                                        List]</a>
                                </div>
                            {% endif %}
                            <div class="col-sm-12">
                                <article>{{ data.doclist.description | raw }}</article>
                            </div>
                        </div>
                    </div>
                   <div class="table-responsive">
                   	<table class="table table-hover">
                   		<tbody>
                   			
                                {% if data.documents is defined and data.documents | length > 0 %}
                                    {% set i = 1 %}
                                    {% for document in data.documents %}
                                        <tr>
                                            <td>
                                                {% if data.doclist.orderBy in [5,6] %}
                                                    {{ document.docCode }}
                                                    {% if document.idDocstatus == 1 %}
                                                        <div class="text-muted">Draft</div>
                                                    {% elseif document.idDocstatus == 3 %}
                                                        <div class="text-muted">Pending</div>
                                                    {% endif %}
                                                {% else %}
                                                    {{ i }}
                                                    {% set i = i + 1 %}
                                                {% endif %}
                                            </td>
                                            <td>
                                                {% if document.docCode is defined and document.docCode != "" and data.doclist.orderBy not in [5,6] %}
                                                    <a href="{{ path('view_document',{idDoc: document.idDoc}) }}">{{ document.docCode }}</a> : 
                                                {% endif %}
                                                {% if document.title is defined and document.title != "" %}
                                                    <a href="{{ path('view_document',{idDoc: document.idDoc}) }}">{{ document.title }}</a>
                                                {% endif %}
                                                {% if document.publishedOn is defined and document.publishedOn != "" %}
                                                     ({{ document.publishedOn | date('d/m/Y') }})
                                                {% endif %}
                                                {% if document.summary is defined and document.summary != "" %}
                                                    <br />{{ document.summary | truncate(50,'...')}}
                                                {% endif %}
                                            </td>
                                            <td><i class="fa fa-download download-document fa-2x" data-idDoc="{{ document.idDoc }}"></i></td>
                                            {% if is_granted('ROLE_GLOBAL_EDITOR') %}
                                                <td width="150px"><a href="javascript:void(0);" class="removefromlist" data-idDoc="{{ document.idDoc }}" >[Remove from List]</a></td>
                                            {% endif %}
                                        </tr>
                                    {% endfor %}
                                {% endif %}
                   				
                   			
                   		</tbody>
                   	</table>
                   </div>
                </div>

                {% if data.docFiles is defined and data.docFiles | length > 0 %}
                    <div class="row">
                    <div class="col-xs-10">
                        <div class="panel panel-success">
                            <div class="panel-heading"><i class="fa fa-download fa-fw fa-2x" aria-hidden="true"></i>
                                Download
                            </div>
                            <div class="panel-body">
                                {% for file in data.docFiles %}
                                    <div class="files col-md-4">
                                        <a href="{{ asset(file.url) }}" download>
                                            {% if file.idFileformat == 1 %}
                                                <img src="{{ asset('images/fileicons/pdf.png') }}" alt="PDF" class="fileicon">
                                            {% elseif file.idFileformat == 2 %}
                                                <img src="{{ asset('images/fileicons/doc.png') }}" alt="DOC" class="fileicon">
                                            {% elseif file.idFileformat == 3 %}
                                                <img src="{{ asset('images/fileicons/txt.png') }}" alt="TXT" class="fileicon">
                                            {% elseif file.idFileformat == 4 %}
                                                <img src="{{ asset('images/fileicons/rtf.png') }}" alt="RTF" class="fileicon">
                                            {% elseif file.idFileformat == 5 %}
                                                <img src="{{ asset('images/fileicons/xls.png') }}" alt="XLS" class="fileicon">
                                            {% elseif file.idFileformat == 6 %}
                                                <img src="{{ asset('images/fileicons/ppt.png') }}" alt="PPT" class="fileicon">
                                            {% elseif file.idFileformat == 7 %}
                                                <img src="{{ asset('images/fileicons/ppt.png') }}" alt="PPT" class="fileicon">
                                            {% elseif file.idFileformat == 8 %}
                                                <img src="{{ asset('images/fileicons/gif.png') }}" alt="GIF" class="fileicon">
                                            {% elseif file.idFileformat == 9 %}
                                                <img src="{{ asset('images/fileicons/jpg.png') }}" alt="JPG" class="fileicon">
                                            {% elseif file.idFileformat == 10 %}
                                                <img src="{{ asset('images/fileicons/jpg.png') }}" alt="JPG" class="fileicon">
                                            {% elseif file.idFileformat == 11 %}
                                                <img src="{{ asset('images/fileicons/png.png') }}" alt="PNG" class="fileicon">
                                            {% elseif file.idFileformat == 12 %}
                                                <img src="{{ asset('images/fileicons/bmp.png') }}" alt="BMP" class="fileicon">
                                            {% elseif file.idFileformat == 13 %}
                                                <img src="{{ asset('images/fileicons/zip.png') }}" alt="ZIP" class="fileicon">
                                            {% elseif file.idFileformat == 14 %}
                                                <img src="{{ asset('images/fileicons/xlsx.png') }}" alt="XLSX" class="fileicon">
                                            {% elseif file.idFileformat == 15 %}
                                                <img src="{{ asset('images/fileicons/ppt.png') }}" alt="PPT" class="fileicon">
                                            {% elseif file.idFileformat == 16 %}
                                                <img src="{{ asset('images/fileicons/ppt.png') }}" alt="PPT" class="fileicon">
                                            {% elseif file.idFileformat == 17 %}
                                                <img src="{{ asset('images/fileicons/doc.png') }}" alt="DOC" class="fileicon">
                                            {% endif %}
                                        </a>

                                        <a href="{{ path('download_document',{idFile:file.idFile}) }}"
                                           target="_blank">  {{ file.languagename }}</a>
                                        <span class="small">(v{{ file.version }}, {{ file.size|format_bytes }})</span>
                                    </div>
                                {% endfor %}
                            </div>
                        </div>
                    </div>

                {% endif %}


                </div>
                <div class="row">
                    <hr/>
                    <div class="col-xs-12">
                        <div class="pull-right text-right stats">
                            {% if data.documentGroup is defined and data.documentGroup | length >0 %}
                                <div>Group(s):
                                    {% for documentGroup in  data.documentGroup %}
                                        {{ documentGroup.groupname }}
                                    {% endfor %}
                                </div>
                            {% endif %}
                            <div>
                                {% if data.createdAt is defined and data.createdAt != "" %}
                                    {{ "Created at " ~ data.createdAt | date("H:i") ~ ' on ' ~ data.createdAt | date("d M Y") }}
                                {% endif %}
                                {% if data.createdBy is defined and data.createdBy != "" %}
                                    {{ ' by ' ~ data.createdBy }}
                                {% endif %}
                            </div>
                            <div>
                                {% if data.updatedAt is defined and data.updatedAt != "" %}
                                    {{ "Created at " ~ data.updatedAt | date("H:i") ~ ' on ' ~ data.updatedAt | date("d M Y") }}
                                {% endif %}
                                {% if data.updatedBy is defined and data.updatedBy != "" %}
                                    {{ ' by ' ~ data.updatedBy }}
                                {% endif %}

                            </div>
                        </div>
                    </div>
                </div>
                {% if is_granted('ROLE_GLOBAL_EDITOR') %}
                    
                {% endif %}
            {% else %}
                <div class="alert alert-danger" role="alert">
                    <i class="fa fa-exclamation-triangle fa-fw fa-2x"></i> The requested document list could not be found.
                </div>
                <a class="btn btn-success" href="{{ path('frontend_homepage') }}">Cick here to go to Home</a>
            {% endif %}

        </div>
    </div>
    {% include "footer.html.twig" %}
    <script src="{{ asset('js/jquery-confirm.min.js') }}"></script>
    <script type="text/javascript" class="init">
        $(document).ready(function() {
            //set the top nav menu style
            $(".documents").addClass('navactive');
        });
    </script>
    <script type="text/javascript">
        var documentDownloadBlock = "{{ path('document_download_block') }}";
        var removeDocumentFromList = "{{ path('remove_document_from_list') }}";
        var deleteDocumentList = "{{ path('remove_document_from_list') }}";
        var admindashboard = "{{ path('admin_dashboard') }}";

        {% if data.doclist.idDoclist is defined %}
        
        $(".removefromlist").click(function () {
            var $this = $(this);
            var idDoc = $this.data("iddoc");
            $.confirm({
                escapeKey: "cancel",
                title: 'Confirm!',
                content: 'Are you sure you want to remove this document from the list?',
                buttons: {
                    confirm:{
                        keys: ['enter'],
                        btnClass: 'btn-primary',
                        text: "OK",
                        action: function(){
                            $.ajax({
                               url: removeDocumentFromList, 
                                data:{idDoclist: {{ data.doclist.idDoclist}}, idDoc: idDoc},
                                method: "POST"
                            }).done(function (response) {
                                if(response.status==1 ){
                                    window.location.reload();
                                }
                            });
                        }
                    },
                    cancel: function () {
                        btnClass: 'btn-danger'
                    }
                }
            });
        });

        $("#deleteList").click(function () {
            var $this = $(this);
            var idDoclist = $this.data("iddoclist");
            $.confirm({
                escapeKey: "cancel",
                title: 'Confirm!',
                content: 'The removal of this list is an irreversible process. Are you sure you want to delete it forever?',
                buttons: {
                    confirm:{
                        keys: ['enter'],
                        btnClass: 'btn-primary',
                        text: "OK",
                        action: function(){
                            $.ajax({
                                url:deleteDocumentList,
                                data:{idDoclist: idDoclist},
                                method: "POST"
                            }).done(function (response) {
                                if(response.status==1 ){
                                    window.location.href = admindashboard;
                                }
                            });
                        }
                    },
                    cancel: function () {
                        btnClass: 'btn-danger'
                    }
                }
            });
        });
        
        {% endif %}
    </script>
    <script src="{{ asset('js/event-view.js') }}" type="text/javascript"></script>
   
{% endblock %}