MAX Lab Session Material: Creating Data Centric Applications using Flash Builder and PHP

October 13th, 2009

Flash Builder 4 Beta 2

Lab handout and sql script.

The version of WAMP which was installed on the lab machines can be downloaded from here.

Finally, in case you have any queries please post them at the Adobe Labs Forums.

Other References
Tour De Flex
Flex Devnet
Flash Builder 4 Tutorials
Flash Builder 4 Beta 2 and Flex 4 Beta 2 training videos

Finally, a worthy Google Reader replacement

September 3rd, 2009

Anirudh has developed a cool reader app (http://readefine.anirudhsasikumar.net/). Its based on the Text Layout Framework of Adobe Flash.

Two mins. of seeing and using the app, I’m in love with it and for the first time I think I have found a worthy replacement of Google Reader. Hopefully one day it’ll have OPML support so that I can move all my feeds from reader to this app :) .

Excellent work Anirudh!

Flex India Evangelism Team's Website Launched

August 5th, 2009

The Flex India Evangelism Team has created their home page (http://flashahead.adobe.com). Their blog is available at http://flashahead.wordpress.com.

Watch the two spaces for the latest news from them…

Adobe Dev Summit 2009 – Bangalore

July 27th, 2009

Adobe Dev Summit is back to present you the latest happenings of Adobe Flash Platform. Don’t miss this unique opportunity to hear from the experts about the power & awesomeness of Adobe Flash Platform & Flash Builder 4.

Date : 4th August 2009, Tuesday
Time : 9 AM to 6 PM
Where : Lalit Ashok, Bangalore

Highlights

  • See the new, improved and rocking LiveCycle Data Services 3 in action! If you are a Java developer, you wouldn’t want to miss this one!
  • If you are a PHP/Java developer, get on the RIA expressway using the new Data Centric Development features on Adobe Flash Builder 4
  • If you’re into enterprise-wide RIA development, things have just got hot! Check out the brand new version of ColdFusion with the sparkling new developer IDE – ColdFusion Builder.
  • User Interfaces are a thing of the past now. Build User Experiences of tomorrow with Adobe Flash Catalyst. Quicker than ever!

You can attend this event for FREE using Gold Pass or signup for the Platinum pass and get a Flex Builder 3 Professional license worth USD 699 FREE!!!.

You can get more details about the event and register here.

Come, be there to experience the awesomeness.

Howto: Setup PDT & Flash Builder

June 13th, 2009

This setup allows you to edit and debug you PHP files along with your flex application in the same instance of eclipse. All features of PDT like PHP code coloring, auto complete will be available in addition to the wonderful features that Flash Builder 4 providesJ.

1. Download Eclipse 3.4.2 based PDT All-in-One bundle
a. Windows
b. Mac OSX Carbon

2. Extract it to a location of your choice. (say C:\opt\eclipse)

3. Download XDebug dll from http://xdebug.org/download.php. For the purposes of this tutorial I downloaded and used http://xdebug.org/files/php_xdebug-2.0.4-5.2.8.dll

4. Place this dll at any location accessible by your php installation, the PHP home directory itself is a good location.

5. Add the following entries to your php.ini file:

;
; Changes to enable XDebug
;

zend_extension_ts="C:/opt/php526/php_xdebug-2.0.4-5.2.8.dll"
zend_debugger.allow_hosts=127.0.0.1
zend_debugger.expose_remotely=always
xdebug.remote_port=9000
xdebug.remote_handler=dbgp
xdebug.profiler_enable=0
xdebug.profiler_output_dir="C:/temp"
xdebug.remote_enable=On
xdebug.remote_autostart=On
xdebug.remote_host=127.0.0.1
xdebug.remote_mode=req
xdebug.remote_log="C:/temp"

You need to be extra careful while editing the php.ini file as installations like WAMP tend to have a php.ini file inside the php folder and another one inside the apache/bin folder. The one under apache/bin is used. So a good way to figure out which php.ini file is being used by your PHP installation run phpinfo() and check the value of “Loaded Configuration File”

6. Restart your web server and view the phpinfo() output. XDebug should be listed there. If you don’t have a phpinfo() file, you can create one by putting the text below in a php file and saving it under your webroot. Then load the file in your browser.

<?php
 phpinfo();
?>

7. Now download the plug-in version of Flash Builder and install it. When prompted to select the host eclipse, choose the “Plug into another copy of Eclipse” option and enter the path of the eclipse installed in Step 2 – “C:\opt\eclipse”

8. Start eclipse and create a new Flex Project with server type PHP

9. Create/Import a new PHP service the flex project

10. Click on the filters icon at the top of the flex package explorer and uncheck some .* & .project

11. Create a .buildpath file right under the Flex Project and add the following content to it, take care not to overwrite the text in BOLD in your .project file:

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

<buildpath>

<buildpathentry kind=”src” path=”services”/>

<buildpathentry kind=”con” path=”org.eclipse.php.core.LANGUAGE”/>

</buildpath>

12. Update your project’s .project file to look like this:
<?xml version=“1.0″ encoding=“UTF-8″?>

<projectDescription>

<name>PdtFlexTest</name>

<comment></comment>

<projects>

</projects>

<buildSpec>

<buildCommand>

<name>org.eclipse.wst.validation.validationbuilder</name>

<arguments>

</arguments>

</buildCommand>

<buildCommand>

<name>org.eclipse.dltk.core.scriptbuilder</name>

<arguments>

</arguments>

</buildCommand>

<buildCommand>

<name>com.adobe.flexbuilder.project.flexbuilder</name>

<arguments>

</arguments>

</buildCommand>

</buildSpec>

<natures>

<nature>com.adobe.flexbuilder.project.flexnature</nature>

<nature>com.adobe.flexbuilder.project.actionscriptnature</nature>

<nature>org.eclipse.php.core.PHPNature</nature>

</natures>

<linkedResources>

<link>

<name>bin-debug</name>

<type>2</type>

<location>C:/projects/www/htdocs/PdtFlexTest-debug</location>

</link>

<link>

<name>services/TestService.php</name>

<type>1</type>

<location>C:/projects/www/htdocs/PdtFlexTest-debug/services/TestService.php</location>

</link>

</linkedResources>

</projectDescription>

13. Now click on the Debug menu and go to Debug configurations, create a new “PHP Web Page” debug configuration.

14. Click on debug, the browser will open and this debug session in PDT will wait for the service class to be invoked.

15. Now launch your flex application which uses this services, the PDT debugger should break at the first line of gateway.php. In case you would like the debugger to break on a breakpoint in the service class, uncheck the “Break at First Line” option in the Debug launch configuration and place a break point on the exact line in the service file where you would like the debugger to stop.

That’s all there is to it J. You can now edit your PHP code and Flex code in the same instance of eclipse. Full coloring, autocomplete and other PDT feature support for editing your PHP file in addition to all the awesome features of Flash Builder for editing you Flex applications J.

Enjoyyy!!!

How Service calls work in Flex

June 9th, 2009

Nice explanation by Tom Lane about the inherent async nature of all service calls in flex and how call responders help a user work with the results returned by such services calls.

<snip url=”http://forums.adobe.com/message/2017154#2017154″>

Let me take a shot at explaining asynchronous calls. Most PHP/CF/web developers are used to calling functions in one way only: synchronously. In ActionScript a sychronous function call looks like this:

var stuff = getStuff();

Pretty straightforward. It’s how you expect functions to work: you call them, and then immediately on line #2 of this example you have a value in the stuff variable to work with.

But when it comes to calling remote functions on services sitting on a server somewhere, Flex calls them asynchronously. This is so that the Flex client can continue working while the request is pending. An aync call looks more like this (at least, the first part):

responder.token = getStuffFromService();

What this means is, “stuff” does not come back right away as the result of the function. Instead, what it returns is a kind of ticket. Sort of like ordering some food from a lunch counter and getting a receipt with a number on it. You don’t get your food right away. Instead, you go hang out or do some other stuff while your order is pending, and then your number is called when it’s ready. And then you “respond” to your number.

Well, that’s what a CallResponder is. When you “place your order”, you hook up a CallResponder to it. When your order is ready (data comes back from the service call), the responder kicks into action. It fires a result event (or a fault if something went wrong), and it updates its bindable lastResult property.

So, if you want to work with data from an async call, you can’t simply do it on line #2 of the above snippet. You have to wait until the CallResponder for that call gets its result. If you create a databinding to lastResult, that will automatically update when the result is ready. But since you want to run some script on the result, you have to trigger that script from the CallResponder’s result event handler.

Does that help? Async is definitely a new concept for many web developers to wrap their heads around. But it lets you build some interesting UIs once you get the hang of it.

</snip>

Hope this helps …

Enjoyyy !!!

Howto: Use the update and delete methods of the generated sample code

June 6th, 2009

Related posts:

1. Howto: Connect a flex application to database (for PHP developers)
2. Howto: Use createItem method of the generated sample PHP file

The following video shows how simple it is to connect the PHP sample’s update and delete methods to your flex application.

http://my.adobe.acrobat.com/p77178814/

Now we have a fully functional CRUD application.

The next post will discuss how client side data management can take this CRUD application to the next level :) .

Enjoyyy!!!

Howto: Use createItem method of the generated sample PHP file

June 6th, 2009

The generated sample PHP in FB has 5 methods/functions:

  • getAllItems()
  • getItem($itemID)
  • createItem($item)
  • updateItem($item)
  • count()
  • getItems_paged($startIndex, $numItems)

These methods help you easily use the client side data management functionalities of FB. Before we reach the final goal of using client side data management, we’ll explore how these methods would be used conventionally.

My previous post explained how you can connect to the getAllItems() method of the generated file. This post I’ll explain how to configure and use the createItem method.

Video – http://my.adobe.acrobat.com/p15003296/

Next post I’ll cover delete and update.

Enjoyyy!!!

Howto: Enable Automatic Paging in Flex Applications for Any Kind of Service

June 3rd, 2009

Nice post from Sujit -> http://sujitreddyg.wordpress.com/2009/06/03/built-in-data-paging-using-flash-builder-4/

The post takes PHP as a sample service, the same workflow holds good for all services in Flash Builder. One of the cool benefits of using Services and DCD workflow in Flash Builder 4.

One point to note while trying to enable paging for functions you write on your own. For PHP & CF, the operation should contain two parameters startIndex and numItems as the last two parameters of the operation. Their types should be number/int.

getItems_paged($startIndex, $numItems)

For Java the name restriction is relaxed, but the type of the last two parameters should be int.

Once paging is enabled for an operation,  the data will be paged automatically by the flex controls! How cool is that :) . Paging enabled operations can then be bound to data-driven controls like datagrid, list controls, combo box, advanced data grid and tree. These controls take care of asking of invoking the paging enabled operation to fetch the required data.

Short video (http://my.adobe.acrobat.com/p27433395/) showing the paging enabled operation working with a tree :) .

Enjoyyy!!!

[Bookmark This Page] Aggregation of Flash Builder 4 Blog Posts

June 3rd, 2009

My colleague and good friend, Sujit  is aggreagating some of the very cool tutorials, articles and feature walk-through posts by the Flash Builder & Evangelism teams. Be sure you book mark it. You can see it here:

http://sujitreddyg.wordpress.com/flash-builder-4/