mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-10-30 10:50:08 +00:00
rewritten the getVisibleImageSize(...), now its more general, and some tweaking...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
d41452a766
commit
5267e018ad
20
ui/base.js
20
ui/base.js
@ -133,11 +133,23 @@ function getRelativeVisualPosition(outer, inner){
|
|||||||
|
|
||||||
// Returns the image size (width) as viewed on screen...
|
// Returns the image size (width) as viewed on screen...
|
||||||
//
|
//
|
||||||
// NOTE: dim can be either 'height' or 'width', this dimension will be
|
// dim can be:
|
||||||
// used as image "diameter" (default: width)
|
// - 'width' (default)
|
||||||
|
// - 'height'
|
||||||
|
// - 'min'
|
||||||
|
// - 'max'
|
||||||
function getVisibleImageSize(dim){
|
function getVisibleImageSize(dim){
|
||||||
dim = dim != 'height' ? 'outerWidth' : 'outerHeight'
|
dim = dim == null ? 'width' : dim
|
||||||
return $('.image')[dim]() * getElementScale($('.ribbon-set'))
|
var scale = getElementScale($('.ribbon-set'))
|
||||||
|
if(dim == 'height'){
|
||||||
|
return $('.image').outerHeight() * scale
|
||||||
|
} else if(dim == 'width'){
|
||||||
|
return $('.image').outerWidth() * scale
|
||||||
|
} else if(dim == 'max'){
|
||||||
|
return Math.max($('.image').outerHeight(), $('.image').outerWidth()) * scale
|
||||||
|
} else if(dim == 'min'){
|
||||||
|
return Math.min($('.image').outerHeight(), $('.image').outerWidth()) * scale
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
14
ui/data.js
14
ui/data.js
@ -241,7 +241,7 @@ function getImageGIDs(from, count, ribbon, inclusive){
|
|||||||
//
|
//
|
||||||
// NOTE: this will use the original if everything else is smaller...
|
// NOTE: this will use the original if everything else is smaller...
|
||||||
function getBestPreview(gid, size){
|
function getBestPreview(gid, size){
|
||||||
size = size == null ? getVisibleImageSize() : size
|
size = size == null ? getVisibleImageSize('max') : size
|
||||||
var s
|
var s
|
||||||
var img_data = DATA.images[gid]
|
var img_data = DATA.images[gid]
|
||||||
var url = img_data.path
|
var url = img_data.path
|
||||||
@ -275,7 +275,7 @@ function updateImage(image, gid, size){
|
|||||||
} else {
|
} else {
|
||||||
image.attr('gid', JSON.stringify(gid))
|
image.attr('gid', JSON.stringify(gid))
|
||||||
}
|
}
|
||||||
size = size == null ? getVisibleImageSize() : size
|
size = size == null ? getVisibleImageSize('max') : size
|
||||||
|
|
||||||
// update image order...
|
// update image order...
|
||||||
image.attr({
|
image.attr({
|
||||||
@ -308,7 +308,7 @@ function updateImage(image, gid, size){
|
|||||||
|
|
||||||
// shorthand...
|
// shorthand...
|
||||||
function updateImages(size){
|
function updateImages(size){
|
||||||
size = size == null ? getVisibleImageSize() : size
|
size = size == null ? getVisibleImageSize('max') : size
|
||||||
return $('.image').each(function(){
|
return $('.image').each(function(){
|
||||||
updateImage($(this), null, size)
|
updateImage($(this), null, size)
|
||||||
})
|
})
|
||||||
@ -361,7 +361,7 @@ function loadImages(ref_gid, count, ribbon){
|
|||||||
: j > 0 ? -(old_gids.length - j - 1)
|
: j > 0 ? -(old_gids.length - j - 1)
|
||||||
: 0
|
: 0
|
||||||
|
|
||||||
var size = getVisibleImageSize()
|
var size = getVisibleImageSize('max')
|
||||||
|
|
||||||
// XXX the next section might need some simplification -- feels bulky...
|
// XXX the next section might need some simplification -- feels bulky...
|
||||||
// check if we have a common section at all / full reload...
|
// check if we have a common section at all / full reload...
|
||||||
@ -444,7 +444,7 @@ function rollImages(n, ribbon, extend, no_compensate_shift){
|
|||||||
images = rollRibbon(gids.length * (n > 0 ? 1 : -1), ribbon, extend, no_compensate_shift)
|
images = rollRibbon(gids.length * (n > 0 ? 1 : -1), ribbon, extend, no_compensate_shift)
|
||||||
}
|
}
|
||||||
|
|
||||||
var size = getVisibleImageSize()
|
var size = getVisibleImageSize('max')
|
||||||
images.each(function(i, e){
|
images.each(function(i, e){
|
||||||
updateImage($(e), gids[i], size)
|
updateImage($(e), gids[i], size)
|
||||||
})
|
})
|
||||||
@ -565,8 +565,8 @@ function saveLocalStorageMarks(attr){
|
|||||||
// NOTE: this will always overwrite the previous cache set for a ribbon...
|
// NOTE: this will always overwrite the previous cache set for a ribbon...
|
||||||
function preCacheRibbonImages(ribbon){
|
function preCacheRibbonImages(ribbon){
|
||||||
var i = getRibbonIndex(ribbon)
|
var i = getRibbonIndex(ribbon)
|
||||||
var size = getVisibleImageSize()
|
var size = getVisibleImageSize('max')
|
||||||
var screen_size = getScreenWidthInImages(size)
|
var screen_size = getScreenWidthInImages(getVisibleImageSize())
|
||||||
var cache_frame_size = (screen_size * LOAD_SCREENS) / 2
|
var cache_frame_size = (screen_size * LOAD_SCREENS) / 2
|
||||||
var images = ribbon.find('.image')
|
var images = ribbon.find('.image')
|
||||||
var first = getImageGID(images.first())
|
var first = getImageGID(images.first())
|
||||||
|
|||||||
@ -18,6 +18,7 @@ var toggleSingleImageMode = createCSSClassToggler('.viewer',
|
|||||||
fitNImages(1)
|
fitNImages(1)
|
||||||
} else {
|
} else {
|
||||||
TRANSITION_MODE_DEFAULT = 'animate'
|
TRANSITION_MODE_DEFAULT = 'animate'
|
||||||
|
toggleImageProportions('square')
|
||||||
fitNImages(5)
|
fitNImages(5)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user