Wiki Example
Remember that this is not a framework, where half of the job (or more) is already done - we'll have to do everything from ground to top.
Let's start with the database. This is the table where wiki pages will be stored:
CREATE TABLE article
(
id INTEGER PRIMARY KEY,
name TEXT,
title TEXT,
content TEXT
);
Next, lets create some templates. The first one will be called base.html - it will be our base template, used to generate all the pages:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title>A Wiki: <% echo(title); %></title>
</head>
<body>
<h1><a href="index.al">A Wiki</a></h1>
<h2><% echo(title); %></h2>
<% echo(content); %>
</body>
</html>
As you can see, there are two variables used: title and content, so we'll have to provide these parameters to the template operation every time we'll be using it.
The next template will be called list.html:
<% if (items.name.length) { %>
<ul>
<% for (i in items.name) { %>
<li><a href="show.al?name=<% echo(items.name[i]); %>"><% echo(items.title[i]); %></a></li>
<% } %>
</ul>
<% } else {%>
<p>No pages created.</p>
<% } %>
<form action="create.al" method="get">
<p>
Create new page: <input type="text" name="name" />
<input type="submit" value="Create" />
</p>
</form>
It will iterate through array items, which contains the list of all wiki pages, and make links to each page, or write that there are no pages, if the array is empty. There's also a little form that can be used to create new pages. There's no HTML headers, since this template will be merged into base.html.
The next template, show.html, will be used to show a single wiki page:
<% if (content != "") { %>
<p>
[<a href="edit.al?name=<% echo(name); %>">edit</a>]
[<a href="confirm_delete.al?name=<% echo(name); %>">delete</a>]
</p>
<div>
<% echo(content); %>
</div>
<% } else { %>
<p>[<a href="create.al?name=<% echo(name); %>">create page</a>]</p>
<% } %>
If the contents of the page is empty, it will assume that someone is trying to open a non-existing page, and suggest to create one. Otherwise, the contents, along with edit and delete options will be printed.
The next template will be called form.html. It will be used to edit and create pages:
<form method="post" action="<% echo(action); %>">
<table>
<tr>
<td>Name (used in URL):</td>
<td><input type="text" name="name" value="<% echo(hasOwnProperty('name') ? name : ''); %>" style="width: 400px;" /></td>
</tr>
<tr>
<td>Title:</td>
<td><input type="text" name="title" value="<% echo(hasOwnProperty('title') ? title : ''); %>" style="width: 400px;" /></td>
</tr>
<tr>
<td>Content:</td>
<td><textarea name="content" cols="40" rows="10" style="width: 400px; height: 50px;"><% echo(hasOwnProperty('content') ? content : ''); %></textarea></td>
</tr>
<tr>
<td colspan="2" align="right"><input type="submit" value="Save" /></td>
</tr>
</table>
<div>
<input type="hidden" name="redirect" value="<% echo(redirect); %>" />
<input type="hidden" name="old_name" value="<% echo(hasOwnProperty('name') ? name : ''); %>" />
</div>
</form>
As you can see, it checks if the variables are defined before using them, so the corresponding template arguments are optional. The only mandatory arguments are action, which contains the form handler, and redirect - where to redirect after the form has been processed.
The last template, delete.html, will be used to ask the user if he/she really wants to delete the selected page:
<form method="post" action="delete.al">
<p>Really delete page "<% echo(title); %>"?</p>
<p>
<input type="submit" value="Yes, really" />
<input type="hidden" name="name" value="<% echo(name); %>" />
<input type="hidden" name="redirect" value="<% echo(redirect); %>" />
</p>
</form>
It will print the question containing page name, so we'll have to provide corresponding argument.
And now, the interesting part - the application code:
At the top, there are several structures, that can be viewed as a function library of some sort. The blue-ish and yellow operations are labeled (see Dia element documentation for information about notations), so those can be pointed to and reused in other structures. The green one is an active pointer, which means that it will automatically point to all operations with the same label i.e. all those operations will get the :database argument passed to them.
The pink operation is marked abstract, so it's going to become one of the start point operations of every file it's included in.
In the middle there are five packages, from which corresponding output files will be generated. Each package contains a structure of operations, that performs certain actions. The resulting output files will contain the elements from the packages, and all the related elements that aren't assigned to any file (see Language Description to find out how it works).
At the bottom there are the form handlers. All of them are identical except the query that is being executed, so they are drawn as a single structure. The unique queries are given as arguments, specifying that each argument belongs to the corresponding file. This results in three output files, each of which executes one of the queries.
The two pink operations (with comments "1" and "2") are marked as the start points, so query handlers will be executing two operations: executing the query, and redirecting the browser.