You are currently browsing the monthly archive for March 2007.

This is the third tutorial in the Apollo JukeBox mp3 player series.The first one being Creating a mp3 player in Apollo and Flex 2 and the second one is Making the mp3 player Window Transparent. As this tutorial uses and modifies the code used in Making the mp3 player Window Transparent tutorial, please go through it before proceeding further.

In this tutorial we will use the Native Window properties and methods to display id3 tag info of an mp3 file.

 

See the screenshot of the app belowApollo JukeBox_windowing
This process of feature addition can be divided into 4 smaller tasks as follows:

Task 1: Creating the native window

Task 2: Creating the text field in the window to display id3 info

Task 3: Retrieving the id3 info for display

Task 4: Preventing the user to display null value in window

 

Task 1: Creating a native Window using NativeWindowInitOption() feature.

 

Creating a native window in Apollo is easier than you think.

Open the ApolloJukeBox.mxml file in Flex Builder.

Type the following code before </Panel> tag.

<mx:Button x=”164″ y=”42″ label=”ID3″ fontFamily=”Georgia” fontSize=”12″ fontStyle=”italic” click=”createNewWindow()” id=”snId”/>

This creates a button with id as “snId” and sets its label as “ID3”.When this button is clicked it calls “createWindow()” function.

Now lets define the custom createWindow() function.

Type the following code before the </mx:Script> tag.

private function createNewWindow():void{

var wOptions:NativeWindowInitOptions = new NativeWindowInitOptions();

wOptions.systemChrome = NativeWindowSystemChrome.STANDARD;

wOptions.transparent = false;

var newWindow:NativeWindow = new NativeWindow(true, wOptions);

This will open a blank window displaying standard chrome (OS dependent) and it will have opaque background.

 

Task 2 Creating the text field in the window to display id3 info

To display the id3 info of selected mp3 file, modify the above code to look like this.

import flash.display.Sprite;

import flash.text.TextField;

private function createNewWindow():void{

var wOptions:NativeWindowInitOptions = new NativeWindowInitOptions();

wOptions.systemChrome = NativeWindowSystemChrome.STANDARD;

wOptions.transparent = false;

var newWindow:NativeWindow = new NativeWindow(true, wOptions);

var field:TextField = new TextField();

field.borderColor = 0x000ccc;

field.autoSize = TextFieldAutoSize.CENTER;

field.text = “Album:” + songId3al + “\n” +”Artist:”+ songId3at + “\n” +”Genre:” + songId3gn + “\n” +”Songname:” + songId3sn + “\n” + “Track:” + songId3tr + “\n” + “Year:” + songId3yr + “\n” + “Comments:” + songId3ct;

newWindow.stage.addChild(field);

}

Here a new text field is created and it is added to the window , otherwise it will not be displayed in the window. The id3 info is passed to the text property of the text field instance as string.

 

Task 3: Retrieving the id3 info for display

 

Type the following code for declaring variables required for storing the id3 info.

[Bindable]

private var songId3al:String;

[Bindable]

private var songId3at:String;

[Bindable]

private var songId3gn:String;

[Bindable]

private var songId3sn:String;

[Bindable]

private var songId3tr:String;

[Bindable]

private var songId3yr:String;

[Bindable]

private var songId3ct:String;

Now modify the startPaly() function as follows:

private function startPlay():void {

_sound = new Sound(new URLRequest(songURL));

_channel = _sound.play();

_sound.addEventListener(Event.ID3, onID3);

}

Define the event listener function onID3() as follows

public function onID3(event:Event):void {

songId3al = _sound.id3.album;

songId3at = _sound.id3.artist;

songId3gn = _sound.id3.genre;

songId3sn = _sound.id3.songName;

songId3tr = _sound.id3.track;

songId3yr = _sound.id3.year;

songId3ct = _sound.id3.comment;

}

Once the id3 info is loaded the sound instance will call onID3() function which will assign various id3 properties to the variables.

Task 4: Preventing the user to display null value in window

 

As id3 info will not be assigned to the variables until unless the mp3 file is played, clicking the id3 button will display null value in the window.This will not be a good experience for the user.So we have to keep the button disable until the selected mp3 file is played

To do this the code needs to be modified at three places in three steps.

Step 1: Change the code from

<mx:Button x=”164″ y=”42″ label=”ID3″ fontFamily=”Georgia” fontSize=”12″ fontStyle=”italic” click=”createNewWindow()” id=”snId”/>

To

<mx:Button x=”164″ y=”42″ label=”ID3″ fontFamily=”Georgia” fontSize=”12″ fontStyle=”italic” click=”createNewWindow()” enabled=”false” id=”snId”/>

Step 2: Change the startPlay() function from

private function startPlay():void {

_sound = new Sound(new URLRequest(songURL));

_channel = _sound.play();

_sound.addEventListener(Event.ID3, onID3);

}

To

private function startPlay():void {

_sound = new Sound(new URLRequest(songURL));

_channel = _sound.play();

_sound.addEventListener(Event.ID3, onID3);

snId.enabled = true;

}

Step 3: Change the stopPlay() function from

public function stopPlay():void {

_channel.stop();

}

To

public function stopPlay():void {

_channel.stop();

snId.enabled = false;

}

We are done.

Now save the ApolloJukeBox.mxml file and press Run to compile the file.

Now test the app with a properly tagged mp3 file to see id3 info in a new window.

Now export the app and distribute it.

 

Something for you to do:

Modify the code so that the native window closes automatically when the user clicks “Stop” button to stop the mp3 being played.

(Hint: Follow Rich Tretola’s Windowing with Apollo tutorial.)

Download Source

Download Application

Alternative Download link (use it when the above download link does not work).

http://rapidshare.com/files/23012587/ApolloJukeBox3_source.zip.html

 

This tutorial extends the earlier tutorial about making Apollo JukeBox. In this tutorial we will see how to make application’s window transparent.

 

When we compile an Apollo app it uses the default set of window properties like rectangular shape with the usual minimize, maximize and close button. But Apollo provides features to make windows transparent and features to move the application on the desktop.

 

We have to perform following two task to achieve our result.

  1. Making the window transparent.
  2. Providing features such as closing and moving the application.

Task 1:Making the window transparent

As we will not be using the default systemChrome ,we have to make change at two places

  1. Open the ApolloJukeBox.mxml file in the Flex Builder.Change the start tag from <mx:ApolloApplication> to <mx:Application> and the end tag from </ApolloApplication> to </Application>.

Then open the ApolloJukeBox-app.xml file.Here you will see the following line

<rootContent systemChrome=”standard” transparent=”false” visible=”true”>[SWF reference is generated]</rootContent> .Now modify the attribute systemChrome from “standard” to “none” and the transparent attribute from “false” to “true”.

The code will look like this

<rootContent systemChrome=”none” transparent=”true” visible=”true”>[SWF reference is generated]</rootContent>.

  1. Now we have to make our own style statement for the application’s window such as color or background image etc.

Type this code in the ApolloJukeBox.mxml

<mx:Style>

Application

{

background-color:””;

background-image:””;

padding: 0px;

}

</mx:Style>

And we are done. Now if you can compile the file and the app will render windowless.

 

Task 2: Providing custom features like and closing and moving the application.

Type the following code to add the close button to the panel

<mx:Button x=”173″ y=”10″ label=”X” click=”onClose(event)”/>

Now declare the function onClose() inside the <mx:Script> tag

private function onClose(evt:MouseEvent):void {

stage.window.close();

}

On clicking the “X” button the mouse event fires the onClose function whch closes the window.

You can Run the file and test it.The app will appear window-less.Click the “X” marked button to close it.

Now let’s think about moving the app on desktop.

The user will hold the mouse down on the application and try to move it. For this the app has to listen to and respond to the mouse event after it initializes.

The event we will use here is MouseEvent.MOUSE_DOWN.

So change the appCompleteHandler() function from

private function appCompleteHandler():void

{

defaultFile = File.documentsDirectory.resolve("test.txt");

stage.window.width = 500;

stage.window.height = 500;

stage.window.x = 10;

stage.window.y = 10;

stage.window.visible = true;

}

to

private function appCompleteHandler():void

{

defaultFile = File.documentsDirectory.resolve("test.txt");

stage.window.width = 500;

stage.window.height = 500;

stage.window.x = 10;

stage.window.y = 10;

stage.window.visible = true;

this.jkBox.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);

}

Now lastly modify the panel a little bit.

<mx:Panel x=”112″ y=”68″ width=”243″ height=”137″ layout=”absolute” id=”jkBox”

label=”Music Tunes” title=”Apollo JukeBox” borderColor=”#00003c” backgroundColor=”#a3cafa” cornerRadius=”8″ themeColor=”#0080ff”>

<mx:Button x=”10″ y=”13″ label=”Browse” id=”openId” click=”openFile()” fillColors=”[#203fd0, #203fd0]”/>

<mx:Button x=”56″ y=”43″ label=”Play” click=”startPlay()” fillColors=”[#203fd0, #203fd0]”/>

<mx:Button x=”113″ y=”43″ label=”Stop” click=”stopPlay()” fillColors=”[#203fd0, #203fd0]”/>

<mx:Label x=”10″ y=”70″ text=”Song:” fontWeight=”bold” color=”#804040″/>

<mx:Label x=”46″ y=”70″ text=”{songName}”/>

<mx:Button x=”173″ y=”10″ label=”X” click=”onClose(event)”/>

</mx:Panel>

And your app is now ready.

You can save and Run it to see if everything works OK. If everything works OK, export it and distribute it.

 

Something for you to Try:

Try using a background image for your app.

Download Source

Download Application

Here are the alternative download links from rapidshare.com(Use this in case the above links do not work ).

Link for source file

http://rapidshare.com/files/22820898/jukebox2_source.zip.html

Link for application file

http://rapidshare.com/files/22821214/apollo_jukebox_1.1_air.zip.html

Please report  in case of broken links .

You will be building a simple mp3 player that will let the user browse the system files and directories and select a particular mp3 file for playback.

We will be building the application in stages.

There are several ways to develop Apollo application. But here we are going to look at the option that is applicable to the Flex builder users.

Requirement

a) Adobe Flex Builder 2.0.1

b) Apollo Alpha extension for Flex Builder

c) Apollo Alpha runtime

Assumption:

a) It is assumed that you already have downloaded and installed Flex Builder 2.0.1.

b) You have some programming background in Actionscript 3.0 and MXML.

Stage 1 Installation of Apollo extension

Download the Apollo alpha extension (fb_apollo_extensions_win_alpha1.exe) for Flex from http://www.adobe.com/go/getapollo.

Double click on the fb_apollo_extensions_win_alpha1.exe file and follow instructions to complete the installation.

 

Stage 2: Create the apollo project

1 Open Flex Builder 2.0.1.

2 Select File – New – Apollo Project.

New Apollo Project

 

2. This will open the New Apollo Project dialog box.

new Project dialog box

3 The Basic option is selected as default , so click the Next button.

create apollo project

4. In the next page of the dialog box, type ApolloJukeBox as the project name and leave Use Default Loacation selected.Click the Next button.

5. The Application XML Properties panel is displayed.

6. In the panel specify the settings as follows:

  • ID : ApolloJukeBox
  • Name : ApolloJukeBox
  • Publisher : Apollo Publisher
  • Description: It is a simple mp3 player
  • Copyright : 2007

application properties

 

After specifying the details ,click Finish.

The project will be created.In addition to the ApolloJukeBox.mxml file you will see another xml file named ApolloJukeBox -app.xml.

 

Stage 3: Coding the application

Before we start coding the application, we should try to find out if we can segregate the application in smaller blocks. In our case it is a simple mp3 player which enables the user to browse system files for mp3 files, select the desired file and then play and stop the file using buttons.

This shows we can divide the application in following blocks.

Block 1-> Designing the UI of the application

Block 2 -> Browsing the File System and selecting a particular file

Block 3 -> Controlling the playback of the selected file

Block 1: Designing the UI of the application

For the browsing and selecting the file we will use the FileOpenPanel component.

This component can be found in the apollo_alpha1_docs\Samples\TextEditorFlex\com\adobe\apollo\sample
folder.

(If you already have not downloaded the Apollo_alpha1_docs.zip, then download it from adobe labs)

Lets do the Coding.

With the creation of the project you will see Flex has created two files ApolloJukeBox.MXML and ApolloJukeBox -app.xml along with the usual bin folder.

 

We will look at the xml file later.You will see the mxml file contains the code

<?xml version=”1.0″ encoding=”utf-8″?>

<mx:ApolloApplication xmlns:mx=”http://www.adobe.com/2006/mxml&#8221; layout=”absolute” title=”ApolloJukeBox >

</mx:ApolloApplication>

The <mx:ApolloApplication> means it is an Apollo application.

Write the following code to create a panel and three buttons with labels ‘Open’, ‘Play’, ‘Stop’ :

<mx:Panel x=”112″ y=”68″ width=”243″ height=”200″ layout=”absolute”

label=”Apollo Tunes”>

<mx:Button x=”10″ y=”20″ label=”Open” />

<mx:Button x=”86″ y=”20″ label=”Play” />

<mx:Button x=”157″ y=”20″ label=”Stop” />

</mx:Panel>

Now the code should look like this:

<?xml version=”1.0″ encoding=”utf-8″?>

<mx:ApolloApplication xmlns:mx=”http://www.adobe.com/2006/mxml&#8221; layout=”absolute” title=”My Apollo Tunes >

<mx:Panel x=”112″ y=”68″ width=”243″ height=”200″ layout=”absolute”

label=”Apollo Tunes”>

<mx:Button x=”10″ y=”20″ label=”Open” />

<mx:Button x=”86″ y=”20″ label=”Play” />

<mx:Button x=”157″ y=”20″ label=”Stop” />

</mx:Panel>

</mx:ApolloApplication>

Now save the file and Click Run.

 

You will see a new window will open up with a label ‘Apollo Tunes’ with three buttons labeled ‘Open’, ‘Play’ and ‘Stop’.

One thing to be noticed here is that the browser did not opened as in the case of Flex application.

Close it and return to do the coding.

We need a Label to display the song name.

Type the following code below the button code:

<mx:Label x=”21″ y=”71″ text=”Song Name”/>

<mx:Label x=”21″ y=”97″ text=”{songName}”/>

The second label will display the selected filename.

Now save the file.Now is the time to put the logic in the application.

Block 2: Browsing the File System and selecting a particular file

For this we wil use the FileOpenPanel component.

Let us first create a new folder called components.

Now right click on the ApolloJukeBox folder and select new from the Menu and select Folder.

new folder

New Folder dialog box will open.

Type the folder name as components and click finish.

Now copy the FileOpenPanel.mxml from the samples folder and paste it in the components folder.

Type the following code:

<mx:Script>

<![CDATA[

import mx.controls.FileSystemList;

import component.FileOpenPanel;

import mx.controls.Alert;

import mx.events.*;

private var currentFile:File; // The currentFile opened by the application

private var defaultFile:File; // The default currentFile

[Bindable]

private var songName:String;

/**

* Handles I/O errors that may come about when opening the currentFile.

*/

private function readIOErrorHandler(event:Event):void {

Alert.show(“The specified currentFile cannot be opened.”, “Error”, Alert.OK, this);

}

/**

* Called when the user clicks the Open button. Opens a pop-up window, in which the user selects a currentFile. See the FileOpenPanel.mxml currentFile.

*/

private function openFile():void

{

var fileOpenPanel:FileOpenPanel;

if (currentFile)

{

fileOpenPanel = FileOpenPanel.show(currentFile.parent);

}

else

{

fileOpenPanel = FileOpenPanel.show(defaultFile.parent);

}

fileOpenPanel.addEventListener(FileEvent.SELECT, fileOpenSelected)

}

private function fileOpenSelected(event:FileEvent):void

{

currentFile = event.file;

songName = currentFile.name;

}

/**

* Called as the event handler for the applicationComplete event of the Application. This method

* sets the position and size of the main window.

*/

private function appCompleteHandler():void

{

defaultFile = File.documentsDirectory.resolve(“test.txt”);

stage.window.width = 500;

stage.window.height = 500;

stage.window.x = 10;

stage.window.y = 10;

stage.window.visible = true;

}

]]>

</mx:Script>

The above code opens the file open panel and displays all the folders and files of current selcted folder .In case no folder has been selected , it makes My Documents the current folder.This happens because currently in alpha version of Apollo default file always points to My documents in windows environment and …… in Mac environment.

If any other directory is selected from the drop down, that becomes the current selected directory to be browsed.Once the files shows in the list box any file can be selected.

Once the file is selected it is assigned to currentFile variable in fileOpenSelected method.

Now lets attach the FileOpen function to the ‘Open’ button so that we can see some action.

Modify the button code from

<mx:Button x=”10″ y=”20″ label=”Open” />

to

<mx:Button x=”10″ y=”20″ label=”Open” click=”openFile()” />

To see the name of the file selected, modify the second label

<mx:Label x=”21″ y=”97″ text=”{songName}”/>

Now save the file and click Run.

Now do a lot of file browsing, once the application is rendered.

Now we have to do some customization to the component to serve our purpose.At present when we click button it filters out text files as default,but we want to filter mp3 files as default.Its easy.Just open the FileOpenPanel.mxml file in the Flex Builder.Go to line number 23

{ label: “Text files”, data: [ “.as”, “.css”, “.htm”, “.html”, “.ini”, “.js”, “.txt”, “.mxml”, “.xml” ]}

Here remove all the file extensions in the array and type “.mp3”.A warning will be thrown asking you if you want to make this file writable .This is because this file is in Read-Only mode.You click yes to make file writable.

Next change the label from “Text files” to “mp3”.

Before we can run the file we need to initiate appCompleteHandler() method which sets the application window as the application runs.Just add this applicationComplete=”appCompleteHandler()” after after title=” ApolloJukeBox ” in the <mx: ApolloApplication > tag.

The code will look as follows

<mx:ApolloApplication xmlns:mx=”http://www.adobe.com/2006/mxml&#8221; layout=”absolute” title=”My Apollo Tunes”

applicationComplete=”appCompleteHandler()”>

That’s all.

Now save the file and run the ApolloJukeBox.mxml file. Try to browse different directories and see if mp3 are filtered or not.

 

Block 2: Controlling the playback of the selected file


This is a really simple affair.Add the following code within <mx:Script> tag.

The codes to be added are given in bold faces.

<mx:Script>

<![CDATA[

import mx.controls.FileSystemList;

import flash.filesystem.*

import component.FileOpenPanel;

import mx.controls.Alert;

import mx.events.*;

import flash.media.Sound;

import flash.media.SoundChannel;

import flash.net.URLRequest;

private var currentFile:File; // The currentFile opened by the application

private var defaultFile:File; // The default currentFile

/**

* Handles I/O errors that may come about when opening the currentFile.

*/

private function readIOErrorHandler(event:Event):void

{

Alert.show(“The specified currentFile cannot be opened.”, “Error”, Alert.OK, this);

}

/**

* Called when the user clicks the Open button. Opens a pop-up window, in which the

* user selects a currentFile. See the FileOpenPanel.mxml currentFile.

*/

private function openFile():void

{

var fileOpenPanel:FileOpenPanel;

if (currentFile)

{

fileOpenPanel = FileOpenPanel.show(currentFile.parent);

}

else

{

fileOpenPanel = FileOpenPanel.show(defaultFile.parent);

}

fileOpenPanel.addEventListener(FileEvent.SELECT, fileOpenSelected)

}

[Bindable]

private var songURL:String ;

[Bindable]

private var songName:String;

private function fileOpenSelected(event:FileEvent):void

{

currentFile = event.file;

songName = currentFile.name;

songURL = currentFile.url ;

}

/**

* Called as the event handler for the applicationComplete event of the Application. This method

* sets the position and size of the main window.

*/

private function appCompleteHandler():void

{

defaultFile = File.documentsDirectory.resolve(“test.txt”);

stage.window.width = 500;

stage.window.height = 500;

stage.window.x = 10;

stage.window.y = 10;

stage.window.visible = true;

}

/**

Creating the mp3 player

*/

private var _sound:Sound;

private var _channel:SoundChannel;

public function startPlay():void {

_sound = new Sound(new URLRequest(songURL));

_channel = _sound.play();

}

public function stopPlay():void {

_channel.stop();

}

]]>

</mx:Script>

The above code creates a sound object and startPlay() function assigns the selected file url as the url of the sound object.Function stopPlay() stops the sound from playing the file.

Special note:

One thing to be remembered here is that url property of the file instance to be used in this case, if the nativePath property is used the mp3 file will not play.


Now assign the startPlay() and stopPlay() functions to the ‘Play’ and ‘Stop’ buttons respectively.

The code should look like as follows:

<mx:Button x=”86″ y=”20″ label=”Play” click=”startPlay()”/>

<mx:Button x=”157″ y=”20″ label=”Stop” click=”stopPlay()”/>

<mx:Label x=”21″ y=”71″ text=”Song Name”/>

<mx:Label x=”21″ y=”97″ text=”{songName}”/>

Here you will see text property of the second label is changed to songName} from {currentFile},that’s because the label will show the mp3 file name which is selected.

Now save the file and your app is ready to run if the problems panel does not show list any errors.

Click run to compile and test the app.

Now select a mp3 file and once the file is selected click ‘Play’ button to start playing. Enjoy the music.

Now that you have built the application ,you would want to distribute it as a package so that others can enjoy music too.

Stage 3 Packaging and distributing the application

It’s the time to give a look at the ApolloJukeBox -app.xml file.open it if it is not opened already in the Flex Builder. It is a simple xml file known as application descriptor file.

In this file you need to provide path to the icon images that you want to associate with the application.

Go to the end of the file .just before </application> you will see </icon> tag.

Here replace the closing icon tag with the following

<icon>

<image16x16>icons/ApolloApp_16.png</image16x16>

<image32x32>icons/ApolloApp_32.png</image32x32>

<image48x48>icons/ApolloApp_48.png</image48x48>

<image128x128>icons/ApolloApp_128.png</image128x128>

</icon>

Create an icons folder just as you earlier created the components folder.Copy the images from apollo_alpha1_docs\Samples\TextEditorFlex\icons folder and paste them in icons folder.

Now select Export option from File Menu.

export

 

The following panel will appear.

export 2

 

Select Deployable AIR File if already not selected and click Next.

export 3

The AIR Deployment Export Wizard appears.It will show all the Apollo projects open in Flex Builder(In the image it shows three projects,but in your case it may show only the current project you are working on).Now select the ApolloJukeBox -app.xml and click Next.The following page opens.

app

 

Click in the icons checkbox to include it with the deployable AIR file.

Click browse button to select the desired export destination where the air file will be saved.

It will show Save As dialog box .Here type ApolloJukeBox.air as the file name and click Save button.

save as

 

The wizard dialog box will appear again.Here click in the icons checkbox to include it with the deployable AIR file.

icons

 

Clicking the save button will return to air dialog box.

Then click Finish to create the AIR file in the desired location.

That’s it.

Your application is ready to be distributed. Others can enjoy their favorite music with your app.


Resources to be explored:

I would like to recommend you go through the following resources for greater understanding.

1. http://labs.adobe.com/wiki/index.php/Apollo:Articles

2. Apollo_for_Adobe_Flex_Developers_Pocket_Guide

3. http://blog.everythingflex.com/apollo/

Download Source file

Download AIR file

 

 

 

 

 

I have downloaded the available pdf chapter from O’Reilly site.

And here is my understanding about File System API
1. Apollo is multi OS runtime.This means its syntax will run in any OS.

2. There is a new Object File (flash.filesystem.File).
Its properties are
appStoragedirectory
appResourceDirectory
currentDirectory
desktopDirectory
documentDirectory
userDirectory

3. File.documentsDirectory, as the name suggests is the My documents directory in Windows and Documents subdirectory of user in Mac.

4. There are two versions of some methods of the File class.They are synchronous and asynchronous.

5. Asynchronous methods are below listed.
a) copyToAsync()
b) deleteDirectoryAsync()
c) deleteFileAsync()
d) listDirectoryAsync()
e) moveToAsync()
f) moveToTrashAsync()
g) openAsync()

6. Asynchronous methods run in the background allowing other scripts to run.

7. File.listDirectory() method returns a list of directories or files in a particular directory in the form of an array.However it does not return an subdirectories and its contents.

8. File or directory info using File object properties
exists
isDirectory
isHidden
nativePath
parent
url
creationDate
modificationDate
name
size

9. Files or directories created using methods File.createTempFile() and File.createTempDirectory() are not deleted automatically.

10. Files and directories can be deleted using File.deleteFile() method.

If Apollo can’t access database,then how does it work ?

In the true tradition of macromedia Adobe once more has let us down.Last time you saved anything from a flash movie was in the times of Flash 5.After Flash 5 the security tightened and nothing can be saved from swfs.You can draw a picture or write some notes and even use ‘Ctrl+C’ and ‘Ctrl+V’ but no ‘Ctrl+S’ while your favorite movie plays or waits for your active response.

But you will say “Don’t forget Local shared Object”.And I will say “Wow, that’s great.Actually LSO has saved me many times in my coding career.”

But we all know that is not enough.We need some kind of database access to develope enterprise level applications.

The next question is if an Apollo app cannot access databse then how is it going to deal with data?

Ans:

Adobe has alaready shown a really cool demo of ebay apollo app.

Still want to know more..

Let’s analyse the objective with which Apollo framework is created and we will clearly see why database access is not on its to-do lists.

Reason 1:

Its primary objective is to connect the system(desktop) with the application running on the server.

Reason 2:

Its job is not to replace either the browser or the server side languages but rather to complement them.

Reason 3:

Any server side language can access the database in better ways as they are built to do that.(save us learning a new language)

Then how does the app work?

Before we go further give a look at the class and package structure of the Apollo(refer my Apollo Class heierarchy.swf)

It has got the following actionscript packages

flash.display
flash.events.FileListEvent
flash.filesystem
flash.html
flash.system

This clearly shows what is being dealt with here.
Apollo is a framework which leverages the power of Flash,Actionscript,html,css and javascript in addition to some native functionalities and APIs such as file I/O and native windowing etc.

From this I can safely deduce that Apollo application will work in the following manner(see the blow diagram).

apollo-app-structure.gif
The app renders the html and display contents from the server.It saves the required data in the system in some format so that it can operate when offline.Apart form this, it can read/write files and can access system directories.So any modification done by the user is saved and uploaded once the app goes online.

Javascript support means developers do not have to write user interactions,client side validations twice.Once in javascript and again in actionscript.

It seems without direct database access an apollo app can do a lot.

March 2007
M T W T F S S
 1234
567891011
12131415161718
19202122232425
262728293031  

Blog Stats

  • 78,873 hits