~cyborg/michelangelo

da17041a2978ff484ff84215dd7b94b705a509d4 — cyborg 9 months ago 9f96837
add post_type options
3 files changed, 33 insertions(+), 65 deletions(-)

M assets/css/app.css
M index.php
M template.php
M assets/css/app.css => assets/css/app.css +17 -52
@@ 33,73 33,38 @@ body {
}

.card,
.card-img-top {
.card-img {
    border: none;
    border-radius: 0;
}

.card-body {
    border: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
    visibility: hidden;
    opacity: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity .2s, visibility .2s;
}

.card:hover .card-body {
    visibility: visible;
    opacity: 1;
}

.card-title {
    transition: .2s;
    transform: translateY(1em);
}

.card:hover .card-title {
    transform: translateY(0);
}

.card-img {
    border-radius: 0
}

.page-link {
  color: #dc3545;
  background-color: #202020;
  border: 1px solid #3b3b3b;
    color: #dc3545;
    background-color: #202020;
    border: 1px solid #3b3b3b;
}

.page-link:hover {
  color: #dc3545;
  background-color: #202020;
  border-color: #3b3b3b;
    color: #dc3545;
    background-color: #202020;
    border-color: #3b3b3b;
}

.page-link:focus {
  background-color: #202020;
  box-shadow: 0 0 0 .2rem rgba(220, 53, 69, .25);
    background-color: #202020;
    box-shadow: 0 0 0 .2rem rgba(220, 53, 69, .25);
}

.page-item.disabled .page-link {
  color: #dc3545;
  opacity: 0.5;
  pointer-events: none;
  cursor: auto;
  background-color: #202020;
  border-color: #3b3b3b;
    color: #dc3545;
    opacity: 0.5;
    pointer-events: none;
    cursor: auto;
    background-color: #202020;
    border-color: #3b3b3b;
}

.page-item.active .page-link {
  background-color: #dc3545;
  border-color: #dc3545;
    background-color: #dc3545;
    border-color: #dc3545;
}

M index.php => index.php +11 -11
@@ 101,9 101,9 @@ function authentication() {
    return $client;
}

function get_dashboard_posts($client, $post_start, $limit) {
function get_dashboard_posts($client, $post_start, $limit, $post_type='photo') {
    // Call the function for dashboard posts
    $dashboard_posts = $client->getDashboardPosts(array('limit' => $limit, 'offset' => $post_start, 'reblog_info' => true));
    $dashboard_posts = $client->getDashboardPosts(array('limit' => $limit, 'offset' => $post_start, 'type' => $post_type));
    // Open the row that will hold all photos/videos
    $post_row = '<div class="row">';
    // For each post returned by Tumblr, create the HTML content


@@ 170,11 170,8 @@ function get_tagged_posts($client, $tag) {
            $post_row .= <<<EOD
                <div class="col-sm-6 col-lg-4 mb-4">
                    <div class="card" data-type="$type" data-id="$id">
                        <img class="card-img h-100 w-100" src="$url" loading="lazy">
                        <a data-fancybox="gallery" aria-label="Open gallery viewer" href="$url">
                            <div class="card-body">
                                <h5 class="card-title">$caption</h5>
                            </div>
                            <img class="card-img h-100 w-100" src="$url" loading="lazy">
                        </a>
                    </div>
                </div>


@@ 190,11 187,8 @@ function get_tagged_posts($client, $tag) {
            $post_row .= <<<EOD
                <div class="col-sm-6 col-lg-4 mb-4">
                    <div class="card" data-type="$type" data-id="$id">
                        <video class="card-img h-100 w-100" controls autoplay poster="$thumbnail"><source src="$url"></source></video>
                        <a data-fancybox="gallery" aria-label="Open gallery viewer" href="$url">
                            <div class="card-body">
                                <h5 class="card-title">$caption</h5>
                            </div>
                            <video class="card-img h-100 w-100" controls autoplay poster="$thumbnail"><source src="$url"></source></video>
                        </a>
                    </div>
                </div>


@@ 222,8 216,14 @@ function gallery($params=null) {
    }
    $post_start = (($page - 1) * 20) + 1;
    $limit = 20;
    // Check for specific post type in the URL
    if (not_blank($_GET['post_type'])) {
      $post_type = $_GET['post_type'];
    } else {
      $post_type = 'photo';
    }
    // Call the get_dashboard_posts function and load some posts!
    $posts = get_dashboard_posts($client, $post_start, $limit);
    $posts = get_dashboard_posts($client, $post_start, $limit, $post_type);
    // Set page variables
    $page_title = 'Michelangelo';
    $header = $blog_name;

M template.php => template.php +5 -2
@@ 43,7 43,10 @@
                        <a class="nav-link active" href="/"></i>Home</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="/search/">Search</a>
                        <a class="nav-link" href="/?post_type=photo">Photos</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="/?post_type=video">Videos</a>
                    </li>
                </ul>
            </div>


@@ 53,7 56,7 @@
    <div class="main container">

        <p class="h1 text-center my-4">
          <?php echo $blog_name; ?>
            <?php echo $blog_name; ?>
        </p>

        <?php echo $posts; ?>