<?php

/**
 * This file is part of JohnCMS Content Management System.
 *
 * @copyright JohnCMS Community
 * @license   https://opensource.org/licenses/GPL-3.0 GPL-3.0
 * @link      https://johncms.com JohnCMS Project
 */

use Albums\Photo;

/**
 * @var $title
 * @var $page_title
 * @var $data
 * @var $photo Photo
 */

$this->layout(
    'system::layout/default',
    [
        'title'      => $title,
        'page_title' => $page_title,
    ]
);
?>
<?php if (empty($data['photos'])): ?>
    <?= $this->fetch(
        'system::app/alert',
        [
            'alert_type' => 'alert-info',
            'alert'      => __('The list is empty'),
        ]
    ) ?>
<?php endif; ?>

<?php if ($data['has_add_photo']): ?>
    <div class="mb-3">
        <a href="./image_upload?al=<?= $data['album']['id'] ?>&amp;user=<?= $data['album']['user_id'] ?>"
           class="btn btn-primary"
        ><?= __('Add image') ?></a>
    </div>
<?php endif; ?>

<div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 row-cols-lg-3">
    <?php foreach ($data['photos'] as $photo): ?>
        <div class="col mb-4">
            <div class="card py-0 h-100 overflow-hidden">
                <a href="<?= $photo->detail_url ?>">
                    <div class="album-photo" style="background: url('<?= $photo->preview_picture ?>');"></div>
                </a>
                <div class="card-body d-flex px-3 flex-column justify-content-between">
                    <?php if ($photo->preview_text): ?>
                        <p class="card-text"><?= $photo->preview_text ?></p>
                    <?php endif ?>
                    <?php if (! empty($photo->user_name || ! empty($photo->album_name))): ?>
                        <div class="small">
                            <span class="text-nowrap pr-2">
                                <?= __('User:') ?> <a href="<?= $photo->user_albums_url ?>"><?= $photo->user_name ?></a>
                            </span>
                            <span class="text-nowrap">
                                <?= __('Album:') ?> <a href="<?= $photo->user_album_url ?>"><?= $photo->album_name ?></a>
                            </span>
                        </div>
                    <?php endif; ?>
                </div>
                <div class="card-footer d-flex justify-content-between">
                    <div>
                        <!-- Vote -->
                        <?php if ($photo->can_vote): ?>
                            <a href="<?= $photo->like_url ?>" class="text-decoration-none pr-2">
                                <svg class="icon download-button-icon mt-n2">
                                    <use xlink:href="<?= $this->asset('icons/sprite.svg') ?>#like"></use>
                                </svg>
                                <span><?= $photo->vote_plus ?></span>
                            </a>
                            <a href="<?= $photo->dislike_url ?>" class="text-decoration-none pr-2">
                                <svg class="icon download-button-icon mr-1">
                                    <use xlink:href="<?= $this->asset('icons/sprite.svg') ?>#dislike"></use>
                                </svg>
                                <span><?= $photo->vote_minus ?></span>
                            </a>
                        <?php else: ?>
                            <div class="d-inline pr-2 text-muted">
                                <svg class="icon download-button-icon mt-n2">
                                    <use xlink:href="<?= $this->asset('icons/sprite.svg') ?>#like"></use>
                                </svg>
                                <span><?= $photo->vote_plus ?></span>
                            </div>
                            <div class="d-inline pr-2 text-muted">
                                <svg class="icon download-button-icon mr-1">
                                    <use xlink:href="<?= $this->asset('icons/sprite.svg') ?>#dislike"></use>
                                </svg>
                                <span><?= $photo->vote_minus ?></span>
                            </div>
                        <?php endif; ?>
                        <!-- // Vote -->
                        <a href="<?= $photo->comments_url ?>" class="text-decoration-none">
                            <svg class="icon download-button-icon" style="margin-top: -2px;">
                                <use xlink:href="<?= $this->asset('icons/sprite.svg') ?>#forum"></use>
                            </svg>
                            <span><?= $photo->comm_count ?></span>
                        </a>
                    </div>
                    <div>
                        <div class="text-muted">
                            <svg class="icon download-button-icon mt-n1">
                                <use xlink:href="<?= $this->asset('icons/sprite.svg') ?>#eye"></use>
                            </svg>
                            <span><?= $photo->views ?></span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    <?php endforeach; ?>
</div>

<?php if ($data['total'] > $data['per_page']): ?>
    <div>
        <?= $data['pagination'] ?>
    </div>
<?php endif; ?>

<?php if ($data['total'] > 0): ?>
    <div><?= __('Total') ?>: <?= $data['total'] ?></div>
<?php endif; ?>
