From 28d9c5dc1205329315d429fea841f5e898227666 Mon Sep 17 00:00:00 2001 From: "Alex A. Naanou" Date: Fri, 13 Jan 2017 08:42:47 +0300 Subject: [PATCH] started work on key editor UI... Signed-off-by: Alex A. Naanou --- ui (gen4)/css/experimenting.css | 2 +- ui (gen4)/features/history.js | 11 +-- ui (gen4)/features/keyboard.js | 133 ++++++++++++++++++++++++++++---- ui (gen4)/lib/widget/browse.js | 13 +++- 4 files changed, 134 insertions(+), 25 deletions(-) diff --git a/ui (gen4)/css/experimenting.css b/ui (gen4)/css/experimenting.css index 2abc10b7..e775da6b 100755 --- a/ui (gen4)/css/experimenting.css +++ b/ui (gen4)/css/experimenting.css @@ -331,7 +331,7 @@ body { 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-style: italic; } diff --git a/ui (gen4)/features/history.js b/ui (gen4)/features/history.js index c44cf49c..db08a16c 100755 --- a/ui (gen4)/features/history.js +++ b/ui (gen4)/features/history.js @@ -573,9 +573,7 @@ var URLHistoryUIActions = actions.Actions({ // XXX should this be standard functionality??? ['●' +'○', - function(p){ - var cur = this.filter('"'+p+'"', false) - + function(p, cur){ // change state... // pinned... if(cur.hasClass('pinned')){ @@ -597,11 +595,10 @@ var URLHistoryUIActions = actions.Actions({ }], // mark for removal... ['×', - function(p){ - var e = this.filter('"'+p+'"', false) - .toggleClass('strike-out') + function(p, cur){ + cur.toggleClass('strike-out') - if(e.hasClass('strike-out')){ + if(cur.hasClass('strike-out')){ to_remove.indexOf(p) < 0 && to_remove.push(p) diff --git a/ui (gen4)/features/keyboard.js b/ui (gen4)/features/keyboard.js index 22ea9d7c..db32b5f8 100755 --- a/ui (gen4)/features/keyboard.js +++ b/ui (gen4)/features/keyboard.js @@ -717,12 +717,6 @@ var KeyboardActions = actions.Actions({ // Interface stuff ------------------------------------------------ - // XXX key editor: - // [ mode ] - // [ action (text with dataset) ] [ args (text field) ] no default: [_] - // --- - // - // new key // XXX BUG sections with doc do not show up in title... // XXX sub-group by path (???) // XXX place this in /Doc/.. (???) @@ -767,15 +761,21 @@ var KeyboardActions = actions.Actions({ not_filtered_out: true, // XXX should sections be searchable??? not_searchable: true, + + buttons: [ + // XXX up + ['⏶', function(){}], + // XXX down + ['⏷', function(){}], + ].concat(dialog.options.itemButtons), }) + .attr('mode', mode) .addClass('mode') // bindings... var c = 0 Object.keys(keys[mode] || {}).forEach(function(action){ - action instanceof Function && console.log('!!!!!') - var o = keyboard.parseActionCall(action) if(get_text){ @@ -819,11 +819,14 @@ var KeyboardActions = actions.Actions({ hidden: hidden, disabled: hidden, }) - .attr('doc', - doc.trim() != '' ? + .attr({ + 'mode': mode, + 'code': action, + 'doc': doc.trim() != '' ? doc : (kb.special_handlers[action] - || null)) + || null), + }) .addClass('key' // special stuff... + (action in kb.special_handlers ? @@ -856,7 +859,8 @@ var KeyboardActions = actions.Actions({ .filter(function(k){ return bound_ignored.indexOf(k) == -1 }) .join(' / ')]) - .addClass('ignore-list') + .addClass('drop-list') + .attr('mode', mode) // controls... if(edit){ @@ -866,11 +870,16 @@ var KeyboardActions = actions.Actions({ ['key', function(){ //elem.before( XXX ) + actions.editKeyBinding(mode) + // XXX update when done??? }], // XXX ['mode', function(){ //elem.after( XXX ) + // XXX need to pass order info... + actions.editKeyboardMode() + // XXX update when done??? }], ]}) .addClass('new') @@ -907,7 +916,18 @@ var KeyboardActions = actions.Actions({ //['⏷', function(){}], // 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(){}], //['🖉', function(){}], ] @@ -916,9 +936,92 @@ var KeyboardActions = actions.Actions({ return dialog })], + // XXX BUG: for some reason modes are unclickable... editKeyboardBindings: ['Interface/Keyboard bindings editor...', 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: [_] + // --- + // + // 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 @@ -926,7 +1029,7 @@ var KeyboardActions = actions.Actions({ // - remove the path component... // - insert the action name where not doc present... // XXX cleanup CSS - showKeyboardBindings: ['Interface/Show keyboard bindings...', + showKeyboardBindings: ['- Interface/Show keyboard bindings...', widgets.makeUIDialog('Drawer', function(){ return keyboard.buildKeybindingsHelpHTML( diff --git a/ui (gen4)/lib/widget/browse.js b/ui (gen4)/lib/widget/browse.js index 2e357592..626e673c 100755 --- a/ui (gen4)/lib/widget/browse.js +++ b/ui (gen4)/lib/widget/browse.js @@ -800,6 +800,15 @@ var BrowserPrototype = { // // NOTE: buttons will override .options.itemButtons, if this is not // 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)... @@ -1140,11 +1149,11 @@ var BrowserPrototype = { // action name... if(typeof(func) == typeof('str')){ - that[func](txt) + that[func](txt, res) // handler... } else { - func.call(that, txt) + func.call(that, txt, res) } })) })