{% extends 'main/base.html' %}
{% load bootstrap3 %}
{% load staticfiles %}

{% block title %}
    Export data
{% endblock %}

{% block content %}
    <script type="text/javascript">
        {% autoescape off %}
            $(document).ready(function () {
                $("#deleteAllSwitcher").change(function () {
                    rbpmUpdateActivity();
                });
                $("#selectAllSwitcher").change(function () {
                    $(".toBeSwitched").prop('checked', $(this).prop("checked"));
                    rbpmUpdateActivity();
                });
                $(".toBeSwitched").change(function () {
                    console.log("Change");
                    console.log(this);
                    console.log($(this).val())
                    rbpmUpdateActivity();
                });
                rbpmUpdateActivity();
            });

            function rbpmUpdateActivity() {
                collectedActivities = {}
                deleteActive = $('#deleteAllSwitcher').prop('checked');
                $(".toBeSwitched").each(function (e) {
                    mainClass = $(this).val();
                    isChecked = $(this).prop('checked');
                    searchClass = '.' + mainClass;
                    if (isChecked) {
                        $(searchClass).removeClass('hidden');
                        collectedActivities[mainClass] = true;
                    } else {
                        $(searchClass).addClass('hidden');
                    }
                    if (deleteActive) {
                        $(searchClass + '.delete').removeClass('hidden');
                        collectedActivities[mainClass + '_delete'] = true;
                    } else {
                        $(searchClass + '.delete').addClass('hidden');
                    }
                });
                return collectedActivities;
            }

            function rbpmAjaxCall(urlArray) {
                elem = urlArray.shift();
                url = elem[0];
                task = elem[1];
                $(task).removeClass('text-muted').addClass('text-primary');
                $.ajax({
                    url: urlArray,
                    cache: false,
                    type: "GET",
                    complete: function () {
                        $('#rbpmExportButton').prop('disabled', false);
                    },
                    success: function () {
                        $(task).removeClass('text-muted').removeClass('text-primary').addClass('text-success');
                        window.rbpmAjaxOperationStatus = 200;
                        if (urlArray.length > 0) {
                            rbpmAjaxCall(urlArray);
                        } else {
                            $('#rbpmExportButton').prop('disabled', false);
                            stopUpdatingStatus();
                        }
                    },
                    error: function () {
                        $(task).removeClass('text-muted').removeClass('text-primary').addClass('text-danger');
                        window.rbpmAjaxOperationStatus = 500;
                    }
                });
            }

            function rbpmExport() {
                $('#rbpmExportButton').prop('disabled', true);
                startUpdatingStatus();
                collectedActivities = rbpmUpdateActivity();
                environment = $('#environment').val();

                urlsArray = [];
                if (collectedActivities.hasOwnProperty('activity_project')) {
                    urlsArray.push(['/api/rbpm/export/schema/' + environment, '.activity_project']);
                    urlsArray.push(['/api/rbpm/export/project/' + environment, '.activity_project']);
                }
                if (collectedActivities.hasOwnProperty('activity_containers')) {
                    urlsArray.push(['/api/rbpm/export/containers/' + environment, '.activity_containers']);
                }
                if (collectedActivities.hasOwnProperty('activity_users')) {
                    urlsArray.push(['/api/rbpm/export/users/' + environment, '.activity_users']);
                }
                if (collectedActivities.hasOwnProperty('activity_groups')) {
                    urlsArray.push(['/api/rbpm/export/groups/' + environment, '.activity_groups']);
                }

                if (collectedActivities.hasOwnProperty('activity_roles')) {
                    urlsArray.push(['/api/rbpm/export/categories/' + environment, '.activity_roles']);
                    urlsArray.push(['/api/rbpm/export/privileges/' + environment, '.activity_roles']);
                }
                rbpmAjaxCall(urlsArray);
            }
        {% endautoescape %}
    </script>
    <div class="form-group disable-if-running">
        <label for="sel1">Select environment:</label>
        <select class="form-control disable-if-running" id="environment">
            <option value="source">Source</option>
            <option value="destination">Destination</option>
            <option value="file">File</option>
        </select>
        <hr/>
        <label>Settings:</label>
        <div class="checkbox">
            <label class="checkbox-inline"><input id='selectAllSwitcher' type="checkbox" value="selectAll" checked>
                Select all
            </label>
        </div>
        <div class="container">
            <div class="checkbox">
                <label>
                    <input class='toBeSwitched' type="checkbox" value="activity_project" checked>Export project
                </label>
            </div>
            <div class="checkbox">
                <label>
                    <input class='toBeSwitched' type="checkbox" value="activity_containers" checked>Export containers
                </label>
            </div>
            <div class="checkbox">
                <label>
                    <input class='toBeSwitched' type="checkbox" value="activity_users" checked>Export users
                </label>
            </div>
            <div class="checkbox">
                <label>
                    <input class='toBeSwitched' type="checkbox" value="activity_groups" checked>Export groups
                </label>
            </div>
            <div class="checkbox">
                <label>
                    <input class='toBeSwitched' type="checkbox" value="activity_roles" checked>Export roles and
                    resources
                </label>
            </div>
        </div>
    </div>
    <div class="col-md-6 col-lg-6 col-sm-6 col-xs-6">
        <button id="rbpmExportButton" type="button" class="btn btn-primary disable-if-running" onclick="rbpmExport();">
            Export
        </button>
    </div>
    <div class="col-md-12 col-lg-12 col-sm-12 col-xs-12">
        <hr/>
    </div>
    <div class="col-md-12 col-lg-12 col-sm-12 col-xs-12">
        Pending actions:
        <ul>
            <li class="activity_project text-muted">Export Project Data</li>
            <li class="activity_containers text-muted">Export Containers from Directory</li>
            <li class="activity_users text-muted">Export Users from Directory</li>
            <li class="activity_users text-muted">Export Groups from Directory</li>
            <li class="activity_roles text-muted">Export Privileges from Directory</li>
        </ul>
    </div>
    <div class="col-md-12 col-lg-12 col-sm-12 col-xs-12">
        <hr/>
    </div>
{% endblock %}