Rich Internet Applications & more

General

The PizzeRIA AIR demo generates and displays statistical data and graphics based on the PizzeRIA orderlist and a selectable time frame:

• a list showing the ordered quantity per topping in absolute numbers;
• a datagrid-bar-chart/pie-chart showing the ordered quantity per topping in percentages;
• a top five chart showing the favorite pizza configurations including the consumed quantity.

Usability

• Both mouse and keyboard input can be used to control the application. In the latter case comboboxes must be used to select a time frame.
• Buttons are customized: They respond not only to the space key, but also to the enter/return key.
• Rich graphics: intermediate frames are generated between two graphs to give the appearance that the first graph evolves smoothly into the second graph.
• Immediate feedback messages (notice/alert) are generated in the following situations to create a rich user experience:
  • comboboxes: when an incorrect date is selected;
  • comboboxes: when the selected 'from time' comes after the 'to time';
  • password selection: when the optional password is too short or not identical to the repeated password;
  • login: when the provided password is false (the application quits after three false tries).

Technical details and further reading

General

Resizable application window

A custom scale/scroll class is used to automatically adapt to different window sizes. When the application window is resized to a width smaller than the application width, the application is instantly scaled down to a certain point, then scrolled. This changeover point is made screenwidth dependent and prevents small texts becoming unreadable.

Present settings (PizzeRIA AIR demo width= 922 pixels):

• screenwidth larger than 1024 pixels: changeover point at 800 pixels;
• screenwidth between 800 and 1024 pixels: changeover point at 600 pixels;
• screenwidth between 600 and 800 pixels: changeover point at 400 pixels.

Graphics

The datagrid-bar-chart and pie-chart are made with Degrafa, a framework for Flex that uses graphics classes in MXML.
Further reading:

• the datagrid-bar-chart is a RIAmore modification of the Degrafa visual datagrid by Andrew Trice:
  http://www.insideria.com/2008/03/degrafa-datagrids-visual-displ.html
• the pie-chart is a slight modification by RIAmore of the Degrafa pie chart component by Derrick Grigg:
  http://www.dgrigg.com/post.cfm/04/15/2008/Degrafa-Pie-Chart
• Degrafa framework:
  http://www.degrafa.org/index.html

Zend Framework as backend

The PizzeRIA Server handles storage and retrieval of raw order data. The server also takes care of cookie handling.

The PizzeRIA AIR demo uses the same backend as the PizzeRIA demo backend2: the Zend Framework combined with a custom HMAC implementation. This HMAC script uses a custom function to authenticate a domainless AIR application.

The Zend Framework backend was favored over a Drupal 6 solution because Drupal's current HMAC implementation does not support AIR applications.

Optional password protection

The PizzeRIA AIR demo can be password protected to prevent other users access to the evaluation data. In this case the password is part of a larger key that is used to create the encrypted database. Since the password is not stored separately, it is not possible to retrieve the password.

Button "quit application"

This button adds "safe" quitting of the application. When a user quits the application in the middle of an update, all the new orderdata is saved in the local database before the application actually quits. Read more about this in the next paragraph.

Local SQLite database

Database operations

The PizzeRIA AIR demo stores orderdata in the SQLite database for offline evaluations. AIR offers synchronous and asynchronous database operations:

• Synchronous operations are fast, but they freeze the application and disable user interaction with it until the operations have finished;
• Asynchronous operations are relative slow, but they take place in the background while the application continues to run, the user can continue to interact with it without the screen freezing.

The PizzeRIA AIR demo uses the asynchronous mode together with a "safe" way of quitting. By pressing the "quit application" button, the actual quitting is delayed until database operations have finished.

Database encryption

AIR database encryption uses the Advanced Encryption Standard (AES) with Counter-Mode/CBC-Mac (CCM). This encryption cipher requires a user-entered key to be combined with a salt value to be secure.

For the PizzeRIA AIR demo the EncryptionKeyGenerator class, included in the open-source ActionScript 3.0 core library (as3corelib) project, was used.

Further reading:
AIR 1.5 - Using encryption with databases: http://help.adobe.com/en_US/AIR/1.5/devappsflex/WS8AFC5E35-DC79-4082-9AD4-DE1A2B41DAAF.html

Data Transfer

Raw data backend2

Order data is sent as a sequence of 4-digit numbers to increase transferrate.
Further reading:
Raw data backend2
 

Hash Message Authentication Code (HMAC)

To verify both the data integrity and authenticity during data-transfer to the PizzeRIA server, the HMAC mechanism is used. This is a message authentication code involving a cryptographic hash function in combination with a secret key. The security of such a mechanism depends upon cryptographic strength of the underlying hash function, on the size and quality of the key and the size of the hash output length in bits.
Further Reading:
HMAC in Flex: http://ntt.cc/2008/12/06/as3corelib-tutorial-how-to-use-hmac-class-in-flex.html
HMAC: http://www.faqs.org/rfcs/rfc2104.html
 

AMF gateway

The Adobe Messaging Format is used for fast data communication between Flex/AIR and the server backend. AMF encodes remote procedure calls (RPC) into a compact binary representation that can be transferred over a HTTP/HTTPS protocol. AMF implementations exist for PHP, Coldfusion, Java, Perl, .NET, Ruby and Python.
 

The PizzeRIA AIR demo uses Zend_Amf, the Zend AMF implementation, on the server side.

Order data is transferred using the HTTP protocol. In data sensitive applications the order data could be sent encrypted or over a SSL connection to enhance security.

Cookies

Cookie based session-IDs are used as part of the HMAC authentication during communication with the PizzeRIA server.