Why Call it Mungenetengine?


The Story Behind the Name

munging is a term describing processing things. Converting stuff. Or as the Munge Brothers said, turning data into information. Hey, and we said this wayyy before Uncle Bill started talking about Information at your Fingertips (now where has that gone?)

So, after the breakup of the Munge Brothers, I named my web site in honour of that time in my working career. There are a scant few times in your work-life where you mix and connect with a bunch of collegues and do some really cool stuff.

Anyway, the mungenetengine is just the latest incarnation of using the munge term and applying to something completely different. To make the URL shorter, I have renamed the mungenetengine into mne.

For further information on the Munge Brothers, please do not consult your local library:
Who are the Munge Brothers?

Why Did I Write My Own Content Management System?


Why Write Your Own?

A Content Management System, in my definition anyway, is a piece of software that takes all the content: text, images, links etc and manages them. It also understands the relationship between items. It also has enough intelligence to be able to present the content to the end user.

Previously on mungenet I have used Userland Frontier – and specifically a piece of code I wrote myself for Fairfax@Atlanta. The main lesson I learnt from writing this was that “structure defines navigation” and that “structure should be described in the database”. Therefore, its easy to add to the structure of the site – and the navigation will follow. The central premise of this is that the relationship between items is key to the rendering of the navigational pieces on the site.

After moving away from my home grown Fairfax@Atlanta system, I transitioned to a combination of GoLive for the bulk of the content and a variety of systems for the “blogging” first page.

Initially, I used Blogger for easily adding notes on a daily basis. Followed by Radio Userland – a free piece of software based on Frontier. For about 2 months in late 2001 I used a combination of PHP and MySQL as my first foray into PHP coding.

The mungenetengine as you see it today is a full PHP and MySQL based content management system that also contains and serves binary elements (PDF, images, SWF) as well as the HTML snippets. It renders the navigation from the relationship hierachy in the system from templates, as well as permitting arbitary pieces of code to run server side.

The most recent additions to the server-side code is the ability to switch content snippets and templates based on the client’s browser environment. There are alternate templates for Netscape 4.7 and earlier.

Once the data is stored in a database, it becomes extremly easy to bolt on features that permit easier creation and editing of content. In May 2002, a SOAP interface was added for a VB client application. In July 2002 a RSS XML feed was added.

There are many, many other systems that manage content for web sites. Each has their own strengths and weaknesses. As I consider cutting code a hobby rather than a profession, its really cool to have something you have written working in production on a daily basis.

Warping Text using Illustrator 10’s Warping Tools

NOTE: Technique for the latest version of Illustrator CS3 

Adobe Illustrator 10 has a collection of new Warping tools. These tools do not directly work with text. At first, this looks like a serious ommission. But hark! There is a little technique that will serve us well.

Firstly, let’s assume you have created some text in your Illustrator document.

[1000] 01 initial text

Create a rectangle that bounds the text exactly. This rectangle will not be visible: its used for the Envelope tool…

[1001] 02 rectangle

Select both the new rectangle and the text frame underneath. Go to Object>Envelope Distort>Make with Top Object.

This will take the underlying text and ‘distort’ it into the shape of a rectangle. The text probably hasn’t changed that much. But the beauty of Illustrator 10 is that we can now Warp the envelope shape.

[1002] 03 warp

Voila! we can now warp text!

To edit the text, you can select this object and go to Object>Envelope Distort>Edit Contents. Here you can edit the text rather than the envelope shape itself.

In this simple example, we are changing the shape of the envelope that the text is being stretched into.

Now, this alone is interesting and worthwhile. But there is another “thing” we can do…

By simply adding a Warp Envelope to our text object by going to Object>Envelope Distort>Make with Warp

[1003] 04 envelope with warp

We can change the shape the text is ‘enveloped’ into. These warp styles closely reflect the style in Photoshop 6.0. However, what is different is that there is an underlying shape that we can manipulate the effect the shape the text is warped into.

[1004] 05 warp envelope warp

Apart from using the ‘white arrow’ (direct select tool) to change the envelope, or we can use the Warping tools to change the shape.

Sweet.

InDesign 2.0: Hidden Baseline Grids


Exposing a Hidden Feature of InDesign 2.0

Does this describe you: Type is your thing. Ensuring that the baselines are consistent is causing a relationship breakdown between you and your partner, dog or manager. You wake up in a cold sweat thinking about bad hyphenation decisions you made during the day.

If so, its time to look at this little hidden feature of InDesign 2.0. It’s not as frivilous as zooming, zapping aliens – but it may change your life. At least a little.

Here’s the problem: you have two flows of text on a page; one master column contains the body copy; and there is also a second column that contains a pull quote, or margin notes that refer to the main body text.

To typeset the text to ensure readability, the appropriate process is to align the baseline of the first lines of each paragraph, with the main body paragraph flowing on the document-wide baseline; and the margin note starting on the same baseline, but the leading flowing appropriate to its smaller type size.

Setting this type manually is a chore. You have to exactly align the baselines of the two text frames. If the text reflows, or the margin quote needs to move – there is many minutes (to hours) of rework to realign your text.

InDesign 2.0 has what Tim Cole (Adobe’s InDesign Evangelist) calls a double-secret feature. Its a little hidden, but worth the effort to uncover to solve this problem and hopefully save the relationship with your pet.

Firstly, we need to ensure that the document has a baseline grid set. To do this, go to Edit>Preferences>Grids. The grouped area “Baseline Grid” contains the settings. Start is the starting position from the top of the document, Increment Every is the baseline setting.

[993] 01 preference

Set the baseline to the appropriate baseline grid for your document.

[994] 02 starting paragraph

[995] 03 align master paragraph

And assign to a paragraph by using the Type>Paragraph palette. The “Align to Baseline Grid” button is in palette as shown.

I have also turned on View>Show Baseline Grid to see where the baselines are… it helps visualise what is going on in our document.

The second paragraph in this instance lies to the right of the body paragraph. Its Character settings are completely different: different point size, leading.

[996] 04 second aligned

If you have not created a custom keyboard shortcut set, Click on the “New Set” button.

Now it is time to sneak up on the double secret feature. It is hidden in the Edit>Keyboard Shortcuts, specifically in the Text and Tables section. Scroll down until you see “Only Align First line to Grid” You will see that there is no keyboard shortcut assigned to this option.

We also need to assign a keyboard shortcut to this option. Click in the New Shortcut area, and type a new Shortcut. Press the keys for your new keyboard shortcut. If the key sequence is currently being used for another command, InDesign displays that command under Current Shortcuts.

The context here is important. The context ensures that the shortcut performs the way you intended. For example, you can assign Ctrl+G to group two cells together (Table context) and Ctrl+G to insert special characters (Text context).

[997] 03a keyboard settings

To enable this feature, assign it to a keyboard shortcut.

Now, back in our original document, we have a right hand “hanging” paragraph. The first step is to set it to the document’s baseline grid. Of course, all of the lines are now aligned to the document’s baseline. We’re one step on the way.

[996] 04 second aligned

Now we use the keyboard shortcut. In my keyboard set, they were assigned using the “Default” context. This means I have to select the text frame using the black arrow (Selection Tool) and type the new shortcut. Voila!

[998] 05 new feature turned on

Please note as I move the right hand paragraph down the page, the baseline for the first line stays aligned to the baseline grid whilst the following lines follow the leading for the paragraph.

[999] 06 moved paragraphs

Note that the you doesn’t have to use the keyboard shortcut on each paragraph. Though there is no UI in the palettes for this feature, it can be saved/captured as part of a paragraph style…the create and redefine functions both ‘see’ this attribute on a paragraph level.

[1006] 07 saved in para styles

The Edit>Keyboard Shortcuts is worth serious investigation. Next time you wake in a cold sweat, just jump onto your InDesign and have a look. Hopefully it will not send you back to sleep…

Thanks to: Tim Cole, Sandee Cohen.

Video to the Web

A copy of David Trescot’s presentation (Introduction to Digital Video) and my presentation (Video to the Web) are now here.

There are a couple of links that may be of interest:

More indepth technical information on DV; more generic information specifically here.

Current supported cards in Premiere 6.0 are listed at Premiere 6.0 Certified Cards

The Nicky Guides offer a different perspective on the world of digital video


Adobe is posting more Premiere 6.0 Technical Guides in the support section of our web site – including finding an appropriate codec and video codec compression methods, and factors that afffect video compression

Another site I recommend visiting is the Terran site explaining Codecs, Architectures: CodecsCentral

All things Microsoft Windows Media Player is here: WindowsMedia

Apple’s web site for QuickTime is comprehensive, but a little too focused on the software developer rather than the web author: Quicktime

(The JavaScript control of the QuickTime plug in is detailed there).

Real Networks has a very complete site detailing how to author for their platform. Real Networks

Avril Around the World

[930] Avril in Hollywood

April 1996

Avril with the lights and glimmer of LA in the distance


[931] Avril in Cupertino, Jan 1997

January 1997

Avril standing in front of “Moof” at the Apple HQ — Cupertino, California.


[932] Avril in Venice

May 1997

Avril on a water taxi in Venice.

[933] Avril and Nick in Florence

Avril and Nick dine at a monastery in Florence.

Photoshop Image Farming


Problem.

In the present version of Adobe GoLive 5.0, there is a nifty feature called Rollover buttons. This uses GoLive actions to automatically create Javascript rollover buttons as part of your page design. The rollover contains images for different states; and the Javascript switches the image inside the web browser. In the present version of Adobe GoLive, 5.0, the images must be GIF or JPEG images. There is a new GoLive 5.0 feature of SmartObjects, where you can directly place Adobe Photoshop “.psd” files onto your pages.

Unfortunately in GoLive 5.0 there is no mechanism of using Photoshop images as part of Rollovers.

But there is a workaround that has other side benefits.

I call it “Farming” your .PSD files into one placeholder HTML page in your GoLive 5.0 site. You still obtain the benefit of SmartObjects: automatic updating and dynamic scaling, changing optimisation settings and output file management.

Solution.

Workaround is to create a “Photoshop Farm File.” This is simply a .html file in your web site.

1. Create a new HTML file in your web site, and set the Publish to “Never”

When this file is set to “Publish: Never” it ensures the HTML file is never sent to the web server, as there is no need to place it on the server. Click on the icon of the file in the site window, and in the Inspector you can set the status.

[803] images/never_publish.jpg

2. Open the new farm HTML file and drag and drop/place your Photoshop files into this document.

[804] images/saveforweb_optimise.jpg

Set the appropriate settings, dimensions, compression using the Save for Web dialog box

[805] images/saveforweb_filesave.jpg

Save resulting file to directory in your site.

Now that the Photoshop files are SmartObjects, you get the benefits of resizing, editing the original Photoshop file.

[806] images/farm_file.jpg

3. In your HTML page that is going to contain the real rollover, create your smart rollovers as normal, but pointing to the JPEG/GIF output from the ranch file above.

[807] images/smart_rollover.jpg

[808] images/final_rollover.jpg


There are some potential downsides to using Farm files:

You need to open the ranch file to update if the psd updates (this also is potentially a time saver when designing)

GoLive 5.0 cannot have more than 2 output files from the same source file (GoLive only updates the first smartobject of the file occurance) — send in request to golivewishlist@adobe.com!

Extensions

With a little more courage and time, you could write an extendscript to “corral” all SmartObjects into “farms” to one-stop editing

This will also work with Adobe Illustrator 9 files, too!

This module is © 2000 Adobe Systems, Inc and cannot be reproduced without the written consent of the author.

Crowded House Pictures

[934] Nick Seymour

[935] Neil on Mic

These photos were taken by my friend in Adelaide circa 1987.

[936] Neil Finn, Eddie Rayner in background

I saw a photo frame for sale in Adelaide with this photo inside. Needless to say, I purchased the frame, and never took the photo out! I think this was the 1988 Apollo Stadium gig in Adelaide.

Fairfax: Apple Technologies Used

[955] Fairfax at Atlanta, small

The backend was supplied and sponsored by IBM (they can’t promote this due to IOC contracts – and since their systems in Atlanta melted down, its a good thing for us!) It was an AIX 4.1 box running the Netscape Commerce server. The link to TelstraNet was 2Mbits – also provided by an IBM R&D; arm in Melbourne. The server only reached 20% utilisation which I found impressive as the hit count was extremely high (10K hits/hour) The fast server, sending out HTML (not heavy CGI munging) and a fast pipe resulted in a better site than the competition!

We were getting news (such as winning medals) posted to the site within a minute of the result occuring. In one case, where the Australian Women’s Hockey Team – the Hockeyroos – won a gold medal, we posted a story and picture within 10 seconds! Whilst not as “instant” as TV, people at work could keep up to date without losing their job! The site also had large amounts of background material that TV does not have the ‘time’ to usually show. Its interesting that newspapers are restricted to the size of the paper, TV restricted to time and the web is restricted to bandwidth.

We published an average of 20 pictures and 100 stories per day on this site – many of these stories are replaced and/or reprocessed; all within a 6 hour period. All stories and pictures were stored in a FileMaker Pro 3.0 database.

It was Frontier 4.0.1, however, that did all the hard HTML ‘munging’ work. It takes the data out of the FileMaker Pro 3.0 database and does some smart find-and-replacing from templates to generate the final HTML. Using Fetch, the results were sent to the Netscape-server via FTP. Frontier uses the AppleScript technology built into System 7.0 to get these other application to “do the job”. At last count, the ‘HTML-processing engine’ was Frontier is about 1000 lines of UserTalk; the database consists of 7 related tables.

The database system was built for flexibility. For instance, once it became clear that the IBM results service was, err, not as responsive as it could have been, we created our own “Australian Results” page. This was unplanned, but the database had the flexibility to build new parts of the overall web-structure within 10 minutes. I outlined the details of this Munge-machine at the ATS in Brisbane in August.

Brainwaave built all the HTML templates and did the design work. CGIs and Java were also supplied by Brainwaave. All I had to do was take the content from the database and process it into the correct templates. There are a couple of techniques I use; all rely on some nifty Frontier code to make work.

I have also scripted the picture-import and text-import process. Pictures are automatically uniquely named, sized (for WIDTH= & HEIGHT= commands) and thumbnails generated – again, from Frontier scripts.

As to the content; it come from Fairfax (Age and Sydney Morning Herald) journalists & photographers in Atlanta. The Photos were scanned and sent from 9500’s in Atlanta via ISDN to a set of Macintoshes in Sydney. These Macintoshes ran AppleScript scripts written by Fairfax to send them to Sun servers which run a series of picture databases. We pulled the pictures out of the database and processed them using Adobe Photoshop into an Internet-ready form (JPEG format) Some of the pictures were from Reuters and much of the ‘breaking news text’ is from Australia Associated Press wires. These pictures/stories are replaced with Fairfax content where possible.

Picture previews were stored in the FileMaker database so that when pictures were assigned to stories, we actually saw the picture. Saved on mistakes!

Text came out of Fairfax’s Tandem-mainframe running the SII INL newspaper publication system. A PC took a serial feed from the SII and ftp’d the text files to a Macintosh 8100/80 running Peter Lewis’s NetPresenz. Frontier read these files, stripped unwanted characters/formatting, and added them to the FileMaker database.

The Filemaker database stores the text and pictures in a way that allowed us to ‘assign’ them to locations within the web site. Frontier took the database and ‘mixed in’ the templates and generated the final HTML.

The search server was Starnine WebSTAR running on an Power Macintosh 8500/150 with the Apple eg ACGI. I wrote a Frontier script that took the raw .html from the main IBM server and ‘replicated’ it to the Macintosh 8500 for indexing. If a user found a story that matched their search, they were re-directed to the main IBM AIX server.

The ‘listserv’ – or Newsflash! as we called it, used Starnine ListSTAR/Apple Internet Mail Server on another Power Macintosh 8500/150 and a Quadra 650. At the end of the Games, we had 1017 subscribers on the list. I pushed for the listserv as a method of ‘pushing’ information out to people who were interested -and- a way of attracting people back to the site. The ListSTAR server was easy to create and manage and I would really recommend it.

The Macintosh 8100/80 was also running the VICOM Internet gateway; all the Macintoshes in Atlanta Web central were on a 10baseT Ethernet network; and the server had a 28.8K PPP connection to Brainwaave and subsequently TelstraNet. Using this gateway, all the Macs have access to the Internet.

So, could all of this be done with Windows? Probably, but not with the integration of multiple small applictions from different sources into a cohesive system – all within 2 person-weeks.

The Fairfax Experience

[951] Fairfax at Atlanta

Background

In June 1996 Apple Computer Australia, Fairfax Publications, Brainwaave Communications, IBM, Comtech, Netscape began the Fairfax@Atlanta (1996) project.

In Australia, sport is a national pastime. Our sporting heroes are more revered than movie stars or rock musicians. Therefore, the Olympics is a 4 year feast to all sporting-mad Australians. Boxing, Cycling, Diving – and the list goes on – present a smorgasboard of viewing to the sports fan.

Fairfax Publications, one of the companies in the Fairfax empire (which includes The Sydney Morning Herald, Financial Review, The Age, Sunday Age and the Sun Herald), decided to marry the Internet with the Olympics.

Fairfax@Atlanta

was one of four Australian-team focused web sites. The nearest competitor was Inside Atlanta run by News Interactive, a company in the Murdoch News Corp empire. Other web sites were much smaller, and usually later with the news and information. Basically, it was a two horse race. As reported in Australian PCWEEK, Fairfax@Atlanta (1996) won gold for the Australian Olympic site.

Apple’s role and positioning was to gain experience with web-publishing on a grand scale; that is, outside of the PageMill/SiteMill level. Apple sponsored the site with my time (Nick Hodge) over a 5 week period; along with a bevy of hardware and software technology.

Initial analysis of the requirements of a “web publishing system” -and the intended volumes scared the hell out of me. No off-the-shelf tools exist for web publishing in this volume within this time scale.

Statistically, we finished up publishing 1,300 documents and 700+ pictures. On our peak days we began at 4:00am and completed work at about 2:00pm. Within this period, about 100 text items and 20 pictures were posted to the site. All links and structure were automatically generated as part of the publishing process.