mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-10-29 02:10:08 +00:00
started work on the key binding editor...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
ddcccdfe41
commit
f8c2a9615e
@ -292,6 +292,58 @@ body {
|
||||
|
||||
|
||||
|
||||
/* key binding editor... */
|
||||
.browse-widget.key-bindings .list>.mode {
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
.browse-widget.key-bindings .list>.mode .doc {
|
||||
margin-left: 1em;
|
||||
|
||||
color: white;
|
||||
font-weight: normal;
|
||||
font-size: small;
|
||||
font-style: italic;
|
||||
|
||||
opacity: 0.8;
|
||||
}
|
||||
.browse-widget.key-bindings .list>.mode.selected {
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
|
||||
.browse-widget.key-bindings .list>.key {
|
||||
}
|
||||
.browse-widget.key-bindings .list>.key .button {
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.browse-widget.key-bindings .list>.key:after,
|
||||
.browse-widget.key-bindings .list>.key .text:not(:first-child) {
|
||||
display: inline;
|
||||
position: relative;
|
||||
content: attr(keys);
|
||||
|
||||
float: right;
|
||||
margin-left: 1em;
|
||||
margin-right: 1em;
|
||||
|
||||
opacity: 0.8;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.browse-widget.key-bindings .list>.new {
|
||||
font-style: italic;
|
||||
}
|
||||
.browse-widget.key-bindings .list>.new:not(.selected) {
|
||||
opacity: 0.3;
|
||||
}
|
||||
.browse-widget.key-bindings .list>.new.selected {
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* DEBUG stuff... */
|
||||
.container-center {
|
||||
position: absolute;
|
||||
|
||||
@ -622,8 +622,10 @@ var KeyboardActions = actions.Actions({
|
||||
// * add ability to disable key without deleting
|
||||
// * use the same mechanics to show the keys as in .browseActions(..)
|
||||
//
|
||||
browseKeyboardBindings: ['- Interface/',
|
||||
// XXX do not hide modes on search...
|
||||
browseKeyboardBindings: ['Interface/Keyboard bindings editor (EXPERIMENTAL)...',
|
||||
widgets.makeUIDialog(function(path){
|
||||
var actions = this
|
||||
|
||||
// Format:
|
||||
// {
|
||||
@ -646,7 +648,69 @@ var KeyboardActions = actions.Actions({
|
||||
: '')
|
||||
})
|
||||
|
||||
// XXX
|
||||
var dialog = browse.makeLister(null,
|
||||
function(path, make){
|
||||
Object.keys(keys)
|
||||
.forEach(function(mode){
|
||||
// section heading...
|
||||
make(keys[mode].doc ?
|
||||
$('<span>')
|
||||
// NOTE: at this time adding a br
|
||||
// is faster and simpler than
|
||||
// doing this in CSS...
|
||||
// XXX revise...
|
||||
.html(mode + '<br>')
|
||||
.append($('<span>')
|
||||
.addClass('doc')
|
||||
.html(keys[mode].doc))
|
||||
: mode)
|
||||
.addClass('mode')
|
||||
|
||||
// bindings...
|
||||
Object.keys(keys[mode])
|
||||
.forEach(function(action){
|
||||
action != 'doc'
|
||||
// NOTE: wee need the button
|
||||
// spec to be searchable,
|
||||
// thus we are not using
|
||||
// the keys attr as in
|
||||
// .browseActions(..)
|
||||
&& make([action, '$BUTTONS']
|
||||
.concat(keys[mode][action]
|
||||
.join(' / ')))
|
||||
.addClass('key')
|
||||
})
|
||||
|
||||
// add new binding/section...
|
||||
var elem = make('new', {
|
||||
buttons: [
|
||||
// XXX
|
||||
['key',
|
||||
function(){
|
||||
//elem.before( XXX )
|
||||
}],
|
||||
// XXX
|
||||
['mode',
|
||||
function(){
|
||||
//elem.after( XXX )
|
||||
}],
|
||||
]})
|
||||
.addClass('new')
|
||||
})
|
||||
}, {
|
||||
cls: 'key-bindings',
|
||||
|
||||
itemButtons: [
|
||||
// XXX
|
||||
['^', function(){}],
|
||||
// XXX
|
||||
['v', function(){}],
|
||||
// XXX
|
||||
['edit', function(){}],
|
||||
],
|
||||
})
|
||||
|
||||
return dialog
|
||||
})],
|
||||
})
|
||||
|
||||
|
||||
@ -795,6 +795,10 @@ var BrowserPrototype = {
|
||||
// the text.
|
||||
// NOTE: empty strings will get replaced
|
||||
// with
|
||||
// NOTE: if one of the items or constructor
|
||||
// returns is "$BUTTONS" then this
|
||||
// item will get replaced with the
|
||||
// button container
|
||||
// - DOM/jQuery - an element to be used as an item
|
||||
//
|
||||
// Both traversable and disabled are optional and can take bool
|
||||
@ -1059,10 +1063,13 @@ var BrowserPrototype = {
|
||||
var txt = p.join('')
|
||||
// XXX check if traversable...
|
||||
p = $(p.map(function(t){
|
||||
return $('<span>')
|
||||
.addClass('text')
|
||||
// here we also replace empty strings with ...
|
||||
[t ? 'text' : 'html'](t || ' ')[0]
|
||||
return t == '$BUTTONS' ?
|
||||
$('<span/>')
|
||||
.addClass('button-container')[0]
|
||||
: $('<span>')
|
||||
.addClass('text')
|
||||
// here we also replace empty strings with ...
|
||||
[t ? 'text' : 'html'](t || ' ')[0]
|
||||
}))
|
||||
|
||||
// jQuery or dom...
|
||||
@ -1113,9 +1120,17 @@ var BrowserPrototype = {
|
||||
push_on_open && res.attr('push-on-open', 'on')
|
||||
|
||||
// buttons...
|
||||
// button container...
|
||||
var btn = res.find('.button-container')
|
||||
btn = btn.length == 0 ?
|
||||
$('<span/>')
|
||||
.addClass('button-container')
|
||||
.appendTo(res)
|
||||
: btn
|
||||
|
||||
// action (open)...
|
||||
if(traversable && that.options.actionButton){
|
||||
res.append($('<div>')
|
||||
btn.append($('<div>')
|
||||
.addClass('button')
|
||||
.html(that.options.actionButton === true ?
|
||||
'✓'
|
||||
@ -1128,7 +1143,7 @@ var BrowserPrototype = {
|
||||
}
|
||||
// push...
|
||||
if(traversable && that.options.pushButton){
|
||||
res.append($('<div>')
|
||||
btn.append($('<div>')
|
||||
.addClass('button')
|
||||
.html(that.options.pushButton ?
|
||||
'p'
|
||||
@ -1139,11 +1154,6 @@ var BrowserPrototype = {
|
||||
}))
|
||||
}
|
||||
|
||||
// button container...
|
||||
var btn = $('<span/>')
|
||||
.addClass('button-container')
|
||||
.appendTo(res)
|
||||
|
||||
// custom buttons...
|
||||
buttons && buttons
|
||||
// make the order consistent for the user -- first
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user