<div class="row">
	<div class="col-md-1"></div>
	<div class="col-md-10">
		<div class="content pt_shadow">
			<div class="col-md-12">
				<div class="upload-head">
					<h4 class="edit-video-title"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path fill="currentColor" d="M9.243 19H21v2H3v-4.243l9.9-9.9 4.242 4.244L9.242 19zm5.07-13.556l2.122-2.122a1 1 0 0 1 1.414 0l2.829 2.829a1 1 0 0 1 0 1.414l-2.122 2.121-4.242-4.242z"/></svg> {{LANG edit_article}}</h4>
					<hr>
				</div>
				<div id="video-success" class="alert alert-success"></div>
				<div class="errors alert alert-danger"></div>
				<div class="pt_forms_large_btns" id="edit-form">
					<form action="" class="form-horizontal pt_forms" method="POST">
						<div class="pp_mat_input">
							<input id="title" name="title" type="text" value="{{TITLE}}">
							<label for="title">{{LANG title}}</label>
						</div>
						<div class="pp_mat_input">
							<textarea name="description" id="description" cols="30" rows="5">{{DESC}}</textarea>
							<label for="description">{{LANG descritpion}}</label>
						</div>
						<div class="pp_mat_input">
							<textarea name="text" id="text">{{TEXT}}</textarea>
							<label for="text" style="z-index: 1;">{{LANG the_article}}</label>  
						</div>
						<div class="pp_mat_input">
							<select class="selectpicker show-menu-arrow" name="category" id="category">
								<option value="" disabled>{{LANG category}}</option>
								<?php foreach($pt->categories as $key => $category) { $selected = ($pt->article->category == $key) ? 'selected' : '';?>
									<option value="<?php echo $key?>" <?php echo $selected?>><?php echo $category?></option>
								<?php } ?>
							</select>
						</div>
						<div class="pp_mat_input">
							<input id="mySingleFieldTags" name="tags" type="text" value="{{TAGS}}" placeholder=" ">
							<label for="tags">{{LANG tags}}</label>
							<span class="help-block">{{LANG tags_help}}</span>
						</div>
						<div class="pp_mat_input">
							<div class="article_image_renderer" id="image-renderer" onclick="document.getElementById('thumbnail').click(); return false">
								<img src="{{IMAGE}}" alt="{{TITLE}}">
							</div>
						</div>
						<div class="form-group hidden">
							<label class="col-md-12" for="thumbnail">{{LANG thumbnail}}</label>  
							<div class="col-md-12">
								<input id="thumbnail" name="image" type="file" accept="image/*">
								<span class="help-block">jpg, png, gif</span>
							</div>
						</div>
						<div class="text-center">
							<button type="button" class="btn btn-delete setting-panel-mdbtn" onclick="PT_DeleteArticle({{ID}});">{{LANG delete}}</button>
							<button type="submit" id="submit-btn" class="btn btn-main 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>
						<input type="hidden" name="id" class="id" value="{{ID}}">
					</form>
				</div>
				<div class="clear"></div>
			</div>
			<div class="clear"></div>
		</div>
	</div>
	<div class="col-md-1"></div>
</div>

<script src="{{CONFIG theme_url}}/js/tinymce/js/tinymce/tinymce.min.js"></script>
<script>
	tinymce.init({
          selector: '#text',  // change this value according to your HTML
          auto_focus: 'element1',
          relative_urls: false,
          remove_script_host: false,
          height:500,
          toolbar: 'insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image  uploadImages |  preview media fullpage | forecolor backcolor emoticons',
          plugins: [
              'advlist autolink link image  lists charmap  preview hr anchor pagebreak spellchecker',
              'searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking',
              'save table contextmenu directionality emoticons template paste textcolor'
          ]
        });
function PT_DeleteArticle(id) {
	  if (!id) {
	    return false;
	  }
	  if (!confirm("{{LANG delete_article_text}}")) {
	    return false;
	  }
	  $.post('{{LINK aj/articles/delete-article}}', {id: id}, function(data, textStatus, xhr) {
	    if (data.status == 200) {
	        window.location.href = '{{LINK my_articles}}';
	    }
	  });
	}

$(function () {
	$('#thumbnail').on('change', function(event) {
		$("#image-renderer").html("<img src='" + window.URL.createObjectURL(this.files[0]) + "' alt='Picture'>");
	});
	$("#mySingleFieldTags").tagit({
		allowSpaces: true
	});
	$('#edit-form form').ajaxForm({
	    url: '{{LINK aj/articles/update-article}}?hash=' + $('.main_session').val(),
	    beforeSend: function() {
	    	$('#submit-btn').attr('disabled', true);
	    	$('#submit-btn').text("{{LANG please_wait}}");
	    },
	    success: function(data) {
	    	if (data.status == 200) {
	    		$('#video-success').html("{{LANG reviewed_article}}");
                window.location.href = data.url;
	    	} else {
	    		$('#submit-btn').attr('disabled', false);
	    	    $('#submit-btn').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}}');
	    		$('.errors').removeClass('hidden').html(data.message);
	    	}
	    }
	});
});
</script>