Wednesday, November 4, 2009

Jump to the Rescue - an easy way to generate web pages

The Problem
Right now Irie Pascal does not provide an easy way to generate web pages, you have to use a writeln to output each line of the page. There is no way to add a web page to an Irie Pascal program without manually converting the page into a series of writeln's.

The Solution
The solution that I have come up with is a very simple language, which I'm calling Jump for the time being. Jump is so simple that I don't even know what to call it (it only has five keywords: jump, var, page, css, end). Anyway, it's simple enough that I designed it and wrote an implementation in a little over a week. I'm going to bang on the implementation a bit more before releasing it. Right now, I'm using it to redo the Irie Tools website. When that is done it should be ready for release.

In the meantime, here is a sneak preview of Jump

//Hello world Jump Program
jump
var
   //Define one variable called "message" with the value "Hello World!!!".
   //NOTE: Your program can easily change the value of the variable
   //             and thereby change the page generated.
   message
      Hello World!!!
   end message
end var
page<html><head>
<title>
   <?jump !message ?>
</title>
</head>
<body>
   <p>
    <?jump !message ?>
   </p>
</body>
</html>
end page
end jump


As you can see, most of the program is taken up by the web page. However I think in most case, you would put the page in a seperate file. So if you removed everything between the page and the end page, and put it in a file called hello.html then the program is greatly simplified as shown below.

jump
var
   //Define one variable called "message" with the value "Hello World!!!".
   //NOTE: Your program can easily change the value of the variable
   //             and thereby change the page generated.
   message
      Hello World!!!
   end message

end var
!page hello.html
end jump

14 comments:

  1. Interesting. However, you may want to take a look at the Apache Wicket Project. No overloading the developer with custom tags to learn about. You only need to understand XHTML for the markup language requirements. Maybe then you can use Irie Pascal as the backing scripting language for the XHTML markups. The Apache Wicket implementation is such that each XHTML markup component/element (e.g. a label) has a peer backing component rendered in a scripting/programming language essentially creating an in memory component model of the structural hierarchy of the XHTML elements that make up the UI for a web page.

    It's cleaner, easier to use, and allows for web page designers and developers to work seamlessly together, where the designer can build out the entire markup for a web application in standard XHTML and hand it over to the Irie Pascal programmer to implement the programming logic for the XHTML pages.

    http://wicket.apache.org/examplehelloworld.html

    Interesting stuff nonetheless.

    ReplyDelete
  2. Thank you for the pointer to Wicket, it was interesting. I took a quick look (10 mins or so) and I don't really understand it, but as far as I can tell there are at least two issues for me:

    (1) Wicket is written in Java and the web server will need to be configured to run Java programs.

    (2) It will take too long for me to understand it well enough to even attempt to modify Irie Pascal to work with it (not mention supporting customers who use it).

    Still, it's interesting, maybe it will give me some ideas.

    ReplyDelete
  3. You are right in that the implementation is in Java. However, I was really trying to push the architecture, goals, and motivation of the framewrok across since Wicket can conceptually be implemented using other programming languages.

    The main idea behind Wicket and similar web application frameworks are that they are what you call component based frameworks. The concept here is that if you have ever done any desktop programming with a 4GL programming language such Visual Basic, or even using the Java Desktop Programming APIs such as Swing, you realize that programming mainly involves composing your screen UIs with high level GUI components that have backing event handlers that respond to user interactions, such as pressing a button. This same concept, being natural and easy to understand by many programmers has been carried over into some web application frameworks such as Wicket, including others not implemented with Java. So essentially you get to do web based programming in a Visual Basic or Java Swing desktop programming style/feel.

    Wicket also makes web development clean by not having the web developer intersperse or mix scripting logic with the XHTML tags, which can become a nightmare to maintain for developers and their web designer colleagues. Wicket enforces the separation of concerns by requiring that the XHTML element components such as labels, buttons, input text boxes etc, respond to user events by delegating those events over http to their in memory component peers implemented on the serveride using Java code. So for example, the in memory peer of an XTHML button will be its equivalent Wicket Button, which will have its button handler method implemented to respond to the press of the XHTML button on a particular web page. The XHTML button and its Wicket button peer will be indetified on the server side by a user defined string called the Wicket id which will be the only pollutant available in one or more XHTML component element tags requiring an input or output handler (e.g.
    "< label wicket:id="my-label-id" > < /label >") rather than full fledged sripting logic being available inside the XHTML files.

    Here are some other links providing information on the motives of a web application framework such as Wicket including additional example code snippets which you may find useful. By the way, the Java code should not be that hard to understand :)

    http://wicket.apache.org/introduction.html
    http://wicket.apache.org/wicket13/compref

    ReplyDelete
  4. I'm impressed with the idea, the website states the vision as "enabling component-oriented, programmatic manipulation of markup". I'm even more impressed by the fact that Wicket actually exists. Jump has much more modest goals, just make it easy to generate web pages.

    The example I gave probably was not clear but Jump does seperate design from development. The only thing that goes into the web page are standard XML processing instructions of the form:

    <?jump !variable-name ?>

    or

    <?jump variable-name ?>
    Some placeholder XHTML goes here
    <?jump end variable-name ?>

    No code or logic is allowed.

    The Jump equivalent of the example you gave would be: <?jump !my-label-id ?>

    ReplyDelete
  5. Ok, thanks for the clarification. Note though that the foreign < ? jump !variable-name ? > XML tag located in an XHTML page can give the web page designers a bit of problems if they ever need to modify such pages.

    The XHTML editors they use may not take kindly to the foreign XML tags.

    On the other hand, the approach currently being taken by Jump is quite common place in many web application frameworks especially the ones that typically follow the MVC pattern.

    I guess if you ever get around to it, you could implement another version of Jump, say Jump 2 which focuses on using Irie Pascal to do component oriented web development.

    ReplyDelete
  6. This is a possible issue I am concerned about. I don't know how every HTML editor will treat these tags. I know PHP uses the same tags (with "php" instead of "jump" of course). Are you aware of any (X)HTML editors having issues with PHP?

    Jump 2? Well, you never can tell. Jump wil be completely open, so anyone can do anything they like with it. So, if not me then maybe someone else will adapt it for component oriented web development.

    ReplyDelete
  7. Well, as far I can tell, most IDEs come already equipped to understand some markup langauges off the bat such as JSP, or even XHTML, based on the fact that those XML markup langauages have predefined XML Schema docs or DTDs to describe their semantics and grammar.

    The XML Schema docs for some of these custom XML markup languages make provisions to mix language domain specific XML tags with W3C XML lanaguages such as XHTML - by extension, building a superset of W3C languages such as XHTML, HTML, etc.

    We know that Notepad, Wordpad, or some other plain text editor will fill the gap for IDEs that don't provide built in support for editing languages such as PHP or JSP based on their supplied DTDs or XML Schema docs. :)

    So basically, what I'm taking such a long time to say is that, as long as Jump has its semantics and grammar rules defined in an XML Schema doc, IDEs that can reference and intrepret its XML Schema doc via some defined URI will have no problems with Jump tags mixing with HTML tags which will by extension mean that they will be working with Jump (.jmp) files.

    Providing the XML Schema docs for a custom XML markup languages is the way of making those languages portable across IDEs.

    ReplyDelete
  8. Ok, I understand what you're saying (somewhat), and as far as I can tell in theory there won't be a problem, but I was just wondering if you had heard anything about problems in the real world.

    ReplyDelete
  9. It would be nice if you could include PHP commands within any output
    i.e.
    writeln('content-type: text/html');
    writeln;
    writeln ('');

    ReplyDelete
  10. Sorry, meant to say:

    It would be nice if you could include PHP commands within any output
    i.e.
    writeln('content-type: text/html');
    writeln;
    writeln ('Hello World');

    ReplyDelete
    Replies
    1. Sorry, 3rd time lucky :-)

      writeln('content-type: text/html');
      writeln;
      writeln ('');

      Delete
  11. Ah..... The web page was hiding the PHP part :-(

    The last line is

    writeln ('echo("Hello World");');

    but enclosed within the PHP < > brackets.

    ReplyDelete
    Replies
    1. What would be the advantage of generating PHP with Irie Pascal rather than just using PHP directly?

      Delete
  12. Since IRIE Pascal can generate HTML output I thought that it would be nice to be able to have a program which could also include pre-written PHP code to perform certain functions. This would save re-inventing the wheel.

    For example, supposing you found a neat little bit of PHP code which created a guest book. It would be really great to be able to include it directly within the "writeln" statement, rather than have to either re-write it in Pascal or run it as an external PHP script (which would then have to re-direct the user back to the IRIE Pascal .exe or .cgi file after running)

    As far as I am aware it is not technically possible (in any server language), since the PHP code needs to passed to the PHP Interpreter.

    ReplyDelete