mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-11-01 03:40:09 +00:00
fixed an old bug relating to image proportions, still need to smooth things out a bit...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
893436d9d4
commit
93ffb9bb21
36
ui/TODO.otl
36
ui/TODO.otl
@ -108,8 +108,34 @@ Roadmap
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
[_] 28% Gen 3 current todo
|
[_] 29% Gen 3 current todo
|
||||||
[_] 57% High priority
|
[_] 58% High priority
|
||||||
|
[_] BUG: zooming vertical images in single image view results in size jumping...
|
||||||
|
| Reason:
|
||||||
|
| This is due to the proportion ratio changing in one step...
|
||||||
|
|
|
||||||
|
| Solution:
|
||||||
|
| Make the proportion transition smoothly, at least in two zoom-steps
|
||||||
|
[X] BUG: jumping more than one image in single image view messes up scale...
|
||||||
|
|
|
||||||
|
| Procedure:
|
||||||
|
| - load: file:///L:/mnt/hdd13 (photo)/NTFS2/media/img/my/work/- 20131122Y.001/DCIM/preview (RAW)/
|
||||||
|
| - go to single image mode
|
||||||
|
| - press 2
|
||||||
|
| - go to end
|
||||||
|
| - press [ until a long jump between vertical and horizontal pics
|
||||||
|
|
|
||||||
|
| Effect:
|
||||||
|
| - the size of the images will change
|
||||||
|
|
|
||||||
|
| Solution:
|
||||||
|
| moved the proportions mode switch to preFittingImages handler
|
||||||
|
|
|
||||||
|
| Side-effect:
|
||||||
|
| vertical images, in horizontal viewer, and vice-versa jump
|
||||||
|
| in size a bit when zooming past the threshold...
|
||||||
|
| the amount of "jump" depends on viewer proportions vs. image
|
||||||
|
| proportions...
|
||||||
[X] BUG: appear to be leaking memory on very large sets of images (>8K)
|
[X] BUG: appear to be leaking memory on very large sets of images (>8K)
|
||||||
| don't remember it before, so it might be due to the new
|
| don't remember it before, so it might be due to the new
|
||||||
| loadImagesAround(..)
|
| loadImagesAround(..)
|
||||||
@ -266,11 +292,11 @@ Roadmap
|
|||||||
| - open/history/...
|
| - open/history/...
|
||||||
| - sort
|
| - sort
|
||||||
| - export
|
| - export
|
||||||
[_] 50% mark-based operations
|
[_] 55% mark-based operations
|
||||||
[_] 50% cropping selection
|
[_] 75% cropping selection
|
||||||
[X] marked
|
[X] marked
|
||||||
[X] ribbon
|
[X] ribbon
|
||||||
[_] by tag/collection
|
[X] by tag/collection
|
||||||
[_] by group
|
[_] by group
|
||||||
[X] shift up/down
|
[X] shift up/down
|
||||||
[X] tag
|
[X] tag
|
||||||
|
|||||||
30
ui/data.js
30
ui/data.js
@ -660,7 +660,6 @@ function makeGIDBeforeGetterFromList(get_list, restrict_to_ribbon){
|
|||||||
if(list.length == 0){
|
if(list.length == 0){
|
||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
console.log('>>>>', ribbon)
|
|
||||||
gid = gid == null ? getImageGID(null, ribbon) : gid
|
gid = gid == null ? getImageGID(null, ribbon) : gid
|
||||||
var prev
|
var prev
|
||||||
|
|
||||||
@ -2100,6 +2099,17 @@ function setupData(viewer){
|
|||||||
rollImages(gr.length, ribbon)
|
rollImages(gr.length, ribbon)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
.on('preFittingImages', function(evt, n){
|
||||||
|
// update proportions...
|
||||||
|
if(CONFIG.proportions_ratio_threshold != null
|
||||||
|
&& toggleSingleImageMode('?') == 'on'){
|
||||||
|
if(n <= CONFIG.proportions_ratio_threshold){
|
||||||
|
toggleImageProportions('fit-viewer')
|
||||||
|
} else {
|
||||||
|
toggleImageProportions('none')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
.on('fittingImages', function(evt, n){
|
.on('fittingImages', function(evt, n){
|
||||||
//console.log('!!!! fittingImages')
|
//console.log('!!!! fittingImages')
|
||||||
// load correct amount of images in each ribbon!!!
|
// load correct amount of images in each ribbon!!!
|
||||||
@ -2137,24 +2147,6 @@ function setupData(viewer){
|
|||||||
UI_STATE['ribbon-mode-screen-images'] = n
|
UI_STATE['ribbon-mode-screen-images'] = n
|
||||||
}
|
}
|
||||||
|
|
||||||
// update proportions...
|
|
||||||
if(CONFIG.proportions_ratio_threshold != null
|
|
||||||
&& toggleSingleImageMode('?') == 'on'){
|
|
||||||
|
|
||||||
var h = getVisibleImageSize('height')
|
|
||||||
var w = getVisibleImageSize('width')
|
|
||||||
var H = $('.viewer').innerHeight()
|
|
||||||
var W = $('.viewer').innerWidth()
|
|
||||||
|
|
||||||
var m = Math.min(W/w, H/h)
|
|
||||||
|
|
||||||
if(m < CONFIG.proportions_ratio_threshold){
|
|
||||||
toggleImageProportions('fit-viewer')
|
|
||||||
} else {
|
|
||||||
toggleImageProportions('none')
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// update size classes...
|
// update size classes...
|
||||||
// XXX make thresholds global...
|
// XXX make thresholds global...
|
||||||
if(n <= 2.5){
|
if(n <= 2.5){
|
||||||
|
|||||||
51
ui/modes.js
51
ui/modes.js
@ -325,18 +325,57 @@ var toggleInlineImageInfo = createCSSClassToggler(
|
|||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
function setImageProportions(image, mode){
|
||||||
|
var h = image.outerHeight(true)
|
||||||
|
var w = image.outerWidth(true)
|
||||||
|
mode = mode == null ? toggleImageProportions('?') : 'square'
|
||||||
|
mode = mode == 'fit-viewer' ? 'viewer' : 'squzre'
|
||||||
|
|
||||||
|
if(mode == 'viewer'){
|
||||||
|
var viewer = $('.viewer')
|
||||||
|
var W = viewer.innerWidth()
|
||||||
|
var H = viewer.innerHeight()
|
||||||
|
|
||||||
|
if(W > H){
|
||||||
|
image.css('width', W * h/H)
|
||||||
|
} else {
|
||||||
|
image.css('height', H * w/W)
|
||||||
|
}
|
||||||
|
|
||||||
|
// account for rotation...
|
||||||
|
correctImageProportionsForRotation(image)
|
||||||
|
centerView(null, 'css')
|
||||||
|
|
||||||
|
} else {
|
||||||
|
var size = Math.min(w, h)
|
||||||
|
image.css({
|
||||||
|
width: size,
|
||||||
|
height: size
|
||||||
|
})
|
||||||
|
|
||||||
|
// account for rotation...
|
||||||
|
correctImageProportionsForRotation(image)
|
||||||
|
centerView(null, 'css')
|
||||||
|
}
|
||||||
|
|
||||||
|
return image
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
var toggleImageProportions = createCSSClassToggler(
|
var toggleImageProportions = createCSSClassToggler(
|
||||||
'.viewer',
|
'.viewer',
|
||||||
[
|
[
|
||||||
'none',
|
'none',
|
||||||
'fit-viewer'
|
'fit-viewer'
|
||||||
],
|
],
|
||||||
|
/* XXX do we need this???
|
||||||
function(action){
|
function(action){
|
||||||
// prevent reentering...
|
// prevent reentering...
|
||||||
if(action == toggleImageProportions('?')){
|
if(action == toggleImageProportions('?')){
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
*/
|
||||||
function(action){
|
function(action){
|
||||||
var image = $('.image')
|
var image = $('.image')
|
||||||
var h = image.outerHeight(true)
|
var h = image.outerHeight(true)
|
||||||
@ -345,16 +384,22 @@ var toggleImageProportions = createCSSClassToggler(
|
|||||||
// viewer proportions...
|
// viewer proportions...
|
||||||
// XXX going into here twice for a rotated 90/270 image will
|
// XXX going into here twice for a rotated 90/270 image will
|
||||||
// set it back to square...
|
// set it back to square...
|
||||||
// ...can't even begin to imagine what can affect this!
|
// XXX can't reproduce this error...
|
||||||
if(action == 'fit-viewer'){
|
if(action == 'fit-viewer'){
|
||||||
var viewer = $('.viewer')
|
var viewer = $('.viewer')
|
||||||
var W = viewer.innerWidth()
|
var W = viewer.innerWidth()
|
||||||
var H = viewer.innerHeight()
|
var H = viewer.innerHeight()
|
||||||
|
|
||||||
if(W > H){
|
if(W > H){
|
||||||
image.css('width', W * h/H)
|
image.css({
|
||||||
|
width: W * h/H,
|
||||||
|
height: '',
|
||||||
|
})
|
||||||
} else {
|
} else {
|
||||||
image.css('height', H * w/W)
|
image.css({
|
||||||
|
width: '',
|
||||||
|
height: H * w/W,
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
// account for rotation...
|
// account for rotation...
|
||||||
|
|||||||
@ -225,8 +225,8 @@ function getVisibleImageSize(dim){
|
|||||||
|
|
||||||
|
|
||||||
// Return the number of images that can fit to viewer width...
|
// Return the number of images that can fit to viewer width...
|
||||||
function getScreenWidthInImages(size){
|
function getScreenWidthInImages(size, dim){
|
||||||
size = size == null ? getVisibleImageSize() : size
|
size = size == null ? getVisibleImageSize(dim) : size
|
||||||
return $('.viewer').innerWidth() / size
|
return $('.viewer').innerWidth() / size
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user