{% extends "base.html" %}

{% block bodydata %} data-project-id="{{project.id}}"{% endblock %}
{% block title %} | Project: {{project.name}}{% endblock %}

{% block main %}
        <div class="page-header">
            <div class="container">
                <div class="row">
                    <div class="col-sm-6">
                        <h1 class="smaller"><a href="{% url 'admin:project_overview' project.id %}">{{project.name}}</a></h1>
                        <a href="{% url 'admin:project_overview' project.id %}"><span class="glyphicon glyphicon-arrow-left"></span> Project home page</a>
                    </div>
                    <ul class="header-nav">
                    <li><a href="{% url 'admin:category_list' project.id %}">Categories <span class="badge">{{ project.categories.count }}</span></a></li>
                    <li><a href="{% url 'admin:usergroup_list' project.id %}">User groups <span class="badge">{{ project.usergroups.count }}</span></a></li>
                </ul>
                </div>
            </div>
        </div>

        <div class="container">
            {% include 'snippets/messages.html' %}

            <div class="row">
                <div class="col-sm-4">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <h3 class="panel-title">Manage Project</h3>
                        </div>
                        <div class="list-group">
                            <a href="{% url 'admin:category_list' project.id %}" class="list-group-item"><span class="badge">{{ project.categories.count }}</span>Categories</a>
                            <a href="{% url 'admin:usergroup_list' project.id %}" class="list-group-item"><span class="badge">{{ project.usergroups.count }}</span>User groups</a>
                            <a href="{% url 'admin:project_extend' project.id %}" class="list-group-item">Geographic extent</a>
                            <a href="{% url 'admin:project_settings' project.id %}" class="list-group-item active">Settings</a>
                        </div>
                    </div>
                </div>

                <div class="col-sm-8">
                    <h3 class="header">Project Settings</h3>
                    <form method="POST" action="{% url 'admin:project_settings' project.id %}" novalidate>
                        {% csrf_token %}
                        <div class="form-group">
                            <label for="name" class="control-label">Name (required)</label>
                            <input type="text" class="form-control input-lg" id="name" name="name" maxlength="100" value="{{ project.name }}" required>
                        </div>

                        <div class="form-group">
                            <label for="description" class="control-label">Description</label>
                            <textarea class="form-control input-lg" rows="5" name="description" id="description">{{ project.description }}</textarea>
                        </div>

                        <div class="form-group">
                            <label for="everyone_contributes" class="control-label">Project permissions</label>
                            <div class="radio public {% if project.isprivate %}hidden{% endif %}">
                                <label>
                                    <input type="radio" name="everyone_contributes" value="true" {% if project.everyone_contributes == 'true' %}checked{% endif %}> <strong>All users</strong><br>All users can contribute. This includes anonymous contributions from users, who are not logged in.
                                </label>
                            </div>
                            <div class="radio">
                                <label>
                                    <input type="radio" name="everyone_contributes" value="auth" {% if project.everyone_contributes == 'auth' %}checked{% endif %}>
                                    <span class="private {% if not project.isprivate %}hidden{% endif %}"><strong>All users</strong><br>All users that have access to the project can contribute.</span>
                                    <span class="public {% if project.isprivate %}hidden{% endif %}"><strong>All authenticated users</strong><br>Users have to be logged in to contribute.</span>
                                </label>
                            </div>
                            <div class="radio">
                                <label>
                                    <input type="radio" name="everyone_contributes" value="false" {% if project.everyone_contributes == 'false' %}checked{% endif %}> <strong>Only members of contributor groups can cantribute</strong><br>Only users, who are member of a user groups that has been granted contribute permissions, can contribute.
                                </label>
                            </div>
                        </div>

                        <div class="form-group">
                            <button type="submit" class="btn btn-primary">Save</button>
                            <button type="reset" class="btn btn-link">Reset</button>
                        </div>
                    </form>
                </div>
            </div>

            <div class="row">
                <div class="col-sm-8 col-sm-offset-4">
                    <div class="panel panel-danger">
                        <div class="panel-heading">
                            <h2 class="panel-title">Be careful!</h2>
                        </div>
                        <div class="panel-body becareful">
                            <div class="toggle-active {% if project.status == status_types.inactive %} hidden{% endif %}">
                                <strong>Archive the project</strong>
                                <p>The project will be no longer accessible.</p>
                                <a href="#" class="text-danger" data-toggle="modal" data-target="#make-inactive-confirm">Archive</a>
                            </div>

                            <div class="toggle-active {% if project.status == status_types.active %} hidden{% endif %}">
                                <strong>Activate the project</strong>
                                <p>The project will accessible again.</p>
                                <a href="#" class="text-danger" data-toggle="modal" data-target="#make-active-confirm">Activate</a>
                            </div>

                            <div class="toggle-private {% if not project.isprivate %} hidden{% endif %}">
                                <strong>Make the project public</strong>
                                <p>Make this project visible to the general public.</p>
                                <a href="#" class="text-danger" data-toggle="modal" data-target="#make-public-confirm">Make public</a>
                            </div>
                            <div class="toggle-private {% if project.isprivate %} hidden{% endif %}">
                                <strong>Make the project private</strong>
                                <p>Hide this project from the public.</p>
                                <a href="#" class="text-danger" data-toggle="modal" data-target="#make-private-confirm">Make private</a>
                            </div>

                            <div>
                                <strong>Delete project</strong>
                                <p>Deleting a project can not be undone and will delete all data contributed to the project.</p>
                                <a href="#" class="text-danger" data-toggle="modal" data-target="#delete-confirm">Delete this project</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
{% endblock %}

{% block modals %}
        <!-- Delete confirmation modal -->
        <div class="modal fade" id="delete-confirm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content panel-danger">
                    <div class="modal-header panel-heading">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" id="myModalLabel">Are you sure?</h4>
                    </div>
                    <div class="modal-body panel-body">
                        <p><strong>Before you delete the project, please read through the consequences of this action.</strong></p>
                        <ul>
                            <li>Deleting a project can not be undone.</li>
                            <li>Deleting a project will delete all data contributed to the project.</li>
                        </ul>
                    </div>
                    <div class="modal-footer panel-footer">
                        <a href="{% url 'admin:project_delete' project.id %}" class="btn btn-danger">I'm absolutely sure, delete the project!</a>
                    </div>
                </div>
            </div>
        </div>
        <!-- /Delete confirmation modal -->

        <div class="modal fade" id="make-public-confirm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content panel-warning">
                    <div class="modal-header panel-heading">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" id="myModalLabel">Are you sure?</h4>
                    </div>
                    <div class="modal-body panel-body">
                        <p><strong>Before you make the project public, please read through the consequences of this action.</strong></p>
                        <p>A public project is accessible to any user. However, access to contributed data may still be restricted by settings of individual data groupings.</p>
                    </div>
                    <div class="modal-footer panel-footer">
                        <button type="button" name="confirm" value="false" class="btn btn-warning" data-loading-text="Loading...">Yes, make the project public.</button>
                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade" id="make-private-confirm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content panel-warning">
                    <div class="modal-header panel-heading">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" id="myModalLabel">Are you sure?</h4>
                    </div>
                    <div class="modal-body panel-body">
                        <p><strong>Before you make the project private, please read through the consequences of this action.</strong></p>
                        <p>A private project is only accessible by the following users:</p>
                        <ul>
                            <li>Project administrators</li>
                            <li>Project contributers</li>
                            <li>Members of any user group that is assigned to one of the project views.</li>
                        </ul>
                    </div>
                    <div class="modal-footer panel-footer">
                        <button type="button" name="confirm" value="true" class="btn btn-warning" data-loading-text="Loading...">Yes, make the project private.</button>
                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade" id="make-inactive-confirm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content panel-warning">
                    <div class="modal-header panel-heading">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" id="myModalLabel">Are you sure?</h4>
                    </div>
                    <div class="modal-body panel-body">
                        <p>Before you archive the project, please read through the consequences of this action:</p>
                        <ul>
                            <li>The project will be accessible to project administrators only.</li>
                            <li>All data, user groups and views will be kept in the data base.</li>
                            <li>It will not possible to access exisiting data or contribute new data to the project.</li>
                        </ul>
                    </div>
                    <div class="modal-footer panel-footer">
                        <button type="button" name="confirm" value="{{status_types.inactive}}" class="btn btn-warning" data-loading-text="Loading...">Yes, archive the project.</button>
                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade" id="make-active-confirm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content panel-warning">
                    <div class="modal-header panel-heading">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" id="myModalLabel">Are you sure?</h4>
                    </div>
                    <div class="modal-body panel-body">
                        <p>Before you activate the project, please read through the consequences of this action:</p>
                        <ul>
                            <li>The project will be accessible to either all registered users or Administrators, Moderators and Contributors.</li>
                            <li>Contributors and Administrators can contribute new data.</li>
                        </ul>
                    </div>
                    <div class="modal-footer panel-footer">
                        <button type="button" name="confirm" value="{{status_types.active}}" class="btn btn-warning" data-dismiss="modal">Yes, activate the project.</button>
                    </div>
                </div>
            </div>
        </div>
{% endblock %}

{% block libraries %}
            <script src="/static/js/admin.ui.forms.validate.js"></script>
            <script src="/static/js/admin.ui.updater.js"></script>
            <script src="/static/js/admin.control.ajax.js"></script>
{% endblock %}
