<div class="page-margin">
	<div class="row">
		<div class="col-md-2 leftcol"><?php echo Wo_LoadPage("sidebar/left-sidebar"); ?></div>
		<div class="col-md-10 singlecol">
			<form class="form form-horizontal create-article-form" method="post" id="update-blog" action="#">
				<div class="page-margin mt-0">
					<div class="wow_content popular_posts_hdr flex">
						<h2><svg width="17" height="18" viewBox="0 0 17 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.61171 6.79433C2.12446 4.55719 3.83126 2.8104 6.0172 2.28564C7.59585 1.90666 9.23879 1.90666 10.8174 2.28564C13.0034 2.8104 14.7102 4.55719 15.2229 6.79434C15.5932 8.40998 15.5932 10.0914 15.2229 11.707C14.7102 13.9442 13.0034 15.691 10.8174 16.2157C9.23878 16.5947 7.59585 16.5947 6.0172 16.2157C3.83126 15.691 2.12446 13.9442 1.61171 11.707C1.24141 10.0914 1.24141 8.40998 1.61171 6.79433Z" class="icon_main" stroke-width="1.5" stroke-linecap="round"></path><path d="M5.14258 1.5V3.59479M11.6924 1.5V3.59479M5.96131 11.7645H8.41751M5.96131 9.25071H10.8737" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path></svg>&nbsp;<?php echo $wo['lang']['edit'];?></h2>
						<div class="btnss">
							<a class="btn btn-mat btn-default" data-ajax="?link1=my-blogs" href="<?php echo Wo_SeoLink('index.php?link1=my-blogs');?>"><?php echo $wo['lang']['cancel'];?></a>
							<button class="btn btn-main btn-mat add_wow_loader" type="submit"><?php echo $wo['lang']['save']; ?></button>
						</div>
					</div>
				</div>

				<div class="page-margin wow_content wow_sett_content">
					<div class="create-article-alerts" id="blog-alert"></div>
					
					<div class="wow_form_fields">
						<label for="blog_title"><?php echo $wo['lang']['title']; ?></label>
						<input id="blog_title" name="blog_title" type="text" value="<?php echo $wo['article']['title']?>">
					</div>
					<div class="wow_form_fields">
						<label for="new-blog-desc"><?php echo $wo['lang']['description']; ?></label>
						<textarea name="blog_description" id="new-blog-desc" rows="3"><?php echo $wo['article']['description']?></textarea>
					</div>
					<div class="wow_form_fields">
						<label for="blog"><?php echo $wo['lang']['content']; ?></label>
						<textarea name="blog_content" id="blog"><?php echo $wo['article']['content']?></textarea> 
					</div>
					<div class="wow_form_fields">
						<label><?php echo $wo['lang']['thumbnail'];?></label>
						<div class="wow_fcov_image" data-block="thumdrop-zone">
							<div id="wow_fcov_img_holder">
								<img src="<?php echo $wo['article']['thumbnail']; ?>" alt="">
							</div>
							<div class="upload_ad_image" onclick="document.getElementById('thumbnail').click(); return false">
								<div class="upload_ad_image_content">
									<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path fill="currentColor" d="M8.5,13.5L11,16.5L14.5,12L19,18H5M21,19V5C21,3.89 20.1,3 19,3H5A2,2 0 0,0 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19Z"></path></svg> <?php echo $wo['lang']['drop_img_here'] ?> <?php echo $wo['lang']['or']; ?> <?php echo $wo['lang']['browse_to_upload']; ?>
								</div>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-md-6">
							<div class="wow_form_fields">
								<label for="blog_category"><?php echo $wo['lang']['category'] ?></label>
								<select name="blog_category" id="blog_category">
									<option value="0"><?php echo $wo['lang']['category'];?></option>
									<?php foreach ($wo['blog_categories'] as $category_id => $category_name):?>
										<option value="<?php echo $category_id?>" <?php if($category_id == $wo['article']['category']) echo "selected='selected'" ;?> ><?php echo $category_name;?></option>
									<?php endforeach;?>
								</select>
							</div>
						</div>
						<div class="col-md-6">
							<div class="wow_form_fields">
								<label for="blog_tags"><?php echo $wo['lang']['tags']; ?></label>
								<input data-role="tagsinput" value="<?php echo $wo['article']['tags']?>" id="blog_tags" name="blog_tags" type="text" placeholder="<?php echo $wo['lang']['tags'] ?>">
							</div>
						</div>
					</div>
					

					<input type="file" class="hidden" id="thumbnail" name="thumbnail" accept="image/*">
						<input name="image" type="file" id="upload" class="hidden" onchange="">
					<input type="hidden" name="hash_id" value="<?php echo Wo_CreateSession();?>">
				
				</div>
			</form>
		</div>
	</div>
</div>
<script>
 jQuery(document).ready(function($) {

    var thumb_drop_block = $("[data-block='thumdrop-zone']");

    if (typeof(window.FileReader) == 'undefined') {
      thumb_drop_block.find('.error-text-renderer').text('Drag drop is not supported in your browsers!');
    }

    else{
      thumb_drop_block[0].ondragover = function() {
          thumb_drop_block.addClass('hover');
          return false;
      };
          
      thumb_drop_block[0].ondragleave = function() {
          thumb_drop_block.removeClass('hover');
          return false;
      };

      thumb_drop_block[0].ondrop = function(event) {
          event.preventDefault();
          thumb_drop_block.removeClass('hover');
          var file = event.dataTransfer.files;
          $("#thumbnail").prop('files', file);
		  $("#wow_fcov_img_holder").html("<img src='" + window.URL.createObjectURL(event.dataTransfer.files[0]) + "' alt='Picture'>")
      };
    }

    $("#thumbnail").change(function(event) {
	  $("#wow_fcov_img_holder").html("<img src='" + window.URL.createObjectURL(this.files[0]) + "' alt='Picture'>")
    });

    $("#blog_tags").tagsinput({
      maxTags: 15,
    })


    $('#update-blog').ajaxForm({
      url: Wo_Ajax_Requests_File() + '?f=update-blog&blog_id=<?php echo $wo['article']['id'];?>',
      beforeSend: function() {
        $('#update-blog').find('.add_wow_loader').addClass('btn-loading');
      },
      success: function(data) {
        if (data['status'] == 200) {
          $("#blog-alert").html('<div class="alert alert-success">'+ data['message'] +'</div>');
          window.location = data.url;
        } else if (data['message']) {
          $("#blog-alert").html('<div class="alert alert-danger">' + data['message'] + '</div>');
        } 
        $('#update-blog').find('.add_wow_loader').removeClass('btn-loading');
      }
    });

 });

tinymce.init({
      selector: '#blog',
      height: 400,
      plugins: 'anchor autolink charmap codesample emoticons image link lists media searchreplace table visualblocks wordcount',
      toolbar: 'undo redo | blocks fontfamily fontsize | bold italic underline strikethrough | link image media table mergetags | addcomment showcomments | spellcheckdialog a11ycheck typography | align lineheight | checklist numlist bullist indent outdent | emoticons charmap | removeformat',
      tinycomments_mode: 'embedded',
      tinycomments_author: 'Author name',
    file_picker_callback: function(callback, value, meta) {
      if (meta.filetype == 'image') {
        $('#upload').trigger('click');
        $('#upload').on('change', function() {
          var file = this.files[0];
          var reader = new FileReader();
          reader.onload = function(e) {
            callback(e.target.result, {
              alt: ''
            });
          };
          reader.readAsDataURL(file);
        });
      }
    },
});
</script> 