Revisiting GEM For The Atari ST, Part 9

In the last few episodes, we’ve talked about how GEM’s event processing model could have been a bit better, and how it could have better facilitated more cooperation in the cooperative multitasking environment. Then we discussed how the event handling changed a bit under MultiTOS when there was preemptive multitasking.

This time, we’re going to talk about how GEM AES defined and managed GUI elements like windows, buttons, text boxes, and so forth. As we have been doing, we’ll continue to compare GEM to how Microsoft Windows does things.

And once again, to be clear, I’ve chosen Windows to compare against not because I think it’s the standard by which everything else should be judged, but rather because it first came out about the same time as GEM, and because it’s familiar to the greatest number of people.

If you aren’t reasonably familiar with programming for Microsoft Windows, and you haven’t read the previous entry in this series, you might want to do it now. In particular, make sure you’ve read the “What is a Window Class” sidebar.

GEM AES Lacks Consistency

Consistency is an important foundation of how Microsoft Windows works, going all the way back to v1.0. Every UI element is defined by a window class, and they all follow the same basic strategy for how they’re created, how they process events, and how they’re used as components of a greater whole. The really important thing, ultimately, is that everything in Windows works this way. Every UI element, from menu bars or menu items to buttons, combo boxes, or whatever else, is either an object defined by a window class, or is managed by such an object. This means everything works in a consistent manner. You don’t have to learn one set of rules for one part of the user interface and a different set of rules for something else.

By comparison, perhaps the biggest design flaw about GEM AES is how it lacks consistency in the way its UI (user interface) elements are defined, how they work, and how they’re put together to create a complete user interface for an application. GEM doesn’t have anything like windows classes or a single, unified approach to everything. There are basically three different ways to do things.

  • Windows
  • Dialog Boxes
  • Menu Bars

Well, maybe it’s really more accurate to say two and a half. There’s some overlap in the way dialog boxes and menu bars are defined, but also some very fundamental differences in how they’re used.

Overall, the GUI features of GEM break down into two categories, which we’ll call The Elements and The Windows.

The Elements

First let’s talk about the category we called The Elements.  We’re talking about User Interface (UI) elements like buttons, check boxes, list boxes, editable text fields, and so forth.  These simple UI elements are defined via a simple data structure known as an OBJECT.  That’s an unfortunate choice of name by modern standards, but it was applied a few years before object-oriented programming really started to become much of a thing outside of computer science labs.

These elements are normally used in groups, not individually.  Such a group might be used as a dialog box, or a menu bar.

We won’t get into the minute details here, but let’s go over some of the basics of the OBJECT structure.  It was fairly small, just 24-bytes, as you can see below. You can probably guess the function of most of the fields from the names.

typedef struct
   int16_t    ob_next;   /* The next object            */
   int16_t    ob_head;   /* First child                */
   int16_t    ob_tail;   /* Last child                 */
   uint16_t   ob_type;   /* Object type                */
   uint16_t   ob_flags;  /* Manipulation flags         */
   uint16_t   ob_state;  /* Object status              */
   int8_t     *ob_spec;  /* Type specific data pointer */
   int16_t    ob_x;      /* X-coordinate of the object */
   int16_t    ob_y;      /* Y-coordinate of the object */
   int16_t    ob_width;  /* Width of the object        */
   int16_t    ob_height; /* Height of the object       */

To combine multiple UI elements into a larger, more complex UI structure like a dialog box, you used an array of OBJECT structures, also known as an OBJECT tree.

The first three fields of an OBJECT were used to create a hierarchy for items within the tree, such that certain objects could contain other objects.

The ob_type field specified what sort of UI element was represented. There were about 15 or so standard types which included simple UI elements like “button” or “editable text field”. This field not only indicated what the element was supposed to look like, but also how user interaction should be managed. Other fields contained flags that would indicate differences in appearance or behavior, like if the element is selectable, or if it was the default button, and so forth. There were other fields to hold the current object state, and of course, basic details like the object’s location and size.

Some object types required extra data like text strings or a bitmap. Extra data like that was stored elsewhere and pointed to via the ob_spec field.

Note that the OBJECT structure contains no pointers to code of any kind, like a message handler.

Such an array of OBJECT structures, along with the text, bitmap, or other data that goes with it, is known as an Object Tree, and more generally as a Resource. An individual resource might be part of a larger collection of resources loaded from a Resource File by the program at startup time.

Windows Also Has Resources

In Windows, “resource” is a much broader concept than with GEM, but one similar aspect is that a Windows resource file can contain definitions of UI structures like a dialog box, made up of a list of the individual UI elements required.

In GEM, the resource contains the actual data structures for the UI elements, but in Windows, it contains just a list of the parameters required to create each element. And although Windows UI elements have code associated with them, the resource does not contain that code.

In order to distinguish one type of UI element from another, the resource uses the name of the element’s window class. If it’s not a standard type, it’s presumed the application will load the appropriate library or otherwise initialize the window class before the resource is referenced.

This means that Windows can benefit from a relatively compact and simple description of the UI elements required, yet also allow the code for managing those elements be as simple or as complex as they need to be.

GEM AES Objects Are Just Data

The OBJECT structure defines what an individual element is supposed to look like, sort of. That is, it tells GEM, “I’m a button. Draw whatever you think a button should look like“.

The OBJECT structure also defines what an individual element is supposed to do, sort of. That is, it tells GEM, “This is a button. When the user interacts with me, do whatever sort of actions you think a button should do.

Ultimately, in either case, because the OBJECT is just data, it really has no control over the final result. There has to be some code to interpret the OBJECT and make sense of it all. In GEM, this is done by the AES forms library and object library. The forms library is responsible for managing complete structures like dialog boxes, while the object library is responsible for manipulating or drawing UI elements either individually or as a group.

Under Windows, there is nothing that closely corresponds to the GEM AES forms or object libraries. The necessary code for UI elements to do their thing is specified when the window class for that each type of element is registered with Windows. So, each UI element is ultimately a reference to a block of code that knows how to create and display the element, and how to deal with any user interaction. And all of the basic “built-in” UI elements like buttons, checkboxes, etc., are defined in their own library, separate from the rest of Windows, so that even Windows ends up using them in the same way as regular applications.

Showing A Dialog Box

To do a dialog box in GEM, you call the AES form library form_do function, in effect saying , “Here’s a list of UI elements. Draw it, monitor the user’s interaction, and tell me what happens after it’s all over.

The form_do function calls the object library function objc_draw to draw the UI elements specified in the resource tree passed to it, then it monitors the user’s interaction with those elements until the user hits an item with the mouse that is marked as an exit or touchexit item. At that point, control returns to the application.

But that doesn’t mean the dialog box is finished. Now the application has a chance to find out what the user did, by accessing the OBJECT structures and checking the various bits of status information. Depending on what it finds, the application has the option of updating the object tree in some fashion.  It might disable a button, clear a checkbox, or maybe update a list of selectable items.  Then once all that’s done, it can call form_do again for another round of interaction. Eventually, it can call other functions that signify the end of the dialog box, which will release the screen, send redraw messages to whatever was underneath, etc.

It should be clear that for anything other than very simple dialogs, you end up writing a lot of custom code that is unique to that specific dialog box. And all that still assumes you’re using only standard, vanilla UI elements. If you need any customization at all, you probably need to avoid calling the AES form_do function and instead, create your own block of code that does more or less the same thing, plus whatever custom functionality you require.

With Windows, creating a dynamic, interactive dialog is a much more simple process. You simply identify which events will require special attention, and you write handlers for those specific events. For example, let’s say that clicking an item in a list box should make certain buttons elsewhere in the dialog become enabled, disabled, or selected. All you have to do is attach a piece of code to the “item selected” event, and have that code configure the buttons as needed.

This is much simpler, yes?

Dialog Boxes Aren’t Windows, They’re Object Trees

In Windows, a dialog box is just another kind of window. It uses the same exact event processing model as anything else. In most cases the only significant difference for a dialog box is that the window is marked as being modal, meaning that you have to dismiss it before things like mouse events or keyboard events will be given to other windows. And even that is optional.

In GEM, a dialog box isn’t a regular window. Or any other kind of window for that matter. It’s a completely different animal. Instead of being a window, a dialog box is essentially a list of objects arranged in a hierarchal fashion, an object tree as we discussed way back towards the start of this article.

A dialog box object tree will probably start with a G_BOX rectangle object used as an overall container.  Walking the tree from there, you’ll find text label objects, button objects, more G_BOX objects, editable text field objects, and other such UI elements.

A dialog box is typically defined by a resource tree within the program’s resource file. It could also be generated at runtime programmatically, although this would mostly be an exercise in masochism unless your program’s main function was being a resource editor.

To manage the user’s interaction with a dialog box, the AES provides the form_do function. This function uses a specialized event handler loop that knows how do things like navigate the link list of object structures in the resource tree to figure out which button was clicked on, or which editable text field, etc.

When the user performs some action that indicates the dialog box is finished, the form_do function exits. For most dialog boxes, that’s the end of the process, but more sophisticated ones might update something and jump back into form_do again.

Menu Bars

The next part of the GEM AES trifecta of different ways to do things is the menu bar.  Menu bars are object trees, like a dialog box, but they’re managed by the system fairly automatically.  Once you’ve told GEM “Here’s my menu bar! the AES will display it at the top of the screen and allow the user to interact with it.

Under MultiTOS, the menu bar shown at any given moment is that which belongs to whatever application owns the top-most window on screen.

Once the menu bar is in place, things are fairly automatic as far as your program is concerned.  You don’t have to do anything except wait for the user to select a menu item. When that happens, the AES sends your application an MN_SELECTED message which indicates which item was selected.

Your program can dynamically change certain things about the current menu, like individual items being enabled or disabled, or you can update the item text, as long as the object tree for the menu bar doesn’t change when the user could be interacting with it.

Menu Bars Aren’t Modal, Except When They Are

Normally, one thinks of interacting with a menu bar as being a non-modal operation, and in the overall broad sense that’s true. But there are parts of the process that are modal. For example, before drawing a menu, GEM AES saves the appropriate portion of the screen to an offscreen menu.  When this process is done, it restores the original screen contents.  This is done to eliminate the need to send redraw messages to whatever was underneath the menu.

But it’s also a modal operation.  That is, AES locks down the screen when the user interacts with the menu bar.  This includes blocking any application that is currently waiting for an event library call to return.  This normally has little impact, but it can affect programs which are attempting to maintain some sort of live, animated display, as this will probably freeze when the user interacts with the menu bar. At least, if they’re doing it right when they refresh the window for the animation.

Customizing Menus

Although a menu bar is a standard object tree, you can’t get away with placing any sort of OBJECT into a menu. While you’d probably not expect things like editable text fields to make much sense, certain more basic things like icons don’t really work either.  At least not as you’d expect.

When I was working on the 2nd revision to my FONTZ! font editor application, I wanted to be able to have hierarchal submenus in my menu bar.  The first problem I had was that the resource editor programs didn’t understand that idea.  But I managed to put it together.

I managed to get it to draw and interact with the mouse properly.  It didn’t happen automatically, but I did it using only standard AES & VDI functions.  I had to save the screen area underneath the submenu myself, and restore it afterwards.

But even after I got it to draw and track with the mouse, the submenu didn’t generate a message when the user selected an item.  Eventually I ended up doing it by tracking it myself and sending myself a MN_SELECTED message, instead of expecting GEM to do it.

Later revisions of GEM would have support for such submenus built-in, but as far as I know I was the first to do it using 100% legal AES functions before that.

Menus & Event Processing

In our last installment, we talked about how GEM’s event processing could sometimes, at least theoretically, mean that your program received and/or processed messages in a different order from which they occurred.

Menu item selection is a good example of how this can happen.  Suppose a program has a tool bar at the top of the window and it contains a “Quit” button.  So what happens if a user goes into the menu bar, selects the “Save” item, but when the menu goes away the mouse is right on top of the button and it gets clicked too? These might get separated, but it’s possible for both events to be returned by evnt_multi at the same time.

So now the program returns from evnt_multi with a message event for MN_SELECTED and a mouse event for the button click.  The program has no idea which event happened first, so it could SAVE then QUIT, or it could just QUIT and never process the SAVE request.

That’s probably a worse-case scenario, but it’s not hard to imagine other situations where things would be done out of order.

The Windows

The last point on the GEM GUI triangle is the basic application window.

Windows In GEM Aren’t Made Of Objects

Remember earlier when we talked about telling GEM, “Here’s a list of UI elements. Draw it, monitor the user’s interaction, and tell me what happens after it’s all over..”

Well that only applies to menu bars and dialog boxes. Windows aren’t a type of OBJECT, nor are they a resource tree of multiple OBJECTs. Windows are just… windows. They are essentially monolithic entities unto themselves.

You create and open a window by specifying a collection of flags that indicate if individual window elements like scrollbars, close buttons, etc., should be present or not.  You would think such elements would be part of the standard collection used for dialog boxes etc., but no. You also specify things like the position and size where it should go on screen.

When the window is created, you get back an integer window handle that is used thereafter to refer to that window. GEM keeps track of which window handles belong to each application.

But GEM doesn’t really manage the whole window. It tracks the user’s interactions with the outer perimeter, the frame, but not what happens in the window’s client area.

GEM AES Windows and Events

Most window-related events are pretty easy to deal with, but some require a lot of code to handle properly.  There are two reasons for this. First, GEM puts most of the burden for dealing with things like scrollbars onto the application to figure out. Second, because of the way AES handles, or rather doesn’t handle, screen coordinates within a window. You always deal with global screen coordinates.  This connects with the VDI’s lack of ability to do any sort of coordinate system translation,  as we discussed in an earlier episode. 

You get mouse events for things that happen in a window’s client area, but the information you get from the event won’t directly reference the window at all.  It’ll be up to the program to determine which window was at the mouse position by calling the wind_find function. The possibilities include the desktop as well as any open windows belonging to the application.

Once you determine that a mouse event happened inside one of your application’s windows, then you’ll probably have to translate the mouse coordinates from global screen space into something relative to the window’s client area.  This is done using the wind_get function.

Then you’ll have to factor in any offsets represented by the window’s current scroll bar positions. That last part is further complicated by the fact that scrollbar positions and sizes in GEM are always set to a range of zero to 1000, regardless of whether or not you have a 4oo pixel window showing a 410 pixel document or a 10000 pixel document.

And if your application has a “zoom factor” it can apply to what it displays, well, then you’ll have to factor that in at some point.

After all that, you’ll have a set of coordinates relative to the “document” being displayed and you can take whatever action is indicated by the mouse event.

Other than mouse events, the main thing that gets complicated is a redraw message.  When your program gets a redraw message, it will indicate the overall rectangle of the “dirty” area that needs to be redrawn.  In screen coordinates, of course, so you’ll have to jump through the same hoops we mentioned a paragraph or two ago to get an offset for your window’s client area.

And then you can’t just redraw the rectangle in the message.  Turns out, that is the overall bounding rectangle of a list of smaller “dirty” rectangles, which may or may not be contiguous.  You’ve got to use wind_get to get the first such rectangle, set the clipping and redraw it, then repeat the process until wind_get tells you that you’ve reached the end of the rectangle list.

And of course, you’ll have to be translating the coordinates back and forth between global screen space and window client space as needed.

By comparison, when a Windows UI element gets a WM_PAINT message, telling it to redraw something, the (0,0) position of the coordinate system is, by default, set to the top left corner of the element’s client area, with the scrollbar position already factored in. Plus, the graphics library’s clipping is already set to the dirty area being redrawn.  All your paint function has to do is a straightforward redraw of the window contents. If there are multiple “dirty” areas, it’s no big deal because you get a separate WM_PAINT message for each.

Mixing Objects & Windows

The AES manages the process of drawing menu bars and tracking user interaction, once you give it the address of a menu bar resource. It does it for a resource arranged as a dialog box when you call the form_do function. But if you want to use OBJECTs and resource trees in a regular window, your application is going to have to watch over them and make it work. You can’t call form_do because that would block off access to anything other than the object tree. Likewise if you want a dialog box to have additional functionality beyond what GEM AES normally provides. In either case, your program has to supply the code to capture events, traverse through a tree of OBJECT structures, figure out how to apply the events to the OBJECTs.

Mostly, you’ll be replicating what GEM AES does, just so you have the ability change one or two things somewhere. Essentially, it’s going to have to implement the functionality of the form_do function and integrate that with whatever other event processing your window may require. Once developers got sufficiently ambitious that they were trying to do this regularly, Atari released a cleaned-up version of the source to the form_do function to make life easier.

Unlike Windows or other systems, there is no way in GEM for a program to create new types of UI element and drop them into a dialog box or menu bar alongside the predefined ones, mainly because GEM wouldn’t know what to do with an unknown ob_type value. It wouldn’t know how to draw it, or how to handle events for it. If you wanted to manage those details for yourself, then you could provide your own code to do it. Along with the code required to handle all the regular pre-defined object types that might be mixed in there too. Basically your code is all or nothing when it comes to UI elements.

Next Time Around

Our next AES-related article will talk about the scrap library, aka the clipboard. See you then!

For customers who are interested in creating a blog, or who need a content management system, we usually recommend using the popular WordPress content management system.  For customers on a budget, WordPress is a great way to go because the software itself is free.

One of the greatest strengths of WordPress is the ability to use custom themes so you can customize the appearance of your website.  There are a wide variety of different themes around the web to choose from.  Some websites offer “premium” themes, but there are thousands of free themes available as well.

  • WordPress Custom Themes – We can help you select one of the many excellent free themes out there, and then customize it as needed to make it your own.  If you can’t find an existing theme that you like, we can create an entirely new custom theme for you!
  • Ultra-Customized WordPress Themes – There are a lot of great WordPress themes out there, but most of them do nothing more than change around the colors, background images, and rearrange where everything goes on screen.  They don’t offer any additional functionality.  If you need something more, then you need a theme that is customized for your specific needs.  When you need customization that goes beyond shuffling artwork, we’ve got the programming skill and experience to make your theme do whatever you need.
  • Custom WordPress Plugins – There are many plug-ins out there for WordPress that cover a lot of subjects, but if we can’t find one that does what you need, we can create it as needed!  We can even integrate customized plug-ins with your custom theme to take WordPress beyond the usual limits.

Are you lost every time you go to the store to buy a new computer? Do you need a new laptop, or a new printer, and you just don’t know which one to buy?

Let Mike Fulton Consulting help.  We’ll sit down with you and figure out which features are the most important and we’ll do the product research for you! Having the right facts before you buy makes all the difference.

We also offer custom application programming for Windows or Macintosh platforms, database programming, mobile development for Android and iOS, and much more.

If you have questions, please send EMAIL or select the Contact Mike item in the main menu. Please include details about your interest, and make sure to include complete contact information.

Big companies usually have a full-time staff of IT techs who are ready to go whenever someone around the office needs a new printer installed, or when the WiFi isn’t working, but small businesses can’t afford that luxury.

When small businesses have an IT problem, it often gets ignored because nobody knows what to do. At best, an inefficient workaround is used, hurting productivity.

Now there’s another option. Mike Fulton Consulting can be your on-demand IT staff! We can help you get new computers up and running, install printers and other peripherals, install software, and more. Give us a call!

Our main focus these days is website design and creation. If you have specific requirements, let us know and we’ll find the solution that’s best for you.  If you don’t know the specifics for your new website, talk to us and we’ll help you figure it out!

For those sites running on Microsoft-based servers, we can do custom, high-performance ASP.NET solutions.

If you’re using a Linux-based server, we can do a completely customized solution or we we can start off with a popular web content management system such as WordPressDrupal, or Joomla and customize things as needed.  Want to set up an eCommerce site and get your merchandise on the web?  We can do that too!