SYS-CON Media
 Register Now!
Save $200
Register before October 17th to SAVE! ... and also receive a FREE copy of the Best-Selling AJAX Book, a $119 Value!
Untitled Document
2008 East
Platinum Sponsor
Untitled Document
2008 East Gold Sponsors
Untitled Document
2008 East Exhibitors
Untitled Document
2008 East Media Sponsors
Untitled Document
2008 Association Sponsor
SYS-CON Media
2007 West Sponsors
Goingtomeet.com Conference Directory
SYS-CON Media
2007 East Sponsors
Untitled Document
2008 SYS-CON Events

Can't Miss RSS Feed
Subscribe to the AJAXWorld.com RSS Feed & Get All The Conference News As It Happens!

2008: Decision Year for RIAs - October 20-22, 2008 San Jose


Web and Mobile Convergence Sharing Data Between Flex 2 and Flash Lite
Developing a blog aggregator

I love the definition in Wikipedia of Media convergence: "Media convergence is a theory in communications where every mass medium eventually merges to the point where they are indistinguishable to each other due to the advent of new communication technologies."

According to the theory of media convergence, very soon, there will be no more need to have a television and a computer separate from each other, since both would be able to do the job of the other, ultimately making both extinct and creating a new medium from the synthesis."

Even though the prospect of a complete merger among "traditional" media is still far away, the fact that we have access to content on multiple devices (internet, cellular phone, PDA, television) already enhances the usefulness that such content provides to users.

Adding to Wikipedia's definition, convergence also involves the possibility of deploying content through different channels from a unique source in a simple, quick, and cost-effective way, such as the one allowed by the use of Flex, which I attempt to describe in this article.

Nowadays, we have all the technologies that permit developers to create cross-device applications. By sharing and accessing the same remote data (via a database connection, using simple text file or feeding XML), it's possible to have interchangeable content and use them via a mobile phone rather than via a Web application.

Flex 2 and Flash Lite Together
Soon the next generation of Adobe's technology will allow developers to deploy their Flex (under SWF format) applications out of the browser, directly through the desktop.

For those who have never heard about Apollo, this is the definition given by Adobe: "Apollo is the code name for a cross-operating system run-time being developed by Adobe that allows developers to leverage their existing Web development skills (Flash, Flex, HTML, JavaScript, Ajax) to build and deploy Rich Internet Applications (RIAs) to the desktop" (http://labs.adobe.com/wiki/index.php/Apollo:developerfaq).

While waiting for this killer application, we can now use Flex 2 to create a rich interactive Web application that will add and edit remote data. The same remote data is then served and consumed by a mobile application developed in Flash Lite. In this article, we'll see how to create a Flex 2 blog aggregator where users will be able to add, view, and save their favorite RSS feeds.

Each blog post can be bookmarked and stored by users and then viewed under a Flash Lite application. Let's see how it works.

The Database and the PHP Remote Services
To start, create the database that you'll use to store all the blog feeds data saved by the user. I chose MySql database, but you can use whatever you like. I called my db "rssimport". Next, create three tables that will hold the user data. Here is the SQL structure for our tables:

CREATE TABLE `bookmarks` (
    `id` int(11) NOT NULL auto_increment,
    `id_news` int(11) NOT NULL,
    PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=6 ;

This table contains a reference to the news table:

CREATE TABLE `rss_news` (
    `id` bigint(20) NOT NULL auto_increment,
    `id_sito` int(11) NOT NULL default '0',
    `category` varchar(20) default '0',
    `title` varchar(255) NOT NULL default '',
    `summary` text,
    `pub_date` int(11) NOT NULL default '0',
    `link` varchar(255) NOT NULL default '',
    `creator` varchar(100) NOT NULL default '',
    PRIMARY KEY (`id`),
    KEY `link` (`link`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=36;

This table is populated by a Cron service. Cron is the name of a program that enables UNIX users to execute commands or scripts (groups of commands) automatically at a specified time/date. It's normally used for sysadmin commands. In our example, we use a Cron service to retrieve blog posts from the different blogs found on "testate" table:

CREATE TABLE `testate` (
    `id` int(11) NOT NULL auto_increment,
    `nome_testata` varchar(50) NOT NULL default '',
    `preview` varchar(255) default NULL,
    `url` varchar(100) NOT NULL default '',
    PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=5 ;

The database is done. We've got our tables, so now create the PHP scripts that will add blogs to the database, retrieve information over blogs, save posts, and export all the data in the XML that the Flex application will consume. The PHP services are pretty simple, but they're large. You can download all the files here:

http://88.149.156.198/develop/rssToDb/phpservices.zip

This package contains four PHP files. These are the files called by the Flex's RPC service. All PHP files return values in a proper XML format. In fact, data must be encoded in XML in order to pass them to Flex.

Commenting the PHP file is out of the scope of this article, but if you develop in PHP, the code should be self explanatory. If you're not a PHP developer, don't worry - you'll be able to finish the application and make all the code work anyhow.

Developing the Flex 2 Blog Aggregator
It's now time to start building the Web interface that will allow users to add and save their favorite blogs. Create a new Flex project in Flex Builder 2 (File > New > Flex Project) and give it a name. I've called mine "BlogRoll."

Automatically, some files and folders have been created by Flex Builder 2. The most important ones are the bin folder, where Flex Builder puts all the compiled code and the main MXML application file.

We need to create another folder and name it "components." This is the folder where external MXML Components will be stored. To create a new folder in the context of the project, go to File > New > Folder. Our main application is made up of a TabNavigator container that houses two states for adding and viewing blogs. The TabNavigator is a navigation container that creates and manages the set of tabs used to navigate among its children. The children of a TabNavigator container are other containers.

The container automatically creates a tab for each of its children and determines the tab text from the label property of the child, and the tab icon from the icon property of the child.

When a TabNavigator gets the focus, the Flash Player processes keystrokes as described in Table 1 (see the Flex 2 LiveDocs to learn more):

Let's write some MXML code to create our interface. Use the BlogRoll.mxml file that Flex Builder has previously created when you defined your project. Let's examine in detail the code for the main application file:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="vertical"
    xmlns:cust="components.*"
    creationComplete="hs.send()"
    themeColor="haloSilver"
    pageTitle="Blog Aggregator - Developed by Marco Casario for WebDDJ" >

We start creating the application tag where we defined a customized namespace:

xmlns:cust="components.*"

This is the package where we'll insert our MXML components (it points to the folder we previously created). Then we call the send() method of the HTTPService to populate the Datagrid. The method triggers after all the user interface elements are loaded on the creationComplete event, as shown in Listing 1.

This is where we set up the HTTPService and call two PHP remote services: rss.php and add.php. The former returns all the posts that users saved. It accepts one parameter defined inside the <mx:request xmlns=""> tag to indicate the quantity of posts returned by the function: 10, 20 or 30 posts. Then on the result event, it populates the "listAC" ArrayCollection with data returned by the response.

The second PHP service - add.php - receives the name and the URL of the blog inserted by the user. The two variables - blog_name and url_blog - are set to the text attribute of the two TextInput with id "frm_name" and "frm_url". The HTTPService handles the result and the fault events. For both services, we use the POST method to send data, as shown in Listing 2.

I strongly commented the Actionscript code, as shown in Listing 3, so we could go ahead.

We put a <mx:TabNavigator> inside a panel. The TabNavigator has two children. On the first Vbox child, we need to create a simple form that contains the two Text Input elements: frm_name and frm_url.

At the end of the form, we placed a Submit button that calls the send() method of the HTTPService with the addBlog id. This remote service stores the name and the URL of the blog added by the users and puts it into the MySQL database (see Figure 1).

The second child of the TabNavigator is made up of a simple Label, a Combo Box, and an MXML Component. The ComboBox is populated by the ArrayCollection "myArray" defined as a nested tag:

<mx:ComboBox id="myCombo" change="changeHandler()" creationComplete="init();myCombo.selectedIndex=0" >
    <mx:ArrayCollection id="myArray">
       <mx:Object label="20 posts" data="20"/>
       <mx:Object label="30 posts" data="30"/>
    </mx:ArrayCollection>
</mx:ComboBox>

When the user selects an option from the combo box, the changeHandler() function is called. The creationComplete event triggers the init() function and the the index of the combobox is set up to the first element.

The MXML Component's invocation uses the "cust" namespace defined on the application tag. The "lista" property is passed to the component, and it contains the data returned by the HTTPService request:

<cust:custBlogData width="100%" lista="{hs.lastResult.rss.channel.item}" />

The code of the custBlogData.mxml file saved in the "components" folder is shown in Listing 4.The file's role is to display the titles and links of all blogs added by the users. The DataGrid populates itself with the lista property (data typed as ArrayCollection) that we get from the HTTPService. It shows two columns that display the title and link property contained into the complex lista object:

<mx:DataGridColumn headerText="Posts" dataField="title" width="150" />
<mx:DataGridColumn headerText="Link" dataField="link" />

At the end, a Hbox container surrounds a label and a Button that, if clicked, calls the send() method of the HTTPService:

<mx:HTTPService
    id="saveHS"
    url="http://88.149.156.198/develop/rssToDb/savenews.php"
    useProxy="false"
    method="POST"
    result="linkHandler(event)"
    fault="faultHandler(event)">

    <mx:request xmlns="">
    <url>{myDG.selectedItem.link}</url>
    </mx:request>
      </mx:HTTPService>


About Marco Casario
Marco Casario is CEO of Comtaste, a company devoted to develop Rich Internet Applications on the Web and for mobile devices.

He collaborates intensively with Adobe Italy as a speaker at conferences and as a consultant for Flash, Flex, and Flash Lite.

Learn more about Marco Casario at his blog http://casario.blogs.com. In 2005, Marco has founded Comtaste, a company dedicated to exploring new frontiers in Rich Internet Applications and the convergence between the web and the world of mobile devices — MobyMobile and YouThru are representative of their recent work. He is founder of the biggest worldwide Flash Lite User Group and of www.augitaly.com, a reference point for the Italian community of Adobe users, in which he carries out the role of Channel Manager for the section dedicated to Flex.

In order to post a comment you need to be registered and logged in.

Register | Sign-in

Reader Feedback: Page 1 of 1

Here is the page that you asked me to find. It is 3 reviews about Motorola Krzr K1 in it.
http://skyhaifa.com/reviewes.php?cat_id=19&model=nokia-n93
Motorola Krzr K1

Here is the page that you asked me to find. It is 3 reviews about Motorola Krzr K1 in it.
http://skyhaifa.com/reviewes.php?cat_id=19&model=nokia-n93
Motorola Krzr K1


Latest AJAXWorld RIA Stories
CloudEXPO New York 2018, colocated with DXWorldEXPO New York 2018 will be held November 11-13, 2018, in New York City and will bring together Cloud Computing, FinTech and Blockchain, Digital Transformation, Big Data, Internet of Things, DevOps, AI, Machine Learning and WebRTC to...
Disruption, Innovation, Artificial Intelligence and Machine Learning, Leadership and Management hear these words all day every day... lofty goals but how do we make it real? Add to that, that simply put, people don't like change. But what if we could implement and utilize these e...
DXWorldEXPO | CloudEXPO are the world's most influential, independent events where Cloud Computing was coined and where technology buyers and vendors meet to experience and discuss the big picture of Digital Transformation and all of the strategies, tactics, and tools they need t...
Enterprises are striving to become digital businesses for differentiated innovation and customer-centricity. Traditionally, they focused on digitizing processes and paper workflow. To be a disruptor and compete against new players, they need to gain insight into business data and...
Digital Transformation: Preparing Cloud & IoT Security for the Age of Artificial Intelligence. As automation and artificial intelligence (AI) power solution development and delivery, many businesses need to build backend cloud capabilities. Well-poised organizations, marketing sm...
Untitled Document

Call 201 802-3020 or Click Here to Save $200!

Register Today and
Save $200

Your registrations includes: Golden Pass Delegates will receive full conference access on October 20-22, 2008 including: Lunch and Coffee Breaks, Collectible Bag and Archives of all sessions on DVD. Includes access to all Conference Sessions including the Technical Sessions, Exhibits, Keynotes, Vendor Technology Presentations, and Power Panels.


Sponsorship Opportunities

AJAXWorld offers the undisputed best platform to position your company as a leading vendor in the fast-emerging marketplace for AJAX and Enterprise Web 2.0.


Please call
(201)802-3020


Who Should Attend?

 CTOs & VPs of Engineering
 Directors of Technology
 Sr. User Interface Architects
 Front-End Engineers
 VCs & Industry Analysts
 Directors of Business Development
 Software Engineers
 Senior Architects
 Application Programmers & Software Developers
 Project Managers
 Web Programmers & Designers
 Companies & Organizations that need to stay in
  front of the latest Web technology

AJAXWorld Security Bootcamp

Introducing at AJAXWorld RIA Conference 2008 West the world's first-ever full, one-day immersive "AJAX Security Bootcamp" - led by one of the world's foremost AJAX security experts and teachers, HP's Billy Hoffman.

View the full one-day schedule



AJAXWorld 2008 West - Tracks

Track 01: Enterprise RIAs
Track 02: Frameworks & Toolkits
Track 03: Web 2.0 & Mashups
Track 04: Hot Topics
Track 05: The Future of the Web
Track 06: iPhone Developer Summit



Brought To You By:

AJAXWorld Magazine is the pre-eminent independent vendor-neutral resource for the fastest growing new segment of the software business: entirely Web-based applications and experiences.

Download the Latest Issue!

AJAXWorld Webcasts



SYS-CON EVENTS


AJAXWorld Keynotes & Power Panels

2008 SYS-CON TV Keynotes: Can We Fix the Web? By Douglas Crockford - by Douglas Crockford
2008 SYS-CON TV Keynotes: 2008: The Year of the RIA - by Anthony Franco
2008 SYS-CON TV Power Panel: The Business Value of RIAs
2008 SYS-CON TV Power Panel: What Lies Beyond AJAX
2007 SYS-CON TV Keynotes: Why Web 2.0 for the Enterprise Is Far More Than Just a Facelift - by Ted Farrell
2007 SYS-CON TV Keynotes: Fueling the Next Generation Web: A Peek Behind the Green Curtain - by Bob Brewin
2007 SYS-CON TV Keynotes: AJAX in the Balance - by Joe Stagner

AJAXWorld Sessions on SYS-CON.TV

· Bill Scott - Yahoo! UI Library
· David Heinemeier Hansson - AJAX on Rails
· Jesse James Garrett - Elements of User Experience
· Dion Hinchcliffe - Real World AJAX
· Eric Miraglia - Open Source AJAX Development
· Paul Rademacher - Mashing Up Your Web Application
· Adam Sah - Google Gadgets
· Doug Crockford - An Introduction to JavaScript
· David Linthicum - Enterprise Web 2.0
· Patrick Grady - The Imagination & Experience Web

AJAXWorld...All The AJAX Rock Stars in One Spot!


Past Events Archive

SOAWorld Conference & Expo 2008 East
soa2008east.sys-con.com
Virtualization Conference & Expo 2008 East
virt2008east.sys-con.com
AJAXWorld 2008 Conference & Expo East
ajaxmar08.sys-con.com
SOAWorld Conference & Expo 2007 West
www.soaworld2007.com
Virtualization Conference & Expo 2007 West
virt2007west.sys-con.com
AJAXWorld 2007 Conference & Expo West
ajaxoct07.sys-con.com
SOAWorld Conference & Expo 2007 East
soa2007east.sys-con.com
Virtualization Conference & Expo 2007 East
virt2007east.sys-con.com
AJAXWorld 2007 Conference & Expo East
ajaxmarch07.sys-con.com
Other SYS-CON Events
events.sys-con.com

Join Over 10,000 Early AJAX Adopters
Who Have Attended AJAXWorld
• A&R Edelman
• Academic Enterprise
• Accoona Corp [2 delegates]
• Acxiom
• Adams Capital Management
• Adaptive Edge
• Adaptive Path
• Adobe Systems Incorporated [21 delegates]
• Adobe Systems Romania
• Ajax13
• All Risks, Ltd.
• alliance
• Alliance For Community Care
• AlphaDetail Inc
• Altera Corporation
• Amazon.com [6 delegates]
• Appeon Corporation [2 delegates]
• Apple Computer [5 delegates]
• Apress [3 delegates]
• Arkivio
• ASA
• Astute Solutions
• Avaya Inc [2 delegates]
• Avenda Systems
• Avenue A | Razorfish [3 delegates]
• Axcella, LLC [2 delegates]
• Aximsoft
• Azimyth
• Backbase USA Inc. [4 delegates]
• BAE Systems [2 delegates]
• Bank of America [2 delegates]
• Barkley Evergreen & Partners Interactive
• Bayview Financial [2 delegates]
• BEA Systems [3 delegates]
• Billeo
• BMC Software, Inc. [2 delegates]
• Borland Software Corporation
• Bradford Technologies, Inc [2 delegates]
• Brilliance
• Brocade Communications Systems, Inc. [2 delegates]
• Brookside Capital LLC
• Brulant
• Bungee Labs, Inc [6 delegates]
• Bureau of Labor Statistics
• BUZ Interactive
• Cadena Software
• Calix Networks
• Callidus Software [2 delegates]
• Cambia Security
• Carnegie Mellon West
• Cautella, Inc.
• CBSA
• Celequest [3 delegates]
• Change Vision, Inc.
• Charles E. Kenney, CPA
• Charles Schwab & Co., Inc. [8 delegates]

   read more...


ADVERTISE   |   MAGAZINE SUBSCRIPTIONS   |   FREE BREAKING-NEWSLETTERS!   |   SYS-CON.TV   |   BLOG-N-PLAY!   |   WEBCAST   |   EDUCATION   |   RESEARCH

.NET Developer's Journal - .NETDJ   |   ColdFusion Developer's Journal - CFDJ   |   Eclipse Developer's Journal - EDJ   |   Enterprise Open Source Magazine - EOS
Open Web Developer's Journal - OPEN WEB   |   iPhone Developer's Journal - iPHONE   |   Virtualization - Virtualization   |   Java Developer's Journal - JDJ   |   Linux.SYS-CON.com
PowerBuilder Developer's Journal - PBDJ   |   SEO / SEM Journal - SJ   |   SOAWorld Magazine - SOAWM   |   IT Solutions Guide - ITSG   |   Symbian Developer's Journal - SDJ
WebLogic Developer's Journal - WLDJ   |   WebSphere Journal - WJ   |   Wireless Business & Technology - WBT   |   XML-Journal - XMLJ   |   Internet Video - iTV
Flex Developer's Journal - Flex   |   AJAXWorld Magazine - AWM   |   Silverlight Developer's Journal - SLDJ   |   PHP.SYS-CON.com   |   Web 2.0 Journal - WEB2

SYS-CON MEDIA:   ABOUT US   |   CONTACT US   |   COMPANY NEWS   |   CAREERS   |   SITE MAP
SYS-CON EVENTS  |  AJAXWorld Conference & Expo  |  iPhone Developer Summit  |  OpenWeb Developer Summit  |  SOA World Conference & Expo  |  Virtualization Conference & Expo
INTERNATIONAL SITES:   India  |  U.K.  |  Canada  |  Germany  |  France  |  Australia  |  Italy  |  Spain  |  Netherlands  |  Brazil  |  Belgium
 Terms of Use & Our Privacy Statement     About Newsfeeds / Video Feeds
Copyright ©1994-2008 SYS-CON Publications, Inc. All Rights Reserved. All marks are trademarks of SYS-CON Media.
Reproduction in whole or in part in any form or medium without express written permission of SYS-CON Publications, Inc. is prohibited.