Table of Contents

Introduction
Who Should Read This?
How Does It Work?
Download(s)
System and Software Requirements
Adobe Photoshop Reserved Words

Tutorials
Overview
  1. Starting a Flex Project
  2. Hello World Panel
  3. Placing the CSXS Library

  4. Shortcut Buttons Panel
    1. JavaScript
    2. Design the Panel
    3. ActionScript
    4. Photoshop Persistent
    5. CSXS Logger AIR Debugger (Optional)

  5. Setting Up Script Listener

  6. Color Picker Panel
    1. JavaScript
    2. Design the Panel
    3. Find Character ID Code to Register Events
    4. ActionScript
    5. Create Custom Icons

  7. Flickr Search Panel
    1. Design the Panel
    2. Create a Flickr Service
    3. Design a Custom Module
    4. Modify Panel's Properties
    5. Connect on Preferences

  8. Per Layer Metadata Panel
    1. View Metadata
    2. JavaScript
    3. Find Character ID Code to Register Events
    4. Designing the Panel
    5. ActionScript
    6. Using Photomerge
Other Samples
Best Practices
Frequently Asked Questions
Acronyms and Definitions
Links
Adobe® Photoshop® Panel Developer's Guide

How Does It Work?

The following diagram gives the basic concept on developing Adobe Photoshop Panels:

Diagram of How Does It Work

To develop Adobe Photoshop Panels, developers must create a SWF file from such applications as Adobe Flex Builder or Adobe Flash. Typically, developers must also create a JavaScript file from such applications as ExtendScript Toolkit which is included with Adobe Photoshop. In order to communicate between the SWF file, JavaScript file, and Adobe Photoshop, a CSXS (Creative Suite eXtensible Services) Library must be used. The CSXS Library is included with the Adobe Photoshop Panels Developer's Guide. See Placing the CSXS Library for more information.

The SWF file communicates with JavaScript file using the CSXS Interface. However, the JavaScript file communicates with SWF file using an XML (eXtensible Markup Language) string. The JavaScript file bi-directionally communicate with Adobe Photoshop through a Adobe Photoshop DOM (Document Object Model). Transitively, the SWF file communicates with Adobe Photoshop by communicating with the JavaScript file through a CSXS Interface which communicates with Adobe Photoshop through the Photoshop DOM. Likewise, Adobe Photoshop communicates with the SWF file by communicating with the JavaScript file through the Photoshop DOM which communicates with SWF file.

This may seem very confusing now but there will be step by step instructions in all of the communication paths in the Tutorials section. Please refer back to this section during those tutorials. On occasion, a JavaScript file might be deemed optional such as shown in the Modify Panel's Properties section under the Flickr Search Panel tutorial when the SWF file requests the properties of Adobe Photoshop. The tutorials will help developers gain a better understanding of how Adobe Photoshop Panels work.