<?php get_header(); ?>


<main class="">
    <section class="news">
        <div class="container">
            <h1><?= __('Novosti', 'dinamo'); ?></h1>
            <div class="font-controls">
                <button class="font-controls__increment">A</button>
                <button class="font-controls__decrement">A</button>
            </div>
            <div class="news-list">
                <div class="row">



<?php
if( have_posts() ) :
    while( have_posts() ) : the_post();
        $thumbnail_id = get_post_thumbnail_id( $post->ID );
        $image_alt = get_image_alt($thumbnail_id);
        ?>


        <div class="col-12 col-md-6 col-lg-4">
            <article class="news-box">
                <a href="<?= get_the_permalink(); ?>" class="news-box__img-wrap">
                    <?php if(has_post_thumbnail()){ ?>
                        <img data-src="<?= get_the_post_thumbnail_url(null, '9x6_small'); ?>" class="lazyload news-box__img" alt="<?= $image_alt; ?>">
                    <?php } ?>
                </a>
                <div class="news-box__content">
                    <h2><a href="<?= get_the_permalink(); ?>"><?= the_title(); ?></a></h2>
                    <time datetime="<?= get_the_date('Y-m-d') ?>"><?= get_the_date('d.m.Y.') ?></time>
                    <p>  <?= get_the_excerpt(); ?></p>
                    <div class="news-box__cta">
                        <a href="<?= get_the_permalink(); ?>" class="btn btn--dark"><?= __('Saznaj više','dinamo');?></a>
                        <div class="share-box-wrap">
                            <svg class="news-box__share-icon js-share-box icon-share"><use xlink:href="<?php echo THEMEROOT; ?>frontend/icons/icons.svg#icon-share"></use></svg>
                            <div class="share-box">
                                <a href="#Share" class="share-box__link js-share-box-facebook">
                                    <svg class="share-box__img icon-facebook"><use xlink:href="<?php echo THEMEROOT; ?>frontend/icons/icons.svg#icon-facebook"></use></svg>
                                </a>
                                <a href="#Share" class="share-box__link js-share-box-twitter">
                                    <svg class="share-box__img icon-twitter"><use xlink:href="<?php echo THEMEROOT; ?>frontend/icons/icons.svg#icon-twitter"></use></svg>
                                </a>
                                <a href="#Share" class="share-box__link js-share-box-linkedin">
                                    <svg class="share-box__img icon-linkedin"><use xlink:href="<?php echo THEMEROOT; ?>frontend/icons/icons.svg#icon-linkedin"></use></svg>
                                </a>
                                <a href="mailto:?subject=<?= the_title(); ?>&amp;body=<?= get_the_permalink(); ?>" class="share-box__link js-share-box-mail">
                                    <svg class="share-box__img icon-mail"><use xlink:href="<?php echo THEMEROOT; ?>frontend/icons/icons.svg#icon-mail"></use></svg>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </article>
        </div>
        <?php
    endwhile;
endif;
?>
                </div>
            </div>
            <?php
            $paged            = (get_query_var('paged')) ? get_query_var('paged') : 1;
            $total_post_count = $wp_query->found_posts;

            $published_posts  = $total_post_count;
            $posts_per_page   = get_option( 'posts_per_page' );
            $total_pages      = ceil( $published_posts / $posts_per_page );

            $pagination_object = get_pagination($paged, $total_pages);

            ?>

            <div class="pagination">

                <?php if($paged > 1){ ?>
                <a href="<?= get_previous_posts_page_link(); ?>" class="previous">
                    <img class="pagination__icon-left" src="<?php echo THEMEROOT; ?>frontend/img/icons/angle-left.svg" alt="">
                </a>
                <?php } ?>

                <?php if($pagination_object["has_more_start"]) { ?>
                    <?php $first_page = $pagination_object["pages_before_current"][0]; ?>
                    <a href="<?= get_pagenum_link($first_page); ?>" class="page "><?= $first_page; ?></a>                
                    <span>...</span>
                <?php } ?>

                <?php foreach($pagination_object["pages_before_current"] as $page_obj){ ?>
                    <?php if($pagination_object["has_more_start"] && $page_obj < $paged - 2) continue; ?>
                    <a href="<?= get_pagenum_link($page_obj) ?>" class="page"><?= $page_obj; ?></a>
                <?php } ?>

                <a href="<?= get_pagenum_link($paged) ?>" class="page active"><?= $paged; ?></a>

                <?php foreach($pagination_object["pages_after_current"] as $page_obj){ ?>
                    <?php if($pagination_object["has_more_end"] && $page_obj > $paged + 2) continue; ?>
                    <a href="<?= get_pagenum_link($page_obj) ?>" class="page"><?= $page_obj; ?></a>
                <?php } ?>

                <?php if($pagination_object["has_more_end"]) { ?>              
                    <span>...</span>
                    <?php $last_page = end($pagination_object["pages_after_current"]); ?>
                    <a href="<?= get_pagenum_link($last_page); ?>" class="page "><?= $last_page; ?></a>  
                <?php } ?>

                <?php if($paged < $total_pages){ ?>
                <a href="<?= get_next_posts_page_link(); ?>" class="next">
                    <img class="pagination__icon-right" src="<?php echo THEMEROOT; ?>frontend/img/icons/angle-right.svg" alt="">
                </a>
                <?php } ?>

            </div>
        </div>
    </section>
</main>

<?php get_footer(); ?>