This is how Photoshop (i.e. the JSX) sends back data to the HTML Panel. The HTML Panel communicates with Photoshop via evalScript - this is in the
In the JSX there must be some:
In order to enable double-way communication, provide a callback in the evalScript function:
A very trivial example for a panel with one button that retrieves and displays in the panel the Photoshop active document’s name (forgive my total lack of design for this panel - it’s just to show you the bare mechanism) is as follows.
I define a button with
id="btnDocName", and an
h3 tag which will contain the Doc’s name.
Besides themeManager (boilerplate code is by the great David Deraedt) you see I evaluate (i.e. call) a
getDocName() function (which belongs to the JSX) ‘ve used an anonymous function to define a callback on the fly. The result argument is just the return value in the JSX, and it’s used to overwrite the h3 tag content in the Panel.
Contains the getDocName() function and returns the active document name as a String (the
toString() shouldn’t be mandatory):
So as a result when you click the button on the HTML Panel, it evaluates the function in the JSX, which in turn passes its return value to the callback.
The Photoshop HTML Panels Development Course
If you’re reading here, you might be interested in my Photoshop Panels development – so let me inform you that I’ve authored a full course:
- 300 pages PDF
- 3 hours of HD screencasts
- 28 custom Panels with commented code
Check it out! Please help me spread the news – I’ll be able to keep producing more exclusive content on this blog. Thank you!