mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-10-29 02:10:08 +00:00
started work on key editor UI...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
4ca661dd74
commit
28d9c5dc12
@ -331,7 +331,7 @@ body {
|
|||||||
background: rgba(0, 0, 0, 0.7);
|
background: rgba(0, 0, 0, 0.7);
|
||||||
}
|
}
|
||||||
|
|
||||||
.browse-widget.key-bindings .list>.ignore-list .text:first-child {
|
.browse-widget.key-bindings .list>.drop-list .text:first-child {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
font-style: italic;
|
font-style: italic;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -573,9 +573,7 @@ var URLHistoryUIActions = actions.Actions({
|
|||||||
// XXX should this be standard functionality???
|
// XXX should this be standard functionality???
|
||||||
['<span class="pin-set">●</span>'
|
['<span class="pin-set">●</span>'
|
||||||
+'<span class="pin-unset">○</span>',
|
+'<span class="pin-unset">○</span>',
|
||||||
function(p){
|
function(p, cur){
|
||||||
var cur = this.filter('"'+p+'"', false)
|
|
||||||
|
|
||||||
// change state...
|
// change state...
|
||||||
// pinned...
|
// pinned...
|
||||||
if(cur.hasClass('pinned')){
|
if(cur.hasClass('pinned')){
|
||||||
@ -597,11 +595,10 @@ var URLHistoryUIActions = actions.Actions({
|
|||||||
}],
|
}],
|
||||||
// mark for removal...
|
// mark for removal...
|
||||||
['×',
|
['×',
|
||||||
function(p){
|
function(p, cur){
|
||||||
var e = this.filter('"'+p+'"', false)
|
cur.toggleClass('strike-out')
|
||||||
.toggleClass('strike-out')
|
|
||||||
|
|
||||||
if(e.hasClass('strike-out')){
|
if(cur.hasClass('strike-out')){
|
||||||
to_remove.indexOf(p) < 0
|
to_remove.indexOf(p) < 0
|
||||||
&& to_remove.push(p)
|
&& to_remove.push(p)
|
||||||
|
|
||||||
|
|||||||
@ -717,12 +717,6 @@ var KeyboardActions = actions.Actions({
|
|||||||
|
|
||||||
// Interface stuff ------------------------------------------------
|
// Interface stuff ------------------------------------------------
|
||||||
|
|
||||||
// XXX key editor:
|
|
||||||
// [ mode ]
|
|
||||||
// [ action (text with dataset) ] [ args (text field) ] no default: [_]
|
|
||||||
// ---
|
|
||||||
// <list of keys>
|
|
||||||
// new key
|
|
||||||
// XXX BUG sections with doc do not show up in title...
|
// XXX BUG sections with doc do not show up in title...
|
||||||
// XXX sub-group by path (???)
|
// XXX sub-group by path (???)
|
||||||
// XXX place this in /Doc/.. (???)
|
// XXX place this in /Doc/.. (???)
|
||||||
@ -767,15 +761,21 @@ var KeyboardActions = actions.Actions({
|
|||||||
not_filtered_out: true,
|
not_filtered_out: true,
|
||||||
// XXX should sections be searchable???
|
// XXX should sections be searchable???
|
||||||
not_searchable: true,
|
not_searchable: true,
|
||||||
|
|
||||||
|
buttons: [
|
||||||
|
// XXX up
|
||||||
|
['⏶', function(){}],
|
||||||
|
// XXX down
|
||||||
|
['⏷', function(){}],
|
||||||
|
].concat(dialog.options.itemButtons),
|
||||||
})
|
})
|
||||||
|
.attr('mode', mode)
|
||||||
.addClass('mode')
|
.addClass('mode')
|
||||||
|
|
||||||
// bindings...
|
// bindings...
|
||||||
var c = 0
|
var c = 0
|
||||||
Object.keys(keys[mode] || {}).forEach(function(action){
|
Object.keys(keys[mode] || {}).forEach(function(action){
|
||||||
|
|
||||||
action instanceof Function && console.log('!!!!!')
|
|
||||||
|
|
||||||
var o = keyboard.parseActionCall(action)
|
var o = keyboard.parseActionCall(action)
|
||||||
|
|
||||||
if(get_text){
|
if(get_text){
|
||||||
@ -819,11 +819,14 @@ var KeyboardActions = actions.Actions({
|
|||||||
hidden: hidden,
|
hidden: hidden,
|
||||||
disabled: hidden,
|
disabled: hidden,
|
||||||
})
|
})
|
||||||
.attr('doc',
|
.attr({
|
||||||
doc.trim() != '' ?
|
'mode': mode,
|
||||||
|
'code': action,
|
||||||
|
'doc': doc.trim() != '' ?
|
||||||
doc
|
doc
|
||||||
: (kb.special_handlers[action]
|
: (kb.special_handlers[action]
|
||||||
|| null))
|
|| null),
|
||||||
|
})
|
||||||
.addClass('key'
|
.addClass('key'
|
||||||
// special stuff...
|
// special stuff...
|
||||||
+ (action in kb.special_handlers ?
|
+ (action in kb.special_handlers ?
|
||||||
@ -856,7 +859,8 @@ var KeyboardActions = actions.Actions({
|
|||||||
.filter(function(k){
|
.filter(function(k){
|
||||||
return bound_ignored.indexOf(k) == -1 })
|
return bound_ignored.indexOf(k) == -1 })
|
||||||
.join(' / ')])
|
.join(' / ')])
|
||||||
.addClass('ignore-list')
|
.addClass('drop-list')
|
||||||
|
.attr('mode', mode)
|
||||||
|
|
||||||
// controls...
|
// controls...
|
||||||
if(edit){
|
if(edit){
|
||||||
@ -866,11 +870,16 @@ var KeyboardActions = actions.Actions({
|
|||||||
['key',
|
['key',
|
||||||
function(){
|
function(){
|
||||||
//elem.before( XXX )
|
//elem.before( XXX )
|
||||||
|
actions.editKeyBinding(mode)
|
||||||
|
// XXX update when done???
|
||||||
}],
|
}],
|
||||||
// XXX
|
// XXX
|
||||||
['mode',
|
['mode',
|
||||||
function(){
|
function(){
|
||||||
//elem.after( XXX )
|
//elem.after( XXX )
|
||||||
|
// XXX need to pass order info...
|
||||||
|
actions.editKeyboardMode()
|
||||||
|
// XXX update when done???
|
||||||
}],
|
}],
|
||||||
]})
|
]})
|
||||||
.addClass('new')
|
.addClass('new')
|
||||||
@ -907,7 +916,18 @@ var KeyboardActions = actions.Actions({
|
|||||||
//['⏷', function(){}],
|
//['⏷', function(){}],
|
||||||
|
|
||||||
// XXX edit -- launch the editor...
|
// XXX edit -- launch the editor...
|
||||||
['⋯', function(){}],
|
// ...do we actually need this as a button????
|
||||||
|
['⋯', function(_, cur){
|
||||||
|
// key...
|
||||||
|
if(cur.hasClass('key')){
|
||||||
|
actions.editKeyBinding(cur.attr('mode'), cur.attr('code'))
|
||||||
|
|
||||||
|
// mode...
|
||||||
|
} else if(cur.hasClass('mode')){
|
||||||
|
actions.editKeyboardMode(cur.attr('mode'))
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
//*/
|
||||||
//['edit', function(){}],
|
//['edit', function(){}],
|
||||||
//['🖉', function(){}],
|
//['🖉', function(){}],
|
||||||
]
|
]
|
||||||
@ -916,9 +936,92 @@ var KeyboardActions = actions.Actions({
|
|||||||
|
|
||||||
return dialog
|
return dialog
|
||||||
})],
|
})],
|
||||||
|
// XXX BUG: for some reason modes are unclickable...
|
||||||
editKeyboardBindings: ['Interface/Keyboard bindings editor...',
|
editKeyboardBindings: ['Interface/Keyboard bindings editor...',
|
||||||
widgets.uiDialog(function(path){
|
widgets.uiDialog(function(path){
|
||||||
return this.browseKeyboardBindings(path, true) })],
|
var that = this
|
||||||
|
var dialog = this.browseKeyboardBindings(path, true)
|
||||||
|
// XXX should this be only a button thing (done in .browseKeyboardBindings(..))
|
||||||
|
// or also the main action???
|
||||||
|
.open(function(){
|
||||||
|
var cur = dialog.select('!')
|
||||||
|
|
||||||
|
// key...
|
||||||
|
if(cur.hasClass('key')){
|
||||||
|
that.editKeyBinding(cur.attr('mode'), cur.attr('code'))
|
||||||
|
|
||||||
|
// mode...
|
||||||
|
// XXX BUG: for some reason modes are unclickable...
|
||||||
|
} else if(cur.hasClass('mode')){
|
||||||
|
that.editKeyboardMode(cur.attr('mode'))
|
||||||
|
|
||||||
|
} else if(cur.hasClass('drop-list')){
|
||||||
|
that.editKeyboardModeDroppedKeys(cur.attr('mode'))
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return dialog
|
||||||
|
})],
|
||||||
|
|
||||||
|
// XXX key editor:
|
||||||
|
// [ mode ]
|
||||||
|
// [ action (text with dataset) ] [ args (text field) ] no default: [_]
|
||||||
|
// ---
|
||||||
|
// <list of keys>
|
||||||
|
// new key
|
||||||
|
// XXX
|
||||||
|
editKeyBinding: ['- Interface/Key binding editor...',
|
||||||
|
widgets.makeUIDialog(function(mode, code){
|
||||||
|
var that = this
|
||||||
|
// XXX
|
||||||
|
var dialog = browse.makeLister(null,
|
||||||
|
function(path, make){
|
||||||
|
// XXX make editable...
|
||||||
|
make(['Mode:', mode || ''])
|
||||||
|
// XXX make editable...
|
||||||
|
make(['Code:', code || ''])
|
||||||
|
|
||||||
|
make('---')
|
||||||
|
|
||||||
|
// list the keys...
|
||||||
|
that.keyboard.keys(code)[mode][code]
|
||||||
|
.forEach(function(key){
|
||||||
|
// XXX make editable...
|
||||||
|
make(key, { buttons: [
|
||||||
|
['×', function(){}],
|
||||||
|
], })
|
||||||
|
})
|
||||||
|
|
||||||
|
make('New key')
|
||||||
|
// XXX stub...
|
||||||
|
.css({ fontStyle: 'italic' })
|
||||||
|
|
||||||
|
make('---')
|
||||||
|
|
||||||
|
make('', { buttons: [
|
||||||
|
['Delete mapping', function(){}],
|
||||||
|
], })
|
||||||
|
})
|
||||||
|
|
||||||
|
return dialog
|
||||||
|
})],
|
||||||
|
// XXX
|
||||||
|
editKeyboardMode: ['- Interface/keyboard mode editor...',
|
||||||
|
widgets.makeUIDialog(function(mode){
|
||||||
|
var that = this
|
||||||
|
var dialog = browse.makeLister(null,
|
||||||
|
function(path, make){
|
||||||
|
make(['Mode:', mode || ''])
|
||||||
|
make(['Doc:', that.keybindings[mode].doc || ''])
|
||||||
|
make(['Pattern:', that.keybindings[mode].pattern || mode])
|
||||||
|
})
|
||||||
|
|
||||||
|
return dialog
|
||||||
|
})],
|
||||||
|
// XXX
|
||||||
|
editKeyboardModeDroppedKeys: ['- Interface/keyboard mode dropped key editor...',
|
||||||
|
widgets.makeUIDialog(function(mode){
|
||||||
|
// XXX
|
||||||
|
})],
|
||||||
|
|
||||||
|
|
||||||
// XXX move to gen2
|
// XXX move to gen2
|
||||||
@ -926,7 +1029,7 @@ var KeyboardActions = actions.Actions({
|
|||||||
// - remove the path component...
|
// - remove the path component...
|
||||||
// - insert the action name where not doc present...
|
// - insert the action name where not doc present...
|
||||||
// XXX cleanup CSS
|
// XXX cleanup CSS
|
||||||
showKeyboardBindings: ['Interface/Show keyboard bindings...',
|
showKeyboardBindings: ['- Interface/Show keyboard bindings...',
|
||||||
widgets.makeUIDialog('Drawer',
|
widgets.makeUIDialog('Drawer',
|
||||||
function(){
|
function(){
|
||||||
return keyboard.buildKeybindingsHelpHTML(
|
return keyboard.buildKeybindingsHelpHTML(
|
||||||
|
|||||||
@ -800,6 +800,15 @@ var BrowserPrototype = {
|
|||||||
//
|
//
|
||||||
// NOTE: buttons will override .options.itemButtons, if this is not
|
// NOTE: buttons will override .options.itemButtons, if this is not
|
||||||
// desired simply copy .itemButtons and modify it...
|
// desired simply copy .itemButtons and modify it...
|
||||||
|
// Example:
|
||||||
|
// make(.., {
|
||||||
|
// buttons: [
|
||||||
|
//
|
||||||
|
// ...
|
||||||
|
//
|
||||||
|
// // dialog here refers to the browse object...
|
||||||
|
// ].concat(dialog.options.itemButtons),
|
||||||
|
// })
|
||||||
//
|
//
|
||||||
//
|
//
|
||||||
// Finalize the dialog (optional)...
|
// Finalize the dialog (optional)...
|
||||||
@ -1140,11 +1149,11 @@ var BrowserPrototype = {
|
|||||||
|
|
||||||
// action name...
|
// action name...
|
||||||
if(typeof(func) == typeof('str')){
|
if(typeof(func) == typeof('str')){
|
||||||
that[func](txt)
|
that[func](txt, res)
|
||||||
|
|
||||||
// handler...
|
// handler...
|
||||||
} else {
|
} else {
|
||||||
func.call(that, txt)
|
func.call(that, txt, res)
|
||||||
}
|
}
|
||||||
}))
|
}))
|
||||||
})
|
})
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user