mirror of
				https://github.com/flynx/ImageGrid.git
				synced 2025-10-31 11:20:09 +00:00 
			
		
		
		
	added PathList(..) and fixed some minor bugs...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
		
							parent
							
								
									c5a3ca2bf5
								
							
						
					
					
						commit
						21c46d5b75
					
				| @ -65,6 +65,10 @@ | |||||||
| 	top: 400px; | 	top: 400px; | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
|  | .container.pathlist { | ||||||
|  | 	left: 700px; | ||||||
|  | 	top: 600px; | ||||||
|  | } | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| @ -173,14 +177,11 @@ requirejs(['../lib/keyboard', '../object', './browse-dialog'], function(k, o, br | |||||||
| 					}) | 					}) | ||||||
| 					.map(function(k){ | 					.map(function(k){ | ||||||
| 						// make the element... | 						// make the element... | ||||||
| 						var e = make(k) | 						var e = make(k, typeof(cur[k]) != typeof('str')) | ||||||
| 						// disable dir_b... | 						// disable dir_b... | ||||||
| 						if(use_disabled && k == 'dir_b'){ | 						if(use_disabled && k == 'dir_b'){ | ||||||
| 							e.addClass('disabled') | 							e.addClass('disabled') | ||||||
| 						} | 						} | ||||||
| 						if(typeof(cur[k]) == typeof('str')){ |  | ||||||
| 							e.addClass('not-traversable') |  | ||||||
| 						} |  | ||||||
| 						return k | 						return k | ||||||
| 					}) | 					}) | ||||||
| 			}, | 			}, | ||||||
| @ -240,6 +241,18 @@ requirejs(['../lib/keyboard', '../object', './browse-dialog'], function(k, o, br | |||||||
| 		.open(function(evt, text){ | 		.open(function(evt, text){ | ||||||
| 				alert('>>> ' + text) | 				alert('>>> ' + text) | ||||||
| 		}) | 		}) | ||||||
|  | 
 | ||||||
|  | 	// path list demo... | ||||||
|  | 	f3 = browser.makePathList($('.container.pathlist'), { | ||||||
|  | 			// XXX need a way to trigger open ecents with touch/mouse... | ||||||
|  | 			'/dir 1': function(_, p){ console.log('dir:', p) }, | ||||||
|  | 			'dir 1/option 1': function(_, p){ console.log('option:', p) }, | ||||||
|  | 			'dir 1/option 2': function(_, p){ console.log('option:', p) }, | ||||||
|  | 			'dir 2/option 3': function(_, p){ console.log('option:', p) }, | ||||||
|  | 			'option 4': function(_, p){ console.log('option:', p) }, | ||||||
|  | 			'option 5': function(_, p){ console.log('option:', p) }, | ||||||
|  | 			'option 6': function(_, p){ console.log('option:', p) }, | ||||||
|  | 		}) | ||||||
| }) | }) | ||||||
| 
 | 
 | ||||||
| $(function(){ | $(function(){ | ||||||
| @ -363,6 +376,9 @@ Basic key bindings: | |||||||
| <div class="container flat2"> | <div class="container flat2"> | ||||||
| </div> | </div> | ||||||
| 
 | 
 | ||||||
|  | <div class="container pathlist"> | ||||||
|  | </div> | ||||||
|  | 
 | ||||||
| </body> | </body> | ||||||
| </html> | </html> | ||||||
| <!-- vim:set ts=4 sw=4 : --> | <!-- vim:set ts=4 sw=4 : --> | ||||||
|  | |||||||
| @ -394,6 +394,8 @@ var BrowserPrototype = { | |||||||
| 	// NOTE: this does not include the selected element, i.e. the returned 
 | 	// NOTE: this does not include the selected element, i.e. the returned 
 | ||||||
| 	// 		path always ends with a trailing '/'.
 | 	// 		path always ends with a trailing '/'.
 | ||||||
| 	// NOTE: the setter is just a shorthand to .path setter for uniformity...
 | 	// NOTE: the setter is just a shorthand to .path setter for uniformity...
 | ||||||
|  | 	//
 | ||||||
|  | 	// XXX need to append '/' only if traversable...
 | ||||||
| 	get strPath(){ | 	get strPath(){ | ||||||
| 		return '/' + this.path.join('/') + '/' | 		return '/' + this.path.join('/') + '/' | ||||||
| 	}, | 	}, | ||||||
| @ -408,7 +410,7 @@ var BrowserPrototype = { | |||||||
| 	// 		.strPath
 | 	// 		.strPath
 | ||||||
| 	// NOTE: the setter is just a shorthand to .path setter for uniformity...
 | 	// NOTE: the setter is just a shorthand to .path setter for uniformity...
 | ||||||
| 	get selectionPath(){ | 	get selectionPath(){ | ||||||
| 		return this.strPath +'/'+ (this.selected || '') | 		return this.strPath + (this.selected || '') | ||||||
| 	}, | 	}, | ||||||
| 	set selectionPath(value){ | 	set selectionPath(value){ | ||||||
| 		this.path = value | 		this.path = value | ||||||
| @ -583,9 +585,10 @@ var BrowserPrototype = { | |||||||
| 		// fill the children list...
 | 		// fill the children list...
 | ||||||
| 		var interactive = false | 		var interactive = false | ||||||
| 
 | 
 | ||||||
| 		var make = function(p){ | 		var make = function(p, traversable){ | ||||||
|  | 			traversable = traversable == null ? true : traversable | ||||||
| 			interactive = true | 			interactive = true | ||||||
| 			return $('<div>') | 			var res = $('<div>') | ||||||
| 				// handle clicks ONLY when not disabled...
 | 				// handle clicks ONLY when not disabled...
 | ||||||
| 				.click(function(){ | 				.click(function(){ | ||||||
| 					if(!$(this).hasClass('disabled')){ | 					if(!$(this).hasClass('disabled')){ | ||||||
| @ -594,6 +597,10 @@ var BrowserPrototype = { | |||||||
| 				}) | 				}) | ||||||
| 				.text(p) | 				.text(p) | ||||||
| 				.appendTo(l) | 				.appendTo(l) | ||||||
|  | 			if(!traversable){ | ||||||
|  | 				res.addClass('not-traversable') | ||||||
|  | 			} | ||||||
|  | 			return res | ||||||
| 		} | 		} | ||||||
| 
 | 
 | ||||||
| 		var res = this.list(path, make) | 		var res = this.list(path, make) | ||||||
| @ -1396,6 +1403,9 @@ var BrowserPrototype = { | |||||||
| 		var res = m ? m.apply(this, args) : this | 		var res = m ? m.apply(this, args) : this | ||||||
| 		res = res || this | 		res = res || this | ||||||
| 
 | 
 | ||||||
|  | 		// XXX do we strigify the path???
 | ||||||
|  | 		path = '/' + path.join('/') | ||||||
|  | 
 | ||||||
| 		// trigger the 'open' events...
 | 		// trigger the 'open' events...
 | ||||||
| 		if(elem.length > 0){ | 		if(elem.length > 0){ | ||||||
| 			// NOTE: this will bubble up to the browser root...
 | 			// NOTE: this will bubble up to the browser root...
 | ||||||
| @ -1628,6 +1638,96 @@ module.makeList = function(elem, list){ | |||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|  | /*********************************************************************/ | ||||||
|  | 
 | ||||||
|  | // This full compatible with List(..) but will parse paths in keys...
 | ||||||
|  | //
 | ||||||
|  | // For example:
 | ||||||
|  | // 	{
 | ||||||
|  | // 		'a/b': ..,
 | ||||||
|  | // 		'a/c': ..,
 | ||||||
|  | // 		'd': ..,
 | ||||||
|  | //
 | ||||||
|  | // 	}
 | ||||||
|  | //
 | ||||||
|  | // 	will translate into:
 | ||||||
|  | // 		a/
 | ||||||
|  | // 			b
 | ||||||
|  | // 		 	c
 | ||||||
|  | // 		d
 | ||||||
|  | //
 | ||||||
|  | var PathListPrototype = Object.create(BrowserPrototype) | ||||||
|  | PathListPrototype.options = { | ||||||
|  | 
 | ||||||
|  | 	fullPathEdit: false, | ||||||
|  | 	traversable: true, | ||||||
|  | 	flat: false, | ||||||
|  | 
 | ||||||
|  | 	list: function(path, make){ | ||||||
|  | 		var that = this | ||||||
|  | 		var data = this.options.data | ||||||
|  | 		var keys = data.constructor == Array ? data : Object.keys(data) | ||||||
|  | 
 | ||||||
|  | 		var visited = [] | ||||||
|  | 
 | ||||||
|  | 		return keys | ||||||
|  | 			.map(function(k){ | ||||||
|  | 				var kp = k.split(/[\\\/]+/g) | ||||||
|  | 				kp[0] == '' && kp.shift() | ||||||
|  | 
 | ||||||
|  | 				// get and check current path, continue if relevant...
 | ||||||
|  | 				var p = kp.splice(0, path.length) | ||||||
|  | 				if(kp.length == 0  | ||||||
|  | 						|| p.length < path.length  | ||||||
|  | 						|| p.filter(function(e, i){ return e != path[i] }).length > 0){ | ||||||
|  | 					return false | ||||||
|  | 				} | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 				// get current path element if one exists and we did not create it already...
 | ||||||
|  | 				cur = kp.shift() | ||||||
|  | 				if(cur == undefined){ | ||||||
|  | 					return false | ||||||
|  | 				} | ||||||
|  | 
 | ||||||
|  | 				if(visited.indexOf(cur) >= 0){ | ||||||
|  | 					// set element to traversable...
 | ||||||
|  | 					if(kp.length > 0){ | ||||||
|  | 						that.filter(cur).removeClass('not-traversable') | ||||||
|  | 					} | ||||||
|  | 					return false | ||||||
|  | 				} | ||||||
|  | 				visited.push(cur) | ||||||
|  | 
 | ||||||
|  | 				// build the element....
 | ||||||
|  | 				var e = make(cur, kp.length > 0) | ||||||
|  | 
 | ||||||
|  | 				// setup handlers...
 | ||||||
|  | 				if(data !== keys && kp.length == 0){ | ||||||
|  | 					e.on('open', function(){  | ||||||
|  | 						return that.options.data[k].apply(this, arguments) | ||||||
|  | 					}) | ||||||
|  | 				} | ||||||
|  | 
 | ||||||
|  | 				return cur | ||||||
|  | 			}) | ||||||
|  | 			.filter(function(e){ return e !== false }) | ||||||
|  | 	}, | ||||||
|  | } | ||||||
|  | PathListPrototype.options.__proto__ = BrowserPrototype.options | ||||||
|  | 
 | ||||||
|  | var PathList =  | ||||||
|  | module.PathList =  | ||||||
|  | object.makeConstructor('PathList',  | ||||||
|  | 		BrowserClassPrototype,  | ||||||
|  | 		PathListPrototype) | ||||||
|  | 
 | ||||||
|  | var makePathList =  | ||||||
|  | module.makePathList = function(elem, list){ | ||||||
|  | 	return PathList(elem, { data: list }) | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
| /********************************************************************** | /********************************************************************** | ||||||
| * vim:set ts=4 sw=4 :                                                */ | * vim:set ts=4 sw=4 :                                                */ | ||||||
| return module }) | return module }) | ||||||
|  | |||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user