mirror of
				https://github.com/flynx/ImageGrid.git
				synced 2025-10-30 19:00:09 +00:00 
			
		
		
		
	refactored the panel API out from the editor...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
		
							parent
							
								
									d4bae60f58
								
							
						
					
					
						commit
						64f13db83f
					
				| @ -20,6 +20,7 @@ | |||||||
| <script src="lib/jli.js"></script> | <script src="lib/jli.js"></script> | ||||||
| <script src="lib/keyboard.js"></script> | <script src="lib/keyboard.js"></script> | ||||||
| <script src="lib/scroller.js"></script> | <script src="lib/scroller.js"></script> | ||||||
|  | <script src="lib/panels.js"></script> | ||||||
| <script src="lib/editor.js"></script> | <script src="lib/editor.js"></script> | ||||||
| 
 | 
 | ||||||
| <script src="compatibility.js"></script> | <script src="compatibility.js"></script> | ||||||
|  | |||||||
| @ -246,101 +246,6 @@ function makeLogRange(text, filter, target){ | |||||||
| } | } | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| function makePanel(title, open, editable_title){ |  | ||||||
| 	title = title == null ? ' ' : title |  | ||||||
| 
 |  | ||||||
| 	// tool panel...
 |  | ||||||
| 	var panel = $('<details/>') |  | ||||||
| 		.prop('open', open == null ? true : open) |  | ||||||
| 		.addClass('panel noScroll') |  | ||||||
| 		.css({ |  | ||||||
| 			position: 'absolute', |  | ||||||
| 			top: '100px', |  | ||||||
| 			left: '100px', |  | ||||||
| 		}) |  | ||||||
| 		.append($('<summary>'+title+'</summary>') |  | ||||||
| 			.attr({ |  | ||||||
| 				contenteditable: editable_title == null ? 'false' : 'true', |  | ||||||
| 			}) |  | ||||||
| 			// XXX add a '+' button to create a new panel...
 |  | ||||||
| 			.append($('<span/>') |  | ||||||
| 				.addClass('close-button') |  | ||||||
| 				.click(function(){ |  | ||||||
| 					panel |  | ||||||
| 						.trigger('panelClosing') |  | ||||||
| 						.hide() |  | ||||||
| 					return false |  | ||||||
| 				}) |  | ||||||
| 				.html('×'))) |  | ||||||
| 		.draggable({ |  | ||||||
| 			containment: 'parent', |  | ||||||
| 			scroll: false, |  | ||||||
| 			// XXX this makes things quite a bit slower...
 |  | ||||||
| 			stack: '.panel', |  | ||||||
| 		}) |  | ||||||
| 
 |  | ||||||
| 	var _outside = false |  | ||||||
| 
 |  | ||||||
| 	// wrapper for sub-panels...
 |  | ||||||
| 	var content = $('<span class="panel-content">') |  | ||||||
| 		.sortable({ |  | ||||||
| 			forcePlaceholderSize: true, |  | ||||||
| 			opacity: 0.7, |  | ||||||
| 			connectWith: '.panel-content', |  | ||||||
| 			zIndex: 9999, |  | ||||||
| 
 |  | ||||||
| 			start: function(e, ui){ |  | ||||||
| 				_outside = false |  | ||||||
| 				ui.placeholder.height(ui.helper.outerHeight()); |  | ||||||
| 				ui.placeholder.width(ui.helper.outerWidth()); |  | ||||||
| 			}, |  | ||||||
| 			// XXX this is not done...
 |  | ||||||
| 			// create a new panel when dropping outside of curent panel...
 |  | ||||||
| 			stop: function(e, ui){ |  | ||||||
| 				// do this only when dropping putside the panel...
 |  | ||||||
| 				if(_outside){ |  | ||||||
| 					makePanel() |  | ||||||
| 						// XXX adjust this to scale...
 |  | ||||||
| 						.css(ui.position) |  | ||||||
| 						.appendTo(panel.parent()) |  | ||||||
| 						.find('.panel-content') |  | ||||||
| 							.append(ui.item) |  | ||||||
| 				} |  | ||||||
| 			}, |  | ||||||
| 			// XXX are these the correct events???
 |  | ||||||
| 			over: function(e, ui){ |  | ||||||
| 				_outside = false |  | ||||||
| 			}, |  | ||||||
| 			out: function(e, ui){ |  | ||||||
| 				_outside = true |  | ||||||
| 			}, |  | ||||||
| 		}) |  | ||||||
| 		.appendTo(panel) |  | ||||||
| 	return panel |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| 
 |  | ||||||
| function makeSubPanel(title, open, parent){ |  | ||||||
| 	title = title == null ? ' ' : title |  | ||||||
| 
 |  | ||||||
| 	var sub_panel = $('<details/>') |  | ||||||
| 		.addClass('sub-panel noScroll') |  | ||||||
| 		.prop('open', open == null ? true : open) |  | ||||||
| 		.append($('<summary>'+title+'</summary>')) |  | ||||||
| 		.append($('<div class="sub-panel-content"/>')) |  | ||||||
| 
 |  | ||||||
| 	if(parent != null){ |  | ||||||
| 		if(parent.hasClass('panel-content')){ |  | ||||||
| 			sub_panel.appendTo(parent) |  | ||||||
| 		} else { |  | ||||||
| 			sub_panel.appendTo(parent.find('.panel-content')) |  | ||||||
| 		} |  | ||||||
| 	} |  | ||||||
| 
 |  | ||||||
| 	return sub_panel |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| 
 |  | ||||||
| function makeFilterPanel(parent, target){ | function makeFilterPanel(parent, target){ | ||||||
| 	return makeSubPanel('Filters', true, parent) | 	return makeSubPanel('Filters', true, parent) | ||||||
| 		.find('.sub-panel-content') | 		.find('.sub-panel-content') | ||||||
|  | |||||||
							
								
								
									
										111
									
								
								ui/lib/panels.js
									
									
									
									
									
										Executable file
									
								
							
							
						
						
									
										111
									
								
								ui/lib/panels.js
									
									
									
									
									
										Executable file
									
								
							| @ -0,0 +1,111 @@ | |||||||
|  | /********************************************************************** | ||||||
|  | *  | ||||||
|  | * | ||||||
|  | * | ||||||
|  | **********************************************************************/ | ||||||
|  | 
 | ||||||
|  | //var DEBUG = DEBUG != null ? DEBUG : true
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | /*********************************************************************/ | ||||||
|  | 
 | ||||||
|  | function makePanel(title, open, editable_title){ | ||||||
|  | 	title = title == null ? ' ' : title | ||||||
|  | 
 | ||||||
|  | 	// tool panel...
 | ||||||
|  | 	var panel = $('<details/>') | ||||||
|  | 		.prop('open', open == null ? true : open) | ||||||
|  | 		.addClass('panel noScroll') | ||||||
|  | 		.css({ | ||||||
|  | 			position: 'absolute', | ||||||
|  | 			top: '100px', | ||||||
|  | 			left: '100px', | ||||||
|  | 		}) | ||||||
|  | 		.append($('<summary>'+title+'</summary>') | ||||||
|  | 			.attr({ | ||||||
|  | 				contenteditable: editable_title == null ? 'false' : 'true', | ||||||
|  | 			}) | ||||||
|  | 			// XXX add a '+' button to create a new panel...
 | ||||||
|  | 			.append($('<span/>') | ||||||
|  | 				.addClass('close-button') | ||||||
|  | 				.click(function(){ | ||||||
|  | 					panel | ||||||
|  | 						.trigger('panelClosing') | ||||||
|  | 						.hide() | ||||||
|  | 					return false | ||||||
|  | 				}) | ||||||
|  | 				.html('×'))) | ||||||
|  | 		.draggable({ | ||||||
|  | 			containment: 'parent', | ||||||
|  | 			scroll: false, | ||||||
|  | 			// XXX this makes things quite a bit slower...
 | ||||||
|  | 			stack: '.panel', | ||||||
|  | 		}) | ||||||
|  | 
 | ||||||
|  | 	var _outside = false | ||||||
|  | 
 | ||||||
|  | 	// wrapper for sub-panels...
 | ||||||
|  | 	var content = $('<span class="panel-content">') | ||||||
|  | 		.sortable({ | ||||||
|  | 			forcePlaceholderSize: true, | ||||||
|  | 			opacity: 0.7, | ||||||
|  | 			connectWith: '.panel-content', | ||||||
|  | 			zIndex: 9999, | ||||||
|  | 
 | ||||||
|  | 			start: function(e, ui){ | ||||||
|  | 				_outside = false | ||||||
|  | 				ui.placeholder.height(ui.helper.outerHeight()); | ||||||
|  | 				ui.placeholder.width(ui.helper.outerWidth()); | ||||||
|  | 			}, | ||||||
|  | 			// XXX this is not done...
 | ||||||
|  | 			// create a new panel when dropping outside of curent panel...
 | ||||||
|  | 			stop: function(e, ui){ | ||||||
|  | 				// do this only when dropping putside the panel...
 | ||||||
|  | 				if(_outside){ | ||||||
|  | 					makePanel() | ||||||
|  | 						// XXX adjust this to scale...
 | ||||||
|  | 						.css(ui.position) | ||||||
|  | 						.appendTo(panel.parent()) | ||||||
|  | 						.find('.panel-content') | ||||||
|  | 							.append(ui.item) | ||||||
|  | 				} | ||||||
|  | 			}, | ||||||
|  | 			// XXX are these the correct events???
 | ||||||
|  | 			over: function(e, ui){ | ||||||
|  | 				_outside = false | ||||||
|  | 			}, | ||||||
|  | 			out: function(e, ui){ | ||||||
|  | 				_outside = true | ||||||
|  | 			}, | ||||||
|  | 		}) | ||||||
|  | 		.appendTo(panel) | ||||||
|  | 	return panel | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | function makeSubPanel(title, open, parent){ | ||||||
|  | 	title = title == null ? ' ' : title | ||||||
|  | 
 | ||||||
|  | 	var sub_panel = $('<details/>') | ||||||
|  | 		.addClass('sub-panel noScroll') | ||||||
|  | 		.prop('open', open == null ? true : open) | ||||||
|  | 		.append($('<summary>'+title+'</summary>')) | ||||||
|  | 		.append($('<div class="sub-panel-content"/>')) | ||||||
|  | 
 | ||||||
|  | 	if(parent != null){ | ||||||
|  | 		if(parent.hasClass('panel-content')){ | ||||||
|  | 			sub_panel.appendTo(parent) | ||||||
|  | 		} else { | ||||||
|  | 			sub_panel.appendTo(parent.find('.panel-content')) | ||||||
|  | 		} | ||||||
|  | 	} | ||||||
|  | 
 | ||||||
|  | 	return sub_panel | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | /********************************************************************** | ||||||
|  | * vim:set ts=4 sw=4 :                                                */ | ||||||
							
								
								
									
										29
									
								
								ui/tags.js
									
									
									
									
									
								
							
							
						
						
									
										29
									
								
								ui/tags.js
									
									
									
									
									
								
							| @ -18,15 +18,32 @@ TAGS = { | |||||||
| 
 | 
 | ||||||
| /*********************************************************************/ | /*********************************************************************/ | ||||||
| 
 | 
 | ||||||
| function buildTagsFromImages(images){ | function buildTagsFromImages(images, tagset){ | ||||||
|  | 	tagset = tagset == null ? TAGS : tagset | ||||||
|  | 	images = images == null ? IMAGES : images | ||||||
|  | 
 | ||||||
|  | 	for(gid in images){ | ||||||
|  | 		var tags = images[gid].tags | ||||||
|  | 		if(tags == null){ | ||||||
|  | 			continue | ||||||
|  | 		} | ||||||
|  | 		tags.map(function(tag){ | ||||||
|  | 			if(tagset[tag] == null){ | ||||||
|  | 				tagset[tag] = [] | ||||||
|  | 			} | ||||||
|  | 			tagset[tag].push(gid) | ||||||
|  | 		}) | ||||||
|  | 	} | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
|  | 
 | ||||||
| // XXX
 | // XXX
 | ||||||
| function normalizeTag(tag){ | function normalizeTag(tag){ | ||||||
| 	return tag.trim() | 	return tag.trim() | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|  | 
 | ||||||
| /*********************************************************************/ | /*********************************************************************/ | ||||||
| 
 | 
 | ||||||
| function addTag(tags, gid, tagset, images){ | function addTag(tags, gid, tagset, images){ | ||||||
| @ -137,19 +154,25 @@ function updateTags(tags, gid, tagset, images){ | |||||||
| // this implements the AND selector...
 | // this implements the AND selector...
 | ||||||
| // NOTE: do not like this algorithm as it can get O(n^2)-ish
 | // NOTE: do not like this algorithm as it can get O(n^2)-ish
 | ||||||
| function selectByTags(tags, tagset){ | function selectByTags(tags, tagset){ | ||||||
|  | 	tags = typeof(tags) == typeof('str') ? [ tags ] : tags | ||||||
|  | 	tagset = tagset == null ? TAGS : tagset | ||||||
|  | 
 | ||||||
| 	var subtagset = [] | 	var subtagset = [] | ||||||
| 	var res = [] | 	var res = [] | ||||||
| 
 | 
 | ||||||
| 	// populate the subtagset...
 | 	// populate the subtagset...
 | ||||||
| 	tags.map(function(tag){ | 	tags.map(function(tag){ | ||||||
|  | 		if(tagset[tag] == null){ | ||||||
|  | 			return | ||||||
|  | 		} | ||||||
| 		subtagset.push(tagset[tag]) | 		subtagset.push(tagset[tag]) | ||||||
| 	}) | 	}) | ||||||
| 	subtagset.sort(function(a, b){  | 	subtagset.sort(function(a, b){  | ||||||
| 		return a.length - b.length  | 		return b.length - a.length  | ||||||
| 	}) | 	}) | ||||||
| 
 | 
 | ||||||
| 	// set the res to the shortest subset...
 | 	// set the res to the shortest subset...
 | ||||||
| 	var cur = subtagset.pop().splice() | 	var cur = subtagset.pop().slice() | ||||||
| 
 | 
 | ||||||
| 	// filter out the result...
 | 	// filter out the result...
 | ||||||
| 	cur.map(function(gid){ | 	cur.map(function(gid){ | ||||||
|  | |||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user