Filter Gallery

I am web designer with strong knowledge in HTML and CSS and a little on PHP. As of now, I just created my own Theme for C5. Now I wanted to create own filter gallery with category coding except same methods as to this except replacing html into concrete's php and without needing to use plug-in. I want to be able to learn and understand how to code it myself. Where do I start? How do I create category of images and what code do I need to implement?

You help is appreciated.

View Replies:
JohntheFish replied on at Permalink Reply
To get you started, have a look at
sergio11ofpp replied on at Permalink Reply
Create FileSet in Filemanager.
 $fs = FileSet::getByName('file_set_name');
 $fileList = new FileList();
 $files = $fileList->get();
  foreach($files as $image){
     $source = $image->getRelativePath();
     echo '<img src="'.$source.'" />';

Now You will output all the images in that fileset.
To filter them I will suggest a little bit of JS(Jquery)

So when you echo the images add a specific class to them for exapmle Title of the image
foreach($files as $image){
     $name= $image->getFileName();
     $source = $image->getRelativePath();
     echo '<img class="'.$name.'" src="'.$source.'" />';

Or any other Option That.

echo $image->getFileName();
    echo $image->getTitle(); 
    echo $image->getAttribute("width");
    echo $image->getDownloadURL();
    echo $image->getRelativePath();
    echo $image->getDescription();
    echo $image->getAttribute('attribute_name')

After write a JS script

  var show_this = $(this).attr('class'); //so it will take the class that you want show

Hope this Helped! WTD
APrather replied on at Permalink Reply
Johnthefish: Thanks for the linl, look like this is going to be a long route for me.. but I'll have a look at it anyway.

Sergio11ofpp: Little confusion here... Honestly JS coding isn't my best friend. But I understanding I'd need to create new JS and place it in somewhere of my template folder correct? And yet, what code do I need to implement for categories i.e. GREEN, RED, BLUE for based on fileset? page.php to get it work between JS? Can you give me hints.

[i] page.php example [/i]
        <link rel="stylesheet" type="text/css" href="<?php echo $this->getThemePath () ?> /default.css" media="screen"/> 
<!--<title>Decayed</title> old -->
<?php Loader::element('header_required'); ?>

Tanks in advance