@extends('catalog.master')

@section('header')
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>{{ config('app.name') }} - Catalogo</title>

    <!-- Bootstrap Core CSS -->

    <!-- Custom Fonts -->
    <link rel="stylesheet" href="{{ asset('css/app.css')  }}">
    <link rel="stylesheet" href="{{ asset('css/sb-admin-2.min.css')  }}">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
        <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
        <script src="//oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
@endsection
@section('main.navigation')
    @include('catalog.main.navigation')
@endsection

@section('content')
    <div class="container">
        @yield('content')
    </div>
@endsection

@section('jsincludes')        
    <script src="{{ asset('js/app.js') }}"></script>
    <script src="{{ asset('js/sb-admin-2.min.js') }}"></script>
    <script>
    function showModal(configurationJSON){

        let configurationObject = JSON.parse(configurationJSON)

        let type=configurationObject.type;
        let msg=configurationObject.msg;
        let title=configurationObject.title;
        let confirm=configurationObject.confirm;
        let confirmMethod=confirm.method;
        let confirmRoute=confirm.route;
        let redirect=configurationObject.redirect;

        var confirmTemplate = ``;

        var modalTemplate = `
        <div class="modal" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <form action="${confirmRoute}" method="post">
                        <div class="modal-header">
                            <h5 class="modal-title text-${type}">${title}</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">
                            @csrf
                            @method('${confirmMethod}')
                            <h5 class="text-center">${msg}</h5>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
                            <button type="submit" class="btn btn-danger">Confirmar</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>`;

        jQuery('.modal_placeholder')
            .empty()
            .append(modalTemplate);

        jQuery(".modal").modal({'show':true});
        if (redirect) {
            jQuery('.modal').on('hide.bs.modal', function(e){
                window.location = redirect;
            })
        }
    }
    </script>
@endsection

@section('modals')
    <div class="modal_placeholder"></div>
@endsection