Category: Programming
A while ago I talked about Slide.Show. Some one asked me how to dynamically look into a folder and create a slide show based on its contents. I suggested using an ASP.NET page that looks into the folder and generates a XML output that can be used by Slide.Show as a data source.
I’ve implemented a simple version that shows how to do it. Download it and change it as you wish.
Take a look at DataProvider.js where I have changed the Data.xml reference to Data.aspx file.
In the Data.aspx file I’ve deleted all the HTML output, and in the Page_Load event handler generated XML output.
Response.ClearContent();
Response.ContentType = “Application/xml”;
Response.Write(”{XML output}”);
Response.End();
I’ve included in the zip file only the required files to let the example work. It has only 1 image. I hope it will be useful to someone. 
As you might know, it is possible to use Windows Live ID Web Authentication SDK in your websites as an authentication mechanism. You put an iframe in your homepage, which links to the Windows Live ID sign in page. After a successful authentication the user is redirected back to your website, where you receive the user’s ID. With this ID you can find your user data in your database, and do whatever you need.
Since ASP 2.0, you can use the ASP.NET Membership/Roles Provider as an authentication/authorization mechanism in your websites. You even have controls that make these tasks easy. If you are not familiar with these functionalities take a look at a nice video available in the ASP.NET website: Securing your Web Site with Membership and Login Controls.
Yesterday I started to build a new website, and I wanted to use Windows Live ID as the authentication mechanism. But since I was using an existing website framework that used ASP.NET Membership/Roles Provider not only for authentication but also for authorization purposes, I tried to integrate both. I wanted to eliminate the need for a new user/password for the user to remember, and maintain the benefits of Membership Provider.
You can download the demo website that I wrote which is a simplified version of the website that I am building. It is pretty simple. Do not forget to register you application and change the corresponding parameters in web.config.
The first step is to configure ASP.NET Membership provider. You can use a tool that allows you to add the membership provider tables to your database (C:\Windows\Microsoft.NET\Framework\v2.XXXXXX\aspnet_regsql.exe) or use Web Site > ASP.NET Configuration menu in Visual Studio that creates an SQL Server Express database to store the data.
In your web.config file you must setup the Membership Provider. I’ve done some configuration which allows you to create users using just an user name and a password (eliminating the usual e-mail, question and answer of password recovery, etc). You will be using Forms authentication.
I have a default.aspx page which has an iframe that has a link to Windows Live ID sign in page. When you click the sign in link you are redirected to the sign in page, and the forwarded back to your website, to a authentication handler page named webauth-handler.aspx. This page is part of a sample that comes with Windows Live ID Web Authentication SDK.
You will have just to add a few lines of code, that maps the Windows Live ID authentication to the Forms authentication of your website. You can see these lines in the demo website.
When you sign in with an account that is not registered in your website, a user account is created (only using the user ID as username and password), and you are redirected to a page where you can edit your profile.
Profile Provider is another great functionality of ASP.NET that allows you to assign custom data to your website users. In web.config you define which properties does a user profile has. Then you can access the Profile object from anywhere in your code, and read/write the current user profile properties. These properties can be changed, and Profile object has a Save method that persists the profile information into the Profile Provider (usually a database).
In default.aspx the current user profile is printed out into the page.
After some months willing to buy a Wiimote to try it in my PC, a couple of hours on front of a Wii gaming console convinced me to do finally buy it. After all, now I have some friends with whom I can play using my Wiimote!
Some time ago I wrote a library to the Xbox 360 GamePad (based on XNA 2.0) and a demo which included a PowerPoint add-in to control presentations (targeting Office 2007). Since my GamePad was wired it was just a demo with no real-life usage.
Now I’ve done the same thing with my Wiimote. Based on the Managed Library for Nintendo’s Wiimote available at Codeplex.com, I made a simple (and uncompleted) library that raises events when each pressed/released button state changes. I’ve re-written the PowerPoint add-in to use the Wiimote. Now I finally have a presentation wireless controller (other than my mouse 
).
All the presentation control is achieved using the buttons, but if you quickly move the Wiimote you also move to the next slide. This physics-based control was just a test, is not really necessary. Clicking a button is much simpler than using a movement to move forward. It is just a geek trick.
Download the Wiimote Presenter add-in.
Download the add-in source code.
I forgot to mention one important upcoming Adobe tool that will help a lot the designing/developing workflow.It is called Adobe Thermo. It is another point of view in MXML files manipulation, that is used in Flex applications. Thermo stand for Flex Builder as Microsoft Expression Blend stands for Visual Studio. It allows designers to create prototypes that fit perfectly the design they made, and then developers can add behavior without screwing up the design.
What is BlazeDS?
It is an open-source Java-based web server technology that allows using Remoting and Messaging services with Flex. A Release Candidate is available for download. It communicates using AMF (Action Message Format) natively supported by Flex (after all it is a format developed by Adobe). AMF serializes and de-serializes data in a binary format. According to what was said during Flex Camp this format has a great performance when compared to SOAP/XML. The messages must be shorter, since it is binary and not text-based.
Some BlazeDS functionalities:
- RPC (Remote Procedure Call) such as Web Services, Remoting, REST
- Messaging (Publish/Subscriber architecture)
- Web proxy (it helps to solve cross-domain security restrictions while working with Flash)
- Support for AJAX clients
- Support for clustering (for scalability)
- Is is a Adapters-based system, which allows to develop custom modules that are coupled to BlazeDS
What is Adobe LiveCycle Data Services?
It is a super-set of BlazeDS. This software is payed and adds some functionality to BrazeDS. It has the capability to deal with data conflicts, can compile source to swf on-the-fly and generate PDF files on the server-side.
What is AMFPHP?
It is a PHP library that allows to use Flash Remoting with PHP as the server-side technology. I’ll just quote a more complete description from the official website.
“(…) AMFPHP allows thin client applications built in languages such as Flash, Flex, and AIR to communicate directly with PHP class objectsPHP developers can leverage their PHP experience in server side code development by connecting to data sources such as web-services, databases, and business applications and return that data to the client. Client applications can also offload cpu intensive methods to PHP services and wait for the result set for presentation to the user. AMF allows for native data types and complex object mapping between the client and the server. (…)”
It is pretty straight forward to use. I really liked the demonstration.
As I have said before this was a great event. I’m looking forward to start playing around with Flex. I’m downloading Flex Builder 3 “as I speak “.
How to Develop with Adobe Flex/Air?
The current Flex version in the streets is Adobe Flex 2. Adobe Flex 3 is almost out, though. In Flex Camp they talked about Adobe Flex 3. But the brochure that was given to the audience talked about version 2.
There is a beta version of the Flex SDK on Adobe Labs. Altough you can do a terrific job programming Flex applications using notepad, maybe it is not such a good idea. Al least concerning to productivity.
Flex Buider is the IDE meant to help developers while programming in Flex. It is based in Eclipse, so It is familiar to many developers. I was glad to know that Adobe gives free licenses on Flex Builder to educational purposes. So, students and teachers, go for it!
While working with Flex you will need to program in ActionScript 3.0. From what I’ve heard it is pretty nice, since it is objected-oriented. Now you can develop using your favorite best-practices and design patterns based on this paradigm.
Some of the functionalities are Scaffolding (generating a basic data management application based on a database schema), component theming (eg. text input, radio buttons, buttons, drop-down lists, etc) using some tools like Adobe Photoshop or Fireworks. It has some nice wizards what allow you to easily do things such as connecting to a web service, and generate an wrapper based on the WSDL definition.
Flex Builder has some Profiling functionality that allows you to track down and correct performance issues.
While demonstrating Flex Builder the speaker gave some tips about decreasing the overall size of the swf files generated by Flex. In Flex Builder you can create several modules that correspond to different swf files. This way you can re-use these component and light-weight the main swf file. When you create a Flex application it is compiled including the Flex runtime library. You can choose to load the runtime from an external swf. This way you can use caching of swf to optimize traffic usage.
Flash and Flex are meant to complement each other. Adobe Flash CS3 has the capability to export your Flash animations to the MXML format that is used by Flex. This way you can use Flash elements in your Flex applications, and even access these elements via Action Script to manipulate them. These Flash elements can have a code-behind file. This way you have a class that represents that element, where you can add meta-data and behavior (just like while developing in .NET using Visual Studio).
It is also possible to have embed Flex applications in your Flash animations. This allows you to easily integrate a form in your flash-based website, for instance. In Flex Camp one of the speakers showed some demos to show us that Flex can be used along with different flash movies that are compiled to different versions of Flash Player, and even communicate with those legacy applications/movies.
In the next (and last) post about Flex Camp @ Lisboa I will talk about server side (back-end) technologies working with Flex. Including web services, Flash Remoting and integrating Flex with PHP. Later tonight!
“Flex Camp is a series of conferences designed to help you understand more about Adobe Flex and Adobe AIR.”
And it was a really good conference. I have a whole new perspective at this emerging Adobe technology. This event in Lisbon (ISCTE University) was an initiative of RIApt (Portuguese Community of Rich Internet Applications)
It all starts with a simple question.
What is RIA?
Rich Internet Applications are part of the evolution of the world wide web. It started with Text-based UI and Mainframes, evolved to Integrated Media UI and client/server architectures, and now we are daily dealing with RIA in web applications.
People expect a great user experience while navigating over the web and using distributed applications that are part of a networked and global world.
What is Flex?
Flex is an open-source cross-platform/browser framework brought to the world by Adobe to produce RIA. The output applications donw with Flex are .swf files which can be viewed in any browser with a Flash Player up-to-date plugin. It is based in XML (the format is called MXML. It is pretty similar to XAML used by Microsoft (or the other way around 
)
Flex allows you to use SOAP, HTTP/S, REST among other technologies/protocols. A great advantage of this technology when compared, for instance, to Silverlight (to what else could I compare it?…) it is the fact that a lot of people already support flash-based websites in their browsers. And it is already completely cross-platform (I’m still waiting for Moonlight to say the same about Silverlight).
There were a lot of demonstrations of some Flex applications. Some of them pretty great.
http://www.picnik.com - Online Photo editor. Nice, but I prefer Splashup.
http://www.buzzword.com - A reaaaaally amazing online document processor. Are you thinking about Google Docs? Just forget about it. This one has a real interface. RIA style 
. Astonishing! You can even save your files as Word 2007 documents (or as an usual .doc file). Give it a try.
http://sliderocket.com - Online slide show presentation composer (an online Powerpoint, lol). It is nice, but I don’t think that is as useful as buzzword. When I create a presentation I often use a lot of images and sometimes large pictures. Uploading them to a web server to use them in the presentation takes a lot of time. The waiting time for uploading and downloading the presentation for editing is not very effective. I think that in text processing this kind of issue is not such a problem. A presentation typically is more visual and occupies much more space.
http://remix.mtv.com - an online video editing tool. Pretty nice, I wasn’t paying that much attention during this demo. Sorry…
What is Air?
Air is a platform for Desktop RIA. This means that you can have an application based on Flex/Flash running as a desktop application. It can give you a great user experience. It is also cross-platform. Since it runs as a local application, it can do much more that an web-based application. A lot of the security issues that can be problematic when talking about a web-browser environment are dropped.
Air has an API that allows you to work with I/O, Networking, Clipboard actions, integrate with other typical operating systems features, etc. All you can do with a regular desktop application can be done with Air (or so they say).
Some sample applications:
Adobe Media Player - just another media player…. It was used to show us the HD support of Flex during this conference.
Google Analytics Suite - Google Analytics shaped in a fancy Air application. It can generate PDF reports!
Twhirl - this one was not presented during Flex Camp, but I use it a lot. It is a Twitter client.
This post was about what were these technologies and some examples of real life applications.
Next post will be about development with Flex/Air. Stay tuned.
