Boethos


Current Status Announcement/Warning:

February, 2017: Version 1.993 is up. CrossUI did a major overhaul and broke a few things. I fixed the main problems, but I haven't tested absolutely everything, so use with caution. Thanks to "songz meng" on youtube for the heads-up, and for finding that variable name bug. I'm planning on doing a new video tutorial. Soon. Ish. Version 1.993 adds the ability to use the "theme trick" to use a normal input for a "no echo" password field - by entering "password" in the input control's theme property.

October, 2016: Version 1.98 is up. CrossUI got rid of the advanced designation on Buttons, Labels and Checkboxes. I had to fix my code for buttons, but essentially this means that you can use any button widget you see (there are several types in CrossUI that will all be treated the same way in ExtendScript), and the Labels and Checkboxes are just there and work.
I'll be putting up a new tutorial soon, since the original may be a bit confusing.
One stumbling block to watch out for is that you should be using the "No Label" versions of the Input, Combo Input, and List widgets. The default "Labeled" version is a new designation in CrossUI that doesn't for the time being have support in Boethos (You may use the default and make the label size zero, but that seems to be a silly extra step).


November, 2014: Version 1.96 is up. Stopped working. Now works again. See tutorial. (!)

May, 2013: Version 1.95 is up. No widgets were showing up in the ExtendScript code because of a change to the base crossui widget property.

Version 1.94 is up. It adds the ability to use "multiline" in the theme property of CrossUI Labels (there is no "multiLines" property in CrossUI Labels). Make sure you reload the code page; your browser (please use Firefox) may be using a cached version of the page.

Current Version 1.93! Make sure you reload the code page. On April 13th, 2013, I had to adjust the code to work with the new "CrossUI" update to the linb UIBuilder, which is now called "CrossUI", not jslinb UIBuilder. Better name. Unless you think it gives the impression that it is an angry UI Builder. But seriously, it broke my code. No problem; it was a quick fix (and, to be honest, I don't even know what the problem was. Ain't programming grand?). As a consequence of this update, all references to jsLinb will be slowly changed to read "CrossUI", starting with the text in this document, below this line.

Happy '13, everyone! On January 15 2013, I updated Boethos to version 1.8. Then, on January 16, I updated it to 1.9 (to fix a pretty amateurish error). Make sure you refresh the Boethos code page and that you see the correct version! This update includes a few cosmetic improvements, but the most important improvement is that the Panel/Palette code generated now works as either UIPanels or Palettes. You can test this in After Effects by generating a UI, choosing the "palette/dockable panel" option, save that text as a .jsx file, put it in your AE "Scripts/ScriptUI Panels" folder, open AE, choose the panel from the Window menu, and see it as a dockable panel. Then choose the script from the File menu and see it load as a palette.
And Text Area inputs in CrossUI automatically work as multiline edittext, which has always been the case, but I neglected to show this in the table below and the Quick Reference graphic.
Also, it's probably necessary to point out that if you use Safari or Chrome, pasting into the CrossUI code view can only be done by right-clicking and choosing "Paste" from the popup menu. At least on a Mac. Firefox works perfectly.

On October 20, 2012, I temporarily removed the default reference widget from Boethos, because a bug appeared which prevented Boethos from working when the original code (version 1.4) was used. The newest version, 1.6 is now up, which restores the default reference widget. If you do not see version 1.6, you may need to reload the Boethos code page in your browser.

I have tested pretty extensively on Mac OSX on various browsers, and find that FireFox works best (or ... works). I have done a little testing of the built ExtendScript code on Windows (in ExtendScript Toolkit), but with early versions (why does Windows seem to only allow left-justified text??). Any feedback regarding this issue is appreciated (but I do hope to get to a Windows box with CS5 on it soon). The UI changed considerably from CS4 to CS5 on both platforms, so Boethos is somewhat usable but not recommended on CS4 or earlier. Of course you are welcome to go right ahead and use Boethos for CS4 (or even earlier *gulp*) and make adjustments to the code in your favorite code editor. At version 1.3 I added a little more error correction, mostly to catch for single quotes and badly formatted "alias" properties. Version 1.4 has better slider and scrollbar code (default value, min, max).

Q: "First of all, how the heck is that pronounced?"

Any way you want, really. Click to hear my best effort at getting an official Greek pronunciation:


Q: "What is it?"

Boethos is a big chunk of JavaScript code designed to be plugged into the CrossUI UI Builder in order to rapidly create working JavaScript user interface (ExtendScript) code for certain Adobe CS apps, especially After Effects. Go to the bottom of this page for the code.


Q: "How much does it cost to use?"

Nothing. Donations are happily, in fact, giddily accepted ...



Q: "Who made this? Who are you?"

I did. Christopher Green (http://www.crgreen.com).


Q: "What crossui widgets can I use? All of them?"

Not all of them. In fact, a relatively small subset:


Valid Widgets

ExtendScript Equivalents

Important crossui Widget Properties

"Label"

"statictext"

alias, caption, halign, theme (only "multiline")

"Button"

"button"

alias, caption

"CheckBox"

"checkbox"

alias, caption, value

"CheckBox" (theme: radio)

"radiobutton"

alias, caption, theme (only "radio"), value

"Input"

"edittext"

alias, value, theme (for "password"), multiLines (note: use the "No Label" version, which is not the default.)

"Text Area"

"edittext"

alias, value (multilines by default)

"Input:Password Input"

"edittext" (noecho=true)

alias, value (you may also use an "Input" widget and add "password" to its "theme" property.)

"ComboInput:No Label" (not the "Drop List Input")

"dropdownlist"

alias (note: use the "No Label" version, which is not the default.)

"List"

"listbox"

alias (note: use the "No Label" version, which is not the default.)

"List" (theme: treeview)

"treeview"

alias, theme (only "treeview") (note: use the "No Label" version, which is not the default.)

"ProgressBar"

"progressbar"

alias

"Slider"

"slider"

alias

"Slider:Vertical Slider"

"scrollbar"

alias

"Block"

"panel" (no title)

alias, borderType*, theme (use for ExtendScript borderStyle)*

"Group"

"panel" (titled)

alias, caption, theme (use for ExtendScript borderStyle)*

"Image"

"image"

alias, src

*You may use the crossui borderType property (which is different from the CS convention, of course, so they are translated into the closest equivalent), or (better yet) enter the CS ExtendScript borderStyle property ("black", "etched", "gray", "raised", or "sunken") in the crossui widget's theme property field. Using the theme method is better because it is easier, faster, and works for both Blocks and Groups.


Q: "The written word nauseates me. Do you have a lively, entertaining movie I can watch that will explain how this works?"

Yes! Finally! See http://www.youtube.com/watch?v=41NdMRG8NAA&feature=youtu.be


Q: "Can I do this offline?"

Boethos requires the crossui "back-end" (PHP, Java or C#) to be running; that is what builds and runs the "Single Page Application" when you click the big "Debug" (formerly "Run") button. You can always install the back-end code on your machine locally. It is available on the crossui website. I have almost no connection to the brilliant folks who created CrossUI, so I am not inclined to help with doing this kind of thing (I have yet to do it myself), but I am sure it is pretty straight forward.


Q: "What potential problems should I be aware of?"

Here is a list of caveats:

  1. Watch out for the "No Label" versions of certain widgets; this is the variation you should use.
  2. This is intended to work with, and tested on, After Effects CS 5.0 or later.
  3. Do not use the Radio Group; use Checkbox and enter "radio" in its "theme" property to render those buttons as radio buttons in ExtendScript.
  4. In the CS JavaScript API (ExtendScript), a "panel" control can be titled or untitled. In crossui, use "Group" for a titled panel, use "Block" for an untitled panel. Note that there is a UI control known as a "Group" in ExtendScript, which is essentially the same as an untitled Panel (or a Block in crossui), but Boethos does not support it. The crossui "Panel" and the ExtendScript "Panel" are not the same, and should not be confused with each other (the difference between ExtendScript and crossui Groups and Panels is confusing, so get used to using Groups and Blocks in crossui to render titled and untitled panels, respectively, in ExtendScript).
  5. The (horizontal) Slider will be rendered as a slider; the Vertical Slider will be rendered as a scrollbar.
  6. In crossui, a List (not "Multimode") will be rendered as a listbox. If you enter "treeview" in its theme property, it will be rendered as a treeview control. A "Combo Input" -- sub-category "No Label" -- will be rendered as a dropdownlist in ExtendScript.
  7. On the ExtendScript side, listbox and dropdownlist controls are given generic three-item arrays. A treeview is given several lines of code to add generic hierarchical node-and-item contents to it. So, for these three widget classes, don't bother editing their "items" property.
  8. Images are not given valid file paths, and are commented out, so you'll have to uncomment them and add a valid [.png] file path.
  9. Parenting is allowed, but only with Groups and Blocks (as parents), and only one level deep (no children of children).
  10. The visual theme options on the far upper right of the CrossUI UI builder ("default", "army", "dark blue", etc.) are only for show; changing these themes has no bearing on the final ExtendScript elements.


Q: "What did you use to make this?"

Primarily the CrossUI UI Builder (obviously) and jEdit.


(One way to do this is to get the code using the link below, then return to this page and click on the CrossUI UI Builder link above.)


Go to the code        ←←←←←←←←←←←←←←←←←←←←←←←←←←←←


How it looks. Sort of.