array_slice page numbering - php

Question

This script takes every image in a folder and shows it on a webpage. Is there a way to show like an simple page number like 1,2,3,4,5 every 10 images or so? everything I tried thus far is not working.
<?php
# To prevent browser error output
header('Content-Type: text/javascript; charset=UTF-8');
# Path to image folder
$imagefolder = 'img/';
# Show only these file types in the image folder
$imagetypes = '{*.jpg,*.JPG,*.JPEG,*.png,*.PNG,*.gif,*.GIF}';
# Add images to array
$images = glob($imagefolder.$imagetypes, GLOB_BRACE);
# Sort the images based on its 'last modified' time stamp
$sortedImages = array();
$count = count($images);
for ($i = 0; $i < $count; $i++) {
$sortedImages[date ('YmdHis', filemtime($images[$i])).$i] = $images[$i];
}
# Set to 'false' if you want the oldest images to appear first
$newest_images_first = true;
# Sort images in array
if($newest_images_first) {
krsort($sortedImages);
} else {
ksort($sortedImages);
}
# Generate the HTML output
writeHtml('<ul class="ins-imgs">');
foreach ($sortedImages as $image) {
# Get the name of the image, stripped from image folder path and file type extension
$name = 'Image name: '.substr($image,strlen($imagefolder),strpos($image, '.')-strlen($imagefolder));
# Get the 'last modified' time stamp, make it human readable
$last_modified = '(last modified: '.date('F d Y H:i:s', filemtime($image)).')';
# Begin adding
writeHtml('<li class="ins-imgs-li">');
writeHtml('<div class="ins-imgs-label">'.$name.' '.$last_modified.'</div>');
writeHtml('<div class="ins-imgs-img"><a name="'.$image.'" href="#'.$image.'">');
writeHtml('<img src="'.$image.'" alt="'. $name.'" title="'. $name.'">');
writeHtml('</a></div>');
writeHtml('</li>');
}
writeHtml('</ul>');
writeHtml('<link rel="stylesheet" type="text/css" href="ins-imgs.css">');
# Convert HTML to JS
function writeHtml($html) {
echo "document.write('".$html."');\n";
}
?>

Answer 1

Given that you said you are not a PHP master I'll show my solution and explain it step by step.
I hope you can find it helpful.
Here is the loop I use for pagination:
for($i = (($page-1)*$perPage); $i < min(($page*$perPage), $total); $i++) {
}
I'll gonna use this to create a new array with the elements 11-20, 21-30 and so on.
First of all I removed the .$i in your $sortedImages array's index (15th row of your code)
for ($i = 0; $i < $count; $i++) {
$sortedImages[date ('YmdHis', filemtime($images[$i]))] = $images[$i]; #15th Row
}
because it makes the index a bit messy (it is necessary for a next step).
Then I create a new array with 0 to N indexes which makes the code tidy (I do it to change your code as less as possible) and then I populate it with the elements of $sortedImages array.
$k = 0; # The new index
$newArray = array(); # The new array
foreach($sortedImages as $soImg) {
$newArray[$k] = $soImg;
$k++;
}
Finally the pagination's implementation:
$page = $_GET["page"];
$perPage = 3;
$total = $count;
for ($i = (($page-1)*$perPage); $i < min(($page*$perPage), $total); $i++) {
$newSortedImages[$i] = $newArray[$i];
}
Variables:
$page = $_GET["page"]; is the page number retrived from the url ($_GET[] is a superglobal array)
$perPage is the number of elements to show per page
$total = $count; is the number of $images array (13th line)
The loop:
$i = (($page-1)*$perPage) is the start of the loop, if the page is 1 the loop should start from 0 then the expression (($page-1)*$perPage) makes it work.
$i < min(($page*$perPage), $total) is the end of the loop, min() function finds the lowest value between its arguments, it is helpful when e.g. the last page contains 4 elements while 6 are expected.
Then you just need to change the array to loop through in 29th row of your code from $sortedImages to $newSortedImages.
For pagination controls use this:
$nextPage = $page + 1;
$prevPage = $page - 1;
Here is the new code implementation:
# To prevent browser error output
header('Content-Type: text/javascript; charset=UTF-8');
# Path to image folder
$imagefolder = 'img/';
# Show only these file types in the image folder
$imagetypes = '{*.jpg,*.JPG,*.JPEG,*.png,*.PNG,*.gif,*.GIF}';
# Add images to array
$images = glob($imagefolder.$imagetypes, GLOB_BRACE);
# Sort the images based on its 'last modified' time stamp
$sortedImages = array();
$count = count($images);
for ($i = 0; $i < $count; $i++) {
$sortedImages[date ('YmdHis', filemtime($images[$i])).$i] = $images[$i];
}
# Set to 'false' if you want the oldest images to appear first
$newest_images_first = true;
# Sort images in array
if($newest_images_first) {
krsort($sortedImages);
} else {
ksort($sortedImages);
}
# Now I give an index from 0 to N to the new array to make it work with pagination loop
$k = 0; # The new index
$newArray = array(); # The new array
foreach($sortedImages as $soImg) {
$newArray[$k] = $soImg;
$k++;
}
$page = $_GET["page"];
$perPage = 3;
$total = $count;
for ($i = (($page-1)*$perPage); $i < min(($page*$perPage), $total); $i++) {
$newSortedImages[$i] = $newArray[$i];
}
# Generate the HTML output
writeHtml('<ul class="ins-imgs">');
foreach ($newSortedImages as $image) {
# Get the name of the image, stripped from image folder path and file type extension
$name = 'Image name: '.substr($image,strlen($imagefolder),strpos($image, '.')-strlen($imagefolder));
# Get the 'last modified' time stamp, make it human readable
$last_modified = '(last modified: '.date('F d Y H:i:s', filemtime($image)).')';
# Begin adding
writeHtml('<li class="ins-imgs-li">');
writeHtml('<div class="ins-imgs-label">'.$name.' '.$last_modified.'</div>');
writeHtml('<div class="ins-imgs-img"><a name="'.$image.'" href="#'.$image.'">');
writeHtml('<img src="'.$image.'" alt="'. $name.'" title="'. $name.'">');
writeHtml('</a></div>');
writeHtml('</li>');
}
writeHtml('</ul>');
writeHtml('<link rel="stylesheet" type="text/css" href="ins-imgs.css">');
# Convert HTML to JS
function writeHtml($html) {
echo "document.write('".$html."');\n";
}
For page numbering you have to know the total of elements and divide it by $perPage elements, obviously the result must be an integer, so you'll gonna use ceil() function
From php.net
Returns the next highest integer value by rounding up value if necessary.
$pages = ceil($count / $perPage);
And then use this to display peges numbers:
for($i = 1; $i <= $pages; $i++) {
writeHtml('' . $i . ' ');
}

Answer 2

You don't need a database to implement simple pagination.
$currentpage = $_GET['p'];
for ($i = ($currentpage*$pageSize); $i<sortedImages as $image) {
// your HTML output here
}
for($i = 0; $i < $sortedImages/$pageSize; $i++){
writeHtml('<a href=/?p='.$i + 1.'/>');
}
That's just an example, probably won't work if you cut 'n paste. But there to give you a good idea of how it could be implemented.