• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Splitting jsx files?

Participant ,
Dec 15, 2017 Dec 15, 2017

Copy link to clipboard

Copied

I couldn't find a way to split jsx and use multiple files.

As a result my code is quite a big mess now.

I would like to use separate files and/or prototype classes, or even function-based classes – anything to refactor my code and make it more readable and re-usable.

I tried with various imports but nothing worked.

I need to support CC 2017, so it's CEP7.

TOPICS
Actions and scripting

Views

1.7K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Engaged , Dec 16, 2017 Dec 16, 2017

Hi,

the correct reply to your question is going to be different depending on the context of your JSX: you've specified CEP, so what follows is going to be strictly CEP specific (i.e. there are simpler ways to eval multiple JSX files in the context of pure scripting, for instance via #include directives – that will fail in Photoshop CEP – or make use of File($.fileName).path that will fail either).

You want to use in the JS something like:

var csInterface   = new CSInterface();

var extensionRoot = c

...

Votes

Translate

Translate
Adobe
People's Champ ,
Dec 15, 2017 Dec 15, 2017

Copy link to clipboard

Copied

I do something like this..

my_func_number100500(1234)

function my_func_number100500(arg)

    {  

    $.evalFile("C:\\Program Files\\Common Files\\Adobe\\Scripts\\_my_func_number100500.jsxinc");

    _my_func_number100500(arg);

    }

The body of the huge function _my_func_number100500() and the rest of the code is in the file _my_func_number100500.jsxinc

Did it help? )

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Dec 15, 2017 Dec 15, 2017

Copy link to clipboard

Copied

One week ago there was simlar question on this forum: Running multiples scripts as sequence

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Engaged ,
Dec 16, 2017 Dec 16, 2017

Copy link to clipboard

Copied

Hi,

the correct reply to your question is going to be different depending on the context of your JSX: you've specified CEP, so what follows is going to be strictly CEP specific (i.e. there are simpler ways to eval multiple JSX files in the context of pure scripting, for instance via #include directives – that will fail in Photoshop CEP – or make use of File($.fileName).path that will fail either).

You want to use in the JS something like:

var csInterface   = new CSInterface();

var extensionRoot = csInterface.getSystemPath(SystemPath.EXTENSION);

because this is the only way to tell the JSX where it belongs (i.e. to workaround #include failure).

As a complete example:

var csInterface   = new CSInterface();

var jsxRoot = csInterface.getSystemPath(SystemPath.EXTENSION) + "/jsx/";

// mind the mixed double + single quotes below!

csInterface.evalScript('evalFile("' + jsxRoot + 'anotherFile.jsx")', function(res) {

  console.log(res)

});

Then in the JSX:

function evalFile(path) {

  try {

    $.evalFile(path);

  } catch(e) { alert(e) }

}

Basically, you're passing down to the JSX layer the path of the file for evaluation. This is the simplest form: you can write a slightly more elaborate JSX function that takes the path of a folder as the parameter, and evaluates all the JSX in there.

Caveat:

There are several ways to write functions that do not work in a secondary JSX:

var secondaryFun = function(param) { ... }

function secondaryFun(param) { ... }

The only way to build a function in a secondary JSX that sticks in the ExtendScript engine is omitting the var:

secondaryFun = function(param) { ... }

Since you already are in the global scope there should be no difference. Alternatively, you may want to encapsulate everything into an object to namespace your utilities.

HTH,

Davide

Davide Barranca - PS developer and author
www.ps-scripting.com

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Dec 16, 2017 Dec 16, 2017

Copy link to clipboard

Copied

Thanks for the detailed answer, David.

I tried applying this solution from your blog some time ago, but wasn't successful

What I tried:

I had `main.jsx` with all code for the panel.

I removed that file from <ScriptPath> and instead created and added `core.jsx`, that only can do `_ext.evalFiles` from your blog entry.

Then I tried to eval my `main.jsx`, and I keep getting an error "Syntax error: Syntax error".

With no details about what is the problem – I hate this the most with JSX

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Dec 18, 2017 Dec 18, 2017

Copy link to clipboard

Copied

No idea why, but evalFile fails when I add following code:

applyFromSelection = function() {

    var idMk = ("Mk ");

    var desc716 = new ActionDescriptor();

    var idNw = ("Nw ");

    var idChnl = ("Chnl");

    desc716.putClass(idNw, idChnl);

    var idAt = ("At ");

    var ref438 = new ActionReference();

    var idChnl = ("Chnl");

    var idChnl = ("Chnl");

    var idMsk = ("Msk ");

    ref438.putEnumerated(idChnl, idChnl, idMsk);

    desc716.putReference(idAt, ref438);

    var idUsng = ("Usng");

    var idUsrM = ("UsrM");

    var idRvlS = ("RvlS");

    desc716.putEnumerated(idUsng, idUsrM, idRvlS);

    executeAction(idMk, desc716, DialogModes.NO);

}

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Dec 18, 2017 Dec 18, 2017

Copy link to clipboard

Copied

that 'c' in _c isn't recognised as regular 'c ' for some reason. It only looks so. You may do a test by copying that c then putting it in quotes and make equel to other 'c' you type from your keyboard (of course if that first 'c' wasn't get this way):

alert('с' == 'c')

gives false, but delete that first 'c' and type instead a new 'c' from your keyboard and it gives true! Besides, there are not extra space in names, for example, there should be 2 white spaces in ("Mk ") after 'Mk', but is only one.

Here's correct code you can modify:

function cTT(v) {return charIDToTypeID(v)}; function sTT(v) {return stringIDToTypeID(v)}

function someName() {

     (dsc1 = new ActionDescriptor()).putClass(sTT('new'), sTT('channel'));

     (ref1 = new ActionReference()).putEnumerated(sTT('channel'), sTT('channel'), sTT('mask'))

     dsc1.putReference(sTT('at'), ref1)

     dsc1.putEnumerated(sTT('using'), sTT('userMaskEnabled'), sTT('revealSelection'))

     executeAction(sTT('make'), dsc1, DialogModes.NO);

}

someName()

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Dec 18, 2017 Dec 18, 2017

Copy link to clipboard

Copied

_c is my custom alias for

_c = function(c) {

    return charIDToTypeID(c);

}

so it's not a problem, works fine in a dozen other functions

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Dec 18, 2017 Dec 18, 2017

Copy link to clipboard

Copied

After replacing those fake c's and adding lacking spaces where you have 2 letters with 1 space names, all works good (remember you have to make selection with transparency on a layer before you use this code):

function _c(v) {return charIDToTypeID(v)}

applyFromSelection = function() {

    var idMk = _c("Mk  ");

    var desc716 = new ActionDescriptor();

    var idNw = _c("Nw  ");

    var idChnl = _c("Chnl");

    desc716.putClass(idNw, idChnl);

    var idAt = _c("At  ");

    var ref438 = new ActionReference();

    var idChnl = _c("Chnl");

    var idChnl = _c("Chnl");

    var idMsk = _c("Msk ");

    ref438.putEnumerated(idChnl, idChnl, idMsk);

    desc716.putReference(idAt, ref438);

    var idUsng = _c("Usng");

    var idUsrM = _c("UsrM");

    var idRvlS = _c("RvlS");

    desc716.putEnumerated(idUsng, idUsrM, idRvlS);

    executeAction(idMk, desc716, DialogModes.NO);

}

applyFromSelection()

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Dec 19, 2017 Dec 19, 2017

Copy link to clipboard

Copied

Indeed, looks like once of the `_c` for whatever reason was not the correct symbol. No idea how this method worked before, I just copied it from my main file.

Anyways, thanks for the help, seems to work now

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Dec 19, 2017 Dec 19, 2017

Copy link to clipboard

Copied

LATEST

'_с'.charCodeAt(1)    //    1089

'_c'.charCodeAt(1)    //    99

I wonder is there at least one pixel (ponint?) difference between them. Unfortunately graphically when I copmbared them in Photoshop pasting to text layer and looking at them with the biggest focus, they looked completetly the same!

Histogram for both was the same too. When then I copied both from Photoshop to ExtendScript Toolkit and checked their char code, it still was saying 1089 and 99. So there must be some information in the character source code, that is displayed as letters we see but as code itself is dfferent.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines