Overwriting Laszlo Foundation Class Methods

I often find myself needing to overwrite a method in one of the Laszlo Foundation Classes. For example, there might be a problem setting a background color on a text field, and I want to override the setter method for the text class’s text bgcolor in order to debug it.

In OpenLaszlo 4.0 and below, the syntax for overwriting a method at run-time was:

<canvas>
    <script>
        LzText.prototype.setBGColor = function (bgc) { ... }
    </script>
    ...
</canvas>

With OpenLaszlo 4.0.12 and above, that has changed to:


LzText.prototype.addProperty("setBGColor", function (bgc) { ... }); // 4.0.12


lz.text.prototype.addProperty("setBGColor", function (bgc) { ... }); // 4.1 and up

LZX does provide a class construct, and you can certainly subclass the text class and override the setText method that way, but that won’t let you overwrite the setText method for all existing instances of LzText/lz.text. Luckily, JavaScript allows you to define methods on-the-fly, as shown above. This applies to SWF7, SWF8 and DHTML runtimes. Unfortunately in SWF9, it’s not possible overwrite a method on-the-fly.

There are some gotchas here:

  • The debugger is not accessible within LFC methods. If you try to Debug.write, from within one, the application will fail and become unresponsive. The best thing to do is to write your own text field that replaces the debugger, and write to that. Make sure to test for the existence of that text field first.
  • Any errors in your added LFC methods will break the application or the class. You won’t always get useful feedback in the debugger.
  • You can’t use the super reference to refer to the superclass (since you’re not using LZX’s class construct). You will need to copy-and-paste the original source for that method from the LFC. How do you get the original source for an LFC? Easy. Look it up on the OpenLaszlo Subversion repository. You’ll want the right one for the version of OpenLaszlo you’re developing on. e.g. To see the source for the setBGColor method of lz.text in OpenLaszlo 4.1.1, you would need to look at LaszloView.lzs, since lz.text inherits from that.

This technique will work on your own LZX classes too, and packaged LZX components (e.g. window, button, etc.). It’s just not essential for those, since you can manipulate the LZX code directly.

Note that this is not how you should define/overwrite methods in your applications generally; it’s a debugging technique not a best-practice.

To see the whole thing in context, here’s an example test case that works on a recent OpenLaszlo 4.2.x nightly build.

The Most Useful Firefox Add-on Ever?

There’s a bunch of different tools, add-ons and plugins that I find handy for web and RIA development. However, in terms of sheer usefulness, I would have to say that one stands out above all others: The Firefox Clear Cache Button Add-on:

Clear Cache Button

The Clear Cache Button does exactly as the name suggests, and it does nothing else. It doesn’t clear your cookies, history or any private data at all. It just clears the browser cache. And because it’s a toolbar button, it’s right there. You don’t need to click through a barrage of menus, dialogs and radio buttons.

Browsers are quirky in the way they cache certain types of content. Sometimes images, JavaScript files, CSS files or even SWFs may get pulled from browser cache, without the browser even re-requesting them to see if there is an upated version (which of course, has  just been updated).  Now browsers do provide a fairly standard way to clear cache (via menus), but over the years the default options have come to include clearing your history and cookies – things that improve productivity, and you don’t really want to lose. You can selectively disable things you don’t wish to clear, but it’s time-consuming.

I swear I can see the little broom icon on the button in my toolbar fading, as a result of its frequent use.

Debugging SOLO Applications

The OpenLaszlo debugger is a very versatile tool. You can use it for everything from tracing output, to analyzing the state of objects within your application at runtime, to tracking-down memory leaks. The debugger requires the OpenLaszlo server to be present, but works with SOLO applications – provided the SOLO application can access server. Naturally, while developing a SOLO OpenLaszlo application, you want to have the full capabilities of the debugger available to you.

To achieve this your development workflow should involve:

  1. Make sure the debugger is enabled in the canvas (debug=”true”).
  2. Change your LZX source file(s).
  3. Recompile by accessing the application in your browser (i.e. http://localhost:8080/lps-version/…/my-app.lzx).
  4. Use the debugger.

The above will work fine for both SOLO and proxied OpenLaszlo applications, since you’re accessing the LZX directly. What happens when you want to have a custom HTML wrapper page? You may have to access your OpenLaszlo application via a wrapper page if, say, you pass parameters from the wrapper page to your own application. In a SOLO application, your SWF will probably be embedded in a custom wrapper page like the following. (This is the new 4.1 embed code, the embed code for 4.0.12 looks a little different):

lz.embed.swf({url: 'main.lzx.lzr=swf8.swf?myparam=123', bgcolor: '#ffffff', width: '800', height: '600', id: 'lzapp', accessible: 'false'});

As an example, I’ve added a myparam paramaNote the direct reference to the compiled SWF file. If you run the above application with the debugger open, it will throw the following error:

Debugger cannot contact LPS server, switching to SOLO mode.

At this point, the debugger can trace output from Debug.write() statements in your code, but it won’t be able to execute arbitrary code you type into it, or many of its other useful features. To fix this, when developing SOLO applications within a custom wraper page, you should embed the application as follows:

lz.embed.swf({url: 'main.lzx?lzt=swf&lzr=swf8&myparam=123', bgcolor: '#ffffff', width: '800', height: '600', id: 'lzapp', accessible: 'false'});

Since you specify that the application is SOLO in your LZX code, the returned SWF will be a SOLO OpenLaszlo application, but it will have access to the server too. I wouldn’t recommend using the command-line compiler for development.