Smoky Cogs

Appcelerator Titanium has a rich set of Window management methods which are accessible with the UserWindow object and the Titanium.UI namespace.

The basics of opening up a new window in Titanium is as follows:

   var currentWindow = Titanium.UI.getCurrentWindow();
   var newWindow = currentWindow.createWindow('http://www.google.com');
   newWindow.setWidth(400);
   newWindow.setHeight(300);
   new();

First, we need to get the current window we want to work with, from which we are going to open the new window. This window will become the new window’s parent.

The new window is created with the .createWindow() method. The parameter is an optional parameter, but can be either a url, or an object containing the parameters for the new window. The url can be either an external url, which is signified by using http:// in the url, or else it can be a url pointing to an internal location in the application, which is prefixed by app:// and then the path to the html page to display.
continue reading…

Out of all the features included in Appcelerator Titanium which sets it apart from a conventional web application is not things like the SQLite database, which is included in the HTML 5 spec, and so will be in browsers everywhere soon, or the menu system, which can be easily replicated using CSS, but rather, it is Titanium’s ability to read and write files to and from the local file system that truly makes the platform a desktop-friendly platform, while keeping the flexibility of a web app.

File access in Titanium is very similar to how it is done in other languages like PHP or C#. The objects used are the File and FileStream objects, and the Titanium.Filesystem namespace.

So, to write some data to a file, the code is as follows:

   var contents = "Some contents to write";
   var filename = 'test.txt';
   var userDir = Titanium.Filesystem.getUserDirectory();
   var writeFile = Titanium.Filesystem.getFile(userDir, filename);
   var writeStream = Titanium.Filesystem.getFileStream(writeFile);
   writeStream.open(Titanium.Filesystem.MODE_WRITE);
   writeStream.write(contents);
   writeStream.close();

Titanium.Filesystem.getUserDirectory() gets the user directory of the currently logged in user. Other useful options here are getDocumentsDirectory(), getApplicationDirectory() and getDesktopDirectory(). The directory can also be a string representing any folder on the user’s machine but these functions provide a cross-platform method of obtaining the most common directories needed.
continue reading…

Appcelerator Titanium has built in support for using SQLite databases either asynchronously or synchronously. It is a fair bit easier doing it synchronously, and for my application, it had to work that way for it to work correctly, so I will go throught that first, and in a later tutorial explain how to set up an asynchronous database.

Using the SQLite database is a simple affair, and makes use of theTitanium.Database namespace and the DB and ResultSet objects.

So, the first step is to connect to a database:

   var db = Titanium.Database.open('session_db');

The parameter is the name of the database to open.
continue reading…

In Appcelerator Titanium, setting up a menu is very easy. The menu system works with Titanium.UI and the Menu object.

To create a new menu object, all you have to do is:

   var menu = Titanium.UI.createMenu();

Now, a menu without any menu items is a rather useless feature, so now we need to add some menu items.

   var file = menu.addSubMenu("File");
   var help = menu.addSubMenu("Help");
   file.addItem("Open", function () { alert('Do open');});
   file.addSeparator();
   file.addItem("Exit", function () { Titanium.App.exit(); });

   help.addItem("About", function () { alert('Show about box here');  });

The menu.addSubMenu(textToDisplay) function adds a submenu to the menu, and returns the submenu object. Menu items are then added to the submenu with the .addItem(textToDisplay, functionToExecute). You can, of course, add submenus to a submenu in the same way as a submenu is added to the main menu.

The last step is to tell Titanium that you want to display the menu, and that is done with this command:

   Titanium.UI.setMenu(menu);

That is all there is to it. Nothing hard about it at all. For the full list of methods for the Menu object see the Titanium API Documentation.

During the last several weeks I have been making considerable progress in using Appcelerator Titanium. The new KnowledgeTree client application in Titanium, which I am working on at work, is coming along nicely.

Using Javascript in Titanium is easy, although one thing that is lacking at this stage are tutorials and sample code for the Titanium-specific extensions are not easy to come by, and the forums are still too new to have answers to everything, so at times, this means prodding around in the dark trying to get things to work.

As a result of this, I thought it would be a good idea to write up some of the lessons I have learned from using Titanium so that I can share them with the world.

Just this morning, I managed to crack an issue I have been struggling with for a few days: How on upload a file to a webserver using Javascript.

One of the ways to accomplish this is to use the XMLHttpRequest object to upload a file using a form post. However, Titanium has wrapped this functionality in the HTTPClient object.
continue reading…

Finally I have managed to create a package of a Titanium app. It is a simple period table app called Elemental – which you can get here.

This is actually the second personal Titanium app which I have worked on. The first is an astronomical calculations app which I have not quite finished yet, and need a certain bug in Titanium fixed before I can complete it so it is on the back burner.

It seems that ever since I have been working on Titanium at work, it has had me obsessed.

So, why on earth do I love Titanium so?

Well, Titanium is a great step to marrying two worlds that have up to now been apart. Desktop applications and web apps. Web browsers, for security reasons, don’t allow web apps to access any local resources on a computer. It would be very irresponsible and dangerous if they did, however, this limits what you can do with a web app. Desktop apps have that power, but lack the flexibility of easy distribution and platform-independance.

Now, with Titanium, the two realms are easily intermingled, and it is the most fun I have had in a long time.

What this means is that web apps are going to increase their dominance in the market far more than ever before thought, and one Javascript is the language that is gaining far more prominence than I ever suspected it could gain. It could easily become the most widely used language in the near future to write entire applications in.

But then again, anything can happen…….this is IT after all.

For the last few weeks I have been playing around with Appcelerator Titanium.

It all began at work where we were researching the best platform to write some client tools for the KnowledgeTree document management software which we produce. Adobe Air was our initial first choice, but after doing a few demos of Titanium versus Air, we have finally settled on Titanium.

Titanium is an awesome platform, and I was rooting for it from the start, so I am very glad we have decided to use it, although, like all things in life, there is a down side.

Titanium is cutting edge. So cutting edge, that the beta release was only released two days before our second demo.
continue reading…