diff --git a/ui/base.js b/ui/base.js index de4c8c2c..9f2d1185 100755 --- a/ui/base.js +++ b/ui/base.js @@ -917,13 +917,9 @@ function setImageFlipState(image, state){ return image } -// XXX not yet implemented... -// ...mostly because it will conflict with turning and require a -// very tightly woven with rotation code, both JS and CSS... -// i.e. requiring two sets of rotation styles, one for flipped -// and another for horizontally flipped image. -// ...at least flipping will not affect the square/viewer aspect -// ratio of images. +// direction can be: +// - 'vertical' +// - 'horizontal' function flipImage(direction, image){ image = image == null ? getImage() : $(image) image.each(function(i, e){ diff --git a/ui/data.js b/ui/data.js index ce5d21e0..acb35c9e 100755 --- a/ui/data.js +++ b/ui/data.js @@ -55,12 +55,24 @@ var STUB_IMAGE_DATA = { classes: '', // Image orientation + // // can be: // - 0 (default) - load as-is // - 90 - rotate 90deg CW // - 180 - rotate 180deg CW // - 270 - rotate 270deg CW (90deg CCW) orientation: 0, + + // Image flip state + // + // can be: + // - null/undefined + // - array + // + // can contain: + // - 'vertical' + // - 'horizontal' + flipped: null, } // Data format... @@ -751,6 +763,11 @@ function updateImage(image, gid, size){ orientation: img_data.orientation == null ? 0 : img_data.orientation, }) + // flip... + if(img_data.flipped != null){ + setImageFlipState(image, img_data.flipped) + } + // marks... if(MARKED.indexOf(gid) != -1){ image.addClass('marked') diff --git a/ui/info.js b/ui/info.js index d54ac4d0..85625468 100755 --- a/ui/info.js +++ b/ui/info.js @@ -42,6 +42,9 @@ function updateGlobalImageInfo(image){ 'R'+ '') : '' + // XXX + //var flip = data.flip + meta = meta.join(', ') meta = meta != '' ? '( '+ meta +' )' : '' diff --git a/ui/setup.js b/ui/setup.js index 8d45df7a..228dcc5d 100755 --- a/ui/setup.js +++ b/ui/setup.js @@ -186,6 +186,20 @@ function setupDataBindings(viewer){ } }) }) + .on('flippingVertical flippingHorizontal', function(evt, image){ + $(image).each(function(i, e){ + var img = $(this) + var gid = getImageGID(img) + var flip = getImageFlipState(img) + + // change the image orientation status and add to + // updated list... + IMAGES[gid].flipped = flip + if(IMAGES_UPDATED.indexOf(gid) == -1){ + IMAGES_UPDATED.push(gid) + } + }) + }) // marks... @@ -250,6 +264,8 @@ function setupDataBindings(viewer){ 'focusingImage', 'rotatingLeft', 'rotateingRight', + 'flippingVertical', + 'flippingHorizontal', 'togglingMark' ].join(' '), function(evt, image){