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'+
'Rotated: '+orientation+'°CW') : ''
+ // 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){