{% extends 'Admin/base.html.twig' %}
{% block title %}
    OceanExpert |
    {% if data.document is defined and data.document.idDoc is defined %}
        Edit Document
    {% else %}
        Add Document
    {% endif %}
{% 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/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" type="text/css" href="{{ asset('css/jquery-ui.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/checkbox.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/register.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/select.dataTables.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/events.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/bootstrap-dialog.min.css') }}">
    <style>
        .files {
            margin-top: 15px;
        }
    </style>
{% endblock %}

{% block body %}
    {% include('navbarlogin.html.twig') %}
    <div class="wrapper">
    <div class="wait">
        <div id="cssload-wrapper">
            <div id="cssload-border">
                <div id="cssload-whitespace">
                    <div id="cssload-line">
                    </div>
                </div>
            </div>
        </div>
    </div>
    {% block sidebar %}
        {% include('Admin/adminSidebar.html.twig') %}
    {% endblock %}
    <div class="content-wrapper">
    {#{{ dump(data.eventContacts) }}#}
    <!-- 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-file"></i>
                {% if data.document is defined and data.document.idDoc is defined %}
                    Edit Document
                {% else %}
                    Add Document
                {% endif %}
            </li>
        </ol>
    </section>
    {% block content %}
        <div class="container-fluid">
            <form
                    class="form-horizontal"
                    id="uploadFile"
                    method="post"
                    enctype="multipart/form-data">
                <div class="mainForm">
                    <div class="col-md-12 document-note">
                        <p>On this page, you
                            can {% if data.document is defined and data.document.idDoc is defined %}edit document information.
                            {% else %}
                                add a new document.
                            {% endif %}
                            <br />
                            Simply fill out the form below.
                            <br />
                            You can add multiple files corresponding to any different formats,
                            languages and versions you may have of your document.
                        </p>
                        <p><strong>Note:</strong> Fields marked with an asterisk (*) are mandatory.</p>
                    </div>
                    <div class="col-md-12">

                        <div class="form-group">
                            <legend>Document Metadata</legend>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-2" for="doctype">Document Type*</label>
                            <div class="col-sm-10">
                                <select name="doctype" id="doctype" class="form-control col-md-6"
                                        placeholder="Choose One...">
                                    <option value="">Choose One...</option>
                                    {% for key, doctype in data.docTypes %}
                                        {% if  data.document.idDoctype is defined and data.document.idDoctype == key %}
                                            <option label="{{ doctype }}" value="{{ key }}"
                                                    selected>{{ doctype }}</option>
                                        {% else %}
                                            <option label="{{ doctype }}" value="{{ key }}">{{ doctype }}</option>
                                        {% endif %}
                                    {% endfor %}
                                </select>
                                <div class='help-block with-errors'></div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-2" for="doc-title">Document Title*</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" id="doc-title" name="title"
                                       placeholder="Document Title" {% if data.document.title is defined %} value="{{ data.document.title }}" {% endif %}/>
                                <div class='help-block with-errors'></div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-2" for="authors">Author(s)</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" id="authors" name="authors"
                                       placeholder="Author(s)" {% if data.document.authorText is defined %} value="{{ data.document.authorText }}" {% endif %} />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-2" for="summary">Summary</label>
                            <div class="col-sm-10">
                                <textarea name="summary" class="form-control" id="summary"
                                          placeholder="Summary">{% if data.document.summary is defined %}{{ data.document.summary }}{% endif %}</textarea>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-2" for="notes">Notes:</label>
                            <div class="col-sm-10">
                                <textarea name="notes" class="form-control" id="notes"
                                          placeholder="Notes">{% if data.document.notes is defined %}{{ data.document.notes }}{% endif %}</textarea>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-2" for="keywords">Keywords:</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" id="keywords" name="keywords"
                                       placeholder="Keywords" {% if data.document.keywords is defined %} value="{{ data.document.keywords }}" {% endif %} />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-2" for="doccode">Document Code (if applicable)</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" id="doccode" name="doccode"
                                       placeholder="Document Code e.g. 'GOOS-126', 'I-GOOS-VII/7'" {% if data.document.docCode is defined %} value="{{ data.document.docCode }}" {% endif %} />
                            </div>
                        </div>
                        {% set status = {1: 'Draft',2:"Published",3:"Pending"} %}
                        <div class="form-group">
                            <label class="control-label col-sm-2" for="status">Status *</label>
                            <div class="col-sm-10">
                                <select name="status" id="status">
                                    <option value="" selected disabled>Choose One...</option>
                                    {% for statusCode, docStatus in status %}
                                        {% if  data.document.idDocstatus is defined and data.document.idDocstatus == statusCode %}
                                            <option label="{{ docStatus }}" value="{{ statusCode }}"
                                                    selected>{{ docStatus }}</option>
                                        {% else %}
                                            <option label="{{ docStatus }}"
                                                    value="{{ statusCode }}">{{ docStatus }}</option>
                                        {% endif %}
                                    {% endfor %}
                                </select>
                                <div class='help-block with-errors'></div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-2" for="">Lists to include document in:</label>
                            <div class="col-sm-10">
                                {#<button class="btn btn-xs btn-primary" type="button" id="doclist">Click to hide/show list</button>#}
                                <div class="checkbox doclists">
                                    {% for key, groups in data.documentList %}
                                        <label class="col-md-12 docgroups"> {{ key }} </label>
                                        {% for doclist in groups %}
                                            <label class="col-md-12 group-options">
                                                <input type="checkbox" class="checklist" value="{{ doclist.idDoclist }}"
                                                       name="doclist[]"
                                                       {% if doclist.idDoclist in data.docDoclist %}checked="checked"{% endif %}>
                                                <span class="cr"><i class="cr-icon fa fa-check"></i></span>
                                                <span class="doclist-title">{{ doclist.title }}</span> <a
                                                        href="{{ path('view_doclist',{idDoclist: doclist.idDoclist}) }}"
                                                        target="_blank">[view list (in new window)]</a>
                                            </label>
                                        {% endfor %}
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                        {% if data.files is defined and data.files | length > 0 %}
                            <div class="form-group">
                                <legend>Existing Files</legend>
                                {% for file in data.files %}
                                    <div class="row row-grid">
                                        <div class="col-xs-6 files-display">
                                            {% 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="JPEG"
                                                        class="fileicon" />
                                            {% elseif file.idFileformat == 10 %}
                                                <img
                                                        src="{{ asset('images/fileicons/jpg.png') }}"
                                                        alt="JPEG"
                                                        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="PNG"
                                                        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 %}
                                            {% if file.languagename is defined %}{{ file.languagename }} {% endif %}
                                            {% if file.version is defined %}({{ file.version }}){% endif %}
                                            {% if file.fileformatname is defined %}{{ file.fileformatname }}{% endif %}
                                        </div>
                                        <div class="col-md-6">
                                            <button
                                                    type="button"
                                                    class="btn btn-primary remove-files"
                                                    data-idFile="{{ file.idFile }}">
                                                <i
                                                        class="fa fa-times fa-fw"
                                                       aria-hidden="true"></i>
                                                Remove
                                            </button>
                                        </div>
                                        <br/>
                                    </div>
                                {% endfor %}
                            </div>
                        {% endif %}
                        <div class="file-section">
                            <div class="form-group">
                                <legend>File(s) to Upload</legend>
                            </div>
                            <div class="form-group">
                                <div class="col-sm-3">
                                    <label>File in</label>
                                    <select name="id_language[]" class="form-control languages">
                                        <option value="" selected disabled>Choose Language...</option>
                                        <option value="1">English</option>
                                        <option value="2">French</option>
                                        <option value="3">Spanish</option>
                                        <option value="4">Russian</option>
                                        <option value="5">Arabic</option>
                                        <option value="6">Chinese</option>
                                        <option value="7">Other</option>
                                    </select>
                                </div>
                                <div class="col-sm-5 fileUpload">
                                    <label for="">Select File</label>
                                    <input name="userfile[]" type="file"
                                           accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,
                                            application/vnd.ms-excel, image/*,
                                             application/msword,
                                             application/vnd.openxmlformats-officedocument.wordprocessingml.document,
                                             application/vnd.ms-powerpoint,
                                             application/vnd.openxmlformats-officedocument.presentationml.presentation,
                                             application/pdf" size="40"
                                           class="form-control userfiles">
                                </div>
                                <div class="col-sm-2">
                                    <label for="">Version </label>
                                    <input name="version[]" type="text" size="3" value="1.0" id=""
                                           class="form-control version">
                                </div>
                                <div class="col-sm-2">
                                    <label for="">&nbsp;</label>
                                    <button class='btn btn-danger remove-docs' type='button'><i class='fa fa-times'></i>
                                        Clear
                                    </button>
                                </div>
                            </div>
                        </div>

                        <div class="website-section" style="display: none;">
                            <div class="form-group">
                                <legend>Website Address</legend>
                            </div>
                            <div class="form-group">
                                <label class="control-label col-sm-2" for="url">URL</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control" id="url" name="websiteUrl"
                                           placeholder="Website Url.">
                                </div>
                            </div>
                        </div>

                        <div class="form-group pull-right">
                            <div class="col-sm-12">
                                {% if data.doclist is defined and data.doclist.idDoclist is defined %}
                                    {% set href = path('view_document',{idDoc: data.d.idDoclist}) %}
                                {% else %}
                                    {% set href = path('admin_dashboard') %}
                                {% endif %}
                                <a type="button" class="btn btn-danger document-close"
                                   href="{{ path('admin_dashboard') }}">
                                    <i class="fa fa-times-circle fa-fw" aria-hidden="true"></i> Cancel</a>
                                <button class="btn btn-success next-step" type="button"><i
                                            class="fa fa-arrow-right"></i> Proceed to Next Step
                                </button>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="preview" style="display: none;">
                    <div class="form-group">
                        <legend>Check Your Submission</legend>
                    </div>
                    <div class="">
                        <p>On this page you can see how your document will appear to users. Please check all the details
                            are correct, and then click on the submit button at the bottom of the page.</p>
                        <p>If you need to make changes before submitting, click on the make changes button.</p>
                    </div>
                    <div class="clearfix"></div>
                    <div class="form-group">
                        <label
                                class="control-label col-sm-2"
                                for="doctype">
                            Document Type
                        </label>
                        <div class="col-sm-10">
                            <label
                                    class="control-label-left"
                                    id="chkdoctype"></label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-sm-2" for="doc-title">Document Title</label>
                        <div class="col-sm-10">
                            <label id="chkdoc-title" class="control-label-left"></label>
                        </div>
                    </div>
                    <div class="form-group authors">
                        <label class="control-label col-sm-2" for="authors">Author(s):</label>
                        <div class="col-sm-10">
                            <label class="control-label-left" id="chkauthors"></label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-sm-2" for="summary">Summary</label>
                        <div class="col-sm-10">
                            <label class="control-label-left" id="chksummary"></label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-sm-2" for="notes">Notes:</label>
                        <div class="col-sm-10">
                            <label class="control-label-left" id="chknotes"></label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-sm-2" for="notes">Keywords:</label>
                        <div class="col-sm-10">
                            <label class="control-label-left" id="chkkeywords"></label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-sm-2" for="doccode">Document Code (if applicable)</label>
                        <div class="col-sm-10">
                            <label class="control-label-left" id="chkdoccode"></label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-sm-2" for="status">Status*</label>
                        <div class="col-sm-10">
                            <label class="control-label-left" id="chkstatus"></label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-sm-2" for="">Lists to include document in:</label>
                        <div class="col-sm-10">
                            <label class="control-label-left" id="chkdoclist"></label><br/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-sm-2" for="">Website:</label>
                        <div class="col-sm-10">
                            <label class="control-label-left" id="chkurl"></label><br/>
                        </div>
                    </div>

                    <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">
                            <div class="row-grid files-preview">
                                {% for file in data.files %}
                                    <div class="col-md-4 col-sm-6 files">
                                        {% 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="JPEG"
                                                    class="fileicon" />
                                        {% elseif file.idFileformat == 10 %}
                                            <img
                                                    src="{{ asset('images/fileicons/jpg.png') }}"
                                                    alt="JPEG"
                                                    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="PNG"
                                                    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 %}
                                        {% if file.languagename is defined %}{{ file.languagename }} {% endif %}
                                        {% if file.version is defined %}({{ file.version }}){% endif %}
                                        {% if file.fileformatname is defined %}{{ file.fileformatname }}{% endif %}
                                    </div>

                                {% endfor %}
                            </div>
                        </div>
                    </div>
                    <div class="form-group pull-right">
                        <div class="col-sm-12">
                            {% if data.document.idDoc is defined %}
                                <input
                                        type="hidden"
                                        name="idDoc"
                                        id="idDoc"
                                        value="{{ data.document.idDoc }}"/>
                            {% endif %}
                            <input
                                    type="hidden"
                                    name="saveDocument"
                                    value="1">
                            <btn
                                    type="button"
                                    class="btn btn-info make-changes">
                                <i
                                        class="fa fa-arrow-left fa-fw"
                                        aria-hidden="true"></i>
                                Make Changes
                            </btn>
                            <button
                                    class="btn btn-success"
                                    data-toggle="modal"
                                    type="submit"
                                    name="submit">
                                <i
                                        class="fa fa-save fa-fw"></i>
                                Submit Document
                            </button>
                        </div>
                    </div>
                </div>
            </form>
        </div>

    {% endblock %}

    {% include "footer.html.twig" %}
    <script src="{{ asset('js/app.min.js') }}"></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/plugins/purify.js') }}"></script>
    <script src="{{ asset('js/plugins/canvas-to-blob.min.js') }}"></script>
    <script src="{{ asset('js/plugins/sortable.min.js') }}"></script>
    <script src="{{ asset('js/tipped.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/jquery.noty.packaged.js') }}" type="text/javascript"></script>

    <script src="{{ asset('js/jquery.dataTables.min.js') }}"></script>
    <script src="{{ asset('js/dataTables.bootstrap.min.js') }}"></script>
    <script src="{{ asset('js/dataTables.responsive.min.js') }}"></script>
    <script src="{{ asset('js/bootstrap-tooltip.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/bootstrap-confirmation.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/bootstrap-dialog.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/dataTables.select.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/jquery.validate.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/jquery-ui.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/tinymce.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/bootstrap-datepicker.js') }}"></script>
    <script src="{{ asset('js/event.js') }}"></script>
    <script src="{{ asset('js/documents.js') }}"></script>
    <script src="{{ asset('js/jquery.nestable.js') }}"></script>
    <script src="{{ asset('js/handlebars.min.js') }}"></script>
    <script type="text/javascript">
        var removeDocumentFile = "{{ path('remove_document_file') }}";
        var idDoc = 0;
        {% if data.document.idDoc is defined %}
        idDoc = {{ data.document.idDoc }};
        {% endif %}
        $("body").on("click", ".next-step", function () {
            var error = false;
            if ($.trim($("#status").val()) == "") {
                $("#status").parents(".form-group").addClass("has-error");
                $("#status").focus();
                $("#status").parents(".form-group").find(".help-block").html("<ul class='list-unstyled'><li>You must select document status.</li></ul>");
                error = true;
            } else {
                $("#status").parents(".form-group").removeClass("has-error");
                $("#status").parents(".form-group").find(".help-block").html("");
            }
            if ($.trim($("#doc-title").val()) == "") {
                $("#doc-title").parents(".form-group").addClass("has-error");
                $("#doc-title").parents(".form-group").find(".help-block").html("<ul class='list-unstyled'><li>You must enter document title.</li></ul>");
                $("#doc-title").focus();
                error = true;
            } else {
                $("#doc-title").parents(".form-group").removeClass("has-error");
                $("#doc-title").parents(".form-group").find(".help-block").html("");
            }
            if ($.trim($("#doctype").val()) == "") {
                $("#doctype").parents(".form-group").addClass("has-error");
                $("#doctype").parents(".form-group").find(".help-block").html("<ul class='list-unstyled'><li>You must select document type.</li></ul>");
                $("#doctype").focus();
                error = true;
            } else {
                $("#doctype").parents(".form-group").removeClass("has-error");
                $("#doctype").parents(".form-group").find(".help-block").html("");
            }
            if (error == true) {
                return false;
            }

            $(".mainForm").css('display', 'none');
            $(".preview").css('display', 'block');
            $("#chkdoctype").html($("#doctype option:selected").text());
            $("#chkdoc-title").html($("#doc-title").val());
            if ($.trim($("#authors").val()) != "") {
                $("#chkauthors").parents(".form-group").css('display', 'block');
                $("#chkauthors").html($("#authors").val())
            } else {
                $("#chkauthors").html("");
                $("#chkauthors").parents(".form-group").css('display', 'none');
            }
            if ($.trim(tinyMCE.get('summary').getContent()) != "") {
                $("#chksummary").parents(".form-group").css('display', 'block');
                $("#chksummary").html(tinyMCE.get('summary').getContent())
            } else {
                $("#chksummary").html("");
                $("#chksummary").parents(".form-group").css('display', 'none');
            }
            if ($.trim(tinyMCE.get('notes').getContent()) != "") {
                $("#chknotes").parents(".form-group").css('display', 'block');
                $("#chknotes").html(tinyMCE.get('notes').getContent())
            } else {
                $("#chknotes").html("");
                $("#chknotes").parents(".form-group").css('display', 'none');
            }
            if ($.trim($("#keywords").val()) != "") {
                $("#chkkeywords").parents(".form-group").css('display', 'block');
                $("#chkkeywords").html($("#keywords").val())
            } else {
                $("#chkkeywords").html("");
                $("#chkkeywords").parents(".form-group").css('display', 'none');
            }
            if ($.trim($("#doccode").val()) != "") {
                $("#chkdoccode").parents(".form-group").css('display', 'block');
                $("#chkdoccode").html($("#doccode").val())
            } else {
                $("#chkdoccode").html("");
                $("#chkdoccode").parents(".form-group").css('display', 'none');
            }
            $("#chkstatus").html($("#status option:selected").text());
            if ($('.checklist:checkbox:checked').length > 0) {
                $("#chkdoclist").parents(".form-group").css('display', 'block');
                var html = "";
                $.each($('.checklist:checkbox:checked'), function (key, val) {
                    html += $(this).siblings(".doclist-title").html() + "<br />";
                })
                $("#chkdoclist").html(html);
            } else {
                $("#chkdoclist").parents(".form-group").css('display', 'none');
            }
            if ($.trim($("#url").val()) != "") {
                $("#chkurl").parents(".form-group").css('display', 'block');
                $("#chkurl").html($("#url").val())
            } else {
                $("#chkurl").html("");
                $("#chkurl").parents(".form-group").css('display', 'none');
            }

            $(".files-preview").html("");
            var html = "";
            $.each($(".files-display"), function (key, val) {
                html += "<div class='col-md-4 col-sm-6 files'>" + $(this).html() + "</div>";
            });
            $.each($('input[type=file]'), function (key, val) {
                var file = val.files[0];
                console.log();
                if (file) {
                    var filetype = "";
                    var image = "";
                    switch (file.type) {
                        case "application/pdf":
                            filetype = "PDF";
                            image = '/images/fileicons/pdf.png';
                            break;
                        case 'text/plain':
                            filetype = "TXT";
                            image = '/images/fileicons/txt.png';
                            break;
                        case 'text/rtf':
                            filetype = "RTF";
                            image = '/images/fileicons/rtf.png';
                            break;
                        case 'application/mspowerpoint':
                            filetype = "PPT";
                            image = '/images/fileicons/ppt.png';
                            break;
                        case 'image/gif':
                            filetype = "GIF";
                            image = '/images/fileicons/gif.png';
                            break;
                        case 'image/jpeg':
                            filetype = "JPG";
                            image = '/images/fileicons/jpg.png';
                            break;
                        case 'image/png':
                            filetype = "PNG";
                            image = '/images/fileicons/png.png';
                            break;
                        case 'image/bmp':
                            filetype = "BMP";
                            image = '/images/fileicons/bmp.png';
                            break;
                        case 'application/zip':
                            filetype = "ZIP";
                            image = '/images/fileicons/txt.png';
                            break;
                        case 'application/vnd.ms-excel':
                            filetype = "XLS";
                            image = '/images/fileicons/txt.png';
                            break;
                        case 'application/msword':
                            filetype = "WORD";
                            image = '/images/fileicons/doc.png';
                            break;
                        default:
                            filetype = "UNKNOWN";
                            image = '/images/fileicons/txt.png';
                    }
                    html += "<div class='col-md-4 col-sm-6 files'>";
                    html += "<img src='" + image + "'";
                    html += " class='fileicon'> ";
                    html += $(this).closest(".form-group").find(".languages option:selected").text();
                    html += " (";
                    html += $(this).closest(".form-group").find(".version").val();
                    html += ") " + filetype + " </div>";
                }
            });
            $(".files-preview").append(html);
        });

        $("body").on("click", ".make-changes", function () {
            $(".mainForm").css('display', 'block');
            $(".preview").css('display', 'none');
        });

        $("body").on("click", ".remove-files", function () {
            var $this = $(this);
            $this.prop('disabled', true);
            $this.html("<i class='fa fa-spin fa-cog fa-fw' aria-hidden='true'></i> Please wait...</button>");
            var idFile = $this.data("idfile");
            $.ajax({
                url: removeDocumentFile,
                method: "POST",
                data: {idFile: idFile, idDoc: idDoc}
            }).done(function (response) {
                if (response.status==1) {
                    $this.prop('disabled', false);
                    $this.html("<i class='fa fa-times fa-fw' aria-hidden='true'></i> Remove</button>");
                    $this.parents('.row-grid').remove();
                }
            })
        });

    </script>
{% endblock %}