Article: Easy ManiaLink Creator, Part 1

2nd place in the TMU Writing Contest. Part 1 of 2. Written by Cyberfrog.

Illustration 1: The envisioned editor (click to enlarge).

About this article

This text is a vision of a piece of software for ManiaLink and ManiaCode creation. It does not describe software that currently exists, nor is it certain that this software will ever be completed and released. While the text may seem like a user guide in places, it is important to keep in mind that the software described does not exist, and so writing a user guide for it would be slightly difficult.

The article is meant to crystallize the thoughts and ideas of its author, while at the same time presenting a vision of a somewhat complex yet easy to use application for ManiaLink and ManiaCode creation.

For readers of this text, a minimum of knowledge about the game TrackMania United is assumed. Other terms will be explained throughout the text as needed, often by pointing to external sources, in order to keep focus as much as possible on the Easy ManiaLink Creator.

Table of Content (Part 1)

• 1. A word on ManiaLinks and ManiaCodes
• 2. The Easy ManiaLink Creator
• 2.1 Projects
• 2.2 Project Tree View, Toolbar and Properties

Note: The Table of Content is expanded in Part 2 of this article. The above are discussed here, while more will be discussed in the second part.

1. A Word on ManiaLinks and ManiaCodes

ManiaLinks are XMLdocuments that feed the TrackMania United (TMU) in-game browser with content or pointers to content as well as instructions on how to format the page. XML (eXtended Markup Language) is a format that is used to describe the hierarchical structure of data. Readers who desire more knowledge about the XML format could for instance look at the following Wikipedia article: http://en.wikipedia.org/wiki/XML.

For the sake of simplicity, we may view ManiaLinks together with the in-game browser as somewhat similar to browsing web pages on the Internet.

ManiaCodes are also XML documents. They can be viewed as one or more actions (e.g. “download track X, then display ‘Have fun!’ in a text box”), and can be linked to in ManiaLinks, significantly adding to the usefulness of ManiaLink documents.

A complete description of the XML tags used in ManiaLinks and ManiaCodes is beyond the scope of this text, but it is worth mentioning the layout of a ManiaLink page. It consists of lines, cells and media (text, images, audio, or video). The lines are spaces with an attribute “height”. One or more cells are placed sequentially on each line. The cells have en attribute “width”. Each cell commonly stores one of the mentioned media types. Presumably lines are so named because they are placed under each other, vertically ordered like paragraphs in a text.

Click to enlarge.

Illustration 2: Simple and ugly ManiaLink layout - two lines with two cells each.

The above treatment of ManiaLinks has been quite simplified. Readers who desire more details could look at for instance the following pages of the TM-WIKI:

• http://en.tm-wiki.org/wiki/ManiaLink_Page
• http://en.tm-wiki.org/wiki/ManiaCode_Tutorial

Does the user of the Easy ManiaLink Creator need to know all that stuff? Ideally, no, but knowing what lines and cells are will be helpful.

2. The Easy ManiaLink Creator (EMC)

This section is divided into several subsections. The first describes what the user does before starting work on the actual ManiaLinks/ManiaCodes. The second deals with other prominent aspects of the user interface, while the third is about the Visualizer (visualizing mainly ManiaLinks). The last subsection lists some likely weaknesses. The first two parts are discussed here, the two others are discussed in the second part of the entire article series.

2.1 Projects

The user must first start a new “project” or open a previously saved one. Each project consists of zero or more ManiaLinks and zero or more ManiaCodes (in order to support even very simple projects where e.g. the user just wants to create a simple ManiaCode).

Projects are given a unique name on creation. It has to be unique since each project will have their own subfolder under the editor folder. Grouping related documents together makes sense in many ways, one of which is the possibility to simulate clicks on ManiaCode links.

In addition to its name, projects has several other features. One worth mentioning is an undo/redo buffer, so that the user can easily fix any screw-ups along the way.

With an active project, the user can right-click on it (or choose the appropriate item from the top menu) to add a new blank ManiaLink or ManiaCode to the project. It is also possible to copy existing ManiaLinks or ManiaCodes from other projects. As we shall soon see, it is also possible to use only parts of other ManiaLinks/ManiaCodes in new projects.

2.2 Project Tree View, Toolbar and Properties

On the left hand side of the screen is the projects tree. Expanding project nodes will show “ManiaLink files” and “ManiaCode files”. Expanding ManiaLink files will show any created ManiaLinks with their filenames. Lines can be added to these nodes by choosing from the toolbar or by right-clicking on them. Cells can be added to the Lines. Content (e.g. text or an image) can be added to the Cells. Expanding ManiaCode files will show any ManiaCode files added (no surprise there), and expanding any of the files will show the actions in the order they where added (the user can easily change the order if so desired).

Lines, Cells, and media nodes can be copied and pasted within the project or to other open projects. The order of Lines and Cells can be changed. For ManiaCodes, individual actions may be copied and pasted and the order of actions can be changed. Most nodes can be deleted - among the few exceptions are ManiaLink files and ManiaCode files (but these will naturally be deleted if you delete the project they belong too).

The Toolbar has additional helper tools, for example one to construct a table using Lines and Cells. A table-like design will often be appropriate for presenting tracks, mods, avatars and similar content.

On the bottom of the screen you find the two-column Properties table. This will change depending on which node in the project is currently selected. It allows you to change every relevant attribute for the currently selected node. When you click on an item you will on the very bottom of the screen see a small text describing what the attribute is for, and any minimum and maximum values.

To be continued. Read the second part of this article tomorrow