@extends('layouts.app')

@section('content')

<div class="container">
    <div class="row">
        <div class="col-md-8 col-md-offset-2">
            <div class="panel panel-default">
                <div class="panel-heading">Dashboard</div>

                <div class="panel-body">
                    @if (session('status'))
                        <div class="alert alert-success">
                            {{ session('status') }}
                        </div>
                    @endif

                    
                </div>
            </div>
        </div>
    </div>
</div>




<div id="app" class="h-100">

    <div class="d-flex">
        <div id="sidebar" class="border-right sidebar w-25">
            <nav class="nav flex-column mt-5 font-weight-bold">
                <a class="nav-link border-bottom d-flex active" href="#">Dashboard<img src="http://placehold.it/25x25" class="ml-auto"></a>
                <a class="nav-link border-bottom d-flex" href="#">Posts<img src="http://placehold.it/25x25" class="ml-auto"></a>
                <a class="nav-link border-bottom d-flex" href="#">Pages<img src="http://placehold.it/25x25" class="ml-auto"></a>
                <a class="nav-link border-bottom d-flex" href="#">Media<img src="http://placehold.it/25x25" class="ml-auto"></a>
                <a class="nav-link border-bottom d-flex" href="/admin/users">Users<img src="http://placehold.it/25x25" class="ml-auto"></a>
                <a class="nav-link border-bottom d-flex" href="#">Site Management<img src="http://placehold.it/25x25" class="ml-auto"></a>
            </nav>
        </div>

        <div class="container-fluid">

            <div class="row bg-dark text-white">
                <div class="col-12">
                    <div class="">header</div>
                </div>
            </div>
                    

            <div class="row">

                <div class="col-12 p-0 bg-white">

                    <header class="py-5 bg-light border-bottom">
                        <div class="container">
                            <div class="row">
                                <div class="col-md-6">
                                    <h1 class="text-uppercase">Dashboard</h1>
                                </div>
                                <div class="col-auto ml-auto align-self-end">
                                    <form method="get" class="w-50">
                                        <input type="text" name="search" placeholder="Search" />
                                    </form>
                                </div>
                            </div>
                        </div>                        
                    </header>


                    <section class="py-5 dash__links">
                        <div class="container text-uppercase font-weight-bold">
                            <div class="row">
                                
                                <div class="col-3">
                                    <a href="javascript:void(0);">
                                        <div class="border w-100 h-100 text-center py-5 bg-primary-hover">
                                            <img src="http://placehold.it/100x100" class="align-self-center mx-auto d-block mb-3">
                                            <p>Add a new post</p>
                                        </div>
                                    </a>
                                </div>
                                <div class="col-3">
                                    <a href="javascript:void(0);">
                                        <div class="border w-100 h-100 text-center py-5 bg-primary-hover">
                                            <img src="http://placehold.it/100x100" class="align-self-center mx-auto d-block mb-3">
                                            <p>Add User</p>
                                        </div>
                                    </a>
                                </div>
                                <div class="col-3">
                                    <a href="javascript:void(0);">
                                        <div class="border w-100 h-100 text-center py-5 bg-primary-hover">
                                            <img src="http://placehold.it/100x100" class="align-self-center mx-auto d-block mb-3">
                                            <p>View Website</p>
                                        </div>
                                    </a>
                                </div>
                                <div class="col-3">
                                    <a href="javascript:void(0);">
                                        <div class="border w-100 h-100 text-center py-5 bg-primary-hover">
                                            <img src="http://placehold.it/100x100" class="align-self-center mx-auto d-block mb-3">
                                            <p>Need Help?</p>
                                        </div>
                                    </a>
                                </div>

                            </div>
                        </div>
                    </section>
                        

            <!--
                    <section class="py-5">
                        <div id="embed-api-auth-container"></div>
                        <div id="chart-container"></div>
                        <div id="view-selector-container"></div>
                    </section>
            -->

                    
                    <!-- <textarea name="content" class="form-control my-editor">{!! old('content', '$content') !!}</textarea> -->
                    <textarea name="tm" class="form-control"></textarea>
                


                    <section class="py-5">
                        
                        <div class="container">
                            <div class="row">
                                <div class="col">
                                    <h3 class="text-uppercase">Further Support</h3>
                                </div>
                            </div>

                            <div class="row square-nav">
                                
                                <div class="col-4">
                                    <div class="card h-100">
                                        <img class="card-img-top" src="http://placehold.it/300x150" alt="">
                                        <div class="card-body d-flex flex-column">
                                            <h4 class="card-title text-uppercase text-primary">Issues with your website?</h4>
                                            <p class="card-text">Are you experiencing issues with your website, CMS or server?</p>
                                            <a href="javascript:void(0);" class="btn btn-primary mt-auto mr-auto">Click here</a>
                                        </div>
                                    </div>

                                </div>
                                <div class="col-4">
                                    <div class="card h-100">
                                        <img class="card-img-top" src="http://placehold.it/300x150" alt="">
                                        <div class="card-body d-flex flex-column">
                                            <h4 class="card-title text-uppercase text-primary">Need some design work done?</h4>
                                            <p class="card-text">Our team of graphic designers, copywriters and strategists can collaborate together to produce your logos, corporate stationery, brochures and much more!</p>
                                            <a href="javascript:void(0);" class="btn btn-primary mt-auto mr-auto">Click here</a>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-4">
                                    <div class="card h-100">
                                        <img class="card-img-top" src="http://placehold.it/300x150" alt="">
                                        <div class="card-body d-flex flex-column">
                                            <h4 class="card-title text-uppercase text-primary">Connect with us</h4>
                                            <p class="card-text">Like us on Facebook to stay up to date with all the latest industry news, what we are up to plus some fun things along the way!</p>
                                            <a href="https://www.facebook.com/MilestoneBelanova1/" target="_blank" class="btn btn-primary mt-auto mr-auto">Click Here</a>
                                        </div>
                                    </div>
                                </div>
                                

                            </div>
                        </div>

                    </section>

                    <!-- @yield('content') -->
                </div>

            </div>

        </div><!-- end container-fluid -->

    </div>

</div>

<!-- Scripts -->
<script src="//cdn.tinymce.com/4/tinymce.min.js"></script>
<script>
var route_prefix = "{{ url(config('lfm.url_prefix', config('lfm.prefix'))) }}";
// var route_prefix = "/laravel-filemanager/";
console.log(route_prefix);
</script>
<script>
// var route_prefix = "{{ url(config('lfm.url_prefix')) }}";
// console.log(route_prefix);
// $('#lfm').filemanager('image', {prefix: route_prefix});
var editor_config = {
    path_absolute : "",
    selector: "textarea[name=tm]",
    plugins: [
        "link image"
    ],
    relative_urls: false,
    height: 129,
    file_browser_callback : function(field_name, url, type, win) {
        var x = window.innerWidth || document.documentElement.clientWidth || document.getElementsByTagName('body')[0].clientWidth;
        var y = window.innerHeight|| document.documentElement.clientHeight|| document.getElementsByTagName('body')[0].clientHeight;

        var cmsURL = editor_config.path_absolute + route_prefix + '?field_name=' + field_name;
        
        if (type == 'image') {
            cmsURL = cmsURL + "&type=Images";
        } else {
            cmsURL = cmsURL + "&type=Files";
        }
        console.log(cmsURL);
        tinyMCE.activeEditor.windowManager.open({
            file : cmsURL,
            title : 'Filemanager',
            width : x * 0.8,
            height : y * 0.8,
            resizable : "yes",
            close_previous : "no"
        });
    }
};

tinymce.init(editor_config);
</script>
<script>
{!! \File::get(base_path('vendor/unisharp/laravel-filemanager/public/js/lfm.js')) !!}
</script>


@endsection