Matthew
My feedback
-
26 votes
Matthew commented
I've got this working more or less the way I'd like. Feel free to add or update this functionality in the main branch if you'd like. The changes are all made to photoswipe-ui-default.js.
Around line 77, change:
clickToCloseNonZoomable: true,
To:
clickToAdvanceImage: true,
clickToCloseNonZoomable: true,----
Around line 735, update the function:
if(framework.hasClass(target, 'pswp__img')) {
if(pswp.getZoomLevel() === 1 && pswp.getZoomLevel() <= pswp.currItem.fitRatio) {
if(_options.clickToCloseNonZoomable) {
pswp.close();
}
} else {
pswp.toggleDesktopZoom(e.detail.releasePoint);
}
}To:
if(framework.hasClass(target, 'pswp__img')) {
if(_options.clickToAdvanceImage) {
if(( pswp.getZoomLevel() === 1 && pswp.getZoomLevel() <= pswp.currItem.fitRatio )
|| pswp.getZoomLevel() === pswp.currItem.fitRatio) {
pswp.next();
} else {
pswp.toggleDesktopZoom(e.detail.releasePoint);
}
} else {
if(pswp.getZoomLevel() === 1 && pswp.getZoomLevel() <= pswp.currItem.fitRatio) {
if(_options.clickToCloseNonZoomable) {
pswp.close();
}
} else {
pswp.toggleDesktopZoom(e.detail.releasePoint);
}
}
}Matthew shared this idea ·
On second look, I realize that the dual conditions are redundant. The function can be more simple:
if(framework.hasClass(target, 'pswp__img')) {
if(_options.clickToAdvanceImage) {
if(pswp.getZoomLevel() <= pswp.currItem.fitRatio) {
pswp.next();
} else {
pswp.toggleDesktopZoom(e.detail.releasePoint);
}
} else {
if(pswp.getZoomLevel() === 1 && pswp.getZoomLevel() <= pswp.currItem.fitRatio) {
if(_options.clickToCloseNonZoomable) {
pswp.close();
}
} else {
pswp.toggleDesktopZoom(e.detail.releasePoint);
}
}
}