From b3e9eb67661afaed9e72cafac32b8a87fd658faf Mon Sep 17 00:00:00 2001 From: "Alex A. Naanou" Date: Thu, 14 Apr 2016 16:01:17 +0300 Subject: [PATCH] added editing of intervals in slideshow... Signed-off-by: Alex A. Naanou --- ui (gen4)/css/widget/browse.css | 8 ++++ ui (gen4)/features/metadata.js | 19 +++------ ui (gen4)/features/ui-slideshow.js | 68 ++++++++++++++++++++++++++++-- ui (gen4)/lib/util.js | 29 +++++++++++++ ui (gen4)/lib/widget/browse.js | 25 +++++------ 5 files changed, 121 insertions(+), 28 deletions(-) diff --git a/ui (gen4)/css/widget/browse.css b/ui (gen4)/css/widget/browse.css index c10da02d..d0ecd496 100755 --- a/ui (gen4)/css/widget/browse.css +++ b/ui (gen4)/css/widget/browse.css @@ -30,6 +30,13 @@ } +/* editable... */ +.browse-widget [contenteditable] { + min-width: 2px; + min-height: 2px; +} + + /************************************************************ Path ***/ @@ -245,6 +252,7 @@ opacity: 0.3; } + /* numbers... */ /* XXX need to show this only on devices with keyboards... */ .browse-widget .list .text:before { diff --git a/ui (gen4)/features/metadata.js b/ui (gen4)/features/metadata.js index 3bd70df6..f6b14ffd 100755 --- a/ui (gen4)/features/metadata.js +++ b/ui (gen4)/features/metadata.js @@ -268,10 +268,12 @@ var MetadataUIActions = actions.Actions({ ], 'metadata-auto-select-mode': 'on select', + // XXX 'metadata-editable-fields': [ - 'Artist', - 'Copyright', - 'Comment', + //'Artist', + //'Copyright', + //'Comment', + //'Tags', ], 'metadata-field-order': [ // base @@ -325,13 +327,6 @@ var MetadataUIActions = actions.Actions({ b = b == -1 ? x : b return a - b } - var _selectElemText = function(elem){ - var range = document.createRange() - range.selectNodeContents(elem) - var sel = window.getSelection() - sel.removeAllRanges() - sel.addRange(range) - } var _buildInfoList = function(image, metadata){ // XXX move these to an info feature... @@ -434,7 +429,7 @@ var MetadataUIActions = actions.Actions({ // select value of current item... .on('select', function(evt, elem){ if(that.config['metadata-auto-select-mode'] == 'on select'){ - _selectElemText($(elem).find('.text').last()[0]) + $(elem).find('.text').last().selectText() } }) // XXX start editing onkeydown... @@ -451,7 +446,7 @@ var MetadataUIActions = actions.Actions({ // handle select... if(that.config['metadata-auto-select-mode'] == 'on open'){ - _selectElemText(elem[0]) + elem.selectText() } // skip non-editable fields... diff --git a/ui (gen4)/features/ui-slideshow.js b/ui (gen4)/features/ui-slideshow.js index c7f51c6e..84fa96cd 100755 --- a/ui (gen4)/features/ui-slideshow.js +++ b/ui (gen4)/features/ui-slideshow.js @@ -11,6 +11,7 @@ define(function(require){ var module = {} var toggler = require('lib/toggler') var actions = require('lib/actions') var features = require('lib/features') +var keyboard = require('lib/keyboard') var core = require('features/core') var base = require('features/base') @@ -96,6 +97,57 @@ var SlideshowActions = actions.Actions({ return } + var _makeEditable = function(elem){ + $(elem).find('.text') + .prop('contenteditable', true) + .text('') + .selectText() + .keydown(function(){ + event.stopPropagation() + + var n = keyboard.toKeyName(event.keyCode) + + // reset to original value... + if(n == 'Esc'){ + oo.client.update() + + // save value... + } else if(n == 'Enter'){ + event.preventDefault() + var txt = $(this).text() + + // invalid format... + if(!Date.str2ms(txt)){ + oo.client.update() + return + } + + // add new value and sort list... + that.config['slideshow-intervals'] + .push(txt) + that.config['slideshow-intervals'] + .sort(function(a, b){ + return Date.str2ms(a) - Date.str2ms(b) + }) + + // update the list data... + oo.client.options.data + = that.config['slideshow-intervals'] + .concat([ + '---', + 'New...' + ]) + + // update list and select new value... + oo.client.update() + .done(function(){ + oo.client.select('"'+txt+'"') + }) + } + }) + return $(elem) + } + // interval... // XXX add custom interval editing... if(/interval/i.test(path)){ @@ -105,8 +157,9 @@ var SlideshowActions = actions.Actions({ that.config['slideshow-intervals'] .concat([ // XXX do we add a new item here??? - //'---', - //'New' + '---', + //$('') + 'New...', ]), {itemButtons: [ // mark for removal... @@ -127,9 +180,16 @@ var SlideshowActions = actions.Actions({ } }], ]}) + // select 'New...' item... + .on('select', function(evt, elem){ + if(/new/i.test($(elem).text())){ + _makeEditable(elem) + } + }) .open(function(evt, time){ - if(/new/i.test(time)){ - // XXX edit... + if(!Date.str2ms(time)){ + oo.client.select('New...') + // XXX place the cursor... // XXX } else { diff --git a/ui (gen4)/lib/util.js b/ui (gen4)/lib/util.js index f37f3560..e25b00c6 100755 --- a/ui (gen4)/lib/util.js +++ b/ui (gen4)/lib/util.js @@ -159,6 +159,18 @@ function(path){ +/*********************************************************************/ + +module.selectElemText = function(elem){ + var range = document.createRange() + range.selectNodeContents(elem) + var sel = window.getSelection() + sel.removeAllRanges() + sel.addRange(range) +} + + + /*********************************************************************/ // XXX experiment @@ -201,9 +213,26 @@ if(typeof(jQuery) != typeof(undefined)){ elem.velocity('stop') }) } + + jQuery.fn.selectText = function(){ + var range = document.createRange() + + this.each(function(){ + range.selectNodeContents(this) + }) + + var sel = window.getSelection() + sel.removeAllRanges() + sel.addRange(range) + + return this + } + + } + /********************************************************************** * vim:set ts=4 sw=4 : */ return module }) diff --git a/ui (gen4)/lib/widget/browse.js b/ui (gen4)/lib/widget/browse.js index b11b50ae..a3d6df9b 100755 --- a/ui (gen4)/lib/widget/browse.js +++ b/ui (gen4)/lib/widget/browse.js @@ -355,8 +355,9 @@ var BrowserPrototype = { '#1', '#2', '#3', '#4', '#5', '#6', '#7', '#8', '#9', ], - Enter: 'stopFullPathEdit!', - Esc: 'abortFullPathEdit!', + // XXX + Enter: 'push!', + Esc: 'update!', }, FullPathEdit: { @@ -454,19 +455,19 @@ var BrowserPrototype = { D: 'toggleDisabledDrawing', T: 'toggleNonTraversableDrawing', - // XXX should these be select??? + // XXX should these use .select(..)??? // XXX should these be relative to visible area or absolute // to current list regardless of scroll (as is now)??? // XXX should these work while filtering?? - '#1': 'push: "0!"', - '#2': 'push: "1!"', - '#3': 'push: "2!"', - '#4': 'push: "3!"', - '#5': 'push: "4!"', - '#6': 'push: "5!"', - '#7': 'push: "6!"', - '#8': 'push: "7!"', - '#9': 'push: "8!"', + '#1': 'push!: "0!"', + '#2': 'push!: "1!"', + '#3': 'push!: "2!"', + '#4': 'push!: "3!"', + '#5': 'push!: "4!"', + '#6': 'push!: "5!"', + '#7': 'push!: "6!"', + '#8': 'push!: "7!"', + '#9': 'push!: "8!"', }, },