WebsiteBaker Community Forum
WebsiteBaker Support (2.13.x) => Modules => Topic started by: netraam on February 09, 2025, 01:55:52 PM
-
Hello everyone,
I've made a new photo album module. I needed a simple photoalbum that show's the photo's in a folder an also in it's subfolders. The extisting photo albums that also track the photo's in the subfolders where to extensive for my purpose. So after many years of using WebsiteBaker i've give it a try to write my first module.
Those who are interested in it can find it on github: https://github.com/nethraam/pixofcake
You can find some screenshots in the repository. I thought I would be nice to share this here.
The module works, but i know there is room for improvement and probably there are still some errors in it, your feedback is welcome.
-
Hi and Thanks for the job!! (Y)
some rules...
- use language files, at minimum in englisch and german, possible in all 23 installed languages from WB
- your image folder must be the media-folder or a subfolder from MediaDirectory. Better as a free input field is a select box with this folders (see example in attachement)
- use a default value for both checkboxes in save.php. Use if(isset...) to read a submitted value, if not submitted, use the default value
- its better, to use integer fields for the checkbox values (0 or 1) or enum(), go'es faster and better to code
- prevent your install-struct.sql.php with a php-code in the top
Some errors from the test
Undefined array key "crop_images" - if you dont submitted a value for this
Undefined array key "show_filenames" - if you dont submitted a value for this
dispatch\find_photos "foreach() argument must be of type array|object, false given - if you dont submit a existed folder
code, to prevent the install-struct.sql.php (see also in the Accordion-Module)
-- <?php header($_SERVER['SERVER_PROTOCOL'].' 404 Not Found'); echo '404 Not Found'; flush(); exit;?>
function, to read all subfolders from /media
function MediaDirectoryList($directory, $show_hidden = false){
$aMediaFolderList = [];
if (\is_dir($directory))
{
$dir = array_values(array_diff(\scandir($directory),['.','..'])); //Open directory
foreach ($dir as $key => $entry) {
if(($entry[0] === '.') && ($show_hidden == false)) { continue; } // Skip hidden files
$sItem = str_replace('//', '/',$directory.'/'.$entry.(\is_dir($directory.'/'.$entry) ? '' : ''));
if (\is_dir($sItem)) { // Add dir and contents to list
$aMediaFolderList = \array_merge($aMediaFolderList, MediaDirectoryList($sItem));
$aMediaFolderList[] = str_replace(WB_PATH."/",'',$sItem);
}
}
}
if (\natcasesort($aMediaFolderList)) {
// new indexing
$aMediaFolderList = \array_merge($aMediaFolderList);
}
return $aMediaFolderList; // Now return the list
}
$aMediaFolderList = MediaDirectoryList(WB_PATH.MEDIA_DIREC TORY);
Result is a array, called $aMediaFolderList
use it for example like this
<select name="url" style="width: 100%;padding:4px;">
<option value="media">media</option>
<?php
foreach ($aMediaFolderList as $aFolder){
echo '<option value="'.$aFolder.'" ';
if ($aFolder == $url){echo ' selected = "selected"';}
echo ' > '.$aFolder.'</option>';
}
?>
</select>
example for the default value in save.php for non-submitted fields
// crop_images / default=''
if(isset($aRequestVars['crop_images']) && ($aRequestVars['crop_images'] == 'checked')) {
$sCropImages = 'checked';
}else{
$sCropImages = '';
}
proof the incoming datas also for the correct data-type, means integers with is_numeric()
some example links from our addons
- Brax Highslide Gallery B (https://addon.WebsiteBaker.org/en/browse-add-ons/?id=06689826) -> repaired in last week, show the old module structure, you can use it as example for the language files && inclusion
- Accordion (https://addon.WebsiteBaker.org/en/browse-add-ons/?id=00CB2195) -> show the new module structure "for the future", from my personal view easyer to handle, but its new. Has a included Twig-Template-Editor and this give the possibility, to use in every output section a different template
Please ask, if you need help
-
For more feedback maybe it is a good idea to attache the module here as installable module.
Or give github now installable zips?
-
For more feedback maybe it is a good idea to attache the module here as installable module.
Or give github now installable zips?
i add the module in the attachement (ZIP-Date: 09.02.2025, 14:24
Github use a special structure, good for developement, but not for the direct install as WB-module
(https://i.gyazo.com/204db6bba7bbbe06b010fe84afc577d2.png)
-
First problem in the install procedure.
The install-struct.sql.php contains this lines:
DROP TABLE IF EXISTS `{TABLE_PREFIX}mod_pixofcake`;
CREATE TABLE IF NOT EXISTS `wb_mod_pixofcake` (
the first line is right. the second, with hardcoded table prefix, will not work in many cases.
The module works once you have figured out how to specify the URL It is not https://... and not media/myfolder. Must be /media/myfolder.
A hint as to what the URL should look like would be nice
-
a general tip for all coders
since PHP 8.x the declaration of the data-type is more and more important. a simple example, to make the code more secure is here the (int) in the front of the Section-ID
$sql = 'SELECT COUNT(*) FROM `'.TABLE_PREFIX.'mod_example` '
. 'WHERE `section_id`='.(int)$section_id;
in this case, its save, that $section_id must be a integer value - important for possible hijacking
if we need to handle a string, best solution to check this value is a intern WB-funtion, called StripCodeFromText(), that remove possible JS-Code from the submitted string and something more, like droplet-call etc
if(isset($aRequestVars['cat_name']) && ($aRequestVars['cat_name'] != '')) {
$sCatName = $admin->StripCodeFromText($aRequestVars['cat_name']);
}
for a numeric value
if (isset($aRequestVars['active']) && is_numeric($aRequestVars['active']) ) {
$active = intval($aRequestVars['active']);
}
good practice is it, to named own variables with the selected datatype, for example:
$i... for a integer value like $iSectionId
$a... for a array value like $aRequestVars as $_POST-array
$s... for a string value like $sCatName
$b... for a boolean
a lot of examples are in the admin-folder
-
Maybe not the right place to discuss about this, then sorry for that...
i build a new version of the old swift-gallery. you can select a single folder under /media and display a start picture and a row of thumb on the right side of the start pic. The output works (like the original module) without any open effect. It looks okay, if you have only 4-6 Pictures in the selected folder and thats my use for a customer. if you've more pics in the folder, it goes longer and longer in the thumblist. Maybe its better, to have a horizontale thumb-list at the bottom or a switch in the module-settings
We've also the Brax_Highslide-B-Module with the same funktion, read a single folder from media, add some picture settings, result/output is a list with thumbs, to open with a js-effect
And here, we've the project from netraam, minimal settings, but it use also the subfolders from a selected medai directory.
QUESTION: is it a good idea, to combine modules with nearly the same function to one single module?
After adding a new section, you get a select box with the 3 submodules and the rest works with switches in every module file. Every module has his own setting, his own output, his own open effects, if needed. You can add multiple sections with this 3 submodules (or with the same)
From my point possible to code, but is it a good solution for the users?
Screenshot Swiftgallery
(https://i.gyazo.com/f555d177f9dcea9d1b22f70e7396ea8d.png)
Screenshot Pixo
(https://i.gyazo.com/d975cf452eb655367faa377eec036bb7.png)
Screenshot Brax-Highslide-B
(https://i.gyazo.com/b371201c2b783634c24926335e619319.png)
-
You ask whether it is a good idea to have another module with more options. I say yes. (Y)
The only disadvantage is the size of the module. Is it still installable for everyone?
-
The only disadvantage is the size of the module. Is it still installable for everyone?
my swift-version has a size (in the zip) from 167kb, it need a couple of new php-files for the backend, maybe 50kb, and it needs the other JS-files for the open-effects, highslide use 370kb (a lot of buttons via pictures), pixo use 173 kb - maybe, it goes smaller, if we use minified js.
I think, in summary 700 or 800 kb for the complete module is possible
But, I don't want to steal the work of others - Let's let netraam do his job - its only a idea for the future, for rainy day's ;-)
-
At first, thanks for all the tips and rules how to properly code a module, when I have some time I will try to implement them.
I think that its not bad idea to combine all the functions of the three modules.
The most important thing for me are the subfolders. On the site of our theater company (www.restant.be/wb/pages/fotos.php), all our foto's are in subfolders. I create a subfolder for every play we preform. Because I sometimes upload 50 photo's or more at one time, I also find it useful that the images are automatically resized so i don't have to resize them on my computer. The last thing what is important for me is that the gallery is fully responsive. I have old iphone with a very small screen, so I don't like margin and borders around the photo's becaus they take a lot of space on my very small screen.
I don'y mind that you use my code, so if you are bored on a rainy day go ahead.
-
only a question : is the foldergallery not a good solution for your project?
-
Yes, I could use the foldergallery, but I like simplicity. Foldergallery has a lot of settings that I don't need for my application. I wanted a simple gallery like Brax or Minigallery but with the ability to show the subfolders.
And it was a good reason to learn how to make a module for WebsiteBaker. With the comments of you all, I learnd more in 5 minutes than I do normaly in one month.
I also like the fact that I can add features to the module whenever I want. Now I find it a super handy feature that I can upload my pictures in fullsize. The photoalbum resizes the pictures for me.
-
Then welcome to the group of module authors and good luck with the implementation. We are happy to test the new Gallery.
-
Personally(!), although I welcome any effort to create new modules, don't think we need more galleries. MiniGal2 by Ruud (https://dev4me.com/modules-snippets/opensource/minigallery-v2/) beats them all. In versatility, features, styling options etc. Quite frankly, all the other galleries that are available aren't very good and not at all user-friendly (try to explain to a customer he needs to upload a bunch of images to a folder first before the gallery works - yes it's easy for us but not for USERS.)
-
I agree whit you MiniGal2 is one of the best and user friendly gallerie's for WebsiteBaker, but in my case I need a gallery that can work with subfolders. I have more than 1000 images, spread over 30 folders, thats to much to handle with MiniGal2.
-
I agree whit you MiniGal2 is one of the best and user friendly gallerie's for WebsiteBaker, but in my case I need a gallery that can work with subfolders. I have more than 1000 images, spread over 30 folders, thats to much to handle with MiniGal2.
Is it?
Here's my photography business website with close to 2,000 images in Minigal2 ;-)
https://www.fotomakerij.nl