Welcome!

Adobe Flex Authors: Matthew Lobas, PR.com Newswire, Shelly Palmer, Kevin Benedict

Related Topics: Adobe Flex, Java IoT, ColdFusion, FlexSeminar.com

Adobe Flex: Article

"Real-World Flex" by Adobe's Christophe Coenraets

Tips and tricks from Adobe's intrepid Flex Evangelist

Some people take the dog for a walk, other go play a round of golf. Not Christophe Coenraets. His idea of a good time is to illustrate Flex and JMS integration by extending a simple "realtime feed" application that he built a while back! Web Developer's & Designer's Journal is proud to bring you each month two of the month's best tips from Adobe's intrepid Flex Hero.

Using Flex 2 with Flash Media Server
I recently built a proof of concept that included a call center integration scenario. The use case revolved around a user getting stuck while trying to complete an online process, and engaging in a real time collaboration session with a customer services representative to sort out the problem.

The nature of the collaboration between the end-user and the support representative was very rich and included the following features:

  1. Chat
  2. Videoconference / video chat
  3. The support representative was able to "drive" the end-user's UI
  4. The support representative was also able to remotely fill in the user's form. In other words, data typed in the support rep's application automatically appeared (in real time) in the user's app.
From the end-user point of view, all this was done "in context" without ever leaving the application, and without starting any other application.

The application turned out to be really easy to implement with Flex 2:

  • Features (1) and (3) were enabled by the new Message Service in Flex 2.
  • Feature (4) was enabled by the Data Services in Flex 2. Using the data services, two clients can point to the same destination (the same data set). Changes made by one client are automatically reflected in the other client. No code required!
  • Feature (2) was enabled by the Flash Media Server.
Here's a simple example of how to integrate Flex and Flash Media Server to support rich media streaming and video-conferencing. This is surprisingly easy to do with just a few lines of code.

To run this example you will have to:

  1. Install FlexBuilder 2. You can download the beta here: http://labs.adobe.com/.
  2. Install the Flash Media Server (you can download a free developer edition here: www.adobe.com/products/flashmediaserver/
  3. Download the sample application code here: http://coenraets.com/apps/fms.zip
  4. In C:\Program Files\Macromedia\Flash Media Server 2\applications\flex_videoconference, create a directory called flex_videoconference and copy the main.asc file in that directory
  5. Create a FlexBuilder project and copy fms.mxml and VideoContainer.as in that project
  6. Run fms.mxml
The application starts your webcam, publishes the captured video stream to Flash Media Server.and then "plays" the video streamed by Flash Media Sever in a second video component.

Embedding HTML in a Flex Application using an IFrame
I have recently been involved in several projects where there was a need to embed HTML content in a Flex application. Depending on the specific requirements of your application, there are a couple of approaches you can use...

  1. The Flex Text components (Label, Text, TextArea) support basic HTML formatting through their htmlText attribute. You can find an example of this approach in the Samples Explorer where the Code Viewer uses the HTML capabilities of the TextArea to provide syntax coloring.
  2. You can embed a Flex application in a page that also contains traditional HTML. The Flex application can communicate with the HTML document (and the other way around) through JavaScript. You can also embed multiple Flex applications in a page. These applications can then communicate directly with each others using the LocalConnection API.
Note: I am not advocating that you use this technique as your default approach to combine Flex and HTML content. Depending on your application, the approaches (1) and (2) described above may represent a better solution. If these approaches don't meet your specific requirements, the technique implemented in the attached example can be very useful.

In some cases, these approaches may not go far enough: You may need a single Flex application that embeds HTML content with no restriction in terms of HTML tags and features supported.

In this case, another approach is to position an IFrame on top of a specific area of your Flex application to provide a container for the HTML content which will then appear embedded in the application. This technique may initially sound complex or cumbersome to implement, especially if the different containers of your Flex application resize dynamically and you have to keep the IFrame in sync. In the attached example, I abstracted the complexity of this approach in an IFrame component written in mxml. The IFrame component extends Canvas and is used like any other Flex container. Behind the scenes, it acts as a proxy for the actual HTML IFrame (Figure 1). For example, when the IFrame component is resized or moved it automatically asks the HTML document to resize/move the actual IFrame.

More Stories By Christophe Coenraets

Christophe Coenraets currently works as a Senior Technical Evangelist at Adobe. Before joining Adobe, Christophe was an evangelist at Macromedia, focusing on Rich Internet Applications and Enterprise integration. Prior to Macromedia, Christophe was the head of Java and J2EE Technical Evangelism at Sybase, where he started working on Java Enterprise projects in 1996. Before joining Sybase in the US, Christophe held different positions at Powersoft in Belgium, including Principal Consultant for PowerBuilder, and Manager of the Professional Services organization. Before joining Powersoft, Christophe worked as a developer and architect on several retail and BPM projects. Christophe has been a regular speaker at conferences worldwide for the last 10 years.

Comments (3) View Comments

Share your thoughts on this story.

Add your comment
You must be signed in to add a comment. Sign-in | Register

In accordance with our Comment Policy, we encourage comments that are on topic, relevant and to-the-point. We will remove comments that include profanity, personal attacks, racial slurs, threats of violence, or other inappropriate material that violates our Terms and Conditions, and will block users who make repeated violations. We ask all readers to expect diversity of opinion and to treat one another with dignity and respect.


Most Recent Comments
SShah 06/14/06 05:02:53 AM EDT

Hello,

i have tried this example but getting the error that NetConnection object cannot be connected.Can anyone help me resolve this issue.

Web Developer's & Designer's Journal 05/22/06 04:16:47 PM EDT

Some people take the dog for a walk, other go play a round of golf. Not Christophe Coenraets. His idea of a good time is to illustrate Flex and JMS integration by extending a simple 'realtime feed' application that he built a while back! Web Developer's & Designer's Journal is proud to bring you each month two of the month's best tips from Adobe's intrepid Flex Hero.

Web Developer's & Designer's Journal 05/22/06 03:30:48 PM EDT

Some people take the dog for a walk, other go play a round of golf. Not Christophe Coenraets. His idea of a good time is to illustrate Flex and JMS integration by extending a simple 'realtime feed' application that he built a while back! Web Developer's & Designer's Journal is proud to bring you each month two of the month's best tips from Adobe's intrepid Flex Hero.

@ThingsExpo Stories
SYS-CON Events announced today that Dasher Technologies will exhibit at SYS-CON's 21st International Cloud Expo®, which will take place on Oct 31 - Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. Dasher Technologies, Inc. ® is a premier IT solution provider that delivers expert technical resources along with trusted account executives to architect and deliver complete IT solutions and services to help our clients execute their goals, plans and objectives. Since 1999, we'v...
SYS-CON Events announced today that NetApp has been named “Bronze Sponsor” of SYS-CON's 21st International Cloud Expo®, which will take place on Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. NetApp is the data authority for hybrid cloud. NetApp provides a full range of hybrid cloud data services that simplify management of applications and data across cloud and on-premises environments to accelerate digital transformation. Together with their partners, NetApp emp...
SYS-CON Events announced today that IBM has been named “Diamond Sponsor” of SYS-CON's 21st Cloud Expo, which will take place on October 31 through November 2nd 2017 at the Santa Clara Convention Center in Santa Clara, California.
SYS-CON Events announced today that TidalScale, a leading provider of systems and services, will exhibit at SYS-CON's 21st International Cloud Expo®, which will take place on Oct 31 - Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. TidalScale has been involved in shaping the computing landscape. They've designed, developed and deployed some of the most important and successful systems and services in the history of the computing industry - internet, Ethernet, operating s...
Infoblox delivers Actionable Network Intelligence to enterprise, government, and service provider customers around the world. They are the industry leader in DNS, DHCP, and IP address management, the category known as DDI. We empower thousands of organizations to control and secure their networks from the core-enabling them to increase efficiency and visibility, improve customer service, and meet compliance requirements.
SYS-CON Events announced today that IBM has been named “Diamond Sponsor” of SYS-CON's 21st Cloud Expo, which will take place on October 31 through November 2nd 2017 at the Santa Clara Convention Center in Santa Clara, California.
Join IBM November 1 at 21st Cloud Expo at the Santa Clara Convention Center in Santa Clara, CA, and learn how IBM Watson can bring cognitive services and AI to intelligent, unmanned systems. Cognitive analysis impacts today’s systems with unparalleled ability that were previously available only to manned, back-end operations. Thanks to cloud processing, IBM Watson can bring cognitive services and AI to intelligent, unmanned systems. Imagine a robot vacuum that becomes your personal assistant tha...
In a recent survey, Sumo Logic surveyed 1,500 customers who employ cloud services such as Amazon Web Services (AWS), Microsoft Azure, and Google Cloud Platform (GCP). According to the survey, a quarter of the respondents have already deployed Docker containers and nearly as many (23 percent) are employing the AWS Lambda serverless computing framework. It’s clear: serverless is here to stay. The adoption does come with some needed changes, within both application development and operations. Tha...
In his Opening Keynote at 21st Cloud Expo, John Considine, General Manager of IBM Cloud Infrastructure, will lead you through the exciting evolution of the cloud. He'll look at this major disruption from the perspective of technology, business models, and what this means for enterprises of all sizes. John Considine is General Manager of Cloud Infrastructure Services at IBM. In that role he is responsible for leading IBM’s public cloud infrastructure including strategy, development, and offering ...
SYS-CON Events announced today that Avere Systems, a leading provider of enterprise storage for the hybrid cloud, will exhibit at SYS-CON's 21st International Cloud Expo®, which will take place on Oct 31 - Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. Avere delivers a more modern architectural approach to storage that doesn't require the overprovisioning of storage capacity to achieve performance, overspending on expensive storage media for inactive data or the overbui...
Widespread fragmentation is stalling the growth of the IIoT and making it difficult for partners to work together. The number of software platforms, apps, hardware and connectivity standards is creating paralysis among businesses that are afraid of being locked into a solution. EdgeX Foundry is unifying the community around a common IoT edge framework and an ecosystem of interoperable components.
SYS-CON Events announced today that TidalScale will exhibit at SYS-CON's 21st International Cloud Expo®, which will take place on Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. TidalScale is the leading provider of Software-Defined Servers that bring flexibility to modern data centers by right-sizing servers on the fly to fit any data set or workload. TidalScale’s award-winning inverse hypervisor technology combines multiple commodity servers (including their ass...
SYS-CON Events announced today that N3N will exhibit at SYS-CON's @ThingsExpo, which will take place on Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. N3N’s solutions increase the effectiveness of operations and control centers, increase the value of IoT investments, and facilitate real-time operational decision making. N3N enables operations teams with a four dimensional digital “big board” that consolidates real-time live video feeds alongside IoT sensor data a...
As hybrid cloud becomes the de-facto standard mode of operation for most enterprises, new challenges arise on how to efficiently and economically share data across environments. In his session at 21st Cloud Expo, Dr. Allon Cohen, VP of Product at Elastifile, will explore new techniques and best practices that help enterprise IT benefit from the advantages of hybrid cloud environments by enabling data availability for both legacy enterprise and cloud-native mission critical applications. By rev...
With major technology companies and startups seriously embracing Cloud strategies, now is the perfect time to attend 21st Cloud Expo October 31 - November 2, 2017, at the Santa Clara Convention Center, CA, and June 12-14, 2018, at the Javits Center in New York City, NY, and learn what is going on, contribute to the discussions, and ensure that your enterprise is on the right path to Digital Transformation.
Join IBM November 1 at 21st Cloud Expo at the Santa Clara Convention Center in Santa Clara, CA, and learn how IBM Watson can bring cognitive services and AI to intelligent, unmanned systems. Cognitive analysis impacts today’s systems with unparalleled ability that were previously available only to manned, back-end operations. Thanks to cloud processing, IBM Watson can bring cognitive services and AI to intelligent, unmanned systems. Imagine a robot vacuum that becomes your personal assistant th...
Digital transformation is changing the face of business. The IDC predicts that enterprises will commit to a massive new scale of digital transformation, to stake out leadership positions in the "digital transformation economy." Accordingly, attendees at the upcoming Cloud Expo | @ThingsExpo at the Santa Clara Convention Center in Santa Clara, CA, Oct 31-Nov 2, will find fresh new content in a new track called Enterprise Cloud & Digital Transformation.
Most technology leaders, contemporary and from the hardware era, are reshaping their businesses to do software. They hope to capture value from emerging technologies such as IoT, SDN, and AI. Ultimately, irrespective of the vertical, it is about deriving value from independent software applications participating in an ecosystem as one comprehensive solution. In his session at @ThingsExpo, Kausik Sridhar, founder and CTO of Pulzze Systems, will discuss how given the magnitude of today's applicati...
Smart cities have the potential to change our lives at so many levels for citizens: less pollution, reduced parking obstacles, better health, education and more energy savings. Real-time data streaming and the Internet of Things (IoT) possess the power to turn this vision into a reality. However, most organizations today are building their data infrastructure to focus solely on addressing immediate business needs vs. a platform capable of quickly adapting emerging technologies to address future ...
SYS-CON Events announced today that Golden Gate University will exhibit at SYS-CON's 21st International Cloud Expo®, which will take place on Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA. Since 1901, non-profit Golden Gate University (GGU) has been helping adults achieve their professional goals by providing high quality, practice-based undergraduate and graduate educational programs in law, taxation, business and related professions. Many of its courses are taug...