Understanding how to create Javascript Extensions

[rollwhistler]

Hi there,

I'm just starting with Indesign Html5 Extensions, I built an Angular2 app width several screens and buttons and well, everything displays and navigates perfercly.

Now I want it to actually do something, so as I understood, the way to ask Indesign to create a doc is easy, and I also make it work, just call evalScript with the appropiate app.document.add() or something like that, and worked for me, great.

But what If I want to get the first item of a page, get is boundaries and do some calculations? does all of that code need to be inside an evalScript? what If I want to get something from Indesign and then work with it in my apps scope? Do you know what I mean?

With previous actionScript extensions solution, you had a library, you could ask for the page and you got an object and work with it, all in the same scope. But here it seems like the approach is completely diferent and I don't quite get it... can you orientate me a bit?

Thank you!

[Harbs.]

CSInterface.evalScript() takes an optional callback which is called with the result. You can use JSON.parse() and JSON.stringify() on both ends to pass objects as strings.

It's important to note that ExtendScript executes asynchronously. Wrapping the calls in a Promise is a good way to migrate code.

I plan on publishing an example project in a couple of weeks to Github which has boilerplate code to handle a lot of the annoyances with cross-engine scripting.

[rollwhistler]

Thank you Harbs.

Do you know of a sample example I could use to further learn on my own? the adobe one I've found, leaves the scripting part terribly aside... it just shows how to create the html interface with an input text where you can write what will be passed to the evalScript function, with no description of the APIs, nor the correct way to get back the results.

I tried something simple like this:

cs.evalScript("app.activeDocument.pages.item(0)",function(p){

        console.log(p); //p is ""

}

If I try to get and return the item:

cs.evalScript("page = app.activeDocument.pages.item(0); return page;",function(p){

        console.log(p); //p is "Evalscript error"

}

What I can use inside evalScript is described in  Indesign CS6 scripting guide? is that the latest? sounds wrong, no? too old...

Thank for your guidance!

[Loic.Aigon]

I tried something simple like this:

cs.evalScript("app.activeDocument.pages.item(0)",function(p){

        console.log(p); //p is ""

}

No surprises here. You just reference an object without assigning it to a variable and most of all you don't return anything. So Script execution result is "undefined" which once returned through the CEP layer is worth an empty string.

If I try to get and return the item:

cs.evalScript("page = app.activeDocument.pages.item(0); return page;",function(p){

        console.log(p); //p is "Evalscript error"

}

You get an error because you are using a "return" instruction outside a function. But the ExtendScript to CEP process won't return the extendscript error but the result of the script evaluation as string.

Anyway returning a DOM object to the CEP won't make much sense as it's not a HTML/JS regular DOM object. So if you need info about the page, create a json object with page properties and stringify it so you can send it back to CEP. Eventually you can parse this json within your html panel.

FWIW

Loic

[rollwhistler]

ok, so you nearly explained good enough for me to understand the correct way to do it.

So if you need info about the page, create a json object with page properties and stringify it so you can send it back to CEP. Eventually you can parse this json within your html panel.

So basically my question is, how do I do that? can you provide a sample?

[Loic.Aigon]

http://www.davidebarranca.com/2014/02/html-panels-tips-5-passing-objects-from-jsx-to-html-json/

[rollwhistler]

I see, thank you, with that example I see what you meant for the return and json parsing.

As for getting the page boundaries, I'll see how to do it on the Indesign C6 scripting guide? is that the most up to date documentation about the apis I can use?

[Loic.Aigon · Accepted solution]

The DOM hasn't change much since then to the exception of added features. However I would recommend sticking to the most up to date documentation:

InDesign ExtendScript API (12.0)

HTH

Loic

http://www.ozalto.com/

[rollwhistler]

Omg, I didn't event knew that guide existed... I search for Indesign scripting guide and all I found was those old CS6 documents.

Ok, time for some study, thank you a lot for your help Loic

[rollwhistler]

Just in case some else ends up here using that object passing example, keep in mind JSON is not allways available in Extendscript context: ExtendScripts JSON object is suddenly undefined?

[Loic.Aigon]

Good luck with that.