several fixes and tweaks: defaults for status and sizes... + more work on jQuery3 migration...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>

ui (gen4)/features/core.js

@@ -304,7 +304,7 @@ module.makeWorkspaceConfigWriter = function(keys, callback){
 	return function(workspace){
 		var that = this
 
-		keys = typeof(keys) == typeof(function(){}) ? keys() : keys
+		keys = typeof(keys) == typeof(function(){}) ? keys.call(this) : keys
 
 		// store data...
 		keys.forEach(function(key){
@@ -322,7 +322,7 @@ module.makeWorkspaceConfigLoader = function(keys, callback){
 	return function(workspace){
 		var that = this
 
-		keys = typeof(keys) == typeof(function(){}) ? keys() : keys
+		keys = typeof(keys) == typeof(function(){}) ? keys.call(this) : keys
 
 		// load data...
 		keys.forEach(function(key){

ui (gen4)/features/ui-single-image.js

@@ -80,8 +80,8 @@ var SingleImageActions = actions.Actions({
 		// View scale...
 		//
 		// NOTE: these will get overwritten if/when the user changes the scale...
-		'single-image-scale': null,
+		'single-image-scale': 1.2,
-		'ribbon-scale': null,
+		'ribbon-scale': 5,
 
 		// Set scale 'units' for different viewes...
 		//

ui (gen4)/features/ui-status.js

@@ -45,7 +45,7 @@ var makeStateIndicatorItem = function(container, type, text){
 // XXX revise how/where info is displayed...
 var StatusBarActions = actions.Actions({
 	config: {
-		'status-bar-mode': 'minimal',
+		'status-bar-mode': 'full',
 		'status-bar-modes': [
 			'none',
 			'minimal',
@@ -221,6 +221,10 @@ var StatusBarActions = actions.Actions({
 			return item
 		},
 		changes: function(item, gid, img){
+			if(this.changes === undefined){
+				return $()
+			}
+
 			if(typeof(item) == typeof('str')){
 				item = $('<span>')
 					.addClass('changes')
@@ -340,7 +344,9 @@ var StatusBarActions = actions.Actions({
 				var bar = this.ribbons.viewer.find('.state-indicator-container.global-info') 
 				if(bar.length == 0){
 					bar = makeStateIndicator('global-info overlay-info statusbar') 
-						.addClass(this.config['status-bar-mode'] || '')
+						.addClass(this.config['status-bar-mode'] 
+							|| this.config['status-bar-modes'][0] 
+							|| '')
 						.on('mouseover', function(){
 							var t = $(event.target)
 							
@@ -361,6 +367,10 @@ var StatusBarActions = actions.Actions({
 			function(){ return this.config['status-bar-modes'] },
 			// XXX check if we will be getting gid reliably...
 			function(state, bar, gid){ 
+				// do not do anything unless the status bar exists...
+				if(bar.length == 0){
+					return
+				}
 				var that = this
 				this.config['status-bar-mode'] = state 
 
@@ -550,16 +560,18 @@ module.StatusBar = core.ImageGridFeatures.Feature({
 				function(){ return Object.keys(StatusBar.config) })],
 		['loadWorkspace',
 			core.makeWorkspaceConfigLoader(
-				function(){ return Object.keys(StatusBar.config) },
+				function(){ 
+					return Object.keys(StatusBar.config) },
 				function(workspace){
 					// XXX not sure about this protocol yet...
 					if(this.workspace == 'ui-chrome-hidden'){
 						this.toggleStatusBar('none')
-						return
-					}
 
-					'status-bar-mode' in workspace 
+					} else {
-						&& this.toggleStatusBar(workspace['status-bar-mode'])
+						'status-bar-mode' in workspace ?
+							this.toggleStatusBar(workspace['status-bar-mode'])
+							: this.toggleStatusBar(this.config['status-bar-mode'])
+					}
 				})],
 	],
 })

ui (gen4)/features/ui.js

@@ -316,9 +316,13 @@ module.ViewerActions = actions.Actions({
 		}],
 	// NOTE: this will trigger .updateImage hooks...
 	refresh: ['Interface/Refresh images without reloading',
-		function(gids){
+		function(gids, scale){
 			gids = gids || '*'
-			this.ribbons.updateImage(gids)
+			var size = scale != null ? 
+				this.ribbons.getVisibleImageSize('min', scale)
+				: null
+
+			this.ribbons.updateImage(gids, null, size)
 		}],
 	clear: [
 		function(){ this.ribbons && this.ribbons.clear() }],
@@ -647,14 +651,16 @@ module.ViewerActions = actions.Actions({
 		function(scale){
 			this.resizing.chainCall(this, function(){
 				this.ribbons && scale && this.ribbons.scale(scale)
-				this.refresh()
+				// NOTE: we pass explicit scale here to compensate for animation...
+				this.refresh('*', scale)
 			}, 'scale', scale)
 		}],
 	fitOrig: ['Zoom/Fit to original scale',
 		function(){ 
 			this.resizing.chainCall(this, function(){
 				this.ribbons.scale(1) 
-				this.refresh()
+				// NOTE: we pass explicit scale here to compensate for animation...
+				this.refresh('*', 1)
 			}, 'scale', 1)
 		}],
 	// NOTE: if this gets a count argument it will fit count images, 
@@ -673,15 +679,17 @@ module.ViewerActions = actions.Actions({
 					count += o
 				}
 				this.ribbons.fitImage(count)
-				this.refresh()
+				// NOTE: we pass explicit scale here to compensate for animation...
+				this.refresh('*', this.ribbons.getScreenWidthImages(1) / count)
 			}, 'screenwidth', count, overflow)
 		}],
-	// NOTE: this does not accout for ribbon spacing...
+	// NOTE: this does not account for ribbon spacing...
 	fitRibbon: ['Zoom/Fit ribbon vertically',
 		function(count, whole){
 			this.resizing.chainCall(this, function(){
 				this.ribbons.fitRibbon(count, whole)
-				this.refresh()
+				// NOTE: we pass explicit scale here to compensate for animation...
+				this.refresh('*', this.ribbons.getScreenHeightRibbons(1, whole) / count)
 			}, 'screenheight', count, whole)
 		}],
 

ui (gen4)/imagegrid/ribbons.js

@@ -519,8 +519,17 @@ var RibbonsPrototype = {
 				this.origin(t, l)
 			}
 
+			// XXX experimental: not sure if this is the right place for this...
+			// 		...think this is a good place because its one spot 
+			// 		that gets used everywhere...
+			// 		...think this is a bad spot because we lose control ho many
+			// 		images of what size get loaded, and wee need to minimize 
+			// 		loading...
+			//this.updateImage('*', null, this.getVisibleImageSize('height', 1) * scale)
+
 			this.dom.setScale(ribbon_set, scale)
 
+
 			/*
 			ribbon_set
 				.velocity('stop')
@@ -597,6 +606,7 @@ var RibbonsPrototype = {
 			} else {
 				var img = this.getImage(a)
 				var io = img.offset()
+				// XXX jQuery3: should we compensate for scale here???
 				var w = img.width()
 				var h = img.height()
 
@@ -635,7 +645,6 @@ var RibbonsPrototype = {
 	// XXX this might break when no images are loaded and proportions 
 	// 		are not square...
 	getVisibleImageSize: function(dim, scale, img){
-		scale = scale || this.scale()
 		dim = dim == null ? 'width' : dim
 		img = img || this.viewer.find(IMAGE)
 		var tmp
@@ -661,8 +670,10 @@ var RibbonsPrototype = {
 				Math.min(img.outerHeight(true), img.outerWidth(true))
 			: null
 
-		// XXX needed for jQuery pre 3.0.0
+		// get size for given scale...
-		//res = res ? res * scale : res
+		if(res && scale){
+			res = (res / this.scale()) * scale
+		}
 
 		// remove the tmp image we created...
 		if(tmp != null){