It was almost a year ago that I wrote about calling JavaScript from Morfik (in Morfik Tips: How to integrate JavaScript into the client code). That method is still valid and especially suitable for larger bodies of JavaScript (like libraries), but there is now an easier way of doing this.

Read the rest of this entry »

I had a few additional explanations and thoughts about Calendar that I put into writing for your pleasure:

• You can add new items by simply dragging on empty space (or Shift-dragging on events)
• You can move events by dragging (in the caption) or make them longer/shorter by dragging the bottom of the events.
• If you schedule multiple events at the same time on the same day, they will split the cell width nicely (better than Outlook, IMHO;-).
• While you are making the edits, they are sent to the server in the background for storage, without interrupting your work, in a true AJAX fashion (in demo mode after validation we throw away the changes, to make our life of keeping the demo in shape easier).
• As a future feature, I plan to combine this with my Chat demo to create a collaborative event scheduling calendar where if one party edits an event, those changes will be reflected immediately on the other parties’ screen. Will also add month view, etc.
• The architecture is so that the client side interfaces through Web Services (SOAP) with the server, so it should be simple for other applications to integrate with the Calendar (will also create a demo).
• The browser-server communication language is iCalendar, so other calendars will be able to import our events (tested manually with Google Calendar so far) and we will also be able to consume other iCalendar-compatible events.

Having almost 20 years of software development experience, of course, this does not seem such a big deed for me, still in the web space there are not that many really polished Calendars around (again, Google Calendar being a big example). Now taking into consideration the time it took me to get so far with the demo with relatively little hands-on web development experience (I was mostly envisioning/designing/managing our web projects, not coding) we can see what tools like Morfik can do with the web:

1. they can enable software engineers who avoided weakly object-oriented scripting languages thus far to create powerful solutions that can exceed their desktop equivalents in many ways and
2. they can enable small shops that were coding in MSAccess, FoxPro, Paradox, Visual Basic, etc., to become first-class, fully buzzword-compliant web developers without first learning (X)HTML, DOM, JavaScript, SOAP, XML, AJAX, Apache admin, etc. (they will eventually, IMHO, but it is not an up-front cost;-)

So in the end we can hope for more powerful and more productive web applications to come :-)

From time to time you will want to drop to JavaScript to perform various operations (like when you use a third-party JavaScript library). In those cases you may want to call a Morfik function or method. How can it be done?
Read the rest of this entry »

Once again, we are back with a new demo app done in Morfik! Now it is a weekly calendar view (similar to what you can see in Microsoft Outlook or Google Calendar) with drag-and-drop capability. You can take a look at the application here (it may take Morfik some time to post it, so check back if first you are not successful). At this time the source code is not available (read on to learn more).

This demo was created with Morfik technology within cca. one engineer-week’s time. Some notes on features and limitations:

• The edits to the events are sent to and are validated by the server, but they are not saved in this demo (to help us maintain the demo:-)
• The demo will always show the same week (start of March, 2007) again, to help us maintain the demo.
• You cannot add all-day events in this demo.
• This started out as proof of concept to see how easy it was to develop a complex control in Morfik. You can judge it for yourself: for one week’s time it is quite polished, IMHO :-).
• We have frozen the feature set of the demo so there are many functions missing, but we are continuing the development of the Calendar control itself, so please contact us, if you need a production quality full featured solution (including back-end logic).

PLEASE NOTE: this version of the calendar is NOT secured, there are gaping holes and can be mistreated quite easily, so DO NOT use it for production purposes.

As predicted, Morfik acted switftly upon my note about the (inability of the) customization of the “Loading…” message. So from 0.9.17.7 on you have a much cleaner solution. It is… Read the rest of this entry »

I got bored with the ugly ‘Loading…’ message in the upper left corner while my users are patiently (?) waiting for my app to launch, so I dug a little into the Framework source code and came up with the following.

In SystemServerDocForm, in the Browser code, in TFormServer.GenerateMainHTMLPage, replace line 595 with the following:

// !PI! Added a little style to the "Loading" message
Response.WritelnString('    <div id="__LoadingText" '+
 'style="left:40%;top:50%;position:absolute;font-weight:bold;'+
 'text-align:center;font-size:12px;font-family:verdana,serif;'+
 'background-color:#f0f0f0;padding:10px 14px 10px 14px;'+
 'border:1px dotted gray;color:red;">');

This is valid for 0.9.16.1 — if you have a different version, your mileage may vary somewhat.

This is a quickie, and I suppose will be outdated pretty soon, as Morfik will do something better about it (e.g. put a class on this DIV, and make it possible to have an external stylesheet to customize), but for the time being it is a good fix. Of course, you may want to adjust the settings to your liking. Can also add some logo, change the text itself, etc.

We are building a generic framework to do data transfers/data binding efficiently (and some other wonders;) in Morfik and we had this issue today that we wanted to get a field’s value when we knew the field’s name.

So we cooked up the following little Pascal function that will return the string equivalent of the value of filed ‘v’ of class ‘c’. This is a first cut, some tests should be done (and will be for our production lib) but it is a good start, if you happen to stumble upon the same problem.

function GetValue(c:Pointer; v:String):String; JavaScript; (*!
{
  return c[v];
}*)

Among other things this demonstrates how you can call JavaScript code from within the Pascal code without using external .js files. This is a relatively new syntax (from around the 0.9.1x.x branch AFAIS) but is way cool.

If you happen to have to drop to JavaScript, some of my advices:

• do NOT do that, unless you know what you are doing — if you are new to JavaScript, it will be an interesting experience;
• in Project / Project Options / Compiler, switch off “Obfuscate JavaScript” (and “Optimize JavaScript”, for that matter) to make your life easier when you are debugging;
• install the Microsoft Script debugger as described in Appendix ‘G’ (if I recall correctly).

Happy sailing!

Yours truly has done it again! Instead of finally getting to writing about Analog Clock I created another Morfik Labs sample application, a simple chat thingy.

You can take a look at the application here and download the source code in the Morfik Labs.

Telling the truth, I created the original chat app almost a year ago (February, 2006) and now due to interest in the Morfik forums I dusted it off and updated to the latest version of Morfik WebOS AppsBuilder (0.9.16.1). I thought originally it would be a two-three hours exercise, and man I was wrong! It took me two days to tidy up a few hundred lines of code :-) The reason was that the original version used subforms for displaying the messages, but that was tooo sloooow, so I decided to wander a little bit into the wonderland of DOM programming.

So some details (shamelessly copied form the readme.txt): the Basic Chat example application is the innermost prototypical core of a chat engine and still it can provide some insight into areas of Morfik programming. A few examples:

- using web methods
- using inline JavaScript functions with parameters
- using critical sections in server logic to accommodate concurrency
- using in-memory caching on the server (the chat session is stored in server memory)
- using visual effects for highlighting UI changes
- no security measures: a very good example for many types of web application security attacks, especially injections :-)

PLEASE NOTE: this version of the chat engine is NOT secured, there are gaping holes and can be mistreated quite easily, so DO NOT use it for production purposes. It is very basic as well, you cannot set up chat rooms, or schedule events, authenticate users, there is no smiley handling, there are no application specific extensions, etc. Please also note that at the moment there are some open issues related to resource consumption in the Morfik framework that do affect the performance of the chat app. It has not been overly optimized either so substantial performance improvements can still be achieved.

If you need a production quality, secure chat engine, please contact me ;-).

I owe you with an article on AnalogClock internals, but today we are in for a quick tip.

What I wanted to do is: create a hover effect (i.e. the entire row is highlighted when the mouse is over) for continuous forms.

First I put a Container on the continuous form and placed all the other text controls and checkboxes and others on the Container (since the Detail does not have OnMouseOver/Out events), then set up the Container for OnMouseOver and OnMouseOut. It fundamentally worked, but the hovering effect was slooow and sometimes did not even register on some of the lines (depending on how fast I moved the mouse pointer).

I though the issue was related to the way the controls contained by Container bubble these events to Container. So I simply set the OnMouseOver/Out event handlers for all controls to the same event handlers and bingo! now it works properly. The exact code sample is below:

Procedure TestForm.InfoContainerMouseOut(Event: TDOMEvent);
Begin
  SwitchBandIndex( Event );
  InfoContainer.DOMStyle.backgroundColor := 'White';
End;

Procedure TestForm.InfoContainerMouseOver(Event: TDOMEvent);
Begin
  SwitchBandIndex( Event );
  InfoContainer.DOMStyle.backgroundColor := 'LightBlue';
End;

Now there are two more items I have to explain:

• SwitchBandIndex() will do some magic for continuous forms, making sure that by using controls like InfoContainer you will access the right instance of that control (since there are as many instances, as many bands/lines in your continuous forms are);
• DOMStyle is another magic property of all controls through which you can access and manipulate the style of the underlying HTML control: here I set the backgrtound color of the InfoContainer (for the technically more inclined: it is a DIV deep inside).

That’s it. Clean and simple. Now if we could manipulate the :hover pseudo-class easily…

I have just finished a new sample Morfik application that contains a lot of interesting stuff including custom controls, browser independent vector graphics, and more. I plan to write a detailed entry about the internal workings in the coming days.

Until then the very short summary:

• it was surprisingly easy to create the custom control (the clock itself): it took a few hours without knowing anything about the new Adapter architecture in Morfik;
• there is no single standard for vector graphics on all browsers, or there is (SVG), but Internet Explorer does not support it (instead it does VML) — so I created a rendering engine that sits above these and provides a browser independent way of doing vector graphics (it should work in recent versions of IE, Firefox, Netscape, Safari, Opera, and other Gecko 1.8+ based browsers).

You can take a look at the application here and download the source code in the Morfik Labs.

To Be Continued…