mirror of
				https://github.com/flynx/ImageGrid.git
				synced 2025-10-31 03:10:07 +00:00 
			
		
		
		
	some refactoring and preparing for more...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
		
							parent
							
								
									5762735766
								
							
						
					
					
						commit
						0ac1d5a523
					
				| @ -15,12 +15,39 @@ var core = require('features/core') | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| /*********************************************************************/ | ||||
| 
 | ||||
| var RibbonsClassPrototype = { | ||||
| } | ||||
| 
 | ||||
| 
 | ||||
| var RibbonsPrototype = { | ||||
| 	getImage: function(){ | ||||
| 		// XXX
 | ||||
| 	}, | ||||
| 	getImageByPosition: function(){ | ||||
| 		// XXX
 | ||||
| 	}, | ||||
| 	getRibbon: function(){ | ||||
| 		// XXX
 | ||||
| 	}, | ||||
| } | ||||
| 
 | ||||
| 
 | ||||
| var Ribbons = | ||||
| module.Ribbons = | ||||
| object.makeConstructor('Ribbons',  | ||||
| 	RibbonsClassPrototype, | ||||
| 	RibbonsPrototype) | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| /*********************************************************************/ | ||||
| 
 | ||||
| var RenderActions = actions.Actions({ | ||||
| 	load: [ | ||||
| 		function(){ | ||||
| 			// XXX
 | ||||
| 			// XXX setup .ribbons
 | ||||
| 		}], | ||||
| 	reload: [ | ||||
| 		function(){ | ||||
|  | ||||
| @ -70,7 +70,7 @@ module.Clickable = core.ImageGridFeatures.Feature({ | ||||
| 								// this will prevent double clicks...
 | ||||
| 								x = null | ||||
| 								y = null | ||||
| 								that.focusImage(that.ribbons.getElemGID($(this))) | ||||
| 								that.focusImage(that.ribbons.elemGID($(this))) | ||||
| 								last = Date.now() | ||||
| 							} | ||||
| 						}) | ||||
| @ -190,11 +190,11 @@ module.DirectControlHammer = core.ImageGridFeatures.Feature({ | ||||
| 
 | ||||
| 								// silently focus central image...
 | ||||
| 								if(that.config['focus-central-image'] == 'silent'){ | ||||
| 									that.data.current = that.ribbons.getElemGID(central) | ||||
| 									that.data.current = that.ribbons.elemGID(central) | ||||
| 									 | ||||
| 								// focus central image in a normal manner...
 | ||||
| 								} else if(that.config['focus-central-image']){ | ||||
| 									that.focusImage(that.ribbons.getElemGID(central)) | ||||
| 									that.focusImage(that.ribbons.elemGID(central)) | ||||
| 								} | ||||
| 
 | ||||
| 								setTimeout(function(){ | ||||
|  | ||||
| @ -45,7 +45,7 @@ var PartialRibbonsActions = actions.Actions({ | ||||
| 	updateRibbon: ['- Interface/Update partial ribbon size',  | ||||
| 		function(target, w, size, threshold, preload){ | ||||
| 			target = target instanceof jQuery  | ||||
| 				? this.ribbons.getElemGID(target) | ||||
| 				? this.ribbons.elemGID(target) | ||||
| 				// NOTE: data.getImage(..) can return null at start or end
 | ||||
| 				// 		of ribbon, thus we need to account for this...
 | ||||
| 				: (this.data.getImage(target) | ||||
|  | ||||
| @ -109,7 +109,7 @@ var PreCacheActions = actions.Actions({ | ||||
| 	preCacheJumpTargets: ['- Interface/Pre-cache potential jump target images', | ||||
| 		function(target, sources, radius, size){ | ||||
| 			target = target instanceof jQuery  | ||||
| 				? this.ribbons.getElemGID(target) | ||||
| 				? this.ribbons.elemGID(target) | ||||
| 				// NOTE: data.getImage(..) can return null at start or end
 | ||||
| 				// 		of ribbon, thus we need to account for this...
 | ||||
| 				: (this.data.getImage(target) | ||||
|  | ||||
| @ -61,8 +61,7 @@ var Ribbons = { | ||||
| 	restoreTransitions: null, | ||||
| 	noTransitions: null, | ||||
| 	noTransitionsDeep: null, | ||||
| 	getElemGID: null, | ||||
| 	setElemGID: null, | ||||
| 	elemGID: null, | ||||
| 	replaceGid: null, | ||||
| 
 | ||||
| 	makeShadow: null, | ||||
| @ -518,7 +517,7 @@ var PartialRibbonsActions = actions.Actions({ | ||||
| 	updateRibbon: ['- Interface/Update partial ribbon size',  | ||||
| 		function(target, w, size, threshold){ | ||||
| 			target = target instanceof jQuery  | ||||
| 				? this.ribbons.getElemGID(target) | ||||
| 				? this.ribbons.elemGID(target) | ||||
| 				// NOTE: data.getImage(..) can return null at start or end
 | ||||
| 				// 		of ribbon, thus we need to account for this...
 | ||||
| 				: (this.data.getImage(target) | ||||
|  | ||||
| @ -32,10 +32,10 @@ function updateImagePosition(actions, target){ | ||||
| 
 | ||||
| 	target = target || actions.current | ||||
| 	target = target instanceof jQuery  | ||||
| 		? actions.ribbons.getElemGID(target)  | ||||
| 		? actions.ribbons.elemGID(target)  | ||||
| 		: target | ||||
| 
 | ||||
| 	var source_ribbon = actions.ribbons.getElemGID(actions.ribbons.getRibbon(target)) | ||||
| 	var source_ribbon = actions.ribbons.elemGID(actions.ribbons.getRibbon(target)) | ||||
| 	var source_order = actions.data.getImageOrder(target) | ||||
| 
 | ||||
| 	return function(){ | ||||
| @ -106,18 +106,6 @@ actions.Actions({ | ||||
| 		return this.ribbons ? this.ribbons.viewer : undefined }, | ||||
| 	 | ||||
| 
 | ||||
| 	// NOTE: this expects that ribbons will maintain .parent.images...
 | ||||
| 	// NOTE: when getting rid of ribbons need to also remove the .parent
 | ||||
| 	// 		reference...
 | ||||
| 	// XXX remove...
 | ||||
| 	get ribbons(){ | ||||
| 		return this.__ribbons }, | ||||
| 	set ribbons(ribbons){ | ||||
| 		this.__ribbons = ribbons | ||||
| 		ribbons.parent = this | ||||
| 	}, | ||||
| 
 | ||||
| 
 | ||||
| 	load: [ | ||||
| 		function(data){ | ||||
| 			return function(){ | ||||
| @ -283,7 +271,7 @@ actions.Actions({ | ||||
| 	centerImage: ['- Interface/Center an image in ribbon horizontally', | ||||
| 		function(target, align, offset, scale){ | ||||
| 			target = target instanceof jQuery  | ||||
| 				? this.ribbons.getElemGID(target) | ||||
| 				? this.ribbons.elemGID(target) | ||||
| 				: target | ||||
| 
 | ||||
| 			// align current ribbon...
 | ||||
| @ -292,7 +280,7 @@ actions.Actions({ | ||||
| 	centerRibbon: ['- Interface/Center a ribbon vertically', | ||||
| 		function(target){ | ||||
| 			target = target instanceof jQuery  | ||||
| 				? this.ribbons.getElemGID(target) | ||||
| 				? this.ribbons.elemGID(target) | ||||
| 				: target | ||||
| 
 | ||||
| 			// align current ribbon...
 | ||||
| @ -323,7 +311,7 @@ actions.Actions({ | ||||
| 					t = t.eq(direction == 'before' ? 0 : 1) | ||||
| 				} | ||||
| 
 | ||||
| 				t = ribbons.getElemGID(t) | ||||
| 				t = ribbons.elemGID(t) | ||||
| 
 | ||||
| 				this.focusImage(t, r) | ||||
| 			} | ||||
| @ -612,7 +600,7 @@ actions.Actions({ | ||||
| 	updateRibbon: ['- Interface/Update partial ribbon size',  | ||||
| 		function(target, w, size, threshold){ | ||||
| 			target = target instanceof jQuery  | ||||
| 				? this.ribbons.getElemGID(target) | ||||
| 				? this.ribbons.elemGID(target) | ||||
| 				// NOTE: data.getImage(..) can return null at start or end
 | ||||
| 				// 		of ribbon, thus we need to account for this...
 | ||||
| 				: (this.data.getImage(target) | ||||
|  | ||||
| @ -18,28 +18,6 @@ var core = require('features/core') | ||||
| 
 | ||||
| 
 | ||||
| /*********************************************************************/ | ||||
| 
 | ||||
| /*/ XXX | ||||
| var ViewerClassPrototype = { | ||||
| } | ||||
| 
 | ||||
| 
 | ||||
| var ViewerPrototype = { | ||||
| 	sync: function(){ | ||||
| 	}, | ||||
| } | ||||
| 
 | ||||
| 
 | ||||
| var Viewer = | ||||
| module.Viewer = | ||||
| object.makeConstructor('Viewer',  | ||||
| 	ViewerClassPrototype, | ||||
| 	ViewerPrototype) | ||||
| //*/
 | ||||
| 
 | ||||
| 
 | ||||
| //---------------------------------------------------------------------
 | ||||
| //
 | ||||
| //	- take care of DOM construction and update...
 | ||||
| //	- alignment is done via .centerRibbon(..) / .centerImage(..)
 | ||||
| //	- preview updates (XXX)
 | ||||
| @ -51,7 +29,7 @@ var VirtualDOMRibbonsClassPrototype = { | ||||
| 
 | ||||
| var VirtualDOMRibbonsPrototype = { | ||||
| 	// XXX this is a circular ref -- I do not like it...
 | ||||
| 	imagegrid: null, | ||||
| 	parent: null, | ||||
| 
 | ||||
| 	dom: null, | ||||
| 	vdom: null, | ||||
| @ -77,23 +55,28 @@ var VirtualDOMRibbonsPrototype = { | ||||
| 	}, | ||||
| 	restoreTransitions: function(){ | ||||
| 	}, | ||||
| 	getElemGID: function(){ | ||||
| 	elemGID: function(){ | ||||
| 	}, | ||||
| 	getImage: function(){ | ||||
| 	}, | ||||
| 	getImageByPosition: function(){ | ||||
| 	}, | ||||
| 	getRibbon: function(){ | ||||
| 	}, | ||||
| 	getVisibleImageSize: function(){ | ||||
| 	}, | ||||
| 	focusImage: function(){ | ||||
| 	}, | ||||
| 	px2vmin: function(){ | ||||
| 	}, | ||||
| 	// ...
 | ||||
| 
 | ||||
| 
 | ||||
| 	// constructors...
 | ||||
| 	makeView: function(state, initial){ | ||||
| 		state = state || {} | ||||
| 		var that = this | ||||
| 		var ig = this.imagegrid | ||||
| 		var ig = this.parent | ||||
| 
 | ||||
| 		var target = state.target || ig.current | ||||
| 
 | ||||
| @ -133,7 +116,7 @@ var VirtualDOMRibbonsPrototype = { | ||||
| 	makeRibbon: function(gid, target, count, state, initial){ | ||||
| 		state = state || {} | ||||
| 		var that = this | ||||
| 		var ig = this.imagegrid | ||||
| 		var ig = this.parent | ||||
| 		var current = ig.current | ||||
| 		target = target || state.target || current | ||||
| 		var size = this.state.tile_size = state.tile_size | ||||
| @ -201,13 +184,13 @@ var VirtualDOMRibbonsPrototype = { | ||||
| 	// XXX update image previews...
 | ||||
| 	// XXX update image proportions for rotated images... (???)
 | ||||
| 	makeImage: function(gid, size){ | ||||
| 		var ig = this.imagegrid | ||||
| 		var ig = this.parent | ||||
| 		//size = this.state.tile_size = size 
 | ||||
| 		size = size  | ||||
| 			|| this.state.tile_size | ||||
| 			|| this.getVisibleImageSize('max') | ||||
| 		var data = this.imagegrid.data | ||||
| 		var images = this.imagegrid.images || {} | ||||
| 		var data = this.parent.data | ||||
| 		var images = this.parent.images || {} | ||||
| 		var current = data.current == gid ? '.current' : '' | ||||
| 
 | ||||
| 		// resolve group preview cover...
 | ||||
| @ -253,7 +236,7 @@ var VirtualDOMRibbonsPrototype = { | ||||
| 	makeImageMarks: function(gid){ | ||||
| 		var that = this | ||||
| 		var marks = [] | ||||
| 		var tags = this.imagegrid.data.getTags(gid) | ||||
| 		var tags = this.parent.data.getTags(gid) | ||||
| 
 | ||||
| 		// XXX STUB: make this extensible...
 | ||||
| 		tags.indexOf('bookmark') >= 0  | ||||
| @ -312,7 +295,7 @@ var VirtualDOMRibbonsPrototype = { | ||||
| 			this.sync() | ||||
| 
 | ||||
| 		} else { | ||||
| 			return this.imagegrid.scale | ||||
| 			return this.parent.scale | ||||
| 		} | ||||
| 	}, | ||||
| 
 | ||||
| @ -349,7 +332,7 @@ var VirtualDOMRibbonsPrototype = { | ||||
| 		if(this.vdom == null){ | ||||
| 			var n = this.vdom = this.makeView(state, true) | ||||
| 			var v = vdom.create(n) | ||||
| 			this.imagegrid.dom.append(v) | ||||
| 			this.parent.dom.append(v) | ||||
| 			this.dom = v | ||||
| 
 | ||||
| 		// patch state...
 | ||||
| @ -375,8 +358,8 @@ var VirtualDOMRibbonsPrototype = { | ||||
| 			.sync() | ||||
| 	}, | ||||
| 
 | ||||
| 	__init__: function(imagegrid){ | ||||
| 		this.imagegrid = imagegrid | ||||
| 	__init__: function(parent){ | ||||
| 		this.parent = parent || this.parent | ||||
| 	}, | ||||
| } | ||||
| 
 | ||||
| @ -388,9 +371,7 @@ object.makeConstructor('VirtualDOMRibbons', | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| /*********************************************************************/ | ||||
| //---------------------------------------------------------------------
 | ||||
| 
 | ||||
| var VirtualDomActions = actions.Actions({ | ||||
| 
 | ||||
| @ -398,10 +379,8 @@ var VirtualDomActions = actions.Actions({ | ||||
| 		return this.__dom }, | ||||
| 	set dom(value){ | ||||
| 		this.__dom = value}, | ||||
| 	get virtualdom(){ | ||||
| 		return (this.__virtual_dom = this.__virtual_dom || VirtualDOMRibbons(this)) }, | ||||
| 
 | ||||
| 
 | ||||
| 	// XXX setup .ribbons...
 | ||||
| 	load: [ | ||||
| 		function(data){ | ||||
| 			return function(){ | ||||
| @ -411,9 +390,10 @@ var VirtualDomActions = actions.Actions({ | ||||
| 
 | ||||
| 				if(this.dom == null){ | ||||
| 					this.dom = viewer | ||||
| 					this.ribbons = new VirtualDOMRibbons() | ||||
| 
 | ||||
| 				} else { | ||||
| 					this.virtualdom.clear() | ||||
| 					this.ribbons.clear() | ||||
| 				} | ||||
| 
 | ||||
| 				this.reload() | ||||
| @ -421,13 +401,13 @@ var VirtualDomActions = actions.Actions({ | ||||
| 		}], | ||||
| 	reload: ['Interface/Reload viewer', | ||||
| 		function(){ | ||||
| 			this.virtualdom.reset() | ||||
| 			this.ribbons.reset() | ||||
| 			this.focusImage() | ||||
| 		}], | ||||
| 	// XXX this ignores it's args...
 | ||||
| 	refresh: ['Interface/Refresh images without reloading', | ||||
| 		function(gids, scale){ | ||||
| 			this.virtualdom.sync() | ||||
| 			this.ribbons.sync() | ||||
| 			this.focusImage() | ||||
| 		}], | ||||
| 
 | ||||
| @ -436,7 +416,7 @@ var VirtualDomActions = actions.Actions({ | ||||
| 	updateRibbon: ['- Interface/Update partial ribbon size',  | ||||
| 		function(target, w, size, threshold){ | ||||
| 			target = target instanceof jQuery  | ||||
| 				? this.virtualdom.getElemGID(target) | ||||
| 				? this.ribbons.elemGID(target) | ||||
| 				// NOTE: data.getImage(..) can return null at start or end
 | ||||
| 				// 		of ribbon, thus we need to account for this...
 | ||||
| 				: (this.data.getImage(target) | ||||
| @ -452,7 +432,7 @@ var VirtualDomActions = actions.Actions({ | ||||
| 
 | ||||
| 			// XXX for some reason this does not set the .current class 
 | ||||
| 			// 		on the right image...
 | ||||
| 			this.virtualdom.sync(target, size) | ||||
| 			this.ribbons.sync(target, size) | ||||
| 
 | ||||
| 			// XXX HACK: this fixes a bug in virtual-dom where .current
 | ||||
| 			// 		is not synced correctly...
 | ||||
| @ -460,7 +440,7 @@ var VirtualDomActions = actions.Actions({ | ||||
| 			// 		manually, dom gets diffed and no change is detected
 | ||||
| 			// 		then the object gets recycled and the .current class
 | ||||
| 			// 		ends up on a different element...
 | ||||
| 			this.virtualdom.focusImage(target) | ||||
| 			this.ribbons.focusImage(target) | ||||
| 
 | ||||
| 			this.centerViewer(target) | ||||
| 		}], | ||||
| @ -481,14 +461,14 @@ module.VirtualDom = core.ImageGridFeatures.Feature({ | ||||
| 
 | ||||
| 	handlers: [ | ||||
| 		['clear', | ||||
| 			function(){ this.virtualdom.clear() }], | ||||
| 			function(){ this.ribbons.clear() }], | ||||
| 		['fitImage toggleSingleImage', | ||||
| 			function(){ delete this.virtualdom.state.tile_size }], | ||||
| 			function(){ delete this.ribbons.state.tile_size }], | ||||
| 
 | ||||
| 		// XXX account for fast navigation...
 | ||||
| 		['focusImage.pre',  | ||||
| 			function(target){  | ||||
| 				var img = this.virtualdom.getImage(target) | ||||
| 				var img = this.ribbons.getImage(target) | ||||
| 
 | ||||
| 				// in-place update...
 | ||||
| 				if(img.length > 0){ | ||||
| @ -497,7 +477,7 @@ module.VirtualDom = core.ImageGridFeatures.Feature({ | ||||
| 					if(!this.__partial_ribbon_update){ | ||||
| 						this.__partial_ribbon_update = setTimeout((function(){ | ||||
| 							delete this.__partial_ribbon_update | ||||
| 							this.virtualdom.preventTransitions() | ||||
| 							this.ribbons.preventTransitions() | ||||
| 
 | ||||
| 							this | ||||
| 								.updateRibbon(this.current) | ||||
| @ -506,7 +486,7 @@ module.VirtualDom = core.ImageGridFeatures.Feature({ | ||||
| 								// 		thus missing the base call...
 | ||||
| 								.alignRibbons(null, null, true) | ||||
| 
 | ||||
| 							this.virtualdom.restoreTransitions() | ||||
| 							this.ribbons.restoreTransitions() | ||||
| 						}).bind(this), 150) | ||||
| 					} | ||||
| 
 | ||||
| @ -526,7 +506,7 @@ module.VirtualDom = core.ImageGridFeatures.Feature({ | ||||
| 			'toggleMark', | ||||
| 			'toggleBookmark', | ||||
| 		//], function(){ this.updateRibbon() }],
 | ||||
| 		], function(){ this.virtualdom.sync() }], | ||||
| 		], function(){ this.ribbons.sync() }], | ||||
| 	], | ||||
| }) | ||||
| 
 | ||||
|  | ||||
| @ -1396,7 +1396,7 @@ module.ContextActionMenu = core.ImageGridFeatures.Feature({ | ||||
| 							event.preventDefault() | ||||
| 							event.stopPropagation() | ||||
| 
 | ||||
| 							var g = gid || that.ribbons.getElemGID(img) | ||||
| 							var g = gid || that.ribbons.elemGID(img) | ||||
| 
 | ||||
| 							that | ||||
| 								.focusImage(g) | ||||
| @ -1867,7 +1867,7 @@ var WidgetTestActions = actions.Actions({ | ||||
| 			if(cur && next && cur.birthtime.getMonth() != next.birthtime.getMonth()){ | ||||
| 				this.ribbons.getImageMarks(gid).filter('.partition').remove() | ||||
| 				this.ribbons.getImage(gid) | ||||
| 					.after(this.ribbons.setElemGID($('<div class="mark partition">'), gid) | ||||
| 					.after(this.ribbons.elemGID($('<div class="mark partition">'), gid) | ||||
| 						.attr('text', month[next.birthtime.getMonth()])) | ||||
| 			} | ||||
| 		}], | ||||
|  | ||||
| @ -93,6 +93,24 @@ var base = require('features/base') | ||||
| //		.updateRibbon(target)
 | ||||
| //			-> this
 | ||||
| //
 | ||||
| //	Generic .ribbons API (introspection):
 | ||||
| //		.ribbons.getImage(..)
 | ||||
| //			-> image
 | ||||
| //
 | ||||
| //		.ribbons.getImageByPosition(..)
 | ||||
| //			-> image
 | ||||
| //
 | ||||
| //		.ribbons.getRibbon(..)
 | ||||
| //			-> ribbon
 | ||||
| //
 | ||||
| //		.ribbons.elemGID(..)
 | ||||
| //			-> gid
 | ||||
| //
 | ||||
| //	XXX do we need these???
 | ||||
| //		.ribbons.focusImage(..)
 | ||||
| //	XXX Avoid using methods that expose specific non-generic structure:
 | ||||
| //		.ribbons.getRibbonSet(..)
 | ||||
| //		.ribbons.getRibbonLocator(..)
 | ||||
| //
 | ||||
| //
 | ||||
| // Workspaces:
 | ||||
| @ -189,6 +207,17 @@ module.ViewerActions = actions.Actions({ | ||||
| 	// Viewer dom... 
 | ||||
| 	dom: null, | ||||
| 
 | ||||
| 	// NOTE: this expects that ribbons will maintain .parent.images...
 | ||||
| 	// NOTE: when getting rid of ribbons need to also remove the .parent
 | ||||
| 	// 		reference...
 | ||||
| 	get ribbons(){ | ||||
| 		return this.__ribbons }, | ||||
| 	set ribbons(ribbons){ | ||||
| 		this.__ribbons = ribbons | ||||
| 		ribbons.parent = this | ||||
| 	}, | ||||
| 
 | ||||
| 
 | ||||
| 	// Current image data...
 | ||||
| 	//
 | ||||
| 	get image(){ | ||||
| @ -1390,7 +1419,7 @@ var ControlActions = actions.Actions({ | ||||
| 				var handler = setup.handler = setup.handler  | ||||
| 					|| function(){ | ||||
| 						var img = $(event.target) | ||||
| 						var gid = that.ribbons.getElemGID(img) | ||||
| 						var gid = that.ribbons.elemGID(img) | ||||
| 
 | ||||
| 						// sanity check: only handle clicks on images...
 | ||||
| 						if(!img.hasClass('image')){ | ||||
| @ -1483,7 +1512,7 @@ var ControlActions = actions.Actions({ | ||||
| 	makeRibbonVisible: ['- Interface/Make ribbon visible if it is off screen', | ||||
| 		function(target, center_off_screen){ | ||||
| 			var r = this.ribbons.getRibbon(target) | ||||
| 			var rgid = this.ribbons.getElemGID(r) | ||||
| 			var rgid = this.ribbons.elemGID(r) | ||||
| 
 | ||||
| 			var central = this.ribbons.getImageByPosition('center', r) | ||||
| 
 | ||||
| @ -1595,7 +1624,7 @@ var ControlActions = actions.Actions({ | ||||
| 						var that = this | ||||
| 
 | ||||
| 						var r = this.ribbons.getRibbon(target) | ||||
| 						var rgid = this.ribbons.getElemGID(r) | ||||
| 						var rgid = this.ribbons.elemGID(r) | ||||
| 
 | ||||
| 						var data = false | ||||
| 						var post_handlers | ||||
| @ -1711,7 +1740,7 @@ var ControlActions = actions.Actions({ | ||||
| 										var current_ribbon = that.data.getRibbon() | ||||
| 										if(current_ribbon == rgid){ | ||||
| 											var central = that.ribbons.getImageByPosition('center', r) | ||||
| 											var gid = that.ribbons.getElemGID(central) | ||||
| 											var gid = that.ribbons.elemGID(central) | ||||
| 											// silently focus central image...
 | ||||
| 											if(that.config['focus-central-image'] == 'silent'){ | ||||
| 												that.data.focusImage(gid) | ||||
| @ -1815,7 +1844,7 @@ var ControlActions = actions.Actions({ | ||||
| 					var current_ribbon = that.data.getRibbon() | ||||
| 					if(current_ribbon == rgid){ | ||||
| 						var central = that.ribbons.getImageByPosition('center', r) | ||||
| 						var gid = that.ribbons.getElemGID(central) | ||||
| 						var gid = that.ribbons.elemGID(central) | ||||
| 						// silently focus central image...
 | ||||
| 						if(that.config['focus-central-image'] == 'silent'){ | ||||
| 							that.data.focusImage(gid) | ||||
| @ -1835,7 +1864,7 @@ var ControlActions = actions.Actions({ | ||||
| 						var that = this | ||||
| 
 | ||||
| 						var r = this.ribbons.getRibbon(target) | ||||
| 						var rgid = this.ribbons.getElemGID(r) | ||||
| 						var rgid = this.ribbons.elemGID(r) | ||||
| 
 | ||||
| 						// XXX vertical scroll...
 | ||||
| 						this.dom | ||||
|  | ||||
| @ -214,16 +214,22 @@ var RibbonsClassPrototype = { | ||||
| 	px2vmax: function(px){ return this.px2v(px, 'vmax') }, | ||||
| 
 | ||||
| 	// Generic getters...
 | ||||
| 	getElemGID: function(elem){ | ||||
| 		return JSON.parse('"'  | ||||
| 	elemGID: function(elem, gid){ | ||||
| 		// get gid...
 | ||||
| 		return (gid == null || gid == '?') ? | ||||
| 				JSON.parse('"'  | ||||
| 					+ (elem instanceof jQuery ?  | ||||
| 							elem.attr('gid')  | ||||
| 						: elem.getAttribute('gid')) | ||||
| 					+ '"') | ||||
| 	}, | ||||
| 	setElemGID: function(elem, gid){ | ||||
| 		return $(elem) | ||||
| 			.attr('gid', JSON.stringify(gid) | ||||
| 			// remove gid...
 | ||||
| 			: gid == '' ?  | ||||
| 				$(elem) | ||||
| 					.removesAttr('gid') | ||||
| 			// set gid...
 | ||||
| 			: $(elem) | ||||
| 				.attr('gid',  | ||||
| 					JSON.stringify(gid) | ||||
| 						// this removes the extra quots...
 | ||||
| 						.replace(/^"(.*)"$/g, '$1')) | ||||
| 	}, | ||||
| @ -245,11 +251,11 @@ var RibbonsClassPrototype = { | ||||
| 		return $(gids.map(function(gid){ | ||||
| 			gid = gid != null ? gid+'' : gid | ||||
| 
 | ||||
| 			return that.setElemGID($('<div>') | ||||
| 			return that.elemGID($('<div>') | ||||
| 				.addClass('ribbon'), gid)[0] | ||||
| 			//return $('<div>')
 | ||||
| 			//	.addClass('ribbon-container')
 | ||||
| 			//	.append(that.setElemGID($('<div>')
 | ||||
| 			//	.append(that.elemGID($('<div>')
 | ||||
| 			//		.addClass('ribbon'), gid))[0]
 | ||||
| 		})) | ||||
| 	}, | ||||
| @ -260,13 +266,13 @@ var RibbonsClassPrototype = { | ||||
| 		var that = this | ||||
| 		return $(gids.map(function(gid){ | ||||
| 			gid = gid != null ? gid+'' : gid | ||||
| 			return that.setElemGID($('<div>') | ||||
| 			return that.elemGID($('<div>') | ||||
| 					.addClass('image'), gid)[0] | ||||
| 		})) | ||||
| 	}, | ||||
| 	createMark: function(cls, gid){ | ||||
| 		gid = gid != null ? gid+'' : gid | ||||
| 		return this.setElemGID($('<div class="mark">') | ||||
| 		return this.elemGID($('<div class="mark">') | ||||
| 			.addClass(cls), gid) | ||||
| 	}, | ||||
| }  | ||||
| @ -317,8 +323,7 @@ var RibbonsPrototype = { | ||||
| 	createMark: RibbonsClassPrototype.createMark, | ||||
| 
 | ||||
| 	// Generic getters...
 | ||||
| 	getElemGID: RibbonsClassPrototype.getElemGID, | ||||
| 	setElemGID: RibbonsClassPrototype.setElemGID, | ||||
| 	elemGID: RibbonsClassPrototype.elemGID, | ||||
| 
 | ||||
| 
 | ||||
| 	get parent(){ | ||||
| @ -712,7 +717,7 @@ var RibbonsPrototype = { | ||||
| 			return function(){} | ||||
| 		} | ||||
| 
 | ||||
| 		var gid = this.getElemGID(img) | ||||
| 		var gid = this.elemGID(img) | ||||
| 		var s = this.scale() | ||||
| 		var vo = this.viewer.offset() | ||||
| 		var io = img.offset() | ||||
| @ -934,7 +939,7 @@ var RibbonsPrototype = { | ||||
| 	getImageMarks: function(img, cls){ | ||||
| 		img = img || this.getImage() | ||||
| 		gid = typeof(img) == typeof('str') ? img : null | ||||
| 		gid = gid == null ? this.getElemGID(img) : gid | ||||
| 		gid = gid == null ? this.elemGID(img) : gid | ||||
| 
 | ||||
| 		var marks = this.viewer.find('.mark[gid='+JSON.stringify(gid)+']') | ||||
| 
 | ||||
| @ -1316,14 +1321,14 @@ var RibbonsPrototype = { | ||||
| 		var img = this.getImage(from) | ||||
| 
 | ||||
| 		img && img.length > 0  | ||||
| 			&& this.setElemGID(img, to) | ||||
| 			&& this.elemGID(img, to) | ||||
| 
 | ||||
| 		return this | ||||
| 	}, | ||||
| 
 | ||||
| 	// XXX is .__image_updaters the right way to go???
 | ||||
| 	updateImageIndicators: function(gid, image){ | ||||
| 		gid = gid == null ? this.getElemGID() : gid | ||||
| 		gid = gid == null ? this.elemGID() : gid | ||||
| 		image = image == null ? this.getImage() : $(image) | ||||
| 
 | ||||
| 		// collect marks...
 | ||||
| @ -1406,7 +1411,7 @@ var RibbonsPrototype = { | ||||
| 			if(image.length == 0){ | ||||
| 				return | ||||
| 			} | ||||
| 			var old_gid = that.getElemGID(image) | ||||
| 			var old_gid = that.elemGID(image) | ||||
| 
 | ||||
| 			// same image -- update...
 | ||||
| 			if(old_gid == gid || gid == null){ | ||||
| @ -1529,7 +1534,7 @@ var RibbonsPrototype = { | ||||
| 			if(image.length == 0){ | ||||
| 				return | ||||
| 			} | ||||
| 			var old_gid = that.getElemGID(image) | ||||
| 			var old_gid = that.elemGID(image) | ||||
| 			var data = update[old_gid] = { | ||||
| 				image: image, | ||||
| 				attrs: {}, | ||||
| @ -1702,7 +1707,7 @@ var RibbonsPrototype = { | ||||
| 
 | ||||
| 			// align only if ref is loaded...
 | ||||
| 			if(ref.length > 0){ | ||||
| 				var gid = this.getElemGID(ref) | ||||
| 				var gid = this.elemGID(ref) | ||||
| 				var W = Math.min(document.body.offsetWidth, document.body.offsetHeight) | ||||
| 				var w = this.getVisibleImageSize('width', 1, ref) / W * 100 | ||||
| 
 | ||||
| @ -1722,7 +1727,7 @@ var RibbonsPrototype = { | ||||
| 		var unload_marks = [] | ||||
| 		loaded = loaded | ||||
| 			.filter(function(i, img){  | ||||
| 				var g = that.getElemGID(img) | ||||
| 				var g = that.elemGID(img) | ||||
| 				if(gids.indexOf(g) >= 0){ | ||||
| 					return true | ||||
| 				} | ||||
| @ -1754,7 +1759,7 @@ var RibbonsPrototype = { | ||||
| 			if(img.length == 0){ | ||||
| 				img = unloaded.length > 0  | ||||
| 					// reuse an image we just detached...
 | ||||
| 					? that.setElemGID(unloaded.pop(), gid)  | ||||
| 					? that.elemGID(unloaded.pop(), gid)  | ||||
| 					// create a new image...
 | ||||
| 					: that.createImage(gid) | ||||
| 			} | ||||
| @ -1762,7 +1767,7 @@ var RibbonsPrototype = { | ||||
| 			// see of we are loaded in the right position...
 | ||||
| 			// NOTE: loaded is maintained current later, thus it always 
 | ||||
| 			// 		contains a set of images representative of the ribbon...
 | ||||
| 			var g = loaded.length > i ? that.getElemGID(loaded.eq(i)) : null | ||||
| 			var g = loaded.length > i ? that.elemGID(loaded.eq(i)) : null | ||||
| 
 | ||||
| 			// check if we need to reattach the image...
 | ||||
| 			if(gid != g){ | ||||
| @ -1811,7 +1816,7 @@ var RibbonsPrototype = { | ||||
| 
 | ||||
| 			// align only if ref is loaded...
 | ||||
| 			if(ref.length > 0){ | ||||
| 				var gid = this.getElemGID(ref) | ||||
| 				var gid = this.elemGID(ref) | ||||
| 				var W = Math.min(document.body.offsetWidth, document.body.offsetHeight) | ||||
| 				var w = this.getVisibleImageSize('width', 1, ref) / W * 100 | ||||
| 
 | ||||
| @ -1836,14 +1841,14 @@ var RibbonsPrototype = { | ||||
| 					var img = loaded.eq(i) | ||||
| 
 | ||||
| 					// cleanup marks...
 | ||||
| 					var g = that.getElemGID(img) | ||||
| 					var g = that.elemGID(img) | ||||
| 					unload_marks = gids.indexOf(g) < 0 ? | ||||
| 						unload_marks.concat(that.getImageMarks(g).toArray()) | ||||
| 						: unload_marks | ||||
| 
 | ||||
| 					// XXX for some reason this is smoother than:
 | ||||
| 					// 		gid && that.updateImage(img, gid)
 | ||||
| 					gid && that.updateImage(that.setElemGID(img, gid)) | ||||
| 					gid && that.updateImage(that.elemGID(img, gid)) | ||||
| 				} | ||||
| 		//	})
 | ||||
| 		} | ||||
| @ -1889,7 +1894,7 @@ var RibbonsPrototype = { | ||||
| 				// remove marks...
 | ||||
| 				.each(function(_, img){ | ||||
| 					marks = marks.concat( | ||||
| 						that.getImageMarks(that.getElemGID(img)).toArray()) | ||||
| 						that.getImageMarks(that.elemGID(img)).toArray()) | ||||
| 				}) | ||||
| 				 | ||||
| 			// clear stuff...
 | ||||
| @ -1914,7 +1919,7 @@ var RibbonsPrototype = { | ||||
| 				// remove marks...
 | ||||
| 				.each(function(_, img){ | ||||
| 					marks = marks.concat( | ||||
| 						that.getImageMarks(that.getElemGID(img)).toArray()) | ||||
| 						that.getImageMarks(that.elemGID(img)).toArray()) | ||||
| 				}) | ||||
| 
 | ||||
| 			// calculate the compensation...
 | ||||
| @ -1965,7 +1970,7 @@ var RibbonsPrototype = { | ||||
| 			// update images...
 | ||||
| 			right instanceof Array && right.forEach(function(gid, i){ | ||||
| 				var img = loading.eq(i) | ||||
| 				that.setElemGID(img, gid)  | ||||
| 				that.elemGID(img, gid)  | ||||
| 				// XXX for some reason this does not add indicators...
 | ||||
| 				that.updateImage(img) | ||||
| 			}) | ||||
| @ -1993,7 +1998,7 @@ var RibbonsPrototype = { | ||||
| 			// update images...
 | ||||
| 			left instanceof Array && left.forEach(function(gid, i){ | ||||
| 				var img = loading.eq(i) | ||||
| 				that.setElemGID(img, gid)  | ||||
| 				that.elemGID(img, gid)  | ||||
| 				// XXX for some reason this does not add indicators...
 | ||||
| 				that.updateImage(img) | ||||
| 			}) | ||||
| @ -2122,7 +2127,7 @@ var RibbonsPrototype = { | ||||
| 
 | ||||
| 				that.viewer.find(RIBBON).each(function(){ | ||||
| 					var r = $(this) | ||||
| 					if(ribbons.indexOf(that.getElemGID(r)) < 0){ | ||||
| 					if(ribbons.indexOf(that.elemGID(r)) < 0){ | ||||
| 						r.remove() | ||||
| 					} | ||||
| 				}) | ||||
| @ -2270,7 +2275,7 @@ var RibbonsPrototype = { | ||||
| 
 | ||||
| 		// get marked state...
 | ||||
| 		if(action == '?'){ | ||||
| 			var gid = this.getElemGID(image) | ||||
| 			var gid = this.elemGID(image) | ||||
| 			var res = 0 | ||||
| 			cls.forEach(function(cls){ | ||||
| 				res += that.getImageMarks(gid, cls).length != 0 ? 1 : 0 | ||||
| @ -2281,7 +2286,7 @@ var RibbonsPrototype = { | ||||
| 		// set the marks...
 | ||||
| 		image.each(function(){ | ||||
| 			var image = $(this) | ||||
| 			var gid = that.getElemGID(image) | ||||
| 			var gid = that.elemGID(image) | ||||
| 			cls.forEach(function(cls){ | ||||
| 				var mark = that.getImageMarks(gid, cls) | ||||
| 
 | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user