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
trust and privacy in their ecosystem. Assurance and protection of device identity, secure data encryption and authentication are the key security challenges organizations are trying to address when integrating IoT devices. This holds true for IoT applications in a wide range of industries, for example, healthcare, consumer devices, and manufacturing. In his session at @ThingsExpo, Lancen LaChance, vice president of product management, IoT solutions at GlobalSign, will teach IoT developers how t...
So, you bought into the current machine learning craze and went on to collect millions/billions of records from this promising new data source. Now, what do you do with them? Too often, the abundance of data quickly turns into an abundance of problems. How do you extract that "magic essence" from your data without falling into the common pitfalls? In her session at @ThingsExpo, Natalia Ponomareva, Software Engineer at Google, will provide tips on how to be successful in large scale machine lear...
The IoTs will challenge the status quo of how IT and development organizations operate. Or will it? Certainly the fog layer of IoT requires special insights about data ontology, security and transactional integrity. But the developmental challenges are the same: People, Process and Platform. In his session at @ThingsExpo, Craig Sproule, CEO of Metavine, will demonstrate how to move beyond today's coding paradigm and share the must-have mindsets for removing complexity from the development proc...
Increasing IoT connectivity is forcing enterprises to find elegant solutions to organize and visualize all incoming data from these connected devices with re-configurable dashboard widgets to effectively allow rapid decision-making for everything from immediate actions in tactical situations to strategic analysis and reporting. In his session at 18th Cloud Expo, Shikhir Singh, Senior Developer Relations Manager at Sencha, will discuss how to create HTML5 dashboards that interact with IoT devic...
Artificial Intelligence has the potential to massively disrupt IoT. In his session at 18th Cloud Expo, AJ Abdallat, CEO of Beyond AI, will discuss what the five main drivers are in Artificial Intelligence that could shape the future of the Internet of Things. AJ Abdallat is CEO of Beyond AI. He has over 20 years of management experience in the fields of artificial intelligence, sensors, instruments, devices and software for telecommunications, life sciences, environmental monitoring, process...
You think you know what’s in your data. But do you? Most organizations are now aware of the business intelligence represented by their data. Data science stands to take this to a level you never thought of – literally. The techniques of data science, when used with the capabilities of Big Data technologies, can make connections you had not yet imagined, helping you discover new insights and ask new questions of your data. In his session at @ThingsExpo, Sarbjit Sarkaria, data science team lead ...
SYS-CON Events announced today that Ericsson has been named “Gold Sponsor” of SYS-CON's @ThingsExpo, which will take place on June 7-9, 2016, at the Javits Center in New York, New York. Ericsson is a world leader in the rapidly changing environment of communications technology – providing equipment, software and services to enable transformation through mobility. Some 40 percent of global mobile traffic runs through networks we have supplied. More than 1 billion subscribers around the world re...
We're entering the post-smartphone era, where wearable gadgets from watches and fitness bands to glasses and health aids will power the next technological revolution. With mass adoption of wearable devices comes a new data ecosystem that must be protected. Wearables open new pathways that facilitate the tracking, sharing and storing of consumers’ personal health, location and daily activity data. Consumers have some idea of the data these devices capture, but most don’t realize how revealing and...
We’ve worked with dozens of early adopters across numerous industries and will debunk common misperceptions, which starts with understanding that many of the connected products we’ll use over the next 5 years are already products, they’re just not yet connected. With an IoT product, time-in-market provides much more essential feedback than ever before. Innovation comes from what you do with the data that the connected product provides in order to enhance the customer experience and optimize busi...
In his session at @ThingsExpo, Chris Klein, CEO and Co-founder of Rachio, will discuss next generation communities that are using IoT to create more sustainable, intelligent communities. One example is Sterling Ranch, a 10,000 home development that – with the help of Siemens – will integrate IoT technology into the community to provide residents with energy and water savings as well as intelligent security. Everything from stop lights to sprinkler systems to building infrastructures will run ef...
Manufacturers are embracing the Industrial Internet the same way consumers are leveraging Fitbits – to improve overall health and wellness. Both can provide consistent measurement, visibility, and suggest performance improvements customized to help reach goals. Fitbit users can view real-time data and make adjustments to increase their activity. In his session at @ThingsExpo, Mark Bernardo Professional Services Leader, Americas, at GE Digital, will discuss how leveraging the Industrial Interne...
The increasing popularity of the Internet of Things necessitates that our physical and cognitive relationship with wearable technology will change rapidly in the near future. This advent means logging has become a thing of the past. Before, it was on us to track our own data, but now that data is automatically available. What does this mean for mHealth and the "connected" body? In her session at @ThingsExpo, Lisa Calkins, CEO and co-founder of Amadeus Consulting, will discuss the impact of wea...
Whether your IoT service is connecting cars, homes, appliances, wearable, cameras or other devices, one question hangs in the balance – how do you actually make money from this service? The ability to turn your IoT service into profit requires the ability to create a monetization strategy that is flexible, scalable and working for you in real-time. It must be a transparent, smoothly implemented strategy that all stakeholders – from customers to the board – will be able to understand and comprehe...
The demand for organizations to expand their infrastructure to multiple IT environments like the cloud, on-premise, mobile, bring your own device (BYOD) and the Internet of Things (IoT) continues to grow. As this hybrid infrastructure increases, the challenge to monitor the security of these systems increases in volume and complexity. In his session at 18th Cloud Expo, Stephen Coty, Chief Security Evangelist at Alert Logic, will show how properly configured and managed security architecture can...
A critical component of any IoT project is the back-end systems that capture data from remote IoT devices and structure it in a way to answer useful questions. Traditional data warehouse and analytical systems are mature technologies that can be used to handle large data sets, but they are not well suited to many IoT-scale products and the need for real-time insights. At Fuze, we have developed a backend platform as part of our mobility-oriented cloud service that uses Big Data-based approache...
SYS-CON Events announced today that Peak 10, Inc., a national IT infrastructure and cloud services provider, will exhibit at SYS-CON's 18th International Cloud Expo®, which will take place on June 7-9, 2016, at the Javits Center in New York City, NY. Peak 10 provides reliable, tailored data center and network services, cloud and managed services. Its solutions are designed to scale and adapt to customers’ changing business needs, enabling them to lower costs, improve performance and focus inter...
There is an ever-growing explosion of new devices that are connected to the Internet using “cloud” solutions. This rapid growth is creating a massive new demand for efficient access to data. And it’s not just about connecting to that data anymore. This new demand is bringing new issues and challenges and it is important for companies to scale for the coming growth. And with that scaling comes the need for greater security, gathering and data analysis, storage, connectivity and, of course, the...
Digital payments using wearable devices such as smart watches, fitness trackers, and payment wristbands are an increasing area of focus for industry participants, and consumer acceptance from early trials and deployments has encouraged some of the biggest names in technology and banking to continue their push to drive growth in this nascent market. Wearable payment systems may utilize near field communication (NFC), radio frequency identification (RFID), or quick response (QR) codes and barcodes...
The IETF draft standard for M2M certificates is a security solution specifically designed for the demanding needs of IoT/M2M applications. In his session at @ThingsExpo, Brian Romansky, VP of Strategic Technology at TrustPoint Innovation, will explain how M2M certificates can efficiently enable confidentiality, integrity, and authenticity on highly constrained devices.
You deployed your app with the Bluemix PaaS and it's gaining some serious traction, so it's time to make some tweaks. Did you design your application in a way that it can scale in the cloud? Were you even thinking about the cloud when you built the app? If not, chances are your app is going to break. Check out this webcast to learn various techniques for designing applications that will scale successfully in Bluemix, for the confidence you need to take your apps to the next level and beyond.