Skip to content

Commit

Permalink
Workaround for browser bug where with first image not being properly …
Browse files Browse the repository at this point in the history 
…resized in full screen mode.
  • Loading branch information
Kristoffer Jelbring committed Sep 20, 2012
1 parent 5193354 commit 31e5f21
Show file tree
Hide file tree
Showing 2 changed files with 69 additions and 70 deletions.
6 changes: 3 additions & 3 deletions demos/demo6.html
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<!-- saved from url=(0014)about:internet -->
<!-- saved from url=(0014)about:internet -->
<head>
<title>Exposure - Demo 6</title>
<link href="demo6.css?v=1.0" type="text/css" rel="stylesheet" />
Expand Down Expand Up @@ -95,7 +95,7 @@
$('img.' + $.exposure.selectedImageClass).stop().fadeTo(200, 0.3, function() { $(this).removeClass($.exposure.selectedImageClass); });
}
});
</script>
</script>
</head>
<body>
<div id="main">
Expand All @@ -121,6 +121,6 @@ <h1>Exposure - Demo 6</h1>
<div class="clear"></div>
</div>
<p class="info"><a href="demo5.html?v=1.0">View previous demo</a> | <a href="demo7.html?v=1.0">View next demo</a></p>
<p class="info">This is a demo showing the <a href="http://exposure.blogocracy.org/">Exposure plugin for jQuery</a>. With Exposure you can give your gallery any look you want, this is just an example. <a href="http://exposureforjquery.wordpress.com/download/">Download Exposure</a> or <a href="http://exposure.blogocracy.org/">learn more</a>.</p>
<p class="info">This is a demo showing the <a href="http://exposure.blogocracy.org/">Exposure plugin for jQuery</a>. With Exposure you can give your gallery any look you want, this is just an example. <a href="http://exposureforjquery.wordpress.com/download/">Download Exposure</a> or <a href="http://exposure.blogocracy.org/">learn more</a>.</p>
</body>
</html>
133 changes: 66 additions & 67 deletions jquery.exposure.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,7 @@

// Static Exposure instance.
$.exposure = {
v : '1.0',
v : '1.0.1',

// Predefined selectors.
defaultTargetId : 'exposure',
Expand Down Expand Up @@ -244,7 +244,7 @@
stretchToMaxSize : false,
fullScreen : false,
onEnterFullScreen : function(mask) {
mask.show();
mask.show();
},
onExitFullScreen : function(target, mask) {
target.hide();
Expand Down Expand Up @@ -708,18 +708,18 @@
}
},

/**
* Views thumbnails for a specific set of images (and creates them if needed).
*
* @param first Index of the first image to view.
* @param last Index of the last image to view.
*/
/**
* Views thumbnails for a specific set of images (and creates them if needed).
*
* @param first Index of the first image to view.
* @param last Index of the last image to view.
*/
viewThumbs : function(first, last) {
var i;
var i;
if (gallery.showThumbs) {
// Go through images in set.
for (i = first; i <= last; i++) {
gallery.viewThumb(i, i === first, i === last, true);
gallery.viewThumb(i, i === first, i === last, true);
}

if (!gallery.carouselControls && gallery.currentPage < gallery.numberOfPages()) {
Expand All @@ -737,7 +737,7 @@
}
}
}
}
}
},

/**
Expand All @@ -750,45 +750,45 @@
*/
viewThumb : function(index, first, last, currentPage) {
// Make sure image index is in scope.
if (index < 0) {
index = gallery.images.length + index;
} else if (index >= gallery.images.length) {
index = index - gallery.images.length;
}

var image = gallery.images[index];
// Find thumbnail container.
var container = gallery.getThumb(index).parent();
if (!container.length) {
// Create a thumbnail if one doesn't already exist.
container = gallery.createThumbForImage(image, index);

// Add page number as rel attribute.
container.attr('rel', gallery.pageNumberForImage(index));
}
if (container.length) {
// Append in the end of the container in order to save the ordering of the images.
container.parent().append(container);

if (first) {
// Decorate thumbnail container for first image on page.
container.addClass(ex.firstThumbClass);
} else {
container.removeClass(ex.firstThumbClass);
}
if (last) {
// Decorate thumbnail container for last image on page.
container.addClass(ex.lastThumbClass);
} else {
container.removeClass(ex.lastThumbClass);
if (index < 0) {
index = gallery.images.length + index;
} else if (index >= gallery.images.length) {
index = index - gallery.images.length;
}

var image = gallery.images[index];
// Find thumbnail container.
var container = gallery.getThumb(index).parent();
if (!container.length) {
// Create a thumbnail if one doesn't already exist.
container = gallery.createThumbForImage(image, index);

// Add page number as rel attribute.
container.attr('rel', gallery.pageNumberForImage(index));
}
if (container.length) {
// Append in the end of the container in order to save the ordering of the images.
container.parent().append(container);

if (first) {
// Decorate thumbnail container for first image on page.
container.addClass(ex.firstThumbClass);
} else {
container.removeClass(ex.firstThumbClass);
}
if (last) {
// Decorate thumbnail container for last image on page.
container.addClass(ex.lastThumbClass);
} else {
container.removeClass(ex.lastThumbClass);
}
if (currentPage) {
if (gallery.carouselControls) {
container.show();
} else {
container.addClass(ex.currentThumbClass);
}
}
}
}

return container;
Expand Down Expand Up @@ -1207,8 +1207,7 @@
}

if (!$(this).width() || !$(this).height()) {
// Workaround for bug caused by AdBlock plugin for Chrome and Safari:
// http://code.google.com/p/adblockforchrome/issues/detail?id=3701
// Sometimes image dimentions are not immediately set by the browser.
var i = $(this);
var delay = setInterval(function() {
gallery.resizeContainer(i);
Expand Down Expand Up @@ -1292,26 +1291,26 @@
gallery.current = index;

// If using carousel controls make sure to properly update the thumbnails.
if (gallery.carouselControls && gallery.images.length > gallery.pageSize) {
var firstVisibleImage = index;
var lastVisibleImage = gallery.pageSize-1;
var flooredVisibleImages = Math.floor(gallery.pageSize/2);

if (gallery.carouselControls && gallery.images.length > gallery.pageSize) {
var firstVisibleImage = index;
var lastVisibleImage = gallery.pageSize-1;
var flooredVisibleImages = Math.floor(gallery.pageSize/2);

if (!gallery.loop && index < flooredVisibleImages) {
firstVisibleImage = 0;
} else if (!gallery.loop && index >= (gallery.length - flooredVisibleImages)) {
lastVisibleImage = gallery.length-1;
firstVisibleImage = lastVisibleImage - gallery.pageSize+1;
firstVisibleImage = 0;
} else if (!gallery.loop && index >= (gallery.length - flooredVisibleImages)) {
lastVisibleImage = gallery.length-1;
firstVisibleImage = lastVisibleImage - gallery.pageSize+1;
} else {
firstVisibleImage -= flooredVisibleImages;
lastVisibleImage = firstVisibleImage + gallery.pageSize-1;
firstVisibleImage -= flooredVisibleImages;
lastVisibleImage = firstVisibleImage + gallery.pageSize-1;
}

gallery.onCarousel(firstVisibleImage, lastVisibleImage);
gallery.onCarousel(firstVisibleImage, lastVisibleImage);

gallery.find('li').removeClass(ex.currentThumbClass).hide();
gallery.viewThumbs(firstVisibleImage, lastVisibleImage);
gallery.currentPage = gallery.pageNumberForImage(index);
gallery.find('li').removeClass(ex.currentThumbClass).hide();
gallery.viewThumbs(firstVisibleImage, lastVisibleImage);
gallery.currentPage = gallery.pageNumberForImage(index);
}
}
},
Expand Down Expand Up @@ -1628,17 +1627,17 @@
fitToWindow : function() {
gallery.maxWidth = $(window).width();
gallery.maxHeight = $(window).height();
var image = gallery.targetElement.find('.' + $.exposure.currentImageClass).width('auto').height('auto');
gallery.fitToMaxSize(image);
var image = gallery.targetElement.find('.' + $.exposure.currentImageClass).width('auto').height('auto');

if (!image.width() || !image.height()) {
// Workaround for bug caused by AdBlock plugin for Chrome and Safari:
// http://code.google.com/p/adblockforchrome/issues/detail?id=3701
// Sometimes image dimentions are not immediately set by the browser.
var delay = setInterval(function() {
gallery.fitToMaxSize(image);
gallery.centerImageInWindow(image);
clearTimeout(delay);
}, 2);
} else {
gallery.fitToMaxSize(image);
gallery.centerImageInWindow(image);
}
},
Expand Down Expand Up @@ -1725,9 +1724,9 @@
}
}

// Don't use carousel controls if not showing thumbs.
if (!this.showThumbs) {
this.carouselControls = false;
// Don't use carousel controls if not showing thumbs.
if (!this.showThumbs) {
this.carouselControls = false;
}

// Don't show paging controls if using carousel controls, or if there is no controls target or if all individual controls have been turned off.
Expand Down

0 comments on commit 31e5f21

Please sign in to comment.