@php
$dimensions = \Config::get('pgsimagedimensions');
$width = $dimensions['interior_gallery_file']['large']['width'];
$height = $dimensions['interior_gallery_file']['large']['height'];
$dimensionStr = ' <strong class="imageDims">[' . $width . 'px X ' . $height . 'px] </strong>';
$mimes = ['jpg', 'jpeg', 'png', 'svg'];
@endphp

<div class="row">
	<div id="imageGalleryUpload1" class="col-xl-6 col-lg-6 col-md-6 col-sm-6 col-6">
		<div class="card">
			<div class="card-header">
				<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
					<div class="section-block">
						<h3 class="section-title">Upload Interior Gallery Images</h3>
					</div>
				</div>
			</div>
			<div class="card-body">
				<div class="row">
					<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
						<section class="basic_settings" id="postMediaWrapper">
							<div class="row">
								<div class="col-sm-12  fl fl-wrap fileUploadWrapper form-group">
									{!! getMultiPlUploadControlIX('Upload Gallery Image(s) ' . $dimensionStr . ' (Max 2 MB) ('. implode(', ', $mimes) .') ','interior_gallery',$mimes,'image','Select File',null,null,null,$postType,"myFileLister-interior") !!}
								</div>
							</div>
						</section>
					</div>
					
				</div>
			</div>
			<div class="card-footer  p-0 text-center d-flex justify-content-center">
				<p>Files will be automatically uploaded. Can select multiple files</p>
			</div>
			<div class="row">
				<ul id="{{ (!empty($galleryLister))?$galleryLister:'galleryWrapper' }}" class="myFileLister myFileLister-interior">
					@if(!empty($interiorGallery))
							@foreach($interiorGallery as $media)
							{!! showPrMediaItem($media,'interior_gallery_file') !!}
							@endforeach
					@endif
				</ul>
			</div>
		</div>
		
	</div>
	@php
		$dimensions = \Config::get('pgsimagedimensions');
		$width = $dimensions['exterior_gallery_file']['large']['width'];
		$height = $dimensions['exterior_gallery_file']['large']['height'];
		$dimensionStr = ' <strong class="imageDims">[' . $width . 'px X ' . $height . 'px] </strong>';
		$mimes = ['jpg', 'jpeg', 'png', 'svg'];
	@endphp
	<div id="imageGalleryUpload2" class="col-xl-6 col-lg-6 col-md-6 col-sm-6 col-6">
		<div class="card">
			<div class="card-header">
				<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
					<div class="section-block">
						<h3 class="section-title">Upload Exterior Gallery Images</h3>
					</div>
				</div>
			</div>
			<div class="card-body">
				<div class="row">
					<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
						<section class="basic_settings" id="postMediaWrapper">
							<div class="row">
								<div class="col-sm-12  fl fl-wrap fileUploadWrapper form-group">
									{!! getMultiPlUploadControlIX('Upload Gallery Image(s) ' . $dimensionStr . ' (Max 2 MB) ('. implode(', ', $mimes) .') ','exterior_gallery',$mimes,'image','Select File',null,null,null,$postType,"myFileLister-exterior") !!}
								</div>
							</div>
						</section>
					</div>
					
				</div>
			</div>
			<div class="card-footer  p-0 text-center d-flex justify-content-center">
				<p>Files will be automatically uploaded. Can select multiple files</p>
			</div>
			<div class="row">
				<ul id="{{ (!empty($galleryLister))?$galleryLister:'galleryWrapper' }}" class="myFileLister myFileLister-exterior">
					@if(!empty($exteriorGallery))
							@foreach($exteriorGallery as $media)
							{!! showPrMediaItem($media,'exterior_gallery_file') !!}
							@endforeach
					@endif
				</ul>
			</div>
		</div>
		
	</div>
</div>


@section('scripts')
@parent
<script>
var	galleryUploaders = [], uploaders = [],URL="{{ route('post_media_create',['slug'=>'project']) }}", resultDivID="#galleryWrapper", downloadPath ="{{ apa('post_media_download') }}/", basePath ="{{ asset('storage/post') }}/";

  $('.multiuploader-interior-exterior').each(function(i,v){
				var _this = $(this);
				var _type = $(this).attr('data-type');
				var _slug = $(this).attr('data-slug');
				var _name = $(this).attr('name');
				var holder_grid = '.'+$(this).data('list-holder');
				var _mimeTypesTmp = $(this).attr('data-allowed');
				if(!_type){
					_type = 'default';
				}
				if(!_mimeTypesTmp){
					_mimeTypes = [
						{title : "Pdf Document", extensions : "pdf"},
						{title : "Word Document", extensions : "doc"},
						{title : "Word Document", extensions : "docx"},
						{title : "Word Document", extensions : "odt"},
						{title : "Image file", extensions : "jpg"},
						{title : "Image file", extensions : "jpeg"},
						{title : "Image file", extensions : "png"},
						{title : "Image file", extensions : "svg"},
					];
				}else{
					_mimeTypes = [];
					var _spitArr = _mimeTypesTmp.split(',');
					
					$.each(_spitArr,function(i,v){
						_mimeTypes.push({title : "document",extensions:v })
					})
				}
				
				var uploader = new plupload.Uploader({
							runtimes : 'html5,flash,silverlight,html4',
							browse_button : $(this).attr('id'), // you can pass in id...					
							url : URL,					
							multi_selection : true,
							/* resize: {
								width: 100,
								height: 100
							  }, */
							filters : {
								max_file_size : '10mb',
								mime_types: _mimeTypes
							},
							multipart_params : {
								'controlName': _type,
								'slug':_slug+'_gallery',
								'name':_name
							},
							headers: { 'X-CSRF-TOKEN': window.Laravel.csrfToken },
							init: {
								PostInit: function() {
									
								},
								
								BeforeUpload:function (up,files){
									var status_before = files.status;
									_this.closest('.input_parent').find('.uploadProgress').css({'width':'0%'});					
									_this.closest('.input_parent').find('.uploadPercentage').html('');				
									
									uploader.settings.url = URL;		
								
								},										
								FilesAdded: function(up, files) {

									_this.closest('.input_parent').find('.uploadFileName').html(files[0].name)
									_this.closest('.input_parent').find('input[type="file"]').attr('required',true)
									/* _this.closest('.input_parent').find('.choose').find('.uploadWrapperParent').removeClass('uploaded')
									_this.closest('.input_parent').find('.choose').find('.uploadWrapperParent').addClass('uploading') */
									uploader.start();
								},

								UploadProgress: function(up, file) {
									_this.closest('.input_parent').find('.uploadProgress').css({'width':file.percent+'%'});					
									_this.closest('.input_parent').find('.uploadPercentage').html(file.percent+'%');				
								},
								FileUploaded:function(up,file,response){
							
									var t = response.response;
									
									try{	
										var rt  = $.parseJSON(t);
										if(rt.status == true ){
											_this.closest('.input_parent').find('input[type="file"]').removeClass('error')
											_this.closest('.input_parent').find('input[type="file"]').next('label').hide()
											_this.closest('.input_parent').find('input[type="file"]').attr('required',false)
											_this.closest('.input_parent').find('.filename').val(rt.data.fileName);
											_this.closest('.input_parent').find('.original_name').val(file.name);
											
											var fileHTML, fileType;
											fileType=_type;
										   
											if(typeof rt.data.fileType != 'undefined'){
												fileType = rt.data.fileType;
											}else if(typeof rt.fileType != 'undefined'){
												fileType = rt.fileType;
											}
											if(typeof fileType == 'undefined' && typeof rt.data.type != 'undefined'){
												fileType = rt.data.type;
											}
											
											if(jQuery.inArray(rt.data.mimeType, ['image/jpeg','image/png','image/gif','image/svg+xml']) !== -1){
													fileHTML = PGSADMIN.utils.createFileHolderPr('image',basePath,rt.data,downloadPath);
											}else if(jQuery.inArray(rt.data.mimeType, ['application/pdf']) !== -1){
													fileHTML = PGSADMIN.utils.createFileHolderPr('pdf',basePath,rt.data,downloadPath);
											}else if(jQuery.inArray(rt.data.mimeType, ['application/vnd.openxmlformats-officedocument.wordprocessingml.document']) !== -1){
													fileHTML = PGSADMIN.utils.createFileHolderPr('word',basePath,rt.data,downloadPath);
											}else{
													fileHTML = PGSADMIN.utils.createFileHolderPr('file',basePath,rt.data,downloadPath);
											}
											
											fileHTML += '';
											$(holder_grid).append(fileHTML);
											_this.closest('.fileUploadWrapper').find('.uploadPreview').remove();  
											
											_this.closest('.input_parent').find('.uploadFileName').html('');
											_this.closest('.input_parent').find('.original_name').val('');
											_this.closest('.input_parent').find('.uploadProgress').css({'width':'0%'});					
											_this.closest('.input_parent').find('.uploadPercentage').html('');
											
										}else{
											_this.closest('.input_parent').find('.uploadFileName').html('');
											_this.closest('.input_parent').find('.original_name').val('');
											_this.closest('.input_parent').find('.uploadProgress').css({'width':'0%'});					
											_this.closest('.input_parent').find('.uploadPercentage').html('');
											
											if(typeof swal == 'undefined'){ 
												alert(window.appTrans.invalidFile);
											}else{
												swal.fire({
													  title: window.appTrans.error,
													  text: rt.response,
													  type: "warning",
													  confirmButtonText: window.appTrans.ok,
													  confirmButtonColor:'#000',
													  closeOnConfirm: false
													})
											}
											
										}
									}catch(ex){					
										console.log(ex);
										Swal.fire({
											text: 'Network Error Occured. Please try again.',
											type: 'error',
										});
										_this.closest('.input_parent').find('.uploadFileName').html('');
										_this.closest('.input_parent').find('.filename').val('');
										_this.closest('.input_parent').find('.original').val('');
										_this.closest('.input_parent').find('.uploadProgress').css({'width':'0%'});					
										_this.closest('.input_parent').find('.uploadPercentage').html('');
									}
								},
								UploadComplete:function(up,files){
									//$('#loader').hide();
									// $('.uploadWrapperParent').addClass('uploaded')
									uploader.splice();
								},
								Error: function(up, err) {

									
									if(typeof swal == 'undefined'){ 
										alert(window.appTrans.invalidFile);
									}else{
										swal.fire({
											  title: window.appTrans.error,
											  text: window.appTrans.invalidFile+err.message,
											  type: "warning",
											  confirmButtonText: window.appTrans.ok,
											  confirmButtonColor:'#000',
											  closeOnConfirm: false
										});
									}
									
								}
							}
						});
					
			
						uploader.init();

						galleryUploaders.push(uploader);
					
				}); 
</script>
    @include('admin.common.common_gallery_scripts')
@stop