10 Replies Latest reply on Dec 19, 2017 5:22 AM by Kukurykus

    Splitting jsx files?

    AverinAAA Level 1

      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.

        • 1. Re: Splitting jsx files?
          r-bin Level 5

          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? )

          • 2. Re: Splitting jsx files?
            Kukurykus Adobe Community Professional

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

            • 3. Re: Splitting jsx files?
              Davide_Barranca Adobe Community Professional

              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

              • 4. Re: Splitting jsx files?
                AverinAAA Level 1

                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

                • 5. Re: Splitting jsx files?
                  AverinAAA Level 1

                  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);

                  }

                  • 6. Re: Splitting jsx files?
                    Kukurykus Adobe Community Professional

                    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()
                    
                    • 7. Re: Splitting jsx files?
                      AverinAAA Level 1

                      _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

                      • 8. Re: Splitting jsx files?
                        Kukurykus Adobe Community Professional

                        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()
                        
                        • 9. Re: Splitting jsx files?
                          AverinAAA Level 1

                          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

                          • 10. Re: Splitting jsx files?
                            Kukurykus Adobe Community Professional
                            '_с'.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.