Skip to main content
Stefan Riedmann
Stefan Riedmann
Inspiring
March 3, 2018
Answered

Access 'app' from Angular extension

  • March 3, 2018
  • 1 reply
  • 1252 views

I'm at the point where I don't see the forest for all the trees...

I'm working on an extension with Angular that is supposed to interact/modify the current Illustrator document. But I can't access the global 'app' variable.

Example: I try to get the name of the current document.

new CSInterface().evalScript("alert(app.activeDocument.name")

...I get the name in an alert, but how can I get the name string directly in my Angular service (in this case)???

This topic has been closed for replies.
Correct answer Trevor:

Sorry, I don't understand. I've got the syntax

app.activeDocument.name

from the Javascript scripting reference...


stefied I'm not sure what your understanding of extension creation is but these are the real basics.

There are 2 scripting engines 1) the extensions (Google V8 JS based) and 2) The apps i.e. Ai, ID, Ps etc JSX engine.

To get a result send from the apps jsx to the extensions js engine you can use evalScript.

Writing in sudo code!!

appName = evalScript('app.name')

Is not going to work.

There are 2 ways of retrieving the data.

1) Using a callback

evalScript('app.name', function(name){$('myTitle').text(name)})

2) Dispatching a message for the jsx to js engine

myFunction = function(data){alert(data)}
addEventListener("myUniqueEventAppName", myFunction)
evalScript(`
eventObj = new CSXSEvent();
eventObj.type = "myUniqueEventAppName";
eventObj.data = app.name;
eventObj.dispatch();
`);

Maybe that will help

1 reply

Loic.Aigon
Loic.Aigon
Legend
March 5, 2018

In illustrator.jsx:

/*
 * Add Extendscript functions to this file and call them from your Javascript.
 */
$._ext_ILST={
    getDocumentName : function() {
        return app.documents.length ? app.document.name : "No documents open";
    },
};

In main.js :

new CSInterface().evalScript("$._ext_ILST.getDocumentName()", function(result){
     //Use result for your angular service…
})

Voilà…

Stefan Riedmann
Stefan RiedmannAuthor
Inspiring
March 5, 2018

Thank you! Now I understand. But... the function in jsx is not available. I get the error

VM3425 illustrator.jsx:3 Uncaught ReferenceError: $ is not defined

I incuded the jsx file to index.html and I do an

import '../../assets/illustrator.jsx';

in my angular service. The file also appears in the source tree of the Chrome debugger.

I hope it's not a problem that I use webpack for the extension...

Stefan Riedmann
Stefan RiedmannAuthor
Inspiring
March 5, 2018

Sorry, of course I had to include the jsx file to the manifest.

Now it finds my defined function, but to the line:

function getDocumentName() {

   return app.activeDocument ? app.activeDocument.name : undefined;

}

...it just says

Error 1302: No such element Line: 7 ->      return app.activeDocument ? app.activeDocument.name : undefined;

Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices