docs and minor tweaks...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2019-02-12 02:34:11 +03:00
parent 6c8c0ea3b3
commit a314131066

View File

@ -491,6 +491,9 @@ var BrowserPrototype = {
// ] // ]
itemButtons: [ itemButtons: [
], ],
// XXX need to mix these into the header only...
headerItemButtons: [
],
}, },
// parent element (optional)... // parent element (optional)...
@ -517,6 +520,19 @@ var BrowserPrototype = {
this.__dom = value }, this.__dom = value },
//
// Foramt:
// <div class="browse-widget" tabindex="0">
// <!-- header -->
// ...
//
// <!-- list -->
// <div class="list v-block">
// <!-- items -->
// ...
// </div>
// </div>
//
// XXX instrument interactions... // XXX instrument interactions...
renderList: function(items, context){ renderList: function(items, context){
var that = this var that = this
@ -543,12 +559,19 @@ var BrowserPrototype = {
return dialog return dialog
}, },
//
// Foramt:
// <div class="path v-block">
// <div class="dir" tabindex="0">dir</div>
// ...
// <div class="dir cur" tabindex="0">dir</div>
// </div>
//
// XXX populate this... // XXX populate this...
// XXX make this an item??? // XXX make this an item???
renderListHeader: function(context){ renderListHeader: function(context){
var header = document.createElement('div') var header = document.createElement('div')
header.classList.add('path', 'v-block') header.classList.add('path', 'v-block')
header.setAttribute('tabindex', '0')
// XXX path/search... // XXX path/search...
var dir = document.createElement('div') var dir = document.createElement('div')
@ -558,6 +581,16 @@ var BrowserPrototype = {
return header return header
}, },
//
// Format:
// <div class="list">
// <!-- header (optional) -->
// ...
//
// <!-- sublist (optional) -->
// ...
// </div>
//
// XXX can we influence how the options are passed to the header??? // XXX can we influence how the options are passed to the header???
renderNested: function(header, sublist, item, context){ renderNested: function(header, sublist, item, context){
var that = this var that = this
@ -594,6 +627,7 @@ var BrowserPrototype = {
// items... // items...
sublist instanceof Node ? sublist instanceof Node ?
e.appendChild(sublist) e.appendChild(sublist)
// XXX should this add the items to a container???
: sublist instanceof Array ? : sublist instanceof Array ?
sublist sublist
.forEach(function(item){ .forEach(function(item){
@ -604,6 +638,12 @@ var BrowserPrototype = {
return e return e
}, },
//
// Format:
// <div class="group">
// ..
// </div>
//
// XXX this does not seem to get called by .render(..)... // XXX this does not seem to get called by .render(..)...
renderGroup: function(items, context){ renderGroup: function(items, context){
var e = document.createElement('div') var e = document.createElement('div')
@ -614,6 +654,20 @@ var BrowserPrototype = {
.forEach(function(item){ .forEach(function(item){
e.appendChild(item) }) e.appendChild(item) })
return e }, return e },
//
// Format:
// <div value="value_json" class="item .." tabindex="0" ..>
// <!-- value -->
// <div class="text">value_a</div>
// <div class="text">value_b</div>
// ...
//
// <!-- buttons (optional) -->
// <div class="button">button_a_html</div>
// <div class="button">button_b_html</div>
// ...
// </div>
//
// XXX add custom events: // XXX add custom events:
// - open // - open
// - select // - select
@ -638,11 +692,11 @@ var BrowserPrototype = {
return !!item[cls] }))) return !!item[cls] })))
// attrs... // attrs...
item.disabled
|| elem.setAttribute('tabindex', '0')
Object.entries(item.attrs || {}) Object.entries(item.attrs || {})
.forEach(function([key, value]){ .forEach(function([key, value]){
elem.setAttribute(key, value) }) elem.setAttribute(key, value) })
item.disabled
|| elem.setAttribute('tabindex', '0')
elem.setAttribute('value', JSON.stringify(item.value)) elem.setAttribute('value', JSON.stringify(item.value))
// values... // values...
@ -695,7 +749,7 @@ var BrowserPrototype = {
return elem return elem
}, },
// save the rendered state to .dom // save the rendered state to .dom and wrap a list of nodes in a div...
render: function(options){ render: function(options){
var d = object.parent(BrowserPrototype.render, this).call(this, ...arguments) var d = object.parent(BrowserPrototype.render, this).call(this, ...arguments)