Ok guys, this is my improvement to prevent switching between images when active image is zoomed in.
Thanks umbro77 for giving me some hints.
In the imageviewer:
Add
Code:
config: {
...,
isZoomed: false
...
}
Add two lines in onDoubleTap function:
Code:
onDoubleTap: function(ev, t) {
var me = this,
scroller = me.getScrollable().getScroller(),
scrollPosition = scroller.position,
element = me.element;
if(!me.getDoubleTapScale())
return false;
// set scale and translation
if(me.scale > me.baseScale) {
// ZOOM OUT to base view
me.setIsZoomed(false);
me.scale = me.baseScale;
me.setTranslation(me.translateBaseX, me.translateBaseY);
// reset origin and update transform with new translation
me.applyTransform();
// adjust scroll container
me.adjustScroller();
// force repaint to solve occasional iOS rendering delay
Ext.repaint();
}
else {
// ZOOM IN toward tap position
me.setIsZoomed(true);
var oldScale = me.scale,
newScale = me.baseScale * me.getZoomRatio(),
originViewportX = ev ? (ev.pageX - element.getX()) : 0,
originViewportY = ev ? (ev.pageY - element.getY()) : 0,
originScaledImgX = originViewportX + scrollPosition.x - me.translateX,
originScaledImgY = originViewportY + scrollPosition.y - me.translateY,
originReScaledImgX = originScaledImgX * (newScale / oldScale),
originReScaledImgY = originScaledImgY * (newScale / oldScale);
me.scale = newScale;
//smoothes the transition
setTimeout(function(){
me.setTranslation(originViewportX - originReScaledImgX, originViewportY - originReScaledImgY);
// reset origin and update transform with new translation
me.applyTransform();
// adjust scroll container
me.adjustScroller();
// force repaint to solve occasional iOS rendering delay
Ext.repaint();
},50)
}
},
In your carousel, you should have a onDragStart function (line 343 for me), just add:
Code:
onDragStart: function(e) {
// if current image is zoomed in, stop switching
if (this.getActiveItem().getIsZoomed()) {
e.stopPropagation();
return;
}
var direction = this.getDirection(),
absDeltaX = e.absDeltaX,
absDeltaY = e.absDeltaY,
directionLock = this.getDirectionLock();
....
Hope this helps!!!