CS5 ScriptUI focus issue

Mike Hale · Post by **Mike Hale** » Sun Feb 12, 2012 2:52 am

The demo script below has two sliders with editext controls.

If you run the script with ESTK as the target and enter 200 in the top edittext then click on the bottom slider the focus switches to the bottom slider and the top slider updates as expected.

If you do the same with Photoshop as the target, the focus does not change. The bottom slider and edittext work as expected but the insertion cursor is still in the top edittext and the onChange doesn't get called to update the top slider.

Anyone know how to force the focus to change?

Code: Select all var dlg = new Window( 'dialog', 'focus demo' );

dlg.grpOne = dlg.add('group');
   var grpSliderOne = dlg.grpOne;
   grpSliderOne.orientation = 'column';
   grpSliderOne.alignChildren = ['fill','top'];
   grpSliderOne.grpSlider = grpSliderOne.add('group');
   grpSliderOne.grpSlider.spacing = 0;
   grpSliderOne.grpSlider.orientation = 'column';
   grpSliderOne.grpSlider.st1 = grpSliderOne.grpSlider.add('statictext',undefined,'setting one');
   grpSliderOne.grpSlider.st1.alignment = 'left';
   grpSliderOne.grpSlider.grpSlider = grpSliderOne.grpSlider.add('group');
   grpSliderOne.grpSlider.grpSlider.alignChildren = ['left','center'];
   grpSliderOne.grpSlider.grpSlider.spacing = 0;
   dlg.slSettingOne = grpSliderOne.grpSlider.grpSlider.add('slider',undefined,5,5,500);
   dlg.slSettingOne.preferredSize.width = 200;
   dlg.etSettingOneValue = grpSliderOne.grpSlider.grpSlider.add('edittext',undefined,'5');
   dlg.etSettingOneValue.addEventListener ('keydown', InitEditKeyboardHandler );
   dlg.etSettingOneValue.preferredSize.width = 40;
   grpSliderOne.grpSlider.grpSlider.stUnit = grpSliderOne.grpSlider.grpSlider.add('statictext',undefined,'px');

   grpSliderOne.grpSlider.grpSt = grpSliderOne.grpSlider.add('group');
   grpSliderOne.grpSlider.grpSt.preferredSize.width = 200;
   grpSliderOne.grpSlider.grpSt.orientation = 'row';
   grpSliderOne.grpSlider.grpSt.alignment = 'fill';
   grpSliderOne.grpSlider.grpSt.spacing = 0;
   grpSliderOne.grpSlider.grpSt.margins = [5,0,0,0];
   grpSliderOne.grpSlider.grpSt.grpLeft = grpSliderOne.grpSlider.grpSt.add('group');
   grpSliderOne.grpSlider.grpSt.grpLeft.st1 = grpSliderOne.grpSlider.grpSt.grpLeft.add('statictext',undefined,'5 px');
   grpSliderOne.grpSlider.grpSt.grpLeft.st1.alignment = ['left','center'];
   grpSliderOne.grpSlider.grpSt.grpLeft.st1.preferredSize.width = 140;
   grpSliderOne.grpSlider.grpSt.grpLeft.st3 = grpSliderOne.grpSlider.grpSt.grpLeft.add('statictext',undefined,'500 px');
   grpSliderOne.grpSlider.grpSt.grpLeft.st3.alignment = ['right','center'];
   grpSliderOne.grpSlider.grpSt.grpLeft.st3.preferredSize.width = 45;

dlg.grpTwo = dlg.add('group');
   var grpSliderTwo = dlg.grpTwo;
   grpSliderTwo.orientation = 'column';
   grpSliderTwo.alignChildren = ['fill','top'];
   grpSliderTwo.grpSlider = grpSliderTwo.add('group');
   grpSliderTwo.grpSlider.spacing = 0;
   grpSliderTwo.grpSlider.orientation = 'column';
   grpSliderTwo.grpSlider.st1 = grpSliderTwo.grpSlider.add('statictext',undefined,'setting two');
   grpSliderTwo.grpSlider.st1.alignment = 'left';
   grpSliderTwo.grpSlider.grpSlider = grpSliderTwo.grpSlider.add('group');
   grpSliderTwo.grpSlider.grpSlider.alignChildren = ['left','center'];
   grpSliderTwo.grpSlider.grpSlider.spacing = 0;
   dlg.slSettingTwo = grpSliderTwo.grpSlider.grpSlider.add('slider',undefined,0,-100,100);
   dlg.slSettingTwo.preferredSize.width = 200;
   dlg.etSettingTwoValue = grpSliderTwo.grpSlider.grpSlider.add('edittext',undefined,'0');
   dlg.etSettingTwoValue.preferredSize.width = 40;
   grpSliderTwo.grpSlider.grpSlider.stUnit = grpSliderTwo.grpSlider.grpSlider.add('statictext',undefined,'px');

   grpSliderTwo.grpSlider.grpSt = grpSliderTwo.grpSlider.add('group');
   grpSliderTwo.grpSlider.grpSt.preferredSize.width = 200;
   grpSliderTwo.grpSlider.grpSt.orientation = 'row';
   grpSliderTwo.grpSlider.grpSt.alignment = 'fill';
   grpSliderTwo.grpSlider.grpSt.spacing = 0;
   grpSliderTwo.grpSlider.grpSt.margins = [5,0,0,0];
   grpSliderTwo.grpSlider.grpSt.grpLeft = grpSliderTwo.grpSlider.grpSt.add('group');
   grpSliderTwo.grpSlider.grpSt.grpLeft.st1 = grpSliderTwo.grpSlider.grpSt.grpLeft.add('statictext',undefined,'-100');
   grpSliderTwo.grpSlider.grpSt.grpLeft.st1.alignment = ['left','center'];
   grpSliderTwo.grpSlider.grpSt.grpLeft.st1.preferredSize.width = 85;
   grpSliderTwo.grpSlider.grpSt.grpLeft.st2 = grpSliderTwo.grpSlider.grpSt.grpLeft.add('statictext',undefined,'|');
   grpSliderTwo.grpSlider.grpSt.grpLeft.st2.alignment = ['center','center'];
   grpSliderTwo.grpSlider.grpSt.grpLeft.st2.preferredSize.width = 55;
   grpSliderTwo.grpSlider.grpSt.grpLeft.st3 = grpSliderTwo.grpSlider.grpSt.grpLeft.add('statictext',undefined,'+100');
   grpSliderTwo.grpSlider.grpSt.grpLeft.st3.alignment = ['right','center'];
   grpSliderTwo.grpSlider.grpSt.grpLeft.st3.preferredSize.width = 30;


   dlg.etSettingOneValue.onChange = function(){
                                             var d = FindDialog(this);
                                             d.slSettingOne.value = Number(this.text);
                                             d.slSettingOne.notify();
                                          }
   dlg.slSettingOne.onChange = function(){
                                       var d = FindDialog(this);
                                       d.etSettingOneValue.text = Math.round(this.value);
                                    }
   dlg.etSettingTwoValue.onChange = function(){
                                             var d = FindDialog(this);
                                             d.slSettingTwo.value = Number(this.text);
                                             d.slSettingTwo.notify();
                                          }
   dlg.slSettingTwo.onChange = function(){
                                       var d = FindDialog(this);
                                       d.etSettingTwoValue.text = Math.round(this.value);
                                    }

   dlg.show();


function InitEditKeyboardHandler (event) {
try {
var keyIsOK = KeyIsNumeric(event) ||
                  KeyIsDelete(event) ||
                  KeyIsLRArrow(event) ||
                  KeyIsTabEnterEscape(event);
if (! keyIsOK) {
event.preventDefault();
app.beep();
}
}
catch (e) {
}
};
// key identifier functions
function KeyIsNumeric ( event ) {
return ( event.keyName.match( /[0-9]/) != null ) && ! KeyHasModifier ( event );
}
function FindDialog( inItem ) {
var w = inItem;
while ( 'dialog' != w.type ) {
   if ( undefined == w.parent ) {
      w = null;
      break;
   }
   w = w.parent;
}
return w;
};

Paul MR · Post by **Paul MR** » Sun Feb 12, 2012 10:12 am

Not pretty Mike but it seems to work....

Code: Select alldlg.slSettingTwo.onChange = function(){
dlg.etSettingOneValue.onChange();
var d = FindDialog(this);
d.etSettingTwoValue.text = Math.round(this.value);
dlg.etSettingTwoValue.active=true;
}

Mike Hale · Post by **Mike Hale** » Sun Feb 12, 2012 12:51 pm

Thanks Paul. Yes that does work in this example. But as you said it's not ideal. In the dialog I created where I noticed this issue not all sliders have an associated edittext. Even when it does I don't like the idea of changing the focus to a different control. It does update the top slider but now the bottom edittext has focus.

While working on this after my post I also noticed that it seems that only the slider control has the focus problem. It you add the following to the example you will see that if you enter a value in the top edittext clicking on any of the new bottom controls changes the focus.

Code: Select alldlg.grpOther = dlg.add('group');
   dlg.grpOther.ddOne = dlg.grpOther.add('dropdownlist',undefined,['one','two','three']);
   dlg.grpOther.add('radiobutton',undefined,'no');
   dlg.grpOther.add('radiobutton',undefined,'yes');
   dlg.grpOther.add('checkbox',undefined,'together');
   dlg.grpOther.add('button',undefined,'preview');

The good news is that you had the right idea, you just used it on the wrong control. Because Photoshop is not changing the focus( making it active ) when you change a slider you have to do it manually. i.e. in the slider control add this.active = true; at the start of the callback.

Paul MR · Post by **Paul MR** » Sun Feb 12, 2012 2:02 pm

Nice Mike, I will have to remember that one.