neverslair hacks - useing jquery with wt_gallery

28.06.2008 21:30 Age: 1214703000

You like typo3, you like jquery for your javascript ajax needs, and you use wt_gallery? then this is definitely for you.

how the thing looks

Every coder knows this problem, you are using your javascript library of choice, and need a picture gallery, now there are many galleries available for typo3, each one with its own nice lil features and gimmicks, each one using its own javascript library of choice. I am currently using jm_gallery on my page, but since that one is totally missing ajax stuff, and i wanted to play around with the functions anyways, i decided to test around some galleries on my local development web. There are quite some galleries with ajax support, but none of em actually let me choose different javascript libraries. There is also perfectlightbox and kj_lightbox2, those are pretty nice, but not exactly fitting my needs with the read-images-from-folder thing. Soon i had wt_gallery on my view, cause it nearly fitted all my needs, it let me choose which javascript library i actually want to use for what, and supports folder readout, cat view, list view and single view. But since i am using jquery for javascript stuff on my web, and had already jquery_thickbox installed, and wt_gallery only support kj_lightbox2 or perfectlightbox, i decided on hack the jquery_thickbox support into it. And here is how it is done

1. install jquery_thickbox on your system
2. install wt_gallery on your system
3. edit the file typo3conf/ext/wt_gallery/pi1/class.wtgallery_pi1.php and search for the following code:

if (($popup == '1' || $popup == 'imagelightbox' || $popup == 'perfectlightbox') AND !file_exists('uploads/tx_wtgallery/popup/'.$filename_cached)) { // Generate Popup Cache file if needed Replace it with: if (($popup == '1' || $popup == 'imagelightbox' || $popup == 'perfectlightbox' || $popup == 'thickbox') AND !file_exists('uploads/tx_wtgallery/popup/'.$filename_cached)) { // Generate Popup Cache file if needed Then search for:                         } elseif ($js_popup == 'perfectlightbox' AND t3lib_extMgm::isLoaded('perfectlightbox',0)) {
                                $content = '<a href="uploads/tx_wtgallery/popup/'.$image_result.'" rel="lightbox" title="">';
                        $content .= $imagetag;
                                $content .= '</a>'; And place right under it:                         } elseif ($js_popup == 'thickbox' AND t3lib_extMgm::isLoaded('jquery_thickbox',0)) {
                                $content = '<a href="uploads/tx_wtgallery/popup/'.$image_result.'" rel="gallery55" title="" class="thickbox">';
                        $content .= $imagetag;
                                $content .= '</a>';
                        }

4. edit the file typo3conf/ext/wt_gallery/ext_typoscript_constants.txt and search for the following code:

# cat=plugin.wt_gallery//300; type=options[0,1,wallpaper,imagelightbox,perfectlightbox]; label= POPUP - Activate popup: Ratio of the thumbnails (De)Activate Popup (Default 1) (Example 0 for off, 1 for on, wallpaper for showing orignal picture, imagelightbox for using kj_imagelightbox2, perfectlightbox for using perfectlightbox) and replace it with: # cat=plugin.wt_gallery//300; type=options[0,1,wallpaper,imagelightbox,perfectlightbox,thickbox]; label= POPUP - Activate popup: Ratio of the thumbnails (De)Activate Popup (Default 1) (Example 0 for off, 1 for on, wallpaper for showing orignal picture, imagelightbox for using kj_imagelightbox2, perfectlightbox for using perfectlightbox and thickbox for jquery_thickbox) Thats it, after recacheing the extension, you have enhanced the feature config_popup.show = 1 under constants by the choice of thickbox, which activates the jquery_thickbox. You may find more on my hack (e.g. prepatched files and a diff) at the typo3 bugtracker: http://bugs.typo3.org/view.php?id=8849 I hope you enjoyed my lil tutorial, and i wish you further happy hacking