mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-10-29 10:20:08 +00:00
some work on cropping, fixed several bugs in Data.updateData(..) and friends...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
84953a947e
commit
2e43544625
@ -422,7 +422,7 @@ module.DataPrototype = {
|
||||
// normalize the list to a sparse list of gids...
|
||||
list = list == null ?
|
||||
this.ribbons[this.getRibbon(target)]
|
||||
: list.constructor.name == 'Array' ?
|
||||
: list.constructor === Array ?
|
||||
this.makeSparseImages(list)
|
||||
: this.ribbons[this.getRibbon(list)]
|
||||
|
||||
@ -1348,13 +1348,43 @@ module.DataPrototype = {
|
||||
//
|
||||
// XXX flatten as an option...
|
||||
// XXX should this link to .root and .parent data???
|
||||
crop: function(list){
|
||||
crop: function(list, flatten){
|
||||
var crop = this.clone()
|
||||
list = crop.makeSparseImages(list)
|
||||
for(var k in crop.ribbons){
|
||||
crop.ribbons[k] = crop.makeSparseImages(crop.ribbons[k].filter(function(_, i){
|
||||
return list[i] != null
|
||||
}))
|
||||
|
||||
if(!flatten){
|
||||
// place images in ribbons...
|
||||
for(var k in crop.ribbons){
|
||||
crop.ribbons[k] = crop.makeSparseImages(crop.ribbons[k].filter(function(_, i){
|
||||
return list[i] != null
|
||||
}))
|
||||
}
|
||||
|
||||
// flatten the crop...
|
||||
} else {
|
||||
crop.ribbons = {}
|
||||
crop.ribbon_order = []
|
||||
crop.ribbons[crop.newRibbon()] = list
|
||||
}
|
||||
|
||||
// clear empty ribbons...
|
||||
Object.keys(crop.ribbons)
|
||||
.forEach(function(k){
|
||||
if(crop.ribbons[k].length == 0){
|
||||
crop.ribbon_order.splice(crop.ribbon_order.indexOf(k), 1)
|
||||
delete crop.ribbons[k]
|
||||
}
|
||||
})
|
||||
|
||||
// set the current image in the crop...
|
||||
var r = this.getRibbon()
|
||||
// if current ribbon is not empty get the closest image in it...
|
||||
if(r in crop.ribbons && crop.ribbons[r].length > 0){
|
||||
crop.focusImage(this.current, 'after', this.getRibbon())
|
||||
|
||||
// if ribbon got deleted, get the closest loaded image...
|
||||
} else {
|
||||
crop.focusImage(this.current, list)
|
||||
}
|
||||
|
||||
// XXX ???
|
||||
|
||||
@ -203,7 +203,6 @@ module.RibbonsPrototype = {
|
||||
getComputedStyle(v).transition
|
||||
}
|
||||
},
|
||||
|
||||
noTransitions: function(func){
|
||||
this.preventTransitions()
|
||||
func.apply(this, args2array(arguments).slice(1))
|
||||
@ -966,14 +965,18 @@ module.RibbonsPrototype = {
|
||||
}))
|
||||
},
|
||||
|
||||
// update a set of images in a ribbon...
|
||||
// Update a set of images in a ribbon...
|
||||
//
|
||||
// This will reuse the images that already exist, thus if updating or
|
||||
// adding images to an already loaded set this should be very fast.
|
||||
//
|
||||
// NOTE: gids and ribbon must be .getImage(..) and .getRibbon(..)
|
||||
// compatible...
|
||||
//
|
||||
// XXX at this point this expects gids to be a list of gids, need
|
||||
// to make this compatible with jQuery collections...
|
||||
updateRibbon: function(gids, ribbon){
|
||||
var that = this
|
||||
// get/create the ribbon...
|
||||
var r = this.getRibbon(ribbon)
|
||||
if(r.length == 0){
|
||||
@ -982,24 +985,30 @@ module.RibbonsPrototype = {
|
||||
}
|
||||
|
||||
var loaded = r.find('.image')
|
||||
|
||||
// remove all images that we do not need...
|
||||
loaded = loaded
|
||||
.filter(function(i, img){
|
||||
// XXX .indexOf(..) will not work for a jQuery collection...
|
||||
if(gids.indexOf(that.getElemGID($(img))) >= 0){
|
||||
return true
|
||||
}
|
||||
$(img).remove()
|
||||
return false
|
||||
})
|
||||
|
||||
var that = this
|
||||
$(gids).each(function(i, gid){
|
||||
// support for sparse ribbons...
|
||||
if(gid == null){
|
||||
return
|
||||
}
|
||||
// get/create image...
|
||||
// XXX this may affect other ribbons...
|
||||
var img = that.getImage(gid)
|
||||
img = img.length == 0 ? that.createImage(gid) : img
|
||||
|
||||
// clear a chunk of images that are not in gids until one that is...
|
||||
// see of we are loaded in the right position...
|
||||
var g = loaded.length > i ? that.getElemGID(loaded.eq(i)) : null
|
||||
while(g != null && gids.indexOf(g) < 0){
|
||||
that.clear(g)
|
||||
loaded.splice(i, 1)
|
||||
g = loaded.length > i ? that.getElemGID(loaded.eq(i)) : null
|
||||
}
|
||||
|
||||
// check if we need to reattach the image...
|
||||
if(gid != g){
|
||||
@ -1111,14 +1120,9 @@ module.RibbonsPrototype = {
|
||||
// clear the ribbons that did not get updated...
|
||||
if(!settings.keep_ribbons
|
||||
&& (data.ribbon_order != null || data.ribbons != null)){
|
||||
var ribbons = []
|
||||
ribbons = data.ribbon_order != null
|
||||
? ribbons.concat(Object.keys(data.ribbon_order))
|
||||
: ribbons
|
||||
ribbons = data.ribbons != null
|
||||
? ribbons.concat(Object.keys(data.ribbons))
|
||||
: ribbons
|
||||
ribbons.push(data.base)
|
||||
var ribbons = data.ribbon_order != null ? data.ribbon_order.slice()
|
||||
: data.ribbons != null ? Object.keys(data.ribbons)
|
||||
: []
|
||||
|
||||
that.viewer.find('.ribbon').each(function(){
|
||||
var r = $(this)
|
||||
|
||||
@ -49,11 +49,14 @@ module.GLOBAL_KEYBOARD = {
|
||||
pattern: '*',
|
||||
|
||||
F4: {
|
||||
alt: 'close',
|
||||
/*
|
||||
alt: doc('Close viewer',
|
||||
function(){
|
||||
window.close()
|
||||
return false
|
||||
}),
|
||||
*/
|
||||
},
|
||||
F5: doc('Full reload viewer',
|
||||
function(){
|
||||
@ -66,25 +69,13 @@ module.GLOBAL_KEYBOARD = {
|
||||
location.reload()
|
||||
return false
|
||||
}),
|
||||
F12: doc('Show devTools',
|
||||
function(){
|
||||
if(window.showDevTools != null){
|
||||
showDevTools()
|
||||
return false
|
||||
|
||||
// if no showDevTools defined pass the button further...
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
}),
|
||||
F12: 'showDevTools',
|
||||
// NOTE: these are for systems where F** keys are not available
|
||||
// or do other stuff...
|
||||
R: {
|
||||
'ctrl+alt': 'reload!',
|
||||
default: 'reverseImages!',
|
||||
ctrl: 'reload!',
|
||||
'ctrl+shift': 'F5',
|
||||
|
||||
// XXX testing...
|
||||
ctrl: 'reverseImages!',
|
||||
},
|
||||
P: {
|
||||
'ctrl+shift': 'F12',
|
||||
|
||||
@ -350,33 +350,46 @@ actions.Actions({
|
||||
|
||||
// crop...
|
||||
//
|
||||
// XXX
|
||||
crop: [
|
||||
function(list){
|
||||
function(list, flatten){
|
||||
list = list || this.data.order
|
||||
if(this.crop_stack == null){
|
||||
this.crop_stack = []
|
||||
}
|
||||
|
||||
this.crop_stack.push(this.data)
|
||||
this.data = this.data.crop(list)
|
||||
|
||||
this.focusImage()
|
||||
this.data = this.data.crop(list, flatten)
|
||||
}],
|
||||
// XXX add level...
|
||||
uncrop: ['',
|
||||
function(){
|
||||
uncrop: ['Uncrop ribbons',
|
||||
function(level, restore_current){
|
||||
level = level || 1
|
||||
|
||||
var cur = this.current
|
||||
|
||||
if(this.crop_stack == null){
|
||||
return
|
||||
}
|
||||
|
||||
this.data = this.crop_stack.pop()
|
||||
// uncrop all...
|
||||
if(level == 'all'){
|
||||
this.data = this.crop_stack[0]
|
||||
this.crop_stack = []
|
||||
|
||||
if(this.crop_stack.length == 0){
|
||||
delete this.crop_stac
|
||||
// get the element at level and drop the tail...
|
||||
} else {
|
||||
this.data = this.crop_stack.splice(-level, this.crop_stack.length)[0]
|
||||
}
|
||||
|
||||
this.focusImage()
|
||||
// by default set the current from the crop...
|
||||
if(!restore_current){
|
||||
this.data.focusImage(cur)
|
||||
}
|
||||
|
||||
if(this.crop_stack.length == 0){
|
||||
delete this.crop_stack
|
||||
}
|
||||
}],
|
||||
uncropAll: ['',
|
||||
function(restore_current){ this.uncrop('all', restore_current) }],
|
||||
// XXX same as uncrop but will also try and merge changes...
|
||||
mergeCrop: ['',
|
||||
function(){
|
||||
@ -427,22 +440,27 @@ actions.Actions(Client, {
|
||||
}],
|
||||
|
||||
|
||||
// XXX move this to a viewer window action set
|
||||
close: ['Cloase viewer',
|
||||
function(){
|
||||
// XXX should we do anything else here like auto-save???
|
||||
window.close()
|
||||
}],
|
||||
// XXX where should toggleFullscreenMode(..) be defined...
|
||||
toggleFullScreen: ['',
|
||||
function(){
|
||||
// XXX
|
||||
toggleFullscreenMode()
|
||||
}],
|
||||
toggleSingleImage: ['',
|
||||
function(){
|
||||
// XXX
|
||||
}],
|
||||
// XXX revise this...
|
||||
showDevTools: ['',
|
||||
function(){
|
||||
// XXX
|
||||
if(window.showDevTools != null){
|
||||
showDevTools()
|
||||
}
|
||||
}],
|
||||
|
||||
|
||||
@ -641,6 +659,30 @@ actions.Actions(Client, {
|
||||
|
||||
crop: [ reloadAfter() ],
|
||||
uncrop: [ reloadAfter() ],
|
||||
|
||||
// XXX need flat version of these...
|
||||
cropRibbon: ['Crop current ribbon',
|
||||
function(ribbon, flatten){
|
||||
ribbon = ribbon || 'current'
|
||||
this.crop(this.data.getImages(ribbon), flatten)
|
||||
}],
|
||||
cropRibbonAndAbove: ['',
|
||||
function(ribbon, flatten){
|
||||
ribbon = ribbon || this.data.getRibbon()
|
||||
|
||||
var data = this.data
|
||||
var that = this
|
||||
|
||||
var i = data.ribbon_order.indexOf(ribbon)
|
||||
var ribbons = data.ribbon_order.slice(0, i)
|
||||
var images = ribbons
|
||||
.reduce(function(a, b){
|
||||
return data.getImages(a).concat(data.getImages(b))
|
||||
}, data.getImages(ribbon))
|
||||
.compact()
|
||||
|
||||
this.crop(data.getImages(images), flatten)
|
||||
}],
|
||||
})
|
||||
|
||||
|
||||
@ -678,6 +720,7 @@ module.Animation = {
|
||||
}
|
||||
|
||||
|
||||
// XXX
|
||||
var CurrentIndicator =
|
||||
module.CurrentIndicator = {
|
||||
tag: 'ui-current-indicator',
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user