{% extends 'layout_page.twig' %}

{% set page = 'files' %}

{% block title %}P3X GitList{% endblock %}

{% block content %}

    <script type="text/javascript">
        window.gitlist.codemirror_full_limit = parseInt({{ codemirror_full_limit }});
        window.gitlist.branches = {{ branches | json_encode | raw }}
            window.gitlist.commit = '{{ branch }}'
    </script>

    {% embed 'breadcrumb.twig' with {breadcrumbs: breadcrumbs} %}
        {% block right %}
            {% if (fileType != 'image' and fileType != 'markdown') or (enforceCodemirror) %}
                <button id="p3x-gitlist-file-button-edit" class="btn btn-sm btn-info">
                    <span class="fa fa-edit"></span> Edit
                </button>
                <button id="p3x-gitlist-file-button-edit-cancel" class="btn btn-sm btn-danger">
                    <span class="fa fa-ban"></span> Cancel
                </button>
                <button id="p3x-gitlist-file-button-edit-save" class="btn btn-sm btn-info">
                    <span class="fa fa-save"></span> Save
                </button>

                <div id="p3x-gitlist-modal-commit" class="modal fade" tabindex="-1" role="dialog">
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                            aria-hidden="true"><i class="fas fa-times"></i></span></button>
                                <h4 class="modal-title">Commit</h4>
                            </div>
                            <div class="modal-body">
                                <form id="p3x-gitlist-modal-commit-form">
                                    <div class="input-group">
                                        <span class="input-group-addon" id="p3x-gitlist-modal-commit-name-aria"><i
                                                    class="fas fa-user"></i></span>
                                        <input type="text" class="form-control" placeholder="Name" required
                                               aria-describedby="p3x-gitlist-modal-commit-name-aria"
                                               id="p3x-gitlist-modal-commit-name" minlength="3" maxlength="64"
                                               autofocus>
                                    </div>
                                    <br/>
                                    <div class="input-group">
                                        <span class="input-group-addon" id="p3x-gitlist-modal-commit-email-aria"><i
                                                    class="fas fa-at"></i></span>
                                        <input required type="email" id="p3x-gitlist-modal-commit-email"
                                               class="form-control" placeholder="E-mail"
                                               aria-describedby="p3x-gitlist-modal-commit-email-aria" maxlength="64"
                                               minlength="3">
                                    </div>

                                    <br/>
                                    <div class="input-group">
                                        <span class="input-group-addon" id="p3x-gitlist-modal-commit-comment-aria"><i
                                                    class="far fa-comment"></i></span>
                                        <input required type="text" class="form-control" placeholder="Comment"
                                               aria-describedby="p3x-gitlist-modal-commit-email-aria"
                                               id="p3x-gitlist-modal-commit-comment" minlength="3" maxlength="64"
                                               value="P3X Gitlist Commit">
                                    </div>
                                </form>

                            </div>
                            <div class="modal-footer">
                                <button id="p3x-gitlist-modal-commit-push" type="submit" class="btn btn-info">Commit
                                    and Push
                                </button>
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            </div>
                        </div><!-- /.modal-content -->
                    </div><!-- /.modal-dialog -->
                </div><!-- /.modal -->
            {% elseif fileType == 'markdown' %}
                <a href="{{ path('blob', {repo: repo, commitishPath: branch ~ '/' ~ file}) }}?codemirror=1&edit=1"
                   class="btn btn-sm btn-info">
                    <span class="fa fa-edit"></span> Edit
                </a>
            {% endif %}

        {% endblock %}

        {% block left %}

            <div class="p3x-gitlist-button">

                <a href="{{ path('blob_raw', {repo: repo, commitishPath: branch ~ '/' ~ file}) }}"
                   class="btn btn-default btn-sm"><span class="fas fa-download"></span> Raw</a>
                <a href="{{ path('blame', {repo: repo, commitishPath: branch ~ '/' ~ file}) }}"
                   class="btn btn-default btn-sm"><span class="fa fa-fire"></span> Blame</a>
                <a href="{{ path('commits', {repo: repo, commitishPath: branch ~ '/' ~ file}) }}"
                   class="btn btn-default btn-sm"><span class="fa fa-list"></span> History</a>



                {% if (fileType != 'image' and fileType != 'markdown') or enforceCodemirror %}
                    <span id="p3x-gitlist-file-codemirror" style="display: none;">
                        <div class="btn-group btn-toggle">
                            <button id="p3x-gitlist-file-button-scroll" class="btn btn-sm btn-default">Scroll mode</button>
                            <button id="p3x-gitlist-file-button-full" class="btn btn-sm btn-default">Full height</button>
                        </div>
                    </span>

                {% endif %}

                {% if fileType == 'markdown' %}

                    {% if enforceCodemirror %}
                        <a href="{{ path('blob', {repo: repo, commitishPath: branch ~ '/' ~ file}) }}"
                           class="btn btn-default btn-sm"><span class="fa fa-code"></span> Markdown rendered</a>
                    {% else %}
                        <a title="Click this button and you can edit/save this code."
                           href="{{ path('blob', {repo: repo, commitishPath: branch ~ '/' ~ file}) }}?codemirror=1"
                           class="btn btn-default btn-sm"><span class="fa fa-code"></span> Markdown code</a>
                    {% endif %}


                {% endif %}

            </div>

        {% endblock %}

    {% endembed %}

    <div id="p3x-gitlist-file-codemirror-exceeded" role="alert" class="alert-dismissable alert alert-info">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        This file ( {{ fileSize | format_size }} ) exceeds the allowed full mode ({{ codemirror_full_limit }} kb) size. The editor full hight is disabled, only scrolling is allowed..
    </div>



    <div class="source-view">

        {% if fileType == 'image' %}
            <div class="text-center"><img src="{{ path('blob_raw', {repo: repo, commitishPath: branch ~ '/' ~ file}) }}"
                                          alt="{{ file }}" class="image-blob"/></div>

        {% elseif fileType == 'markdown' and enforceCodemirror != true %}
            {% include 'markdown.twig' with {'filename': file, 'data': blob} %}
        {% else %}
            <pre class="p3x-gitlist-code" id="sourcecode" language="{{ fileType }}">{{ blob|htmlentities|raw }}</pre>

        {% endif %}
    </div>



{% endblock %}