several minor fixes and tweaks...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2014-11-03 06:05:31 +03:00
parent 4a18ab9ecc
commit e9bfb25e0e
3 changed files with 46 additions and 4 deletions

View File

@ -78,6 +78,15 @@
transition: all 0.2s ease-out; transition: all 0.2s ease-out;
} }
/* XXX not 100% sure about this... */
.current-marker:not(.no-transitions) {
-webkit-transition: left 0.2s ease-out;
-moz-transition: left 0.2s ease-out;
-ms-transition: left 0.2s ease-out;
-o-transition: left 0.2s ease-out;
transition: left 0.2s ease-out;
}
.no-transitions { .no-transitions {
-webkit-transition: none; -webkit-transition: none;
-moz-transition: none; -moz-transition: none;
@ -87,7 +96,6 @@
} }
/* DEBUG stuff... */ /* DEBUG stuff... */
.container-center { .container-center {
position: absolute; position: absolute;

View File

@ -411,7 +411,6 @@ module.RibbonsPrototype = {
// NOTE: placing the shadow in the viewer is a compromise that // NOTE: placing the shadow in the viewer is a compromise that
// lets us do simpler positioning // lets us do simpler positioning
.appendTo(this.viewer) .appendTo(this.viewer)
} }
img.addClass('moving') img.addClass('moving')

View File

@ -1258,6 +1258,11 @@ module.CurrentImageIndicator = Feature({
min_border: 2, min_border: 2,
border_timeout: 200, border_timeout: 200,
shift_timeout: 200,
fadein: 500,
animate: true,
updateMarker: function(actions, target, update_border){ updateMarker: function(actions, target, update_border){
var scale = actions.ribbons.getScale() var scale = actions.ribbons.getScale()
@ -1284,7 +1289,7 @@ module.CurrentImageIndicator = Feature({
.appendTo(ribbon) .appendTo(ribbon)
.animate({ .animate({
'opacity': 1 'opacity': 1
}, 500) }, this.fadein)
// add marker to current ribbon... // add marker to current ribbon...
} else { } else {
@ -1318,10 +1323,21 @@ module.CurrentImageIndicator = Feature({
}, },
setup: function(actions){ setup: function(actions){
var timeout
var that = this var that = this
return actions return actions
// move marker to current image...
.on( 'focusImage.post', this.tag, .on( 'focusImage.post', this.tag,
function(target){ that.updateMarker(this, target) }) function(target){ that.updateMarker(this, target) })
// prevent animations when focusing ribbons...
.on('focusRibbon.pre', this.tag,
function(){
var m = this.ribbons.viewer.find('.current-marker')
this.ribbons.preventTransitions(m)
return function(){
this.ribbons.restoreTransitions(m)
}
})
// Change border size in the appropriate spot in the animation: // Change border size in the appropriate spot in the animation:
// - before animation when scaling up // - before animation when scaling up
// - after when scaling down // - after when scaling down
@ -1333,6 +1349,25 @@ module.CurrentImageIndicator = Feature({
that.updateMarker(this, null, w0 > w1 ? 'before' : 'after') that.updateMarker(this, null, w0 > w1 ? 'before' : 'after')
} }
}) })
// hide marker on shift left/right...
.on([
'shiftImageLeft.pre',
'shiftImageRight.pre',
], this.tag, function(){
this.ribbons.viewer.find('.current-marker').hide()
if(timeout != null){
clearTimeout(timeout)
timeout == null
}
return function(){
var ribbons = this.ribbons
var fadein = that.fadein
timeout = setTimeout(function(){
ribbons.viewer.find('.current-marker').fadeIn(fadein)
}, that.shift_timeout)
}
})
// turn the marker on...
// XXX not sure about this... // XXX not sure about this...
.focusImage() .focusImage()
}, },