ImageGrid/ui (gen4)/lib/widget/browse2.html
Alex A. Naanou bed990372b testing generic-walk...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
2019-05-03 19:43:22 +03:00

196 lines
3.6 KiB
HTML
Executable File

<!DOCTYPE html>
<html>
<link rel="stylesheet" href="../../css/widget/browse.css">
<link rel="stylesheet" href="../../css/fonts.css">
<style>
body {
font-family: OpenSans, sans-serif;
}
.container {
position: absolute;
}
</style>
<script src="../../ext-lib/jquery.js"></script>
<script src="../../ext-lib/jquery-ui.js"></script>
<script src="../jli.js"></script>
<script src="../../ext-lib/require.js"></script>
<script src="../../cfg/requirejs.js"></script>
<!--script src="browse-dialog.js"></script-->
<script>
var TREE = {
dir_a: {},
'dir b': {
file1: 'this is a file',
file2: 'this is a file',
file3: 'this is a file',
},
dir_c: {
file1: 'this is a file',
dir_b: {
file1: 'this is a file',
},
dir_c: {},
dir_d: {},
dir_e: {},
dir_f: {},
dir_g: {},
dir_h: {},
dir_i: {},
dir_j: {},
dir_k: {},
dir_l: {},
dir_m: {},
dir_o: {},
dir_p: {},
dir_q: {},
dir_r: {},
dir_s: {},
dir_t: {},
dir_u: {},
},
file: 'this is a file',
}
// add some recursion for testing...
TREE.dir_d = TREE.dir_c.dir_b
TREE.dir_a.tree = TREE
TREE.dir_c.tree = TREE
TREE.dir_c.dir_b.tree = TREE
//---
var use_disabled = true
var show_files = false
requirejs.config({
paths: {
'lib/object': '../../node_modules/ig-object/object',
'lib/actions': '../../node_modules/ig-actions/actions',
'lib/features': '../../node_modules/ig-features/features',
//'lib/keyboard': '../../node_modules/ig-keyboard/keyboard',
},
map: {
'*': {
'../object': 'lib/object',
},
},
})
requirejs([
'../util',
'../keyboard',
'lib/object',
'../toggler',
'./browse2',
], function(u, k, o, t, br){
util = u
keyboard = k
object = o
toggler = t
browser = br
// XXX split this into several dialogues, show each and then combine...
dialog_1 = browser.Browser(function(make){
make(['list', 'of', 'text'])
make.group(
make('group item 0'),
'group item 1 (bare)')
// XXX Q: should we show only one if multiple lines are in sequence???
make('---')
//make('---')
// XXX not yet visible...
//make('...')
//make('e')
// embeded browser...
make(browser.Browser(function(make){
make('inlined browser item 0')
make(1)
make(2)
}))
// basic nested list...
make.nest('nested', [
make('moo', {disabled: true}),
2,
// XXX this is not supported by .map(..)...
make.nest('nested', browser.Browser(function(make){
make('ab')
})),
])
make('in between two subtrees...')
// nested browser...
make.nest('B',
browser.Browser(function(make){
make('xx')
make.nest('C', browser.Browser(function(make){
make('aaa')
make.nest('D', browser.Browser(function(make){
make('a')
make('---')
make('b')
}))
make('bbb')
make('bbb')
}))
}), {
//collapsed: true,
// XXX this does not appear to survive attaching an item
// to the document...
click: function(){ console.log('!!!!!!!!!!!!') },
//cls: ['heading'],
})
}, {
itemButtons: [
['&ndash;'],
['&square;'],
],
})
dialog_1.container = $('.container').first()[0]
dialog_1.render()
//$('.container').first().append(dialog_1.render())
})
$(function(){
$('.container').draggable({
cancel: ".path .dir, .list div"
})
})
</script>
<body>
<div class="container tree">
</div>
<div class="container flat">
</div>
<div class="container flat2">
</div>
<div class="container pathlist">
</div>
</body>
</html>
<!-- vim:set ts=4 sw=4 : -->