@extends('blocks.modal', ['modalName' => "confirm-action-modal"])

@section('modal-header')

    <div class="mdl-grid">
        <div class="mdl-cell mdl-cell--12-col" style="text-align: left;">
            <h4 class="mdl-color-text--indigo">Wymagane potwierdzenie akcji</h4>
        </div>
    </div>

@overwrite

@section('modal-content')

    <div class="mdl-grid">

        <div class="mdl-cell mdl-cell--12-col" style="text-align: center" id="confirm-action-question">
        </div>

        <div class="mdl-cell mdl-cell--12-col" style="text-align: center" id="confirm-action-loading">
            <div id="p2" class="mdl-progress mdl-js-progress mdl-progress__indeterminate"></div>
        </div>

    </div>

@overwrite

@section('modal-footer')

    <div id="confirm-action-submit-section" class="mdl-grid">
        <div class="mdl-cell mdl-cell--6-col mdl-typography--text-left">
            <button id="confirm-action-no" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent">
                anuluj
            </button>
        </div>
        <div class="mdl-cell mdl-cell--6-col mdl-typography--text-right">
            <button id="confirm-action-yes" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent">
                kontynuuj
            </button>
        </div>
    </div>

@overwrite

@section('modal-scripts')

    <script>
        var confirmActionCallback = null;

        $('#confirm-action-no').click(function() {
            $('#confirm-action-modal').modal('hide');
        });

        $('#confirm-action-yes').click(function() {
            $('#confirm-action-modal').modal('hide');
            if(confirmActionCallback) {
                confirmActionCallback();
            }
        });

        function showConfirmActionModal(question, callback) {
            confirmActionCallback = callback;
            hideConfirmActionLoading();
            $('#confirm-action-question').html(question);
            $('#confirm-action-modal').modal();
        }
    
        function showConfirmActionLoading() {
            $('#confirm-action-modal-footer').hide();
            $('#confirm-action-loading').show();
        }

        function hideConfirmActionLoading() {
            $('#confirm-action-modal-footer').show();
            $('#confirm-action-loading').hide();
        }

    </script>

@overwrite