<div class="col-md-4 wow fadeInUpBig">
    <div class="card card-cascade mb-4 z-depth-5">
        <div class="view overlay zoom">

            <?php
                if($xenforoItem["image"] == true){
                    if($xenforoItem["images"] == 1) {
                        echo '<img class="card-img-top rounded hoverable" src="assets/img/portfolio/xenforo/'. $xenforoItem["id"] .'.png">';
                    } else {
                        echo '<img class="card-img-top rounded hoverable" src="assets/img/portfolio/xenforo/'. $xenforoItem["id"] .'-'. rand(1,$xenforoItem["images"]) .'.png">';
                    }
                } else {
                    echo '<img class="card-img-top rounded hoverable" src="assets/img/portfolio/xenforo/NotFound.png">';
                }
            ?>

        </div>

        <div class="card-body card-body-cascade text-center">

            <h4 class="card-title">
                <strong><?php echo $xenforoItem["title"]; ?></strong>
            </h4>

            <div class="btn-toolbar justify-content-center">
                <div class="text-center btn-group">

                    <?php
                        if($xenforoItem["image"] == true) {
                            echo '<a class="btn btn-primary font-weight-bold" data-toggle="modal" data-target="#'. $xenforoItem["id"] .'Modal"><i class="fas fa-search-plus"></i> Zoom</a>';
                        } else {
                            echo '<a class="btn btn-danger font-weight-bold disabled"><i class="fas fa-search-plus"></i> Zoom</a>';
                        }

                        if($xenforoItem["online"] == true) {
                            echo '<a class="btn btn-primary font-weight-bold" target="_blank" href="'. $xenforoItem["href"] .'"><i class="fas fa-link"></i> Visit</a>';
                        } else {
                            echo '<a class="btn btn-danger font-weight-bold disabled"><i class="fas fa-unlink"></i> Offline</a>';
                        }
                    ?>

                </div>
            </div>
        </div>
    </div>
</div>

<?php
    if($xenforoItem["image"] == true) {
?>
    <div class="modal fade" id="<?php echo $xenforoItem["id"]; ?>Modal" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-fluid" role="document">
            <div class="modal-content container">

                <div class="modal-header justify-content-center primary-color-dark">
                    <h4 class="modal-title white-text"><?php echo $xenforoItem["id"]; ?> screenshot</h4>
                </div>

                <?php

                    echo '<div class="modal-body">';

                        if($xenforoItem["images"] == 1) {
                            echo '<img class="card-img-top" src="assets/img/portfolio/xenforo/'. $xenforoItem["id"] .'.png">';
                        } else {

                            echo '<div id="'. $xenforoItem["id"] .'Carousel" class="carousel slide" data-ride="carousel">';
                                echo '<div class="carousel-inner">';

                                    for($i = 0; $i < $xenforoItem["images"]; $i++) {
                                        if($i === 0) {
                                            echo '<div class="carousel-item active">';
                                        } else {
                                            echo '<div class="carousel-item">';
                                        }

                                            echo '<img class="card-img-top" src="assets/img/portfolio/xenforo/'. $xenforoItem["id"] .'-'. $i .'.png">';
                                        echo '</div>';
                                    }

                                echo '</div>';
                            echo '</div>';

                            }


                    echo '</div>';

                    if($xenforoItem["images"] > 1) {
                ?>
                    <div class="btn-toolbar justify-content-center">
                        <div class="text-center btn-group">
                            <button type="button" class="btn btn-primary" href="#<?php echo $xenforoItem["id"]; ?>Carousel" data-slide="prev"><i class="fas fa-chevron-circle-left"></i> Prev</button>
                            <button type="button" class="btn btn-primary" data-dismiss="modal"><i class="fas fa-search-minus"></i> Close</button>
                            <button type="button" class="btn btn-primary" href="#<?php echo $xenforoItem["id"]; ?>Carousel" data-slide="next"><i class="fas fa-chevron-circle-right"></i> Next</button>
                        </div>
                    </div>
                <?php
                    } else {
                ?>
                    <div class="btn-toolbar justify-content-center">
                        <div class="text-center btn-group">
                            <button type="button" class="btn btn-primary" data-dismiss="modal"><i class="fas fa-search-minus"></i> Close</button>
                        </div>
                    </div>
                <?php
                    }
                ?>

            </div>
        </div>
    </div>

<?php
    }
?>