flynx/ImageGrid
1
1
Fork 0
mirror of https://github.com/flynx/ImageGrid.git synced 2025-12-27 13:32:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

fixed zooming, now uses the correct proportions...

Browse Source 
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2013-05-17 16:03:40 +04:00
parent 7bdc575a05
commit d41452a766
2 changed files with 13 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
ui/base.js
View File

@ -132,8 +132,12 @@ function getRelativeVisualPosition(outer, inner){
// Returns the image size (width) as viewed on screen...
function getVisibleImageSize(){
return $('.image').outerWidth() * getElementScale($('.ribbon-set'))
//
// NOTE: dim can be either 'height' or 'width', this dimension will be
// used as image "diameter" (default: width)
function getVisibleImageSize(dim){
dim = dim != 'height' ? 'outerWidth' : 'outerHeight'
return $('.image')[dim]() * getElementScale($('.ribbon-set'))
}
@ -788,15 +792,17 @@ function fitNImages(n){
}
// NOTE: here we measure image height as width may change depending on
// proportions...
function zoomIn(){
var w = getScreenWidthInImages()
var w = getScreenWidthInImages(getVisibleImageSize('height'))
if(w > 1){
w = w / ZOOM_SCALE
fitNImages(w >= 1 ? w : 1)
}
}
function zoomOut(){
var w = getScreenWidthInImages()
var w = getScreenWidthInImages(getVisibleImageSize('height'))
if(w <= MAX_SCREEN_IMAGES){
w = w * ZOOM_SCALE
fitNImages(w <= MAX_SCREEN_IMAGES ? w : MAX_SCREEN_IMAGES)

5
ui/index.html
View File

@ -257,16 +257,17 @@ body {
.single-image-mode.viewer .image {
background-color: transparent;
border: none;
/* NOTE: need to keep a distance from screen borders... */
border: solid transparent 2px;
}
.single-image-mode.viewer .image:not(.current) {
/* XXX for some reason this breaks the alignment on large magnifications...
display: none;
*/
visibility: hidden;
/* XXX this makes images pass through the :visible filter...
opacity: 0;
*/
visibility: hidden;
}