<div class="wo_about_wrapper_parent">
	<div class="wo_about_wrapper"> 
		<div class="hero hero-overlay" style="background-color: #2ec0bc;"> 
			<div class="container">
				<h1 class="text-center">{{LANG import_new_video}}</h1>
			</div> 
		</div>
		<svg id="wave" viewBox="0 0 100 15"><path fill="#2ec0bc" opacity="0.5" d="M0 30 V15 Q30 3 60 15 V30z"></path><path fill="#2ec0bc" d="M0 30 V12 Q30 17 55 12 T100 11 V30z"></path></svg>
	</div>
</div>
<div class="col-md-2"></div>
<div class="col-md-8 pt_page_margin">
	<div class="content pt_shadow">
		<div class="col-md-12 pt_import_vdo">
			<div class="col-md-12" id="fetch-form">
				<form action="" class="form-horizontal" method="POST">
					<div class="text-center"><svg fill="#999" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg" class="feather feather-import"><path d="M17,13L12,18L7,13H10V9H14V13M19.35,10.03C18.67,6.59 15.64,4 12,4C9.11,4 6.6,5.64 5.35,8.03C2.34,8.36 0,10.9 0,14A6,6 0 0,0 6,20H19A5,5 0 0,0 24,15C24,12.36 21.95,10.22 19.35,10.03Z" /></svg></div>
					<div class="row">
						<div class="col-md-9">
							<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-link"><path d="M15 7h3a5 5 0 0 1 5 5 5 5 0 0 1-5 5h-3m-6 0H6a5 5 0 0 1-5-5 5 5 0 0 1 5-5h3"></path><line x1="8" y1="12" x2="16" y2="12"></line></svg>
							<input id="url" name="url" type="text" placeholder="{{LANG video_url}}" class="form-control input-md"> 
							<span class="help-block">{{LANG url_desc}}, mp4</span>
						</div>
						<div class="col-md-3">
							<button type="button" class="btn btn-main fetch-url">{{LANG fetch_Video}}</button>
						</div>
					</div>
					<div class="clear"></div>
				</form>
			</div>
			<div class="col-md-12 import-form-content hidden">
				<div class="row">
					<div class="col-md-7" id="import-form">
						<form action="" class="form-horizontal setting-panel pt_forms" method="POST" id="submit-imported-video">
							<div class="form-group">
								<label class="col-md-12" for="title">{{LANG video_title}}</label>  
								<div class="col-md-12">
									<input id="title" name="title" type="text" placeholder="" class="form-control input-md">
									<span class="help-block">{{LANG video_title_help}}</span>
								</div>
							</div>
							<div class="form-group">
								<label class="col-md-12" for="description">{{LANG video_descritpion}}</label>  
								<div class="col-md-12">
									<textarea name="description" id="description" cols="30" rows="8" class="form-control"></textarea>
								</div>
							</div>
							<div class="form-group">
								<label class="col-md-12" for="category_id">{{LANG category}}</label>  
								<div class="col-md-12">
									<select name="category_id" id="category_id" class="form-control">
										<?php foreach($pt->categories as $key => $category) {?>
											<option value="<?php echo $key?>"><?php echo $category?></option>
										<?php } ?>
									</select>
								</div>
							</div>
							<div class="form-group">
								<label class="col-md-12" for="tags">{{LANG tags}}</label>  
								<div class="col-md-12">
									<input id="mySingleFieldTags" name="tags" type="text" placeholder="" class="form-control input-md">
									<span class="help-block">{{LANG tags_help}}</span>
								</div>
							</div>
							<input type="hidden" name="thumbnail-image" class="thumbnail">
							<input type="hidden" name="video-type" class="type">
							<input type="hidden" name="video-id" class="video-id">
							<input type="hidden" name="duration" class="duration">
							<input id="thumbnail" name="thumbnail" type="file" accept="image/*" class="hidden">
							<div class="last-sett-btn modal-footer">
								<button type="submit" class="btn btn-main submit-url setting-panel-mdbtn"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-check-circle"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path><polyline points="22 4 12 14.01 9 11.01"></polyline></svg> {{LANG publish}}</button>
							</div>
                     <div class="clear"></div>
               </form>
            </div>
            <div class="col-md-5">
               <div class="thumbnail-preview edit-thumb thumbnail-preview-renderer">
                 <img src="" alt="Picture">
               </div>
               <div class="video-title">
                  <p></p>
               </div>
               <div class="video-description">
                  <p></p>
               </div>
            </div>
         </div>
      </div>
   </div>
   <div class="clear"></div>
</div>
</div>
<div class="col-md-2"></div>
<script>
$(function () {
   $('.edit-thumb').on('click', function(event) {
      $('#thumbnail').trigger('click');
   });

   $('#thumbnail').on('change', function(event) {
      readURL(this);
   });

   $('#submit-imported-video').ajaxForm({
       url: '{{LINK aj/submit-imported-video}}?hash=' + $('.main_session').val(),
       beforeSend: function() {
         $('.submit-url').attr('disabled', true);
         $('.submit-url').text("{{LANG please_wait}}");
       },
       success: function(data) {
         if (data.status == 200) {
            window.location.href = data.link;
         } 
         else {
            $('.submit-url').attr('disabled', false);
             $('.submit-url').html('<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-check-circle"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path><polyline points="22 4 12 14.01 9 11.01"></polyline></svg> {{LANG publish}}');
			Snackbar.show({text: '<div>'+ data.message +'</div>'});
         }
       }
   });
   $('#description').keyup(function(event) {
      str = $(this).val().replace(/(?:\r\n|\r|\n)/g, '<br />');
      $('.video-description p').html(str);
   });
   $('#title').keyup(function(event) {
      $('.video-title p').html($(this).val());
   });
   $('#mySingleFieldTags').tagit();
	$('.fetch-url').on('click', function () {
		$(this).text("{{LANG please_wait}}");
		$.post('{{CONFIG site_url}}/aj/fetch-video', {link: $('#url').val()}, function(data, textStatus, xhr) {
			$('.fetch-url').text('{{LANG fetch_Video}}');
			if (data.status == 200) {
            if ($("#mySingleFieldTags").val()) {
               $(".tagit-choice").remove();
            }
            $('.alert-danger').empty();
				$('#title').val(data.title);
            $('.video-title p').html(data.title);
            $('#description').val(data.description);
            $('.video-description p').html(data.description_br);
            $('#mySingleFieldTags').val(data.tags);
            $('.duration').val(data.duration);
            var partsOfStr = data.tags.split(',');
            for (i = 0; i < partsOfStr.length; i++) {
               $('#mySingleFieldTags').tagit("createTag", partsOfStr[i]);
            }
            $('.thumbnail').val(data.thumbnail);
            
            $('.thumbnail-preview img').attr('src', data.full_thumb);
            $('.video-id').val(data.video_id);
            $('.type').val(data.type);
            $('.import-form-content').removeClass('hidden');
			$('.pt_page_margin').addClass('w-100');
			} 

         else if(data.status == 401){
            swal({
               title: '{{LANG oops}}!',
               text: "{{LANG import_limit_reached}}!",
               type: 'info',
               showCancelButton: true,
               confirmButtonColor: '#3085d6',
               cancelButtonColor: '#d33',
               confirmButtonText: '{{LANG upgrade_now}}',
               cancelButtonText: '{{LANG cancel}}',
               confirmButtonClass: 'btn btn-success margin-right',
               cancelButtonClass: 'btn',
               buttonsStyling: false
            }).then(function(){
               window.location.href = '{{LINK go_pro}}';
            },
            function() {
               window.location.href = '{{LINK }}';
            });
            
         }
         else {
				Snackbar.show({text: '<div>'+ data.message +'</div>'});
			}
		},dataType = 'json');
	});
});
</script>