making the .Editable(..) item constructor more functional...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2017-01-20 23:03:09 +03:00
parent 37f601f77b
commit cdc50df278
3 changed files with 51 additions and 9 deletions

View File

@ -25,7 +25,7 @@ var drawer = require('lib/widget/drawer')
/*********************************************************************/
var GLOBAL_KEYBOARD =
module.GLOBAL_KEYBOARD2 = {
module.GLOBAL_KEYBOARD = {
'Global': {
doc: 'Global bindings that take priority over other sections.',
pattern: '*',

View File

@ -367,7 +367,9 @@ if(typeof(jQuery) != typeof(undefined)){
//
// Options format:
// {
// // activate (focus) element when done...
// // activate (focus) element...
// //
// // NOTE: this will also select the element text...
// activate: false,
//
// // set multi line edit mode...
@ -386,8 +388,6 @@ if(typeof(jQuery) != typeof(undefined)){
// // restore focus before disabling the editor...
// keep_focus_on_parent: true,
//
// stop_propagation: false,
//
// // clear selection on abort/commit...
// clear_selection_on_abort: true,
// clear_selection_on_commit: true,
@ -444,7 +444,8 @@ if(typeof(jQuery) != typeof(undefined)){
&& this.text('')
// NOTE: this will also focus the element...
options.activate && this.selectText()
options.activate
&& this.selectText()
// do not setup handlers more than once...
if(!this.hasClass('editable-field')){

View File

@ -166,8 +166,28 @@ function(text, options){
// // show as action (via. .Action(..))
// action: <bool>,
//
// // if true, set multi-line mode...
// //
// // (see: util.makeEditable(..) for more info)
// multiline: false,
//
// // .text element index to edit...
// //
// // NOTE: by default this will select all the elements, if there
// // are more than one, this may result in an odd element
// // state...
// editable_index: <number>,
//
// // item event to start the edit on...
// start_on: 'select',
//
// // if true, trigger abort on deselect...
// abort_on_deselect: true,
//
// // If true, clear text when item is selected...
// clear_on_edit: true,
// //
// // (see: util.makeEditable(..) for more info)
// clear_on_edit: false,
//
// // Called when editing is abrted...
// editaborted: <func>,
@ -177,33 +197,51 @@ function(text, options){
//
// ...
// }
//
// XXX add option to select the element on start...
Items.Editable =
function(text, options){
options = options || {}
var dialog = this.dialog
var editable
var start_on = options.start_on || 'select'
var elem = (options.action ? this.Action : this).call(this, text, options)
.on('select', function(){
.on(start_on, function(){
editable = elem.find('.text')
// get the specific .text element...
editable = options.editable_index != null ?
editable.eq(options.editable_index)
: editable
// edit the element...
editable
.makeEditable({
activate: true,
clear_on_edit: options.clear_on_edit,
blur_on_abort: false,
blur_on_commit: false,
multiline: options.multiline,
})
// deselect on abort...
// deselect on abort -- if we started with a select...
start_on == 'select' && editable
.on('edit-aborted', function(){
dialog.select(null)
})
// edit event handlers...
options.editaborted
&& editable.on('edit-aborted', options.editaborted)
options.editdone
&& editable.on('edit-done', options.editdone)
})
.on('deselect', function(){
editable.trigger('abort')
editable.trigger(
options.abort_on_deselect !== false ? 'abort' : 'commit')
})
return elem
}
@ -628,6 +666,9 @@ var BrowserPrototype = {
cls: null,
// Initial path...
//
// NOTE: this can be a number indicating the item to select when
// load is done.
//path: null,
//show_path: true,