From cf26b8407697b6b2206e1518daa2b7ce93702c05 Mon Sep 17 00:00:00 2001 From: "Alex A. Naanou" Date: Sat, 26 Jan 2019 21:32:14 +0300 Subject: [PATCH] working on the API... Signed-off-by: Alex A. Naanou --- ui (gen4)/lib/widget/browse2.js | 133 ++++++++++++++++++++++++++++---- 1 file changed, 117 insertions(+), 16 deletions(-) diff --git a/ui (gen4)/lib/widget/browse2.js b/ui (gen4)/lib/widget/browse2.js index 0d053efc..54de976b 100755 --- a/ui (gen4)/lib/widget/browse2.js +++ b/ui (gen4)/lib/widget/browse2.js @@ -36,18 +36,52 @@ var widget = require('./widget') // XXX var Items = module.items = function(){} + +Items.dialog = null +Items.items = null + + + // Focus last created item... // XXX also would be nice to set the last created items to .last or // similar in the context... Items.focus = function(){ } -// Embed a list... + // -Items.embed = function(){ +// .group(make(..), ..) +// // XXX not implemented yet... +// .group(make(..), .., options) +// -> make +// +// Example: +// make.group( +// make(1), +// make(2), +// make(3)) +// +// XXX need to cleanup the args... +// XXX do we need to pass options to groups??? +Items.group = function(...items){ + // XXX filter out non-make values.... + // ...for some reason this clears the list... + //items = items + // .filter(function(e){ + // return e === this }) + var l = this.items.length - items.length + this.items.splice(l, items.length, this.items.slice(l)) + return this } -Items.dialog = null +Items.embed = function(list, options){ + return this(list, options) } + +Items.nest = function(item, list, options){ + options = options || {} + options.sublist = list + return this(item, options) +} // singular items... @@ -143,14 +177,39 @@ var BaseBrowserPrototype = { // - first item of sub-list // - connected to the sub-list but part of the parent list // ...I'm leaning to the later... - items: null, + __items: null, + get items(){ + this.__items + || this.make() + return this.__items + }, + set items(value){ + this.__items = value }, + // - // .__list__(make) + // .__list__(make, options) // -> undefined // -> list // - // XXX do we care about the return value??? + // + // make(value, options) + // -> make + // + // + // There are two modes of operation: + // 1) call make(..) to create items + // 2) return a list of items + // + // The if make is called at least once the return value is ignored. + // + // + // Example: + // XXX + // + // + // NOTE: this is not designed to be called directly... + // // XXX not sure how to handle options in here -- see .make(..) and its notes... __list__: function(make, options){ throw new Error('.__list__(..): Not implemented.') }, @@ -177,9 +236,10 @@ var BaseBrowserPrototype = { }.bind(this) make.__proto__ = Items make.dialog = this + make.items = items //var res = this.__list__(make) - // XXX not sure about this... + // XXX not sure about this -- options handling... var res = this.__list__(make, options ? Object.assign( @@ -203,8 +263,11 @@ var BaseBrowserPrototype = { return items }, // Render nested list... // NOTE: to skip rendering an item/list return null... - renderSubList: function(item, rendered, options){ - return rendered }, + renderSubList: function(sublist, item, options){ + return sublist }, + // Render group... + renderGroup: function(items, options){ + return items }, // Render list item... // NOTE: to skip rendering an item/list return null... renderItem: function(item, i, options){ @@ -237,6 +300,7 @@ var BaseBrowserPrototype = { options = context.options // render the items... + var _render // XXX should we control render parameters (range, start, end, ...) // from outside render and pass this info down to nested lists??? // ...if yes how?? @@ -244,18 +308,38 @@ var BaseBrowserPrototype = { // - arg threading // - render context var items = this.items - .map(function(item, i){ - return item.render ? + .map(_render = function(item, i){ + return ( + // group... + item instanceof Array ? + that.renderGroup( + item.map(_render), options) + // renderable item... + : item.render ? that.renderSubList( - item, item.render(context), + item, options) + // renderable value -- embedded list... : item.value.render ? that.renderSubList( - item, item.value.render(context), + item, options) - : that.renderItem(item, i, options) }) + // renderable sub-list -- nested list... + : (item.sublist || {}).render ? + (item.collapsed ? + // collapsed item... + that.renderItem(item, i, options) + // expanded item (grouped)... + : that.renderGroup([ + that.renderItem(item, i, options), + that.renderSubList( + item.sublist.render(context), + item, + options) ], options)) + // basic item... + : that.renderItem(item, i, options)) }) .filter(function(e){ return e != null }) @@ -283,6 +367,20 @@ var BaseBrowserPrototype = { .render(this, options) }, + // XXX item API... + get: function(){}, + set: function(){}, + remove: function(){}, + sort: function(){}, + splice: function(){}, + + // XXX should there return an array or a .constructor(..) instance?? + forEach: function(){}, + map: function(){}, + filter: function(){}, + reduce: function(){}, + + __init__: function(func, options){ this.__list__ = func this.options = Object.assign( @@ -328,9 +426,12 @@ var BrowserPrototype = { // XXX list header // ...is it the responsibility of sub-list or the parent list??? // XXX save link to dom (???) - renderSubList: function(item, rendered, options){ + renderSubList: function(sublist, item, options){ // XXX expand/collapse state??? - return rendered }, + return sublist }, + // Render group... + renderGroup: function(items, options){ + return items }, // Render list item... // XXX save link to dom in item.dom (???) renderItem: function(item, i, options){