Multiple slideshow fix
Pierre_G - October 8, 2009 - 15:28
| Project: | Jquery Slideshow |
| Version: | 6.x-1.2 |
| Component: | Code |
| Category: | bug report |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | needs review |
Jump to:
Description
I wanted to have multiple slideshows displayed in a page which is listing teasers with the slide inside them.
But with the module, it was impossible to have more than one in a page.
I made some changes to get it work :
(thanks as well to this post : #557560: handling empty imagefields)
theme_jquery_slideshow_formatter function
function theme_jquery_slideshow_formatter($element) {
static $current_slide_nid;
if (!$current_slide_nid || $current_slide_nid!=$element['#item']['nid']) {
$nid = $element['#item']['nid'];
$current_slide_nid = $nid;
$node = node_load($element['#item']['nid']);
$field_name = $element['#field_name'];
if($node->{$field_name}){
$jq_slideshow_id = 'jq-slideshow-'. $nid .'-'. $field_name;
#render CSS files
$formatter = $element['#formatter'];
$dets = explode('__', $formatter);
$preset = $dets[1];
_jquery_slideshow_get_settings($jq_slideshow_id, $preset, $nid);
#render output HTML
$output = '<div class="jquery_slideshow" id="'. $jq_slideshow_id .'">';
foreach ($node->{$field_name} as $image) {
if($image) {
$output .= theme('imagecache', $preset, $image['filepath'], $image['data']['alt'], $image['data']['title']);
}
}
$output .= '</div>';
}
return $output;
}
}_jquery_slideshow_get_settings function
function _jquery_slideshow_get_settings($jq_slideshow_id, $preset, $nid='') {
jquery_plugin_add('cycle');
$data = _jquery_slideshow_get_actions($preset);
$script = "Drupal.behaviors.jquerySlideshow".$nid." = function(){
$('#".$jq_slideshow_id."').css({height:'". $data['height'] ."px'});
$('#".$jq_slideshow_id."').css({width:'". $data['width'] ."px'});
$('#".$jq_slideshow_id."').cycle({
fx: '". variable_get('jquery_slideshow_effect', 'fade') ."',
speed: ". variable_get('jquery_slideshow_speed', 500) .",
timeout: ". variable_get('jquery_slideshow_timeout', 4000) ."
});
}";
drupal_add_js($script, 'inline');
}I hope I didn't forget anything, but it seems OK.
Any change to make it more optimized are welcome of course.
#1
I forgot to say that with this, you can also make multiple slideshow in one content, with their own sizes / imagecache presets.
#2
I've installed Jquery Slideshow, which provides the exact functionality I was seeking, except that I experience errors with nodes that contain empty image fields, and I cannot display more than one slideshow on a page (I need multiple).
Both of these features are essential for me (multiple slideshows on one page and properly handling nodes with an empty image field), and am not certain how to patch this module in order to add this functionality.
Is there a module that can accomplish multiple slideshows on one page and successfully handle empty image fields?
Thanks for any help you can provide!
#3
I implemented the above code changes, and both of the problems I was experiencing disappeared, and the module now serves multiple images on a page and does not indicate an error when encountering a node that has an empty image field. Will the above code become a part of the module soon? If not, is it safe to make the above changes to the module on a production site? If so, this module with the above code changes seems to work perfectly for what I am trying to accomplish.
#4
When using the above code to create an image slideshow within a field using multiple nodes on a page via views, Internet Explorer slows down scrolling significantly after adding only a few images (6 or 7). Any ideas as to why? Firefox works fine.
#5
I didn't test it with IE, only on Firefox.
I'll work on my project in the next days, I'll be back here to tell if I find any improvements about this.
#6
Thanks very much Pierre_G. The two problems I found when testing the above code are as follows:
1. In Internet Explorer, scrolling is very slow when placing several images on one page. Firefox is fine.
2. I defined a Jquery Slideshow image field inside of a view, and I use that view to pull multiple nodes onto one page (this is how I was able to accomplish #1 above). I noticed that when I add a new image and then visit the view page, the space occupied by the image is ignored, and therefore the text below the image (the next field) is directly underneath the image itself, as if the view does not know that the image exists. So, instead of having the image followed by the text field, the text ends up underneath the image. But, when I reload the page, the problem disappears. It seems as if this only happens when I add the image to a node for the first time and visit the page that contains the view, because when I reload the page, the view seems to recognize the image size.
If I could solve the above two problems, your code above will work perfectly for what I am trying to accomplish (which is to have multiple nodes shown on one page using views, with each node having a Jquery Slideshow image field producing a slideshow). This will serve as an alternative to animated GIFs on my site so that I can implement higher quality JPG or PNG images.
I look forward to hearing what you can determine Pierre_G!
#7
I tried this for a list of nodes all with thumbnail slide shows and it works perfectly in FF and Chrome but IE doesnt like it although this maybe due to conflict other js on the page.
Thanks
#8
Thanks for the suggested code. Would it be possible for you to provide a patch file so I can easily determine what lines you've changed?
#9
Hi all,
I have the same trouble in IE.
I have an 'addthis' tool that uses java along with jquery_slideshow pulling multi photos from one field_photo.
IE is very slow and will not show java. The Error on page says Invalid argument, line:68 Char:9 Code:0
Firefox is great! on probs.
Very frustrating.
Cheers
#10
Hi all,
I was having a good look at the invalid argument code and the bad line reads;-
$('.jquery_slideshow').css({height:'100%px'});
I would say it has to do with the height at 100%px ?
Anyone know how this can be changed?
Cheers