@include('boilerplate::load.fileinput')

<div class="card">
	<div class="card-header">
		<h3 class="card-title">Photos</h3>
		<div class="card-tools">
			
		</div>
	</div>
	<div class="card-body pt-3 pb-0">
		@if (isset($id))
			@include('components.uploader.mini-gallery')
		@endif

		<div id="uploader-new-images"></div>
		@include('components.uploader.block_image_new', ['name' => 'images[]', 'required' => true])
	</div>
	<div class="card-footer">
		<button type="button" class="btn btn-xs btn-primary add-image pull-right">Ajout <i class="fa fa-plus"></i></button>
	</div>
</div>

@push('js')
	<script>
		function append_image() {
			$("#uploader-new-images .file").fileinput();
			$("#uploader-new-images .file").focus();
		}

		$("#uploader-new-images").appender({
			rowSection: '.row-new-image',
			type: '.row-image',
			addBtn: '.add-image',
			appendEffect: 'fade',
			addClass: 'animated fadeIn',
			rowNumber: '.row-image-number',
			deleteBtn: '.delete-new-image-btn',
			callback: append_image,
			hideSection: true
		});

		function loadImages()
		{
			$gallery = $("#uploader-mini-gallery");
			if ($gallery) {
				$gallery.load("{{ $load_url }}");
			}
		}

		loadImages();
	</script>
@endpush