{{ Form::open(array('url' => $action, 'method' => $method)) }}

<div class="row">
	<div class="col-md-6 col-12">
		{{ Form::defName('title', "Judul", $academy->title, ['required']) }}
	</div>
	<div class="col-md-6 col-12">
		{{ Form::defName('slug', "Slug", $academy->slug, ['required']) }}
	</div>
	
	<div class="col-md-12 col-12">
		{{ Form::wysiwyg('description', "Deksripsi", $academy->description, ['required'], 450, false) }}
	</div>
	<div class="col-md-6 col-12">
		{{ Form::defImageUpload('image',"Foto", $academy->attachments)}}
	</div>
	
	<div class="col-md-6 col-12">
		<button type="button" class="btn btn-info" id="btn-add-document">Tambah Dokumen</button>
		<div id="palace-table">
			<table class="table">
				<thead>
					<tr>
						<th>Nama File</th>
						<th>Action</th>
					</tr>
				</thead>
				<tbody></tbody>
			</table>
		</div>
		<input type="hidden" name="add-files" id="add-files" />
		<input type="hidden" name="remove-files" id="remove-files" />
		<hr />
		{{ Form::links('links',"Tautan", $academy->links,['required'])}}
	</div>

	<div class="col-md-6 col-12">
		
	</div>
</div>

{{ Form::defSubmitDefault('SIMPAN') }} <a href="{{url()->previous()}}" class="btn btn-light btn-rounded">Kembali</a>

{{ Form::close() }}

@push('scripts')
<script type="text/javascript">
	var files = [];
	$(document).ready(function(){
		initDefault();
		$("#btn-add-document").click(function(){
			window.open('/filemanager' + '?type=document', 'FileManager', 'width=900,height=600');
			window.SetUrl = function (items) {
				if(files.length <= 3){
					files.push(items[0]);
            		initFiles();
				}else{
					toastr.warning('file maksimal 3');
				}
            	
            }
		})

		$("#palace-table").on('click','.btn-remove',function(){
			var index = $(this).attr('file-index');
			files.splice(index,1);
			initFiles();
		})

		$("#palace-table").on('click','.btn-remove-document',function(){
			var index = $(this).attr('file-index');
			files.splice(index,1);
			initFiles();
			var value = $("#remove-files").val();
			value += $(this).attr('file-id')+";";
			$("#remove-files").val(value);
		})

		$("#title").change(function(){
			var title = $(this).val();
			slug(title);
		})
	})

	function initDefault(){
		@if(isset($document))
			@foreach($document as $value)
				files.push({
					name:"{{$value->filename}}",
					id:"{{$value->id}}",
				});

			@endforeach
			initFiles();
		@endif
	}

	function slug(title){

			$.ajax({
					headers: {
		                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
		            },
		            type: "post",
		            url: "{{route('academy.checkslug')}}",
		            data:{title: title },
		            dataType: "json",
		            success: function(res){
		              $("#slug").val(res.data);

		            },
		            error: function (xhr, ajaxOptions, thrownError) {
		              ajaxError(xhr.status, xhr.statusText)
		            }
				})
	}

	function initFiles(){
		$("#palace-table tbody").html("");
		var value = "";
		for(var i = 0; i < files.length;i++){
			if(files[i].url != null){
				value += files[i].url+";";
			}
			
			var fileId = "";
			var classBtn = "btn-remove";
			if(files[i].id != null){
				fileId = 'file-id="'+files[i].id+'"';
				classBtn = "btn-remove-document";
			}
			$("#palace-table tbody").append("<tr><td>"+files[i].name+"</td><td><button type='button' class='btn btn-icon btn-sm btn-danger "+classBtn+"' file-index='"+i+"' "+fileId+"><i class='mdi mdi-delete'></i></button></td></tr>");
		}

		$("#add-files").val(value);
	}
</script>
@endpush