Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix containment Y-position when contain is true and pan-zoom is scaled in or out #279

Closed
wants to merge 4 commits into from
Closed

Fix containment Y-position when contain is true and pan-zoom is scaled in or out #279

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
71ec8d6
Fix containment y-position when contain is true and panzoom is scaled…
awartani Oct 6, 2016
a608ce6
fix automatic containment issue and fix container border bottom issue
awartani Oct 11, 2016
de89576
clean files
awartani Oct 11, 2016
e74e9ba
fix containment x-axis
awartani Oct 11, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
50 changes: 30 additions & 20 deletions dist/jquery.panzoom.js
View file
Open in desktop
@@ -1,6 +1,6 @@
/**
* @license jquery.panzoom.js v3.2.2
* Updated: Sun Aug 28 2016
* Updated: Tue Oct 11 2016
* Add pan and zoom functionality to any element
* Copyright (c) timmy willison
* Released under the MIT license
Expand Down Expand Up @@ -539,38 +539,48 @@
this.resetDimensions();
dims = this.dimensions;
}
var spaceWLeft, spaceWRight, scaleDiff;
var container = this.container;
var width = dims.width;
var height = dims.height;
var conWidth = container.width;
var conHeight = container.height;
var parentBorderBottom = parseInt(this.$parent.css('border-bottom-width'), 10);
var parentBorderRight = parseInt(this.$parent.css('border-right-width'), 10);
var originalElementHeight = this.elem.offsetHeight;
var originalElementWidth = this.elem.offsetWidth;
var conWidth = container.width - parentBorderRight;
var conHeight = container.height - parentBorderBottom;
var zoomAspectW = conWidth / width;
var zoomAspectH = conHeight / height;

// If the element is not naturally centered,
// assume full space right
if (this.$parent.css('textAlign') !== 'center' || $.css(this.elem, 'display') !== 'inline') {
// offsetWidth gets us the width without the transform
scaleDiff = (width - this.elem.offsetWidth) / 2;
spaceWLeft = scaleDiff - dims.border.left;
spaceWRight = width - conWidth - scaleDiff + dims.border.right;
} else {
spaceWLeft = spaceWRight = ((width - conWidth) / 2);
}
var spaceHTop = ((height - conHeight) / 2) + dims.border.top;
var spaceHBottom = ((height - conHeight) / 2) - dims.border.top - dims.border.bottom;

//Constrain Y-axis position to the container
//Be careful about how Origin is being calculated when transform matrix is used

//Original X origin - Scaled X Origin
var originX = originalElementWidth / 2 - width / 2;

//Original Element Max X + OriginX - ContainerBorderRight
var maxXPos = conWidth - originalElementWidth + originX - parentBorderRight;

if (contain === 'invert' || contain === 'automatic' && zoomAspectW < 1.01) {
matrix[4] = Math.max(Math.min(matrix[4], spaceWLeft - dims.border.left), -spaceWRight);
matrix[4] = Math.min(Math.max(matrix[4], maxXPos), -originX);
} else {
matrix[4] = Math.min(Math.max(matrix[4], spaceWLeft), -spaceWRight);
matrix[4] = Math.max(Math.min(matrix[4], maxXPos), -originX);
}


//Constrain Y-axis position to the container
//Be careful about how Origin is being calculated when transform matrix is used

//Original Y origin - Scaled Y Origin
var originY = originalElementHeight / 2 - height / 2;

//Original Element Max Y + OriginY - ContainerBorderBottom
var maxYPos = conHeight - originalElementHeight + originY - parentBorderBottom;

if (contain === 'invert' || (contain === 'automatic' && zoomAspectH < 1.01)) {
matrix[5] = Math.max(Math.min(matrix[5], spaceHTop - dims.border.top), -spaceHBottom);
matrix[5] = Math.min(Math.max(matrix[5], maxYPos), -originY);
} else {
matrix[5] = Math.min(Math.max(matrix[5], spaceHTop), -spaceHBottom);
matrix[5] = Math.max(Math.min(matrix[5], maxYPos), -originY);
}
}

Expand Down