Bug when item is 'notFitting'
-
I think I have found a bug when the item to be shown is notFitting. The problem is that the original loop in _fitToViewport is the following:
while (notFitting){
if((pp_containerWidth > windowWidth)){
imageWidth = (windowWidth - 200);
imageHeight = (height/width) * imageWidth;
}else if((pp_containerHeight > windowHeight)){
imageHeight = (windowHeight - 200);
imageWidth = (width/height) * imageHeight;
}else{
notFitting = false;
};
pp_containerHeight = imageHeight;
pp_containerWidth = imageWidth;
};
It bases the criteria whether to fit or not in viewport only on the image height / width and does not consider the extra elements. When _getDimensions is called, it will extend the dimensions of the container to include the elements and buttons. Thus in my opinion, I think that the _getDimensions needs to be calculated inside the loop and the notFitting is calculcated based on the actual final width / height. I have modified the function to the following:
while (notFitting) {
if ((pp_containerWidth > windowWidth)) {
imageWidth = (windowWidth - 200);
imageHeight = (height / width) * imageWidth;
} else if ((pp_containerHeight > windowHeight)) {
imageHeight = (windowHeight - 200);
imageWidth = (width / height) * imageHeight;
} //else{
//notFitting = false;
//};
pp_containerHeight = imageHeight;
pp_containerWidth = imageWidth;
_getDimensions(imageWidth, imageHeight); // Update to actual width / height
notFitting = pp_containerWidth > windowWidth || pp_containerHeight > windowHeight
}; -
Another bug is:
When you move through previous / next items, inside the open() method, the percentBased is never reset to 'false' and then check whether it is 'true' based on width / height values. Thus if you have a very large image, then click next and go to a percentBased item and go back to the very large image, the percentBased will still be set to true and thus the image is shown at its full size! -
And yet another one:
When you use prettyPhoto with inline content, inside the fadeIn function of the open() method, inside the switch for 'inline', when you are cloning the element, you are setting the css width to be the default width. This way you can never open up custom width content and have to abide by the default width.
I am checking whether the item to be cloned has a previous CSS width style attached and if yes, it is copied to the clone, if not, then the default width applies.
Amended code:
case 'inline':
var prevCssWidth = $(images[setPosition]).css('width')
// to get the item height clone it, apply default width, wrap it in the prettyPhoto containers , then delete
myClone = $(images[setPosition]).clone().css({ 'width': prevCssWidth == 'auto' ? settings.default_width : 'auto' }).wrapInner('').appendTo($('body'));
var width = $(myClone).width()
var height = $(myClone).height()
correctSizes = _fitToViewport($(myClone).width(),$(myClone).height());
$(myClone).remove();
toInject = settings.inline_markup.replace(/{content}/g,$(images[setPosition]).html());
break;
Howdy, Stranger!
It looks like you're new here. If you want to get involved, click one of these buttons!