mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-10-29 02:10:08 +00:00
notes and minor cleanup...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
f69837c625
commit
1b98cddc2a
@ -195,14 +195,14 @@ requirejs([
|
|||||||
dialog = browser.Browser(function(make){
|
dialog = browser.Browser(function(make){
|
||||||
make(['list', 'of', 'text'])
|
make(['list', 'of', 'text'])
|
||||||
make.group(
|
make.group(
|
||||||
make('$group item 0',
|
make('$group item 0 (open event)',
|
||||||
function(){ console.log('##', ...arguments) }),
|
function(){ console.log('##', ...arguments) }),
|
||||||
'group item 1 (bare)')
|
'group item 1 (bare)')
|
||||||
// XXX Q: should we show only one if multiple lines are in sequence???
|
// XXX Q: should we show only one if multiple lines are in sequence???
|
||||||
make('---')
|
make('---')
|
||||||
// embeded browser...
|
// embeded browser...
|
||||||
make(browser.Browser(function(make){
|
make(browser.Browser(function(make){
|
||||||
make('inlined browser item 0', {
|
make('inlined browser item 0 (open/menu events)', {
|
||||||
open: function(){ console.log('!!! OPEN', ...arguments) },
|
open: function(){ console.log('!!! OPEN', ...arguments) },
|
||||||
menu: function(){ console.log('!!! MENU', ...arguments) },
|
menu: function(){ console.log('!!! MENU', ...arguments) },
|
||||||
})
|
})
|
||||||
|
|||||||
@ -3047,6 +3047,7 @@ var BrowserClassPrototype = {
|
|||||||
var BrowserPrototype = {
|
var BrowserPrototype = {
|
||||||
__proto__: BaseBrowser.prototype,
|
__proto__: BaseBrowser.prototype,
|
||||||
|
|
||||||
|
|
||||||
options: {
|
options: {
|
||||||
__proto__: BaseBrowser.prototype.options,
|
__proto__: BaseBrowser.prototype.options,
|
||||||
|
|
||||||
@ -3172,7 +3173,6 @@ var BrowserPrototype = {
|
|||||||
},
|
},
|
||||||
function(){ return that.dom })
|
function(){ return that.dom })
|
||||||
return kb },
|
return kb },
|
||||||
|
|
||||||
// NOTE: this is not designed for direct use...
|
// NOTE: this is not designed for direct use...
|
||||||
get __keyboard_handler(){
|
get __keyboard_handler(){
|
||||||
var options = this.options || {}
|
var options = this.options || {}
|
||||||
@ -3220,8 +3220,7 @@ var BrowserPrototype = {
|
|||||||
// .search('pagetop'[, offset] ..)
|
// .search('pagetop'[, offset] ..)
|
||||||
// .search('pagebottom'[, offset] ..)
|
// .search('pagebottom'[, offset] ..)
|
||||||
//
|
//
|
||||||
//
|
// XXX add support for pixel offset???
|
||||||
// XXX add support for pixel offset...
|
|
||||||
search: function(pattern){
|
search: function(pattern){
|
||||||
var args = [...arguments].slice(1)
|
var args = [...arguments].slice(1)
|
||||||
var p = pattern
|
var p = pattern
|
||||||
@ -3346,6 +3345,7 @@ var BrowserPrototype = {
|
|||||||
navigator.clipboard.writeText(text || this.path)
|
navigator.clipboard.writeText(text || this.path)
|
||||||
: console.warn('.__copy(..): clipboard-write not allowed.') }) },
|
: console.warn('.__copy(..): clipboard-write not allowed.') }) },
|
||||||
|
|
||||||
|
|
||||||
// Element renderers...
|
// Element renderers...
|
||||||
//
|
//
|
||||||
// This also does:
|
// This also does:
|
||||||
@ -3422,7 +3422,6 @@ var BrowserPrototype = {
|
|||||||
// </div>
|
// </div>
|
||||||
// </div>
|
// </div>
|
||||||
//
|
//
|
||||||
// XXX the way focus management is done here feels hack-ish...
|
|
||||||
renderList: function(items, context){
|
renderList: function(items, context){
|
||||||
var that = this
|
var that = this
|
||||||
var options = context.options || this.options || {}
|
var options = context.options || this.options || {}
|
||||||
@ -3442,7 +3441,7 @@ var BrowserPrototype = {
|
|||||||
// list...
|
// list...
|
||||||
var list = document.createElement('div')
|
var list = document.createElement('div')
|
||||||
list.classList.add('list', 'v-block')
|
list.classList.add('list', 'v-block')
|
||||||
// HACK?: prevent scrollbar from grabbing focus...
|
// prevent scrollbar from grabbing focus...
|
||||||
list.addEventListener('mousedown',
|
list.addEventListener('mousedown',
|
||||||
function(evt){ evt.stopPropagation() })
|
function(evt){ evt.stopPropagation() })
|
||||||
items
|
items
|
||||||
@ -3452,9 +3451,6 @@ var BrowserPrototype = {
|
|||||||
: item) })
|
: item) })
|
||||||
dialog.appendChild(list)
|
dialog.appendChild(list)
|
||||||
|
|
||||||
// XXX event handlers...
|
|
||||||
// XXX
|
|
||||||
|
|
||||||
return dialog
|
return dialog
|
||||||
},
|
},
|
||||||
//
|
//
|
||||||
@ -3489,7 +3485,6 @@ var BrowserPrototype = {
|
|||||||
// ...
|
// ...
|
||||||
// </div>
|
// </div>
|
||||||
//
|
//
|
||||||
// XXX register event handlers...
|
|
||||||
renderNested: function(header, children, item, context){
|
renderNested: function(header, children, item, context){
|
||||||
var that = this
|
var that = this
|
||||||
var options = context.options || this.options || {}
|
var options = context.options || this.options || {}
|
||||||
@ -3511,47 +3506,33 @@ var BrowserPrototype = {
|
|||||||
// items...
|
// items...
|
||||||
children instanceof Node ?
|
children instanceof Node ?
|
||||||
e.appendChild(children)
|
e.appendChild(children)
|
||||||
// XXX should this add the items to a container???
|
|
||||||
: children instanceof Array ?
|
: children instanceof Array ?
|
||||||
children
|
children
|
||||||
.forEach(function(item){
|
.forEach(function(item){
|
||||||
e.appendChild(item) })
|
e.appendChild(item) })
|
||||||
: null
|
: null
|
||||||
|
|
||||||
// XXX event handlers... (???)
|
|
||||||
// XXX
|
|
||||||
|
|
||||||
item.dom = e
|
item.dom = e
|
||||||
|
|
||||||
return e
|
return e
|
||||||
},
|
},
|
||||||
// NOTE: this is the similar to .renderItem(..)
|
// NOTE: this is the similar to .renderItem(..)
|
||||||
// XXX make collapse action overloadable....
|
|
||||||
// XXX use item.events...
|
|
||||||
renderNestedHeader: function(item, i, context){
|
renderNestedHeader: function(item, i, context){
|
||||||
var that = this
|
var that = this
|
||||||
return this.renderItem(item, i, context)
|
return this.renderItem(item, i, context)
|
||||||
// update dom...
|
// update dom...
|
||||||
.run(function(){
|
.run(function(){
|
||||||
// class...
|
|
||||||
// XXX should be done here or in the config???
|
|
||||||
this.classList.add('sub-list-header', 'traversable')
|
this.classList.add('sub-list-header', 'traversable')
|
||||||
item.collapsed
|
item.collapsed
|
||||||
&& this.classList.add('collapsed')
|
&& this.classList.add('collapsed')
|
||||||
|
|
||||||
// collapse action handler...
|
|
||||||
// XXX make this overloadable...
|
|
||||||
// XXX use item.events...
|
|
||||||
$(this).on('open', function(evt){
|
|
||||||
that.toggleCollapse(item) })
|
|
||||||
}) },
|
}) },
|
||||||
//
|
//
|
||||||
// Format:
|
// Format:
|
||||||
// <div class="group">
|
// <div class="group">
|
||||||
// ..
|
// <!-- items -->
|
||||||
|
// ...
|
||||||
// </div>
|
// </div>
|
||||||
//
|
//
|
||||||
// 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')
|
||||||
e.classList.add('group')
|
e.classList.add('group')
|
||||||
@ -3579,6 +3560,8 @@ var BrowserPrototype = {
|
|||||||
// around. It is not recommended to use DOM events directly.
|
// around. It is not recommended to use DOM events directly.
|
||||||
//
|
//
|
||||||
// XXX should buttons be active in disabled state???
|
// XXX should buttons be active in disabled state???
|
||||||
|
// ...for enable/disable button seems logical, not so much for
|
||||||
|
// the rest...
|
||||||
renderItem: function(item, i, context){
|
renderItem: function(item, i, context){
|
||||||
var that = this
|
var that = this
|
||||||
var options = context.options || this.options || {}
|
var options = context.options || this.options || {}
|
||||||
@ -3748,7 +3731,6 @@ var BrowserPrototype = {
|
|||||||
|
|
||||||
// scroll...
|
// scroll...
|
||||||
//
|
//
|
||||||
// XXX do we need this???
|
|
||||||
scrollTo: function(pattern, position){
|
scrollTo: function(pattern, position){
|
||||||
var target = this.get(pattern)
|
var target = this.get(pattern)
|
||||||
target
|
target
|
||||||
@ -3838,7 +3820,6 @@ var BrowserPrototype = {
|
|||||||
// refocus the dialog...
|
// refocus the dialog...
|
||||||
that.dom
|
that.dom
|
||||||
&& that.dom.focus() }) },
|
&& that.dom.focus() }) },
|
||||||
// XXX should we only update the current elem???
|
|
||||||
__expand__: function(){ this.update() },
|
__expand__: function(){ this.update() },
|
||||||
__collapse__: function(){ this.update() },
|
__collapse__: function(){ this.update() },
|
||||||
__select__: updateElemClass('add', 'selected'),
|
__select__: updateElemClass('add', 'selected'),
|
||||||
@ -3896,6 +3877,9 @@ var BrowserPrototype = {
|
|||||||
.expand()
|
.expand()
|
||||||
: this.next() },
|
: this.next() },
|
||||||
|
|
||||||
|
|
||||||
|
// filtering/search mode...
|
||||||
|
// XXX
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user