 |
 |
 |
 |
|
|
|
PHP and Adobe Air: Building a Time-tracking and Billing Application - Part II
Welcome back. In part 1 of this series, you created some
PHP remote services and the Clocked! widget application.
Part 2 covers PHP administration and completion of the timer
widget. Let's jump right into Adobe Flex Builder and add
more widget features.
Fill in the placeholder functions
You've already created placeholder functions in the
<mx:Script> block of the
clockedWidget.mxml file. Now it's time to fill them in,
beginning with the getClientsResult() function.
This function is called when the application gets the list
of clients from PHP. When that happens, the application
needs to respond by populating a drop-down list, or
combo box, with the names of the clients. The code
looks like this:
private function getClientsResult():void {
&nspbr;var clients:Array = clockedService.getClients.lastResult;
&nspbr;currentState='loggedIn';
&nspbr;clientCB.dataProvider = clients;
&nspbr;clientCB.labelField = 'company_name';
}
First, the function places the result of the remote object
call into the
client variable, an array. Next,
the dataProvider property of the
ComboBox with the ID of clientCB
is set to the clients array. The property that
contains each company name is company_name, so
the ComboBox's labelField is set
to that value. Finally, the application's state is changed
to loggedIn. But wait: Didn't you already do
that in the logInResult function? Yes, so you
need to delete or comment out the line that reads
currentState = 'loggedIn' inside the
logInResult function. Instead of changing the
state on a successful login, you instead get the list of
clients. Put this line in place of the now-removed state
change:
clockedService.getClients();
With this change in place, the
ComboBox will
already be populated when the user is presented with the
loggedIn view state. The next step is to get
the list of projects belonging to the client from which
users can select. First, add a change event
listener to the clientCB ComboBox. Doing so
allows you to call a function whenever a client is selected
from the list. Inside the clientCB's
<mx:ComboBox> tag, add this code:
change="clockedService.getProjects(clientCB.selectedItem.id)"
Now, whenever a user chooses a client from the list, that
client's ID is sent to the remote PHP method
getProjects. And you've probably guessed that
you now need to complete the getProjectsResult
function to handle the response. The completed function
appears below:
private function getProjectsResult():void {
var projects:Array = clockedService.getProjects.lastResult;
projectCB.dataProvider = projects;
projectCB.labelField = 'name';
}
The
getProjectsResult function is similar to
getClientsResult except that it populates the
projectCB combo box and specifies the
name property as the label field.
Now, when a user selects a client, that client's projects
will be retrieved and listed for the user.
Add support for the Ticket object
The next addition to the timer widget is support for the
custom
Ticket object. Recall that you already
created a Ticket class in PHP with Ticket.php.
For the class mapping in Zend_Amf to work, you need an Adobe
ActionScript version of Ticket.php. First, right-click the
src folder in the left pane of Flex Builder,
then click New > Folder. When you create
custom classes in ActionScript (as in many other languages),
the protocol is to use dot-syntax to avoid confusion. It is
also accepted practice to use domain names, as they are a
handy way of ensuring uniqueness. Because I own the domain
name flexandair.com, I create the folder structure
com/flexandair/ and place my custom classes in
the flexandair folder. For convenience, you'll
want to do the same for this exercise. You can then access
the classes in ActionScript by importing them from
com.flexandair.MyClass. To set this up in your
project, you can enter the full path in the New
Folder dialog box: /com/flexandair.
Click Finish, and both directories will be
created.
Next, right-click the
flexandair folder,
then click New > ActionScript Class. For
the class name, type TicketVO. Click
Finish, and the basic class file is
generated. The first things you need to add to this file are
the [Bindable] tag and an alias definition for
class mapping. Add these two lines right below the package
declaration and opening bracket, on lines 3 and 4:
[Bindable]
[RemoteClass(alias="TicketVO")]
The
[Bindable] tag simply allows data binding
to this class's properties. The next line is to indicate
that this class is mapped remotely as TicketVO.
Next, add the same properties here in ActionScript that you
added before to the Ticket.php file. Add these lines right
below the class declaration and opening bracket, before the
TicketVO constructor function:
public var duration:Number = 0;
public var category:String = '';
public var details:String = '';
public var client_id:int = 0;
public var project_id:int = 0;
public var account_id:int = 0;
public var start_time:Number = 0;
public var end_time:Number = 0;
As you can see, this file is similar to its PHP counterpart,
and that's all there is to it.
[ Next Page ]
| Comments: | ||
No Messages FoundYou can post questions/corrections/feedback here
| ||
|
If you are looking for help, please post on the appropriate forum here. Your questions will be answered much more quickly. | ||
