@extends('layouts.app')
@include('layouts.header')
@include('layouts.media_edit')
@section('content')
<main class="media_manager  template_2col">
	<div class="side_menu">
        @php
        $dataVue = [
            'sujets' => $sujets,
            'current' => $currentSujet,
        ];
        @endphp
        <div id="mm-side-header" data-json='@json($dataVue)'></div>
        <div id="mm-folder" data-json='{}'></div>
	</div>
	<div class="main_content">
			<header>
                @php
                $dataVue = [
                    'textsearch' => $textSearch,
                    'typesmedia' => $typesmedia,
                    'etiquettes' => $etiquettes,
                ];
                @endphp
                <div id="mm-filters" data-json='@json($dataVue)'></div>
				<div class="action_wrapper group">
                    <div id="actionsBar">
                        @php
                        $dataVue = [
                            'csrf' => csrf_token(),
                            'etiquettes' => $etiquettes,
                        ];
                        @endphp
                        <div id="mm-actions" data-json='@json($dataVue)'></div>
                    </div>
					<div class="display">
                        <button><i class="fa fa-calendar-check selected"></i></button>
						<button><i class="fa fa-table-cells selected"></i></button>
						<button><i class="fa fa-table-list"></i></button>
					</div>
                    <div id="mm-sorter" data-json='{}'></div>
				</div>
			</header>
            <div id="mm-display" data-json='{}'></div>
		</div>
        <div id="mm-basket" data-json='{}'></div>
</main>

@endsection
@section('scripts')
    <!-- TODO : Faire le tri des js ci-dessous -->
	<script src="{{ mix('js/jquery.nestable.min.js') }}" defer></script>
	<script src="{{ mix('js/fabric.js') }}"></script>
	<script src="{{ mix('js/darkroom.js') }}"></script>
	<script src="{{ mix('js/jquery.caret.min.js') }}"></script>
@endsection