uWeb – a Web Site Kit (pronounced ‘you Web’)

Functional Specification

Overview

uWeb is a Web Site creation Kit for smart, competent developers who want to create bleeding edge Web sites that push the boundaries. The design goals are to enable creativity rather than restrict it within a preconceived structure. And, at the same time provide pre-fabricated solutions for many well understood, already solved problems.

This introduction explores these requirements from two points of view:

What the User Sees

What the User sees is a web site.

After the User logs in, all the content areas which the User may edit are boxed, optionally, have a slightly different background color, and have some additional buttons.

Alternatively, when an editable area is ‘moused over’, a menu of edit actions pops up.

While editing, the user has a very simple interface with a Save and Cancel button.

Edits are done either in the same window or in a popped up window.

Upon saving, the new content is displayed in the original page.

Designer/Developer Point of View

The Designer/Developer gets a Web Site Kit – not a framework or a system.

The kit includes:

1. A sample implementation which can be modified
2. A collection of Objects which simplify building web sites
3. Documentation for sample implementation, modifications, and the objects
4. Installation Scripts which not only Work, but might be supported, if you ask nicely
4. Everything licensed under LGPL or some other nice free/commerical licensing scheme.

User Scenarios

User 1 – Franny Fiddles

Franny Fiddles points her web browser to the home page of her site. She notices, to her great embarrassment that she has misspelled the name of her third grade teacher in her latest “News From Franny” on the home page. She immediately clicks the “login” button descretely placed on the lower right corner of the screen. A window pops up so she can log in with her user name and password: Franny / the-greatest!.

After clicking “login”, the window displays “Hi there Franny, How are you today?” for about 4 seconds. Then the words “Time to get to Work!!!” appear. After another 3 seconds, the popup window closes and her home page redisplays.

This time, the “News from Franny” box has a thin black border and a light yellow background. A dropdown menu has appeared in the top left corner. Displayed is the single word “Edit”. Franny puts the cursor over “Edit” and Left Clicks the mouse. A popup window is displayed.

The New popup window contains a TBD WYSIWIG editor pre-populated with the text from “News From Franny”. Franny corrects her error and clicks the save button. The popup window closes and her home page redisplays with the corrected text. It still has the thin border, yellow background, and edit dropdown menu.

Franny suddenly realizes that she had spelled her third grade teacher’s name right the first time, so she puts the cursor over “Edit”. The dropdown menu displays several more choices: UnDo, ReDo, Look Back 1, Look Back 2, Look Back 3. Franny highlights UnDo and left clicks the mouse.

The home page re-displays with the original version of “News From Franny”, still colored yellow, with the thin border, and Edit dropdown menu.

Franny clicks the “Logout” button which is discretely placed in the lower right corner of the screen where the “Login” button was before. The home page redisplays exactly like it was before Franny started changing things.

User 2 – Suzie Twiddles

Suzie Twiddles’ sister just told her that she is pregnant! Suzie’s promised not to tell anyone until Floozy announces it. So Suzie runs to her PC and logs onto her web site and logs in.

When the home page re-displays she opens the Edit drop-down menu and clicks on “New News”. She doesn’t even know that this will put her current news away someplace called the “archive”. If she did, she might think that’s a nice thing, whatever that is, but that thought wouldn’t last long enough to tell.

A popup window appears with a TBD WYSIWIG editor and an empty screen.

Suzie frantically Writes the Story about how Floozy met the Entire Boston Red Sox team in an, Oh So Cute Tavern, after they won the world series and now she’s Sure that One of Them is the Father of Her Child. She’s So Sure the baby will be a World Series Ball Player that she’s going to Keep the Baby!!! Isn’t that Great. Especially now with DNA testing, she’ll be Set For Life!!!!

She clicks save and immediately starts calling her friends to tell them the big news.

Developer Scenerios

Developer 1 – Who Won’t use it

Sam Smuck – Independent Web Slinger – is building a web site for his mother for her Home Beauty Products Business. Of course he wouldn’t be doing this if he hadn’t told her how lame the company site is. But he did, and now she’s threatened to cut off his supply of acne cream, . . . sigh.

Sam would really rather be playing Death to Everything with Blood, Gore, and Real Intestines!!! – the new multi-player, Internet video game, but there really isn’t any choice. So he googles on ‘Webb sit build’n sftwr’ and at the head of the list is: uWeb – Free Web Site Building Kit for those who only want the Best. He clicks the link that says ‘Download Zip File’ and watches as it crawls onto his machine.

Sam unzips the file – he really knows computers – been using them his whole life, and he’s 13 now, for God’s sake!!!! – and looks at the file names. One of them says README, so he opens it up with Microsoft Word.

It has REAL INSTRUCTIONS – there’s no Wizard!!! there’s no GUI!!!

This is Crap!!!, so he deletes the whole thing and fires up Death!!!!

Mrs. Smuck continues to use the Company supplied web site and slowly sinks into bankruptcy because it is so boring and hard to use that all of her customers just give up and go to the beauty parlor down the street.

Developer 2 – of the Old School

Sid Smedly is a Web Site Developer of the old school – he hand codes all of his HTML, CSS, JavaScript, XML, SQL, PHP, Java, XYZ, and QRST. He despises on Frameworks and CMS Systems.

But, he’s getting a little tired of rewriting the same basic stuff over and over again. Besides, it’s not like the old days when they would pay you what you were worth, by gum! He’s looking for something to jump start his projects – but not get in the way of ‘real coding’!!!

Sid still uses WebCrawler, even though it’s changed from what it once was. He types in ‘Web Site Libraries’ and uWeb pops up on the first page. Sid likes the teaser line, so he follows the link and, after skeptically reading the short description, downloads the gzipped tar file.

Sid then cd’s to the Document root of his local apache server, untars the distribution, and points Firefox at it. The main page comes up telling him that he needs to configure a database and gives him the TBD step process to do it. Sid sets up the database as instructed and refreshes the page.

Everything works.

All the code is easy to find. Nothing mysterious in the file layout. It looks almost too good to be true, but this might actually work!

Developer 3 – a Boutique Developer

Bob and Antoine have a high end web site boutique. Bob writes the code and Antoine does the design. They’ve tried a lot of things, but all of the decent CMS or extensive framework all use templates which make all the pages look pretty much the same. This just doesn’t go well with Antoine’s vision, so Bob has been going (more than a little) nuts.

Antoine can really sell clients and his designs look great (fabulous is what a less down to earther would say), but Bob just hasn’t found a web kit with the flexibility he needs to pull them off. He ends up writing everything from scratch – over and over again – and he just can’t keep up with the work. Besides which he hasn’t had any sex in about three months and the Sue Ellen is giving him baloney sandwiches for lunch – on white bread!

In desperation, Bob decides to look at uWeb – which he read about on Sid Smedly’s blog. Bob respects Sid, even though he’s behind the times, but he writes good code.

Bob discovers that uWeb has about a 2 hour learning curve. Within a week he’s actually going home on time and is catching up with the backlog. Last Friday Sue Ellen asked him what he’d like for lunch.

Life is good.

Developer 4 – Retread

Jerry Dakota has been in IT for 20 years, but has never been ‘into’ the ‘web stuff’. He’s a fairly good programmer, but he’s getting worried. There just aren’t any jobs around doing the kind of stuff he’s been doing for so long and he needs to develop some new skills.

Jerry bought a book on PHP a couple of weeks ago and the language doesn’t look so bad, but there’s so much other stuff you have to know to just get something to work. He tried downloading a couple of the CMS systems, but he doesn’t know how to set up a web server on his Windows home system. He tried a couple of times, but it just didn’t make much sense.

Jerry asked his brother-in-law Bob if there is anything he could recommend and Bob gave him a copy of the uWeb zip file. Jerry unzips it and reads the README file. He follows the instructions for downloading and starting up the apache server and gets it running. He then does the same thing with the MSQL database server. Nothing is really complex, but it’s not something a non-programmer would be able to do easily.

Jerry then points IE to http://localhost/TBD/doc and the uWeb documentation comes up. It consists of an overview, pages for each part of the system, a description of the layout. Each language Jerry needs to learn is in it’s separate directory. The overview even has a list of recommended books to read.

Jerry sigh’s as he realizes how much he will have to learn, but then he now knows it’s possible and he has all the resources he needs right in front of him.

Required Elements

Here’s what we need to satisfy all these scenarios:

Solution 1

Objects

We need at least two classes of object: one for user management and one for data/content.

User Objects

We need to be able to add, update, delete, and query users data.

Data Store Objects

Drupal thinks everything is a ‘node’, but then they have to add all kinds of cruft when they want some more fields. This results in multiple database round trips. I don’t think that’s a good idea. We do need some standards for managing similar aspects of data objects.

The drupal ‘node’ is a good base in that it’s probably right for every data object to have:

class UWebNode { function __construct($nid = 0, $vid = 0, $title = NULL, $body = NULL) { $this->nid = $nid; $this->vid = $vid;; $this->title = $title;; $this->body = $body; } }

function __destruct() {
    if ($this->dirty) {
        // save to database
    }
}
function __get($name) {
}

Javascript Routines

We’ll use jQuery because it’s nice – which is more than I can say for most packages

Include Facility

Executive #! /bin/sh

CSS_FILE=”page_css” TITLE=”UNKNOWN”

hlp() { echo “Usage: $0 [-h | options]” echo ”” echo “Option Meaning” echo “t/-title title for web page [$TITLE]” echo “c/-css name of css file [$CSS_FILE]” }

while [ $# -gt 0 ] ; do case $1 in h|-help) hlp ; exit 0;; t|-title) TITLE=”$2” ; shift ; shift ;; c|-css) CSS_FILE=$2 ; shift ; shift ;; *) echo “Illegal Argument: $1” ; echo $HLP ; exit 1;; esac done

cat <<EOT <?xml version=”1.0” encoding=”UTF-8”?> <!DOCTYPE html PUBLIC ”-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> ${TITLE} <meta http-equiv=”description” content=”The uWeb (pronoucnced ‘you Web’) Functional Specification which describes the what uWeb is by how people interact with it.”> EOT

if [ s ${CSS_FILE:/dev/null} ] ; then cat ${CSS_FILE} fi

cat <<EOT EOT #! /bin/sh echo ” ” echo ““