Archive for June, 2008

Jun 25 2008

How to integrate Flex with an online payment system like Ogone ?

Disease :
What would be the best way to integrate an online payment system like Ogone into my Flex application ?
Prescription :
Depending on the payment system, there are a number of different options.
Option 1 : Use the payment provider web application that handles payment
This is probably the best way to integrate as the payment provider will handle the full payment and has to take care of security. Most of the payment providers will provide you with an html application that you can integrate into your own application, and which is running on a secure environment.You would forward your user to this HTML page. When the payment transaction is done,
the payment service will return your customer to your application and provide
it with information on the transaction. So your Flex application will not even see any credit card details !
So how can you integrate this secure HTML payment application into your Flex application ? The best way is to show the application in an iFrame on top of your Flex application. The Flex application will be able to communicate with the iFrame through FABridge. FABridge is an Adobe javascript library that allows flash player to interact with the HTML container and the other way around. Alistair Rutherford wrote a post on how to use an iFrame on top of your Flex application.
The solution Ogone is providing is Ogone e-commerce. I have build an example integrating Flex with Ogone e-commerce. You can find the source code here.
Here in a few steps what you need to take care of :
1. PaymentEvent.as : Custom event that is used to pass the payment data to the HTML page running in the iFrame.
2. iFrame.as : iFrame component build by Alistair RutherFord
3. Add the FABridge javascript library to ‘html-template/index.template.html’ and add the .js itself.
4. ogone_html.html : html file that will runn in iFrame. Main part is an HTML form that we’ll submit to the Ogone server. Notice how I added an event listener for the Payment event, and i fill in the form and submit it. Also check the form to see what is configurable on the payment side.
5. ogone_bevestiging : html file that will be called by Ogone when transaction is over. Ogone will call this html file with an attribute indicating the status of the transaction. When this page is loaded you can see in the load() function I’m calling the transactionOver() function in my Flex application (Ogone.mxml). TransactionOver function will take as an argument the transaction status and show it in my Flex application.
You can find the source files on here
And have a look at the application here. (Use this test VISA number : 4111 1111 1111 1111)
Option 2 : Use the payment provider API’s.
In this case you’ll build the UI that will handle payment details yourself, which means you’ll be responsable for providing the necesary security measures. After collectint the credit card details you’ll be using the API’s to handle the payment.
So depending on the API technology you’ll have to use a specific solution :
Tips to stay healthy :
Taking care of payments is a delicate thing. Check out legal and security issues. Try to go for solution 1, which will put those responsibilities on the payment provider.

17 responses so far

Jun 25 2008

Anonymous Web UI for PDF Generator

Disease:

If you have upgraded to LiveCycle ES from a previous version of PDF Generator or even Adobe Elements Server, you may have noticed that the Web UI for generating PDF files is only accessible for those that have a login to the server, and for those that have the proper rights to use the PDF Generator services. In the past there was a URL where everybody could go to server-based PDF Generation.

Prescription:

Of course you could start to develop your own web-page to offer this service to anybody within your company, but actually there is a documented solution for this. In the LiveCycle ES LiveDocs on our website, there is a topic called Quick Start: Converting a Microsoft Word document to a PDF document using LiveCycle Remoting“. This specific sample uses LiveCycle Remoting to call the standard PDF Conversion process that is part of LC ES. Click here to access the page that contains the code needed.

Tips to stay healthy:

If you take the code described above, and open it using Adobe Flex, you can create a SWF file there that you can post on a web server. The result looks like this:

It will take you 30 minutes to do the whole process, and you will have a working process. Make sure you link to the swc files in the LiveCycle ES SDK (located in C:\Adobe\LiveCycle8\LiveCycle_ES_SDK\misc\DataServices\Client-Libraries) when compiling the application.

No responses yet

Jun 20 2008

Signing pdf documents on Vista using the Belgian eid card

Disease:
When signing a pdf document in Acrobat/Reader on Vista using the Belgian eid card, it is possible that the signing process is interrupted, and that the Acrobat/Reader gets closed.

Prescription:
The actual cause of this problem is not at all related to the Acrobat/Reader software installed.
Vista uses DEP (Data Execution Protection) which, in combination with the current Belgian eid middleware 2.6, causes the signing process to stop. Also Acrobat/Reader is then stopped.

A workaround is to disable the DEP mechanism. This can be done following
http://www.vistax64.com/tutorials/120778-dep-enable-disable.html

A new version of the Belgian eid card middleware has been tested and works well on Vista (with DEP enabled). This version will be made available on http://eid.belgium.be probably in fall 2008.

Tip to stay healthy:
In the mean time testing other middleware can help as well to see if this works. The quickest workaround is to disable DEP, and upgrade to the new Belgian eid card middleware as soon as it becomes available.

No responses yet

Jun 19 2008

Adobe embeds Alfresco in Adobe LiveCycle ES

Published by Waldo Smeets under LiveCycle ES

There’s lots of new opportunities for developers now Adobe has integrated Alfresco into the LiveCycle Enterprise Suite:

Alfresco Software today announced a new technology partnership with Adobe Systems Incorporated to provide additional content services capabilities to Adobe® LiveCycle™ Enterprise Suite (ES). Under the terms of the agreement, Adobe will embed the Alfresco Enterprise Content Management (ECM) software into Adobe LiveCycle ES. The relationship represents a shared vision for a new class of applications that utilize flexible, open source and Web 2.0 standards that deliver rich and engaging enterprise experiences.

Adobe has integrated a big part of the Alfresco stack – which delivers tons of features on it’s own – and improved things big time, including more platform support and obviously deep integration with a ton of LiveCycle services.

LiveCycle ES Update 1 introduces LiveCycle Content Services ES, a fully integrated set of content services, ranging from an enterprise content repository to social collaboration tools such as enterprise forums. LiveCycle Content Services ES is now part of the base LiveCycle ES platform providing features such as check-in/check-out, versioning, auditing, archiving/retention and access rights management

You can find more information about content services here and read more about what’s new in LiveCycle Updater 1.

Wanna try the new features? Join the LiveCycle ES Update 1 Prerelease Program and provide feedback into the development process by registering here.

For more information:

No responses yet

Jun 18 2008

What is the preferred LiveCycle Data Services development environment

Disease : 

What would be the best development environment if I want to start developing a Flex applications that uses LiveCycle ES Data Services, so I can interact with a database or any other backend system ? 

Prescription : 

You will need these components :

  • Flex Builder (full version or plugin) : You will use the Flex Builder plugin to build and debug your Flex application (MXML/Actionscript).
  • Apache Tomcat (or any other J2EE server) : LiveCycle Data Services is a J2EE Web component (WAR), so you need a J2EE web container to run LiveCycle ES DataServices. You’ll need to add “Java Open Transaction Manager” to Tomcat, to make sure Data Management can handle your database transactions. 
  • Eclipse WTC plugin : This plugin extends the Eclipse platform with tools for developing Web and Java EE applications. 
  • LiveCycle Data Services (get your trial version at adobe.com)

All these components are available for Windows and Mac. So you can set up this environment on both operating systems. 

For setting up these components there are 2 approaches :
  • Install Eclipse and add Flex Builder as a plugin. In this case you probably want to start off with the Eclipse “Europa” version. The Eclipse Europa build is is a coordinated release of different Eclipse project teams. This release will contain extra components, like WTC,  that will make development easier. 
  • Install Flex Builder and add the WTC plugin. 

Mihae Corlan has described the second option. In his post you can also find how to create a combined Flex/J2EE project and how to add the Tomcat installation. (which is applicable to both approaches ofcourse )

Mihae also added a post on how debugging works in a Flex/J2EE project. 

So now you are ready to build your Flex data rich application that will use LiveCycle Data Services. You will be able to edit the Flex Data Services configuration XML files in Eclipse, write your Assemblers, etc … Every modification will be picked up and automatically deployed. 
  
Tips to stay healthy :
 
When building data intensive RIA applications with intensive use  of CRUD operations, use LiveCycle Data Services data management functionality. It will save you loads of development time and minimize the number of code that has to be written. This will benefit the readability and maintenance of your code and it provides you extra functionality like support for database transactions. 

2 responses so far

Jun 12 2008

Multi-Lingual Forms: XLIFF support in LiveCycle Designer 8.2

Published by Bart Vossen under LiveCycle Designer

Disease:

Developing multi-lingual forms can be time-consuming and difficult to implement. 

Prescription: 

LiveCycle Designer 8.2, currently in beta, offers XLIFF support.  The generic idea is to extract field labels, hints, etc. from the xdp-template and store these in a xml-file. Translate the labels in the xml-file. Merge the original template with the xml-file to create a new xdp-template which will contain the translated  ‘labels’. These are the different steps:

 

1) You need to create a DWORD key ‘EmbedTranslationAttributes’ equal to 1 in the windows registry in order to include the XLIFF definitions in your xdp template. Under HKEY_CURRENT_USER – Software – Adobe – Designer – 8.2 – Options   

2) Develop/save your template (e.g. xliff.xdp)  

3) Install an xslt parser (I used the Saxon xslt parser)

4) Execute the following command to export the ‘labels’ (field labels, hints, error messages, etc.) out of the xdp

java net.sf.saxon.Transform -s:xliff.xdp -xsl:XDPtoS2X.xslt -o:strings.xml

5) Change the labels in the strings.xml file

6) Execute the following command to import the ‘labels’ in the newly created xdp (e.g. new.xdp)

java net.sf.saxon.Transform -s:strings.xml -xsl:S2XtoXDP.xslt -o:new.xdp

Please be noted that in the S2XtoXDP.xslt the input-XDP (e.g. xliff.xdp) is hard-coded in the sample; You may change the name of the xdp at line 24 in the xslt-file. 

That’s it.

Tip to stay healthy: 

Thanks to the support of Dr. Steve and Dr. Marc, I have created a zip-file which contains the xslt’s, command-file’s and the sample xliff.xdp. Download the package here. Get familiar with this new feature and develop multi-lingual forms more rapidly.

2 responses so far

Jun 09 2008

Announcing LiveCycle Up2date seminar – Document security

Published by Waldo Smeets under LiveCycle ES

Adobe Benelux Sales Engineers will be sharing more and more of their knowledge publicly this year. Next to the DrLivecycle initiatives, we’ll also be hosting some LiveCycle Up2Date seminars which provide more background information on specific Adobe LiveCycle ES modules.

This Thursday (Netherlands) and next week (Belgium) we’ll be hosting the first seminar, this one is on Document Security. From the site:

Document control and digital signatures protect electronic documents

The Adobe suite of security solutions delivers document control and digital signature services that simplify the process of protecting sensitive electronic documents and forms. Organizations can easily integrate Adobe document security solutions into current business processes and enterprise infrastructure to support a wide range of simple and complex processes. Adobe solutions dynamically protect electronic documents inside and outside the network, online and offline to provide persistent, end-to-end protection throughout an electronic document’s lifecycle.

June 12th 2008, Adobe Offices, Amsterdam
Agenda:
10h-11h: Presentation by an Adobe Systems Engineer
11h-12h: Adobe forms within the financial world, Tim Binsted, Atos Origin

June 19th 2008, Adobe Offices, Diegem
Agenda:
10h-11h: Presentation by an Adobe Systems Engineer
11h-12h: How to use e-ID and Adobe Reader and PDF technology to electronically sign
documents in a web based application? Hugues Dorchy, The e-ID Company

Register for the event at the Adobe Up2date seminars page.

No responses yet

Jun 03 2008

Dynamically populate dropdown lists using webservices

Disease:

How to dynamically populate a dropdown list in a pdf form with results from a webservice? Typically one can accomplish this by using lots of hidden fields to capture the webservice results, and write multiple lines of Javascript code to populate the dropdown list based on the values of these hidden fields. There is however a much shorter way!

Prescription:

LiveCycle Designer 8 offers a nice new functionality.

1) Select the dropdown list and go to the Object Palette.

2) There select the right most icon.

3) Since version 8 one can choose “Show Dynamic Properties”. The result of this is that “Caption” and “List Items” become links instead of just labels.

4) Choose “List Items” and bind the dropdown list items to the return value of the webservice (through the webservice dataconnection).

This is it.

One can go a step further. Suppose you want to select a value from this dropdown list, which needs to be used as input for a second webservice, which needs to populate on its turn a second dropdown list. The same applies for the second dropdown list.

1) Bind it dynamically to the result of the second webservice.

2) Make sure however that in this case you use execute(0) when writing the Javascript code to call the second webservice, and not execute(1). Execute(0) will make sure that the DOM is not remerged (with the risk that the first dropdown list gets empty again)

Tip to stay healthy:

Start questioning your code when you see your lines of code and your amount of hidden fields growing just to accomplish an easy population of lists. Chances are big that Designer offers a functionality to do this on the fly.

3 responses so far

Jun 03 2008

LiveCycle Output ES: Including charts in your documents

Disease:

What if you would like to present your customers with a more graphical view on tabular data, and generate documents that include pie-charts, bar-charts, etcetera.

Prescription:

LiveCycle ES offers various ways to include charts in the generated forms & documents. This time I would like to highlight one alternative in particular. You can make use of Google Chart to call for the right charts. Google Chart makes use of a REST API. It’s a bit like a webservice, but uses simple URL’s to call remote functionality. If you use LiveCycle Designer ES, you can build the right URL and call the Google Service from for instance an initialize event within the page. When the document is rendered, the resulting image is automatically included in your result. A very simple example of a URL for Google Chart is http://chart.apis.google.com/chart?cht=p3&chd=t:60,40&chs=250x100&chl=Hello|World

Now it is also possible include charts such as the one below in your template design.

Sample Chart in PDF

A full sample including the chart above can be downloaded here.

Tip to stay healthy:

I have created a sample for you that you can use yourself. The sample is also used for another post regarding organizing XML data in multiple columns, but since this is good data, a chart is right in context there. Download the package (including an xdp and 2 sample xml files) here. This works stand-alone, but also when using the Output service in your LiveCycle Workbench ES. Please send me your results when you create some exciting charts in your templates.

No responses yet

Jun 02 2008

LiveCycle Designer Advanced: Organizing XML data in multiple columns

Disease:

Let’s say you are a financial organization and you want to inform your customers about the value of their investment over the next 20 or 30 years in a simple one-page overview. When dealing with XML data the Table assistant is often used to make sure that the data rows are displayed in a nice manner. However, when you are dealing with 20 or 30 rows, the table grows bigger, and uses multiple pages. Here is an example of XML data that you might want to display in a consolidated way.

Prescription:

Besides the Table assistant to organize your XML data rows in a nice matter, Adobe LiveCycle Designer offers other features to handle this kind of data, and display it in a different way. Within the Object Library there is an object called “Content Area”, that offers a lot of flexibity to handle the challenge described above. The result of using Content Area’s look like this:

Kolommen in template

A sample document of the result can be downloaded here.

Tip to stay healthy:

I have created a template where I have used the technique above to populate 3 columns with data from an XML file. I have prepared a document package that is downloadable that includes the following documents:

  • LiveCycle Designer template (You need LiveCycle Designer 8.x)
  • 2 XML sample files you can use for previewing (So you can see the different behaviour of the form)

6 responses so far

Next »