<?php

if ( post_password_required() ) {
	return;
}

function mirel_comment($comment, $args, $depth) {
	$comment_id = $comment->comment_ID; 
	$has_avatar = get_avatar($comment, '300');
	$css_class = 'comment-item clearfix';

	if($has_avatar) {
		$css_class .= ' with-avatar';
	} ?>
	<li <?php comment_class($css_class) ?> id="comment-<?php echo esc_attr($comment_id) ?>">
		<?php if($has_avatar) { ?>
			<div class="image" style="background-image: url(<?php echo get_avatar_url($comment, '300') ?>)"></div>
		<?php } ?>
		<div class="ct">
			<div class="top-block">
				<div class="top">
					<div class="name"><?php comment_author(); ?></div>
					<div class="sep"><?php echo esc_html__('/', 'mirel') ?></div>
					<div class="time"><?php echo get_comment_date('j M Y, '.get_option( 'time_format' ), $comment_id); ?></div>
				</div>
				<a href="#" class="replytocom" data-id="<?php echo esc_attr(get_comment_ID()) ?>">
					<span><?php echo esc_html__( 'Reply', 'mirel' ); ?></span>
					<span class="mirel-m-icon">
			<svg width="11px" height="11px" viewBox="0 0 10.946 10.945"><g><path d="m.46 10.485 9.83-9.83"></path><path d="M1.771.655h9"></path><path d="M10.29 9.175V1"></path></g><g><path d="m.46 10.485 9.83-9.83"></path><path d="M1.771.655h9"></path><path d="M10.29 9.175V1"></path></g>
			</svg> </span>
				</a>
			</div>
			<div class="content"><?php echo comment_text() ?></div>
		</div>
	</li>
<?php } ?>

<div id="comments" class="comments-area container">

	<?php if ( have_comments() ) : ?>
		<div class="comment-items-wrap">
			<h6 class="comment-title"><?php echo esc_html__('Comments', 'mirel') ?></h6>
			<ul class="comment-items">
				<?php wp_list_comments(array('callback' => 'mirel_comment')); ?>
			</ul>
			<?php if(paginate_comments_links()) { ?>
			<div class="pagination">
				<?php echo paginate_comments_links(); ?>
			</div>
			<?php } ?>
		</div>
	<?php endif;

	if ( ! comments_open() && get_comments_number() && post_type_supports( get_post_type(), 'comments' ) ) : ?>

		<p class="no-comments"><?php echo esc_html__( 'comments are closed.', 'mirel' ); ?></p>

<?php endif;
	
	add_filter('comment_form_fields', 'mirel_reorder_comment_fields' );
	function mirel_reorder_comment_fields( $fields ){

		$new_fields = array(); 

		//'author','email','url','comment'
		$myorder = array('author','email','comment');

		foreach( $myorder as $key ){
			$new_fields[ $key ] = $fields[ $key ];
			unset( $fields[ $key ] );
		}

		if( $fields )
			foreach( $fields as $key => $val )
				$new_fields[ $key ] = $val;

		unset($new_fields['url']);

		return $new_fields;
	}

	$post_id = get_the_ID();
	?>

	<div id="commentform-area">
		<?php comment_form(array(
			'fields' => array(
				'author' => '<div class="col-12 col-sm-6"><div class="input-row"><input id="author" class="style1" placeholder="'. esc_attr__( 'Your Name*','mirel' ) .'" name="author" type="text" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30" /></div></div>',
				'email'  => '<div class="col-12 col-sm-6"><div class="input-row"><input id="email" class="style1" placeholder="'. esc_attr__( 'Your E-mail*','mirel' ) .'" name="email" type="text" value="' . esc_attr(  $commenter['comment_author_email'] ) . '" size="30" /></div></div>',
				'url'    => '<div class="col-12 col-sm-4"><div class="input-row"><input id="url" class="style1" placeholder="'. esc_attr__( 'Your website','mirel' ) .'" name="url" type="text" value="' . esc_attr(  $commenter['comment_author_url'] ) . '" size="30" /></div></div>',
			),
			'logged_in_as'         => '<div class="col-12 logged-links"><p>' . sprintf( wp_kses(__( '<a href="%1$s" aria-label="Logged in as %2$s. Edit your profile.">Logged in as %2$s</a> <a href="%3$s" class="logout">Log out</a>','mirel' ), 'post'), get_edit_user_link(), $user_identity, wp_logout_url( apply_filters( 'the_permalink', get_permalink( $post_id ) ) ) ) . '</p></div>',
			'class_form'           => 'comment-form row',
			'comment_field'        => '<div class="col-12"><div class="input-row"><textarea id="comment" class="style1" placeholder="'. esc_attr__( 'Your Comment*','mirel' ) .'" name="comment" rows="10" maxlength="65525" required="required"></textarea></div></div>',
			'label_submit'         => esc_html__( 'Send' ,'mirel'),
			'submit_button' => '<button name="%1$s" type="submit" id="%2$s" class="button-style1 filled" data-filled-cursor="true"><em class="border"></em><span>%4$s</span><span class="mirel-m-icon">
			<svg width="11px" height="11px" viewBox="0 0 10.946 10.945"><g><path d="m.46 10.485 9.83-9.83"></path><path d="M1.771.655h9"></path><path d="M10.29 9.175V1"></path></g><g><path d="m.46 10.485 9.83-9.83"></path><path d="M1.771.655h9"></path><path d="M10.29 9.175V1"></path></g>
			</svg> </span></button>',
			'submit_field'         => '<div class="col-12">%1$s %2$s</div>',
			'comment_notes_before' => '',
			'title_reply_before'   => '<h6 class="comment-title"><span>',
			'title_reply_after'    => '</span></h6>',
			'title_reply'          => esc_html__( 'Leave a Comment', 'mirel' ),
		)) ?>
	</div>
</div>