Extracting images based on ID

Question

I have a slider (flexslider) that i'm using to display images in the form shown in the below jsfiddle... I optimized the slider so that it extracts images dynamically from a certain directory. It worked and all images are being extracted. Now in my folder images are named as 1023 , 2045 , 304654, 50 etc... How can i specify that images that start let's say with "1" (can be 14 , 1040,10000.100000 etc...) are the ones only extracted?

Update (more clarification): the reason i'm extracting based on the first digit of the name of each image, is that because i'm going to use the slider in all the elements of my menu. So that if i click on element "aaaa" images that start with 1 appear, if i click on "bbbbbb" images that start with 2 appear, and so on.

JSFIDDLE: https://jsfiddle.net/atkumqpk/1/

PHP code:

         function get_slide_images($folder, $images_per_slide = 10)
{

    $slide_images = false;

    if (file_exists($folder)) {

        // valid extensions
        $extensions = array(
            "jpg",
            "gif",
            "jpeg",
            "svg",
            "png",
            "bmp"
        );

        foreach (new DirectoryIterator($folder) as $file_key => $file) {

            // Don't bother
            if (!in_array($file->getExtension(), $extensions)) {
                continue;
            }

            // Grab file details
            $filename    = $file->getFilename();
            $file_folder = $folder . "/" . $filename;

            // Store the image to the Slide
            $slide_images[$filename] = "<img src='{$file_folder}' alt='{$file_folder}' />";

        }

        if (!empty($slide_images)) {
            ksort($slide_images);
            $slide_images = array_chunk($slide_images, $images_per_slide);
        }

    }
    return $slide_images;
}

//end of php 

        <div id="logo" class="logo" ><img src="logo.png"/></div>
        <p class="custom-class"><a href="">Go to the main website</a></p>

        <div id="menu" class="menu">
        <ul class="headlines">
              <li id="item1">
        <button>aaaaaaaa</button>
    </li>
    <li id="item2">
        <button>bbbbbbb</button>
    </li>
    <li id="item3">
        <button>ccccccc</button>
    </li>
    <li id="item4">
        <button>dddddddd</button>
    </li>
    <li id="item5">
        <button>eeeeeee eee.</button>
    </li>
    <li id="item6">
        <button>ffffff</button>
    </li>
    <li id="item7">
        <button>ggggggg</button>
    </li>

        </ul>
        </div>


     <div id="container">
<div id="first" class="inner-container">
   <div id="item11" class="item"> <a name="item11"></a>

                <div class="flexslider">

  <ul class="slides">



$slider_kvp = get_slide_images("images", 10);

/**
* Here we are going to generate the SLIDES
*/
if($slider_kvp) {

    $slider_list_html = array();

    foreach($slider_kvp as $slider_key => $slide_images) {

        $html_LI_list = "";
        $html_LI_list = "<li>";

        // Go through each image ...
        foreach($slide_images as $image_key => $image_value) {
            $html_LI_list .= $image_value;
        }

        $html_LI_list .= "</li>";

        $slider_list_html[$slider_key] = $html_LI_list;

    }

    // OUR SLIDES!
    $rendered_slider_list_html = implode(' ', $slider_list_html);
    echo "<ul class='slides'>{$rendered_slider_list_html}</ul>";

}



  </ul>
</div>
            </div>
        </div>
    <div id="second" class="inner-container">
      <div id="item22" class="item"> <a name="item22"></a>

              <div class="flexslider">
  <ul class="slides">



$slider_kvp = get_slide_images("images", 10);

/**
* Here we are going to generate the SLIDES
*/
if($slider_kvp) {

    $slider_list_html = array();

    foreach($slider_kvp as $slider_key => $slide_images) {

        $html_LI_list = "";
        $html_LI_list = "<li>";

        // Go through each image ...
        foreach($slide_images as $image_key => $image_value) {
            $html_LI_list .= $image_value;
        }

        $html_LI_list .= "</li>";

        $slider_list_html[$slider_key] = $html_LI_list;

    }

    // OUR SLIDES!
    $rendered_slider_list_html = implode(' ', $slider_list_html);
    echo "<ul class='slides'>{$rendered_slider_list_html}</ul>";

}


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

Answer 1

There are various ways of achieving this, but one way would be to filter the filenames your function is iterating through. Instead of the foreach (new DirectoryIterator($folder) as $file_key => $file) { ... } block, you could do something like:

foreach (glob($folder.'/'.'1*') as $filename) {
    $slide_images[$filename] = "<img src='{$filename}' alt='{$filename}' />";
}

The glob bit matches everything inside $folder that starts with "1" (you could also limit it to, say, PNGs by specifying, eg. "1*.png")

This has the advantage of only looking at the files you actually want, which is more efficient than the alternative approach of iterating through everything and looking at its filename.

Update: if you want to be able to change the "starts with" filter (so it's not always "1"), you can add an extra argument to your function, like so:

function get_slide_images($folder, $images_per_slide = 10, $starts_with = '') {

...and then change the foreach part (above) so it uses it:

foreach (glob("{$folder}/{$starts_with}*") as $filename) {

...then you can call your function like this:

$slider_kvp = get_slide_images("images", 10, "1");

...where the third argument ("1") specifies what the files you want should start with. (If you call the function without a third argument, you'll get all files in the folder, as you currently do). So your get_slide_images function might look something like:

function get_slide_images($folder, $images_per_slide = 10, $starts_with = '')
{

    $slide_images = false;

    // valid extensions
    $extensions = array(
        "jpg",
        "gif",
        "jpeg",
        "svg",
        "png",
        "bmp"
    );

    // Implode the extensions array into a string:
    $extensions = implode(',', $extensions);

    if (file_exists($folder)) {

        // Get all the files with a valid extension in $folder:
        // (optionally filtered by $starts_with)
        foreach (glob($folder.'/'.$starts_with.'*.{'.$extensions.'}', GLOB_BRACE) as $filename) {
            $slide_images[$filename] = "<img src='{$filename}' alt='{$filename}' />";
        }

        if (!empty($slide_images)) {
            ksort($slide_images);
            $slide_images = array_chunk($slide_images, $images_per_slide);
        }

    }

    return $slide_images;
}

Answer 2

If you need a condition to check:

<?php
  function starts_with ($filename, $start)
    if (substr($filename, 0, 1) == $start)
      return true;
    return false;
  }
?>