Search code examples
javascriptadobe-illustratorextendscriptadobe-scriptui

set focus of edit text in extendscript


I have a javascript that goes through the layers list in Adobe Illustrator and changes the name based on the input by the user.

There are 2 'edittext' text boxes for input, the first is the name you want to search, and the second is the one you want to replace it with. The script works, however I would like to have the first text box focused when the script is launched, so the user starts on the first text box and can tab to the second.

Also I would like to have my submit button run when the 'enter' button is pressed, to make it quicker.

I am using Adobe ExtendScript TK with Adobe Illustrator CS6.

#target illustrator
#targetengine main

// JavaScript Document
function renameText(searchText, replaceText) {
     if (app.documents.length == 0) return;
     var docRef = app.activeDocument;
     recurseLayers(searchText, replaceText, docRef.layers);
}


function recurseLayers(searchText, replaceText, objArray) {
     try {
         $.writeln("Layer length: " + objArray.length);
         for (var i = 0; i < objArray.length; i++) {
             if (objArray[i].visible == true && objArray[i].locked == false) {

                 //var searchtext = "/\s*" + searchText + "\s*\d*/";
                 objArray[i].name = objArray[i].name.replace(searchText, replaceText);

                  if (objArray[i].layers.length > 0) {
                      recurseLayers(searchText, replaceText, objArray[i].layers);
                  }
            }
          }
      } catch (e) {
          logger(e);
     }
}


startGUI();

function startGUI() {

        var win = new Window("dialog", "Replace Layer name", undefined);

        win.orientation = "column";
        win.alignChildren = ["fill", "fill"];

        // Search
        var searchGrp = win.add("panel", undefined, "Search and Replace");
        searchGrp.orientation = "column";
        searchGrp.alignChildren = ["fill", "fill"];

        var titleMsgS = searchGrp.add("statictext", undefined, "Layer name to search:");
        var searchText = searchGrp.add("edittext { characters: 1, justify: 'center', active: true }");
        searchTest.setFocus();

        searchText.helpTip = "Input layer name to replace";

        var titleMsgR = searchGrp.add("statictext", undefined, "Layer name to replace with:");
        var replaceText = searchGrp.add("edittext { characters: 1, justify: 'center', active: true }");
        replaceText.helpTip = "Input layer name to replace with";

        // Replace button
        var replaceBtn = searchGrp.add("button", undefined, "Replace");
        replaceBtn.helpTip = "Replace layer name";
        replaceBtn.onClick = function() {
                renameText(searchText.text, replaceText.text);
                app.redraw();
        }

        // Close button
        var quitBtn = win.add("button", undefined, "Close");
        quitBtn.helpTip = "Press Esc to Close";

        // Event listener for the quit button
        quitBtn.onClick = function() {   
            win.close();   
        }  

        // Centering & Show Window
        win.center();
        win.show(); 
}


    // Prints stack trace
    function logger(e) {
        var errorMsg = "";

        errorMsg = errorMsg.concat("An error has occured:\n", e.line, "\n", e.message, "\n", e.stack);
        $.writeln(errorMsg);
    }

Solution

  • This should get you going. The edit text has a property active. If set to true it has focus. And the key is done via a Eventlistener.

    But:

    – Not strictly speaking a ScriptUI problem: in After Effects and in Illustrator, eventlisteners can no longer be used: .addEventListener() doesn't work.
    from ScriptUI for dummies || kahrel.plus.com/indesign/scriptui.html

    var win = new Window ("dialog");
    var etext1 = win.add ("edittext", undefined, "foo");
    var etext2 = win.add ("edittext", undefined, "bah");
    win.add ("button", undefined, "OK");
    win.add ("button", undefined, "Cancel");
    etext1.active = true;
    win.addEventListener ("keydown", function (kd) {pressed (kd)});
    function pressed (k) {
    if(k.keyName === "Enter"){
        $.writeln("You pressed " + k.keyName);
      }
    }
    win.show ( );
    

    Tested in ESTK 4.0.0.1 on macOS 10.11.6