mirror of
				https://github.com/flynx/ImageGrid.git
				synced 2025-10-30 19:00:09 +00:00 
			
		
		
		
	finished the basic bookmarks functionality (not tested, needs CSS)...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
		
							parent
							
								
									062a5ba275
								
							
						
					
					
						commit
						a455e55b4d
					
				
							
								
								
									
										28
									
								
								ui/data.js
									
									
									
									
									
								
							
							
						
						
									
										28
									
								
								ui/data.js
									
									
									
									
									
								
							| @ -163,6 +163,14 @@ var UPDATE_SYNC = false | ||||
| var SYNC_IMG_LOADER = false | ||||
| 
 | ||||
| 
 | ||||
| // list of functions to setup different bindings
 | ||||
| //
 | ||||
| // each function must be of the form:
 | ||||
| // 	setupBinding(viewer) -> viewer
 | ||||
| //
 | ||||
| var SETUP_BINDINGS = [] | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| /********************************************************************** | ||||
| * Helpers | ||||
| @ -502,7 +510,7 @@ function getGIDBefore(gid, ribbon, search, data){ | ||||
| 	ribbon = ribbon == null ? getGIDRibbonIndex(gid, data) : ribbon | ||||
| 	search = search == null ? binSearch : search | ||||
| 	//search = search == null ? match2(linSearch, binSearch) : search
 | ||||
| 	ribbon = data.ribbons[ribbon] | ||||
| 	ribbon = typeof(ribbon) == typeof(123) ? data.ribbons[ribbon] : ribbon | ||||
| 	var order = data.order | ||||
| 
 | ||||
| 	var target = order.indexOf(gid) | ||||
| @ -1713,6 +1721,24 @@ function preCacheAllRibbons(){ | ||||
| * Actions... | ||||
| */ | ||||
| 
 | ||||
| function showImage(gid){ | ||||
| 	var img = getImage(gid) | ||||
| 
 | ||||
| 	// target image not loaded...
 | ||||
| 	if(img.length == 0){ | ||||
| 		DATA.current = gid | ||||
| 		reloadViewer() | ||||
| 		img = getImage(gid) | ||||
| 
 | ||||
| 	// target is already loaded...
 | ||||
| 	} else { | ||||
| 		centerView(focusImage(img)) | ||||
| 		centerRibbons() | ||||
| 	} | ||||
| 	return img | ||||
| } | ||||
| 
 | ||||
| 
 | ||||
| // Sort the ribbons by DATA.order and re-render...
 | ||||
| //
 | ||||
| // This is the main way to sort images:
 | ||||
|  | ||||
| @ -33,6 +33,7 @@ | ||||
| <script src="workers.js"></script> | ||||
| <script src="modes.js"></script> | ||||
| <script src="marks.js"></script> | ||||
| <script src="bookmarks.js"></script> | ||||
| <script src="files.js"></script> | ||||
| <script src="localstorage.js"></script> | ||||
| <script src="info.js"></script> | ||||
|  | ||||
							
								
								
									
										79
									
								
								ui/marks.js
									
									
									
									
									
								
							
							
						
						
									
										79
									
								
								ui/marks.js
									
									
									
									
									
								
							| @ -38,6 +38,28 @@ function _removeMark(cls, gid, image){ | ||||
| } | ||||
| 
 | ||||
| 
 | ||||
| // Make a mark toggler
 | ||||
| //
 | ||||
| // The toggler will:
 | ||||
| // 	- toggle img_class on the target image
 | ||||
| // 	- add/remove a mark element after the image
 | ||||
| // 	- toggle mark_class on the mark element
 | ||||
| // 	- trigger the evt_name on the viewer passing it:
 | ||||
| // 		- target image
 | ||||
| // 		- action ('on' on 'off')
 | ||||
| //
 | ||||
| // The actual toggler is built with createCSSClassToggler(..), see its
 | ||||
| // docs for protocol descrittion.
 | ||||
| //
 | ||||
| // The resulting toggled, by default, marks the current image 
 | ||||
| // (.current.image), but can be passed a different image as first 
 | ||||
| // argument.
 | ||||
| //
 | ||||
| // NOTE: when passing an alternative image as an argument, the second 
 | ||||
| // 		argument MUST also be passed. it can be one of:
 | ||||
| // 			- 'on'		: force create mark
 | ||||
| // 			- 'off'		: force remove mark
 | ||||
| // 			- 'next'	: toggle next state (default)
 | ||||
| function makeMarkToggler(img_class, mark_class, evt_name){ | ||||
| 	return createCSSClassToggler( | ||||
| 		'.current.image',  | ||||
| @ -348,5 +370,62 @@ function markImagesDialog(){ | ||||
| } | ||||
| 
 | ||||
| 
 | ||||
| /*********************************************************************/ | ||||
| 
 | ||||
| function setupMarks(viewer){ | ||||
| 	console.log('Marks: setup...') | ||||
| 	return viewer | ||||
| 		// marks...
 | ||||
| 		// XXX toggle marking a block is not yet supported...
 | ||||
| 		.on('togglingMark', function(evt, img, action){ | ||||
| 			var gid = getImageGID(img)  | ||||
| 
 | ||||
| 			// add marked image to list...
 | ||||
| 			if(action == 'on'){ | ||||
| 				MARKED.indexOf(gid) == -1 && MARKED.push(gid) | ||||
| 
 | ||||
| 			// remove marked image from list...
 | ||||
| 			} else { | ||||
| 				MARKED.splice(MARKED.indexOf(gid), 1) | ||||
| 			} | ||||
| 		}) | ||||
| 		.on('removeingRibbonMarks', function(evt, ribbon){ | ||||
| 			$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){ | ||||
| 				var i = MARKED.indexOf(e) | ||||
| 				if(i != -1){ | ||||
| 					MARKED.splice(i, 1) | ||||
| 				} | ||||
| 			}) | ||||
| 		}) | ||||
| 		.on('removeingAllMarks', function(evt){ | ||||
| 			MARKED.splice(0, MARKED.length) | ||||
| 		}) | ||||
| 		.on('markingRibbon', function(evt, ribbon){ | ||||
| 			$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){ | ||||
| 				var i = MARKED.indexOf(e) | ||||
| 				if(i == -1){ | ||||
| 					MARKED.push(e) | ||||
| 				} | ||||
| 			}) | ||||
| 		}) | ||||
| 		.on('markingAll', function(evt){ | ||||
| 			MARKED.splice(0, MARKED.length) | ||||
| 			MARKED.concat(DATA.order) | ||||
| 		}) | ||||
| 		.on('invertingMarks', function(evt, ribbon){ | ||||
| 			$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){ | ||||
| 				var i = MARKED.indexOf(e) | ||||
| 				if(i == -1){ | ||||
| 					MARKED.push(e) | ||||
| 				} else { | ||||
| 					MARKED.splice(i, 1) | ||||
| 				} | ||||
| 			}) | ||||
| 		}) | ||||
| } | ||||
| SETUP_BINDINGS.push(setupMarks) | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| /********************************************************************** | ||||
| * vim:set ts=4 sw=4 :                                                */ | ||||
|  | ||||
							
								
								
									
										54
									
								
								ui/setup.js
									
									
									
									
									
								
							
							
						
						
									
										54
									
								
								ui/setup.js
									
									
									
									
									
								
							| @ -68,6 +68,11 @@ function updateContextIndicators(image){ | ||||
| //
 | ||||
| function setupDataBindings(viewer){ | ||||
| 	viewer = viewer == null ? $('.viewer') : viewer | ||||
| 
 | ||||
| 	SETUP_BINDINGS.forEach(function(setup){ | ||||
| 		setup(viewer) | ||||
| 	}) | ||||
| 
 | ||||
| 	viewer | ||||
| 		.click(function(){ | ||||
| 			if($('.ribbon').length == 0){ | ||||
| @ -321,55 +326,6 @@ function setupDataBindings(viewer){ | ||||
| 		}) | ||||
| 
 | ||||
| 
 | ||||
| 		// marks...
 | ||||
| 		// XXX toggle marking a block is not yet supported...
 | ||||
| 		.on('togglingMark', function(evt, img, action){ | ||||
| 			var gid = getImageGID(img)  | ||||
| 
 | ||||
| 			// add marked image to list...
 | ||||
| 			if(action == 'on'){ | ||||
| 				 MARKED.indexOf(gid) == -1 && MARKED.push(gid) | ||||
| 
 | ||||
| 			// remove marked image from list...
 | ||||
| 			} else { | ||||
| 				MARKED.splice(MARKED.indexOf(gid), 1) | ||||
| 			} | ||||
| 		}) | ||||
| 		.on('removeingRibbonMarks', function(evt, ribbon){ | ||||
| 			$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){ | ||||
| 				var i = MARKED.indexOf(e) | ||||
| 				if(i != -1){ | ||||
| 					MARKED.splice(i, 1) | ||||
| 				} | ||||
| 			}) | ||||
| 		}) | ||||
| 		.on('removeingAllMarks', function(evt){ | ||||
| 			MARKED.splice(0, MARKED.length) | ||||
| 		}) | ||||
| 		.on('markingRibbon', function(evt, ribbon){ | ||||
| 			$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){ | ||||
| 				var i = MARKED.indexOf(e) | ||||
| 				if(i == -1){ | ||||
| 					MARKED.push(e) | ||||
| 				} | ||||
| 			}) | ||||
| 		}) | ||||
| 		.on('markingAll', function(evt){ | ||||
| 			MARKED.splice(0, MARKED.length) | ||||
| 			MARKED.concat(DATA.order) | ||||
| 		}) | ||||
| 		.on('invertingMarks', function(evt, ribbon){ | ||||
| 			$.each(DATA.ribbons[getRibbonIndex(ribbon)], function(_, e){ | ||||
| 				var i = MARKED.indexOf(e) | ||||
| 				if(i == -1){ | ||||
| 					MARKED.push(e) | ||||
| 				} else { | ||||
| 					MARKED.splice(i, 1) | ||||
| 				} | ||||
| 			}) | ||||
| 		}) | ||||
| 
 | ||||
| 
 | ||||
| 		// caching...
 | ||||
| 		.on('reloadedRibbon updatedRibbon', function(evt, ribbon){ | ||||
| 
 | ||||
|  | ||||
| @ -191,6 +191,7 @@ function sortImages(cmp, reverse){ | ||||
| 		DATA.order.reverse() | ||||
| 	} | ||||
| 	updateRibbonOrder() | ||||
| 	$('.viewer').trigger('sortedImages', [cmp]) | ||||
| } | ||||
| 
 | ||||
| 
 | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user