diff --git a/ui (gen4)/index.html b/ui (gen4)/index.html
index ff605ea7..b611d5ff 100755
--- a/ui (gen4)/index.html
+++ b/ui (gen4)/index.html
@@ -36,9 +36,16 @@
-webkit-transition: all 0.1s ease-in;
-moz-transition: all 0.1s ease-in;
+ -ms-transition: all 0.1s ease-in;
+ -o-transition: all 0.1s ease-in;
transition: all 0.1s ease-in;
}
+.shadow,
.shadow .image {
+ -webkit-transform-origin: 0 0;
+ -moz-transform-origin: 0 0;
+ -ms-transform-origin: 0 0;
+ -o-transform-origin: 0 0;
transform-origin: 0 0;
}
.image.moving {
@@ -49,18 +56,24 @@
.viewer:not(.no-transitions) .ribbon-set {
-webkit-transition: all 0.2s linear, transform 0.2s linear;
-moz-transition: all 0.2s linear, transform 0.2s linear;
+ -ms-transition: all 0.2s linear, transform 0.2s linear;
+ -o-transition: all 0.2s linear, transform 0.2s linear;
transition: all 0.2s linear, transform 0.2s linear;
}
.viewer:not(.no-transitions) .ribbon {
-webkit-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
+ -ms-transition: all 0.2s ease-out;
+ -o-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
}
.no-transitions {
-webkit-transition: none;
-moz-transition: none;
+ -ms-transition: none;
+ -o-transition: none;
transition: none;
}
diff --git a/ui (gen4)/ribbons.js b/ui (gen4)/ribbons.js
index 3047c1d7..16f738ec 100755
--- a/ui (gen4)/ribbons.js
+++ b/ui (gen4)/ribbons.js
@@ -339,17 +339,17 @@ module.RibbonsPrototype = {
var img = this.getImage(target)
var gid = this.getElemGID(img)
var s = this.getScale()
- var shadow = $('
')
+ var shadow = setElementScale($('
')
.addClass('shadow')
- .append(setElementScale(
+ .append(
img
.clone()
.removeClass('current')
- .attr('gid', null), s))
+ .attr('gid', null))
.css({
- width: img.width()*s,
- height: img.height()*s,
- })
+ width: img.width(),
+ height: img.height(),
+ }), s)
.css(img.offset())
.appendTo(this.viewer)
img.addClass('moving')
diff --git a/ui (gen4)/viewer.js b/ui (gen4)/viewer.js
index 69cd5d8e..0594fc2f 100755
--- a/ui (gen4)/viewer.js
+++ b/ui (gen4)/viewer.js
@@ -190,15 +190,19 @@ actions.Actions({
// basic ribbon editing...
//
// NOTE: for all of these, current/ribbon image is a default...
- //
- // XXX move this out to a mixin...
+
+ // XXX to be used for things like mark/place and dragging...
+ shiftImageTo: ['',
+ function(target, to){
+ // XXX
+ }],
shiftImageUp: ['Shift image up',
'If implicitly shifting current image (i.e. no arguments), focus '
+'will shift to the next or previous image in the current '
+'ribbon depending on current direction.',
function(target){
- // by default we need to update the current position...
+ // by default we need to focus another image in the same ribbon...
if(target == null){
var direction = this.direction == 'right' ? 'next' : 'prev'
@@ -221,7 +225,7 @@ actions.Actions({
+'will shift to the next or previous image in the current '
+'ribbon depending on current direction.',
function(target){
- // by default we need to update the current position...
+ // by default we need to focus another image in the same ribbon...
if(target == null){
var direction = this.direction == 'right' ? 'next' : 'prev'
@@ -506,22 +510,28 @@ actions.Actions(Client, {
function(){ }],
- // XXX these are cheating...
+ // XXX are these cheating???
shiftImageUp: [
function(target){
+ // prevent animations form adding/removing ribbons...
this.ribbons.preventTransitions()
return function(){
this.ribbons.restoreTransitions()
+ // NOTE: this may seem like cheating, but .reload() should
+ // be very efficient, reusing all of the items loaded...
this.reload()
}
}],
shiftImageDown: [
function(target){
+ // prevent animations form adding/removing ribbons...
this.ribbons.preventTransitions()
return function(){
this.ribbons.restoreTransitions()
+ // NOTE: this may seem like cheating, but .reload() should
+ // be very efficient, reusing all of the items loaded...
this.reload()
}
}],