mirror of
				https://github.com/flynx/ImageGrid.git
				synced 2025-10-30 19:00:09 +00:00 
			
		
		
		
	reworked generating sections...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
		
							parent
							
								
									9c6f39ea9f
								
							
						
					
					
						commit
						3c7de1f2c3
					
				| @ -171,7 +171,16 @@ requirejs([ | |||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| 	// XXX split this into several dialogues, show each and then combine... | 	// XXX split this into several dialogues, show each and then combine... | ||||||
| 	dialog = browser.Browser(function(make){ | 	dialog = browser.Browser( | ||||||
|  | 		function(make, options){ | ||||||
|  | 			make('CURRENT_PATH', { | ||||||
|  | 				id: 'current_path', | ||||||
|  | 				cls: 'path', | ||||||
|  | 				buttons: (options || {}).headerButtons  | ||||||
|  | 					|| (this.options || {}).headerButtons  | ||||||
|  | 					|| [], | ||||||
|  | 			}) }, | ||||||
|  | 		function(make){ | ||||||
| 			// XXX put this in the header... | 			// XXX put this in the header... | ||||||
| 			//		ways to do this: | 			//		ways to do this: | ||||||
| 			//			- a different handler | 			//			- a different handler | ||||||
|  | |||||||
| @ -787,13 +787,20 @@ var makeItemEventToggler2 = function(get_state, set_state, unset_state, default_ | |||||||
| var BaseBrowserClassPrototype = { | var BaseBrowserClassPrototype = { | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| // XXX Q: should we be able to add/remove/change items outside of .__list__(..)???
 | // XXX Q: should we be able to add/remove/change items outside of .__items__(..)???
 | ||||||
| // 		...only some item updates (how .collapsed is handled) make 
 | // 		...only some item updates (how .collapsed is handled) make 
 | ||||||
| // 		sense at this time -- need to think about this more 
 | // 		sense at this time -- need to think about this more 
 | ||||||
| // 		carefully + strictly document the result...
 | // 		carefully + strictly document the result...
 | ||||||
| var BaseBrowserPrototype = { | var BaseBrowserPrototype = { | ||||||
| 	// XXX should we mix item/list options or separate them into sub-objects???
 | 	// XXX should we mix item/list options or separate them into sub-objects???
 | ||||||
| 	options: { | 	options: { | ||||||
|  | 		sections: [ | ||||||
|  | 			'header', | ||||||
|  | 			'items', | ||||||
|  | 			// XXX do we need this?
 | ||||||
|  | 			//'footer',
 | ||||||
|  | 		], | ||||||
|  | 
 | ||||||
| 		focusDisabled: false, | 		focusDisabled: false, | ||||||
| 
 | 
 | ||||||
| 		// If true item keys must be unique...
 | 		// If true item keys must be unique...
 | ||||||
| @ -838,6 +845,7 @@ var BaseBrowserPrototype = { | |||||||
| 	// NOTE: this may or may not be a Browser object.
 | 	// NOTE: this may or may not be a Browser object.
 | ||||||
| 	parent: null, | 	parent: null, | ||||||
| 
 | 
 | ||||||
|  | 	// Section containers...
 | ||||||
| 	//
 | 	//
 | ||||||
| 	// Format:
 | 	// Format:
 | ||||||
| 	// 	[
 | 	// 	[
 | ||||||
| @ -855,13 +863,12 @@ var BaseBrowserPrototype = { | |||||||
| 	// NOTE: this can't be a map/dict as we need both order manipulation 
 | 	// NOTE: this can't be a map/dict as we need both order manipulation 
 | ||||||
| 	// 		and nested structures which would overcomplicate things, as 
 | 	// 		and nested structures which would overcomplicate things, as 
 | ||||||
| 	// 		a compromise we use .index below for item identification.
 | 	// 		a compromise we use .index below for item identification.
 | ||||||
| 	// XXX should the header be restricted to being separate???
 |  | ||||||
| 	__header: null, | 	__header: null, | ||||||
| 	get header(){ | 	get header(){ | ||||||
| 		this.__header | 		this.__header | ||||||
| 			// XXX should this be .makeHeader(..) ???
 | 			|| (this.__header__  | ||||||
| 			|| this.make() | 				&& this.make({section: 'header'})) | ||||||
| 		return this.__header }, | 		return this.__header || [] }, | ||||||
| 	set header(value){ | 	set header(value){ | ||||||
| 		this.__header = value }, | 		this.__header = value }, | ||||||
| 	__items: null, | 	__items: null, | ||||||
| @ -871,6 +878,14 @@ var BaseBrowserPrototype = { | |||||||
| 		return this.__items }, | 		return this.__items }, | ||||||
| 	set items(value){ | 	set items(value){ | ||||||
| 		this.__items = value }, | 		this.__items = value }, | ||||||
|  | 	__footer: null, | ||||||
|  | 	get footer(){ | ||||||
|  | 		this.__footer | ||||||
|  | 			|| (this.__footer__  | ||||||
|  | 				&& this.make({section: 'footer'})) | ||||||
|  | 		return this.__footer || [] }, | ||||||
|  | 	set footer(value){ | ||||||
|  | 		this.__footer = value }, | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| 	// Clear cached data...
 | 	// Clear cached data...
 | ||||||
| @ -1059,9 +1074,11 @@ var BaseBrowserPrototype = { | |||||||
| 	 | 	 | ||||||
| 	__item__: BaseItem, | 	__item__: BaseItem, | ||||||
| 
 | 
 | ||||||
| 	// Item list constructor...
 | 	// Section item list constructor...
 | ||||||
| 	//
 | 	//
 | ||||||
| 	// 	.__list__(make, options)
 | 	// 	.__header__(make, options)
 | ||||||
|  | 	// 	.__items__(make, options)
 | ||||||
|  | 	// 	.__footer__(make, options)
 | ||||||
| 	// 		-> undefined
 | 	// 		-> undefined
 | ||||||
| 	// 		-> list
 | 	// 		-> list
 | ||||||
| 	//
 | 	//
 | ||||||
| @ -1085,14 +1102,14 @@ var BaseBrowserPrototype = { | |||||||
| 	// When calling make(..) (mode #1) the item is built by combining 
 | 	// When calling make(..) (mode #1) the item is built by combining 
 | ||||||
| 	// the following in order:
 | 	// the following in order:
 | ||||||
| 	// 	- original item (.items[key]) if present,
 | 	// 	- original item (.items[key]) if present,
 | ||||||
| 	// 	- options passed to .make(<options>) method calling .__list__(..),
 | 	// 	- options passed to .make(<options>) method calling .__items__(..),
 | ||||||
| 	// 	- options passed to make(.., <options>) constructing the item,
 | 	// 	- options passed to make(.., <options>) constructing the item,
 | ||||||
| 	// 	- {value: <value>} where <value> passed to make(<value>, ..)
 | 	// 	- {value: <value>} where <value> passed to make(<value>, ..)
 | ||||||
| 	//
 | 	//
 | ||||||
| 	// Each of the above will override values of the previous sections.
 | 	// Each of the above will override values of the previous sections.
 | ||||||
| 	//
 | 	//
 | ||||||
| 	// The resulting item is stored in:
 | 	// The resulting item is stored in:
 | ||||||
| 	// 	.items
 | 	// 	.header, .items or .footer
 | ||||||
| 	// 	.index (keyed via .id or JSONified .value)
 | 	// 	.index (keyed via .id or JSONified .value)
 | ||||||
| 	//
 | 	//
 | ||||||
| 	// Each of the above structures is reset on each call to .make(..)
 | 	// Each of the above structures is reset on each call to .make(..)
 | ||||||
| @ -1126,19 +1143,19 @@ var BaseBrowserPrototype = { | |||||||
| 	//
 | 	//
 | ||||||
| 	//
 | 	//
 | ||||||
| 	// NOTE: this is not designed to be called directly...
 | 	// NOTE: this is not designed to be called directly...
 | ||||||
| 	__list__: function(make, options){ |  | ||||||
| 		throw new Error('.__list__(..): Not implemented.') }, |  | ||||||
| 
 |  | ||||||
| 	// XXX header constructor, same as .__list__(..) but optional...
 |  | ||||||
| 	__header__: null, | 	__header__: null, | ||||||
|  | 	__items__: function(make, options){ | ||||||
|  | 		throw new Error('.__items__(..): Not implemented.') }, | ||||||
|  | 	__footer__: null, | ||||||
|  | 
 | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| 	// Make extension...
 | 	// Make extension...
 | ||||||
| 	//
 | 	//
 | ||||||
| 	// This is called per item created by make(..) in .__list__(..)
 | 	// This is called per item created by make(..) in .__items__(..)
 | ||||||
| 	//
 | 	//
 | ||||||
| 	// NOTE: this can update/modify the item but it can not replace it.
 | 	// NOTE: this can update/modify the item but it can not replace it.
 | ||||||
| 	//__make__: function(item){
 | 	//__make__: function(section, item){
 | ||||||
| 	//},
 | 	//},
 | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| @ -1148,7 +1165,7 @@ var BaseBrowserPrototype = { | |||||||
| 	// 	.make(options)
 | 	// 	.make(options)
 | ||||||
| 	// 		-> this
 | 	// 		-> this
 | ||||||
| 	//
 | 	//
 | ||||||
| 	// The items are constructed by passing a make function to .__list__(..)
 | 	// The items are constructed by passing a make function to .__items__(..)
 | ||||||
| 	// which in turn will call this make(..) per item created.
 | 	// which in turn will call this make(..) per item created.
 | ||||||
| 	//
 | 	//
 | ||||||
| 	// For more doc on item construction see: .__init__(..)
 | 	// For more doc on item construction see: .__init__(..)
 | ||||||
| @ -1159,7 +1176,7 @@ var BaseBrowserPrototype = { | |||||||
| 	// 		identify an item thus no state is maintained between .make(..)
 | 	// 		identify an item thus no state is maintained between .make(..)
 | ||||||
| 	// 		calls for such items...
 | 	// 		calls for such items...
 | ||||||
| 	//
 | 	//
 | ||||||
| 	// XXX revise options handling for .__list__(..)
 | 	// XXX revise options handling for .__items__(..)
 | ||||||
| 	// XXX might be a good idea to enable the user to merge the state 
 | 	// XXX might be a good idea to enable the user to merge the state 
 | ||||||
| 	// 		manually...
 | 	// 		manually...
 | ||||||
| 	// 		one way to do:
 | 	// 		one way to do:
 | ||||||
| @ -1167,19 +1184,30 @@ var BaseBrowserPrototype = { | |||||||
| 	// 			- update it
 | 	// 			- update it
 | ||||||
| 	// 			- pass it to make(..)
 | 	// 			- pass it to make(..)
 | ||||||
| 	// 		Example:
 | 	// 		Example:
 | ||||||
| 	// 			// just a rough example in .__list__(..)...
 | 	// 			// just a rough example in .__items__(..)...
 | ||||||
| 	// 			make(value, 
 | 	// 			make(value, 
 | ||||||
| 	// 				value in this.index ? 
 | 	// 				value in this.index ? 
 | ||||||
| 	// 					Object.assign(
 | 	// 					Object.assign(
 | ||||||
| 	// 						this.index[value], 
 | 	// 						this.index[value], 
 | ||||||
| 	// 						opts) 
 | 	// 						opts) 
 | ||||||
| 	// 					: opts)
 | 	// 					: opts)
 | ||||||
|  | 	// XXX revise if stage 2 is applicable to sections other than .items
 | ||||||
| 	make: function(options){ | 	make: function(options){ | ||||||
| 		var that = this | 		var that = this | ||||||
| 		options = Object.assign( | 		options = Object.assign( | ||||||
| 			Object.create(this.options || {}),  | 			Object.create(this.options || {}),  | ||||||
| 			options || {}) | 			options || {}) | ||||||
| 
 | 
 | ||||||
|  | 		// sections to make...
 | ||||||
|  | 		var sections = options.section == '*' ? | ||||||
|  | 			(options.sections || ['header', 'items', 'footer']) | ||||||
|  | 			: (options.section || 'items') | ||||||
|  | 		sections = (sections instanceof Array ?  | ||||||
|  | 				sections  | ||||||
|  | 				: [sections]) | ||||||
|  | 			// keep only sections we know how to make...
 | ||||||
|  | 			.filter(function(name){ | ||||||
|  | 				return that[`__${name}__`] instanceof Function }) | ||||||
| 
 | 
 | ||||||
| 		// item constructor...
 | 		// item constructor...
 | ||||||
| 		//
 | 		//
 | ||||||
| @ -1203,9 +1231,10 @@ var BaseBrowserPrototype = { | |||||||
| 		// 		while the latter stores a list of items.
 | 		// 		while the latter stores a list of items.
 | ||||||
| 		// 		...would be more logical to store the object (i.e. browser/list)
 | 		// 		...would be more logical to store the object (i.e. browser/list)
 | ||||||
| 		// 		directly as the element...
 | 		// 		directly as the element...
 | ||||||
|  | 		var section | ||||||
| 		var make_called = false | 		var make_called = false | ||||||
| 		var list = [] |  | ||||||
| 		var ids = new Set() | 		var ids = new Set() | ||||||
|  | 		var list = [] | ||||||
| 		var keys = options.uniqueKeys ?  | 		var keys = options.uniqueKeys ?  | ||||||
| 			new Set()  | 			new Set()  | ||||||
| 			: null | 			: null | ||||||
| @ -1278,8 +1307,8 @@ var BaseBrowserPrototype = { | |||||||
| 
 | 
 | ||||||
| 			// user extended make...
 | 			// user extended make...
 | ||||||
| 			// XXX differentiate this for header and list...
 | 			// XXX differentiate this for header and list...
 | ||||||
| 			//this.__make__
 | 			this.__make__ | ||||||
| 			//	&& this.__make__(item)
 | 				&& this.__make__(section, item) | ||||||
| 
 | 
 | ||||||
| 			// store the item...
 | 			// store the item...
 | ||||||
| 			list.push(item) | 			list.push(item) | ||||||
| @ -1290,22 +1319,17 @@ var BaseBrowserPrototype = { | |||||||
| 		make.__proto__ = Items | 		make.__proto__ = Items | ||||||
| 		make.dialog = this | 		make.dialog = this | ||||||
| 
 | 
 | ||||||
| 		// build the lists...
 | 		// build the sections...
 | ||||||
| 		//* XXX
 | 		sections | ||||||
| 		;[...(this.__header__ ?  | 			.forEach(function(name){ | ||||||
| 					[['__header__', 'header']] |  | ||||||
| 					: []), |  | ||||||
| 				['__list__', 'items']] |  | ||||||
| 			.forEach(function([method, name]){ |  | ||||||
| 				// setup closure for make(..)...
 | 				// setup closure for make(..)...
 | ||||||
|  | 				section = name | ||||||
| 				make_called = false | 				make_called = false | ||||||
| 				ids = new Set() | 				ids = new Set() | ||||||
| 				list = make.items = that[name] = [] | 				list = make.items = that[name] = [] | ||||||
| 
 | 
 | ||||||
| 				// build list...
 | 				// build list...
 | ||||||
| 				// XXX check that this is enough...
 | 				var res = that[`__${name}__`](make, | ||||||
| 				// 		...do we index header items???
 |  | ||||||
| 				var res = that[method](make, |  | ||||||
| 					// XXX not sure about this -- revise options handling...
 | 					// XXX not sure about this -- revise options handling...
 | ||||||
| 					options ?  | 					options ?  | ||||||
| 						Object.assign( | 						Object.assign( | ||||||
| @ -1313,28 +1337,15 @@ var BaseBrowserPrototype = { | |||||||
| 							options || {})  | 							options || {})  | ||||||
| 						: null) | 						: null) | ||||||
| 
 | 
 | ||||||
| 				// if make was not called use the .__list__(..) return value...
 | 				// if make was not called use the .__items__(..) return value...
 | ||||||
| 				that[name] = make_called ?  | 				that[name] = make_called ?  | ||||||
| 					that[name] | 					that[name] | ||||||
| 					: res }) | 					: res }) | ||||||
| 
 | 
 | ||||||
| 		/*/ |  | ||||||
| 		// setup closure for make(..)...
 |  | ||||||
| 		list = make.items = this.items = [] |  | ||||||
| 		// XXX not sure about this -- revise options handling...
 |  | ||||||
| 		var res = this.__list__(make,  |  | ||||||
| 			options ?  |  | ||||||
| 				Object.assign( |  | ||||||
| 					Object.create(this.options || {}),  |  | ||||||
| 					options || {})  |  | ||||||
| 				: null) |  | ||||||
| 		// if make was not called use the .__list__(..) return value...
 |  | ||||||
| 		this.items = make_called ?  |  | ||||||
| 			this.items  |  | ||||||
| 			: res |  | ||||||
| 		//*/
 |  | ||||||
| 
 |  | ||||||
| 		// reset the index/cache...
 | 		// reset the index/cache...
 | ||||||
|  | 		// XXX should this be only for .items???
 | ||||||
|  | 		// 		...should this be global (all items?)
 | ||||||
|  | 		if(sections.includes('items')){ | ||||||
| 			var old_index = this.__item_index_cache || {} | 			var old_index = this.__item_index_cache || {} | ||||||
| 			this.clearCache() | 			this.clearCache() | ||||||
| 
 | 
 | ||||||
| @ -1342,7 +1353,6 @@ var BaseBrowserPrototype = { | |||||||
| 			// NOTE: we are doing this in a separate pass as items can get 
 | 			// NOTE: we are doing this in a separate pass as items can get 
 | ||||||
| 			// 		rearranged during the make phase (Items.nest(..) ...),
 | 			// 		rearranged during the make phase (Items.nest(..) ...),
 | ||||||
| 			// 		thus avoiding odd duplicate index numbering...
 | 			// 		thus avoiding odd duplicate index numbering...
 | ||||||
| 		// XXX should we also index header???
 |  | ||||||
| 			var index = this.__item_index_cache = this.index | 			var index = this.__item_index_cache = this.index | ||||||
| 
 | 
 | ||||||
| 			// post process the items...
 | 			// post process the items...
 | ||||||
| @ -1356,7 +1366,7 @@ var BaseBrowserPrototype = { | |||||||
| 						// XXX this is not very elegant(???), revise... 
 | 						// XXX this is not very elegant(???), revise... 
 | ||||||
| 						&& Object.assign(e, | 						&& Object.assign(e, | ||||||
| 							old_index[id], | 							old_index[id], | ||||||
| 						e) }) | 							e) }) } | ||||||
| 
 | 
 | ||||||
| 		return this | 		return this | ||||||
| 	}, | 	}, | ||||||
| @ -1539,7 +1549,16 @@ var BaseBrowserPrototype = { | |||||||
| 		context.index = context.index || 0 | 		context.index = context.index || 0 | ||||||
| 
 | 
 | ||||||
| 		// options specifics...
 | 		// options specifics...
 | ||||||
| 		var source = options.source || 'items' | 		// NOTE: we include header/footer only for the root context...
 | ||||||
|  | 		var sections = context.root === this ? | ||||||
|  | 				'items' | ||||||
|  | 			: options.section == '*' ? | ||||||
|  | 				(options.sections || 'items') | ||||||
|  | 			: (options.section || 'items') | ||||||
|  | 		sections = sections instanceof Array ?  | ||||||
|  | 			sections  | ||||||
|  | 			: [sections] | ||||||
|  | 
 | ||||||
| 		var iterateNonIterable = options.iterateAll || options.iterateNonIterable | 		var iterateNonIterable = options.iterateAll || options.iterateNonIterable | ||||||
| 		var iterateCollapsed = options.iterateAll || options.iterateCollapsed | 		var iterateCollapsed = options.iterateAll || options.iterateCollapsed | ||||||
| 		var skipNested = !options.iterateAll && options.skipNested | 		var skipNested = !options.iterateAll && options.skipNested | ||||||
| @ -1710,11 +1729,14 @@ var BaseBrowserPrototype = { | |||||||
| 			},  | 			},  | ||||||
| 			[],  | 			[],  | ||||||
| 			// input items...
 | 			// input items...
 | ||||||
| 			...(reverse ?  | 			...(sections | ||||||
| 				this[source] | 				.map(function(name){ | ||||||
| 					.slice() | 					return that[name] || [] }) | ||||||
| 					.reverse()  | 				.flat() | ||||||
| 				: this[source])) }, | 				.run(function(){ | ||||||
|  | 					return reverse ? | ||||||
|  | 						this.reverse() | ||||||
|  | 						: this }))) }, | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| 	// Test/Example Text renders...
 | 	// Test/Example Text renders...
 | ||||||
| @ -3083,10 +3105,10 @@ var BaseBrowserPrototype = { | |||||||
| 	// XXX should we update on init....
 | 	// XXX should we update on init....
 | ||||||
| 	__init__: function(func, options){ | 	__init__: function(func, options){ | ||||||
| 		var args = [...arguments] | 		var args = [...arguments] | ||||||
| 		this.__list__ = args.shift() | 		this.__items__ = args.shift() | ||||||
| 		if(args[0] instanceof Function){ | 		if(args[0] instanceof Function){ | ||||||
| 			this.__header__ = this.__list__ | 			this.__header__ = this.__items__ | ||||||
| 			this.__list__ = args.shift() | 			this.__items__ = args.shift() | ||||||
| 		} | 		} | ||||||
| 		this.options = Object.assign( | 		this.options = Object.assign( | ||||||
| 			Object.create(this.options || {}),  | 			Object.create(this.options || {}),  | ||||||
| @ -3555,18 +3577,6 @@ var HTMLBrowserPrototype = { | |||||||
| 		this.__dom = value }, | 		this.__dom = value }, | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| 	// XXX header...
 |  | ||||||
| 	// XXX might be a good idea to make this expandable -- show/hide options...
 |  | ||||||
| 	__header__: function(make, options){ |  | ||||||
| 		make('CURRENT_PATH', { |  | ||||||
| 			id: 'current_path', |  | ||||||
| 			cls: 'path', |  | ||||||
| 			buttons: (options || {}).headerButtons  |  | ||||||
| 				|| (this.options || {}).headerButtons  |  | ||||||
| 				|| [], |  | ||||||
| 		}) }, |  | ||||||
| 
 |  | ||||||
| 
 |  | ||||||
| 	// Extending query...
 | 	// Extending query...
 | ||||||
| 	//	
 | 	//	
 | ||||||
| 	// Extended .search(..) to support:
 | 	// Extended .search(..) to support:
 | ||||||
|  | |||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user